mirror of
https://github.com/xHyroM/roles-bot.git
synced 2024-11-22 00:11:06 +01:00
feat: show guilds in dashboard
This commit is contained in:
parent
d018fbb1d6
commit
b7dd3bf3ef
4 changed files with 52 additions and 3 deletions
7
apps/website/src/components/Container.astro
Normal file
7
apps/website/src/components/Container.astro
Normal file
|
@ -0,0 +1,7 @@
|
|||
---
|
||||
const { class: className } = Astro.props;
|
||||
---
|
||||
|
||||
<div class={`container mx-auto px-4 ${className ?? ""}`}>
|
||||
<slot />
|
||||
</div>
|
2
apps/website/src/env.d.ts
vendored
2
apps/website/src/env.d.ts
vendored
|
@ -4,6 +4,8 @@ import type { User as AuthCoreUser } from "@auth/core/types";
|
|||
|
||||
export type User = AuthCoreUser & {
|
||||
guilds: {
|
||||
id: string;
|
||||
name: string;
|
||||
icon: string;
|
||||
}[];
|
||||
};
|
||||
|
|
|
@ -1,6 +1,9 @@
|
|||
---
|
||||
import type { User } from "~/env";
|
||||
import { getSession } from "auth-astro/server";
|
||||
import Layout from "~/layouts/Layout.astro";
|
||||
import Container from "~/components/Container.astro";
|
||||
import { Image } from "astro:assets";
|
||||
|
||||
const session = await getSession(Astro.request);
|
||||
if (!session || !session.user) {
|
||||
|
@ -8,8 +11,44 @@ if (!session || !session.user) {
|
|||
}
|
||||
|
||||
const user = session.user as User;
|
||||
console.log(user.guilds[0]);
|
||||
---
|
||||
|
||||
<p>Welcome {user.name}</p>
|
||||
{user.guilds.map((g) => g.id).join("\n\n")}
|
||||
<Layout>
|
||||
<div class="flex items-center justify-center">
|
||||
<Image
|
||||
src={user.image!}
|
||||
class="mr-5 rounded-full"
|
||||
alt="icon"
|
||||
width={64}
|
||||
height={64}
|
||||
/>
|
||||
|
||||
<h1 class="py-12 text-5xl font-extrabold text-white">
|
||||
@{user.name}
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<Container class="pb-4">
|
||||
<main
|
||||
class="flex flex-wrap items-center justify-center gap-12 pb-4 text-white"
|
||||
>
|
||||
{
|
||||
user.guilds.map((guild) => (
|
||||
<section class="flex min-h-max w-80 justify-between rounded-md border-[1px] border-neutral-800 bg-dark-100 p-6 md:w-96">
|
||||
<div class="flex flex-row items-center">
|
||||
<Image
|
||||
src={`https://cdn.discordapp.com/icons/${guild.id}/${guild.icon}.webp`}
|
||||
class="mr-5 rounded-full"
|
||||
alt="icon"
|
||||
width={64}
|
||||
height={64}
|
||||
/>
|
||||
|
||||
<h2 class="w-fit break-all text-3xl font-bold">{guild.name}</h2>
|
||||
</div>
|
||||
</section>
|
||||
))
|
||||
}
|
||||
</main>
|
||||
</Container>
|
||||
</Layout>
|
||||
|
|
|
@ -5,6 +5,7 @@ module.exports = {
|
|||
extend: {
|
||||
colors: {
|
||||
dark: "#111111",
|
||||
"dark-100": "#1A1A1A",
|
||||
blue: "#5865F2",
|
||||
gold: "#FFA500",
|
||||
},
|
||||
|
|
Loading…
Reference in a new issue