41 lines
1.3 KiB
TypeScript
41 lines
1.3 KiB
TypeScript
import Link from "next/link";
|
|
|
|
import { api } from "~/utils/api";
|
|
import FeedbackButton from "./FeedbackButton";
|
|
import SideNavigation from "./SideNavigation";
|
|
|
|
export default function Dashboard(props: { children: React.ReactNode }) {
|
|
const { data, isLoading } = api.user.getUser.useQuery();
|
|
|
|
return (
|
|
<>
|
|
<style jsx global>{`
|
|
html {
|
|
height: 100vh;
|
|
overflow: hidden;
|
|
}
|
|
`}</style>
|
|
<div className="flex h-screen min-w-[800px] flex-col items-center bg-light-100 dark:bg-dark-50">
|
|
<div className="m-auto flex h-16 min-h-16 w-full justify-between border-b border-light-600 px-5 py-2 align-middle dark:border-dark-400">
|
|
<div className="my-auto flex w-full items-center justify-between">
|
|
<Link href="/">
|
|
<h1 className="text-lg font-bold tracking-tight text-neutral-900 dark:text-dark-1000">
|
|
kan.bn
|
|
</h1>
|
|
</Link>
|
|
<FeedbackButton />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex h-full w-full">
|
|
<SideNavigation
|
|
user={{ email: data?.email, image: data?.image }}
|
|
isLoading={isLoading}
|
|
/>
|
|
<div className="w-full overflow-hidden">{props.children}</div>
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|