alihan/OpenPipe-llm
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add requireAuth to AppShell

Browse Source
This commit is contained in:
David Corbitt
2023-08-08 13:20:02 -07:00
parent a2ace63f25
commit a2c322ff43
4 changed files with 24 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
app/src/components/nav/AppShell.tsx
View File

@@ -106,7 +106,15 @@ const NavSidebar = () => {
);
};
export default function AppShell(props: { children: React.ReactNode; title?: string }) {
export default function AppShell({
children,
title,
requireAuth,
}: {
children: React.ReactNode;
title?: string;
requireAuth?: boolean;
}) {
const [vh, setVh] = useState("100vh"); // Default height to prevent flicker on initial render
useEffect(() => {
@@ -126,14 +134,23 @@ export default function AppShell(props: { children: React.ReactNode; title?: str
};
}, []);
const user = useSession().data;
const authLoading = useSession().status === "loading";
useEffect(() => {
if (requireAuth && user === null && !authLoading) {
signIn("github").catch(console.error);
}
}, [requireAuth, user, authLoading]);
return (
<Flex h={vh} w="100vw">
<Head>
<title>{props.title ? `${props.title} | OpenPipe` : "OpenPipe"}</title>
<title>{title ? `${title} | OpenPipe` : "OpenPipe"}</title>
</Head>
<NavSidebar />
<Box h="100%" flex={1} overflowY="auto">
{props.children}
{children}
</Box>
</Flex>
);

31
app/src/pages/data/index.tsx
View File

@@ -4,12 +4,8 @@ import {
Breadcrumb,
BreadcrumbItem,
Flex,
Center,
Text,
Link,
} from "@chakra-ui/react";
import AppShell from "~/components/nav/AppShell";
import { signIn, useSession } from "next-auth/react";
import { RiDatabase2Line } from "react-icons/ri";
import {
DatasetCard,
@@ -23,33 +19,8 @@ import { useDatasets } from "~/utils/hooks";
export default function DatasetsPage() {
const datasets = useDatasets();
const user = useSession().data;
const authLoading = useSession().status === "loading";
if (user === null || authLoading) {
return (
<AppShell title="Data">
<Center h="100%">
{!authLoading && (
<Text>
<Link
onClick={() => {
signIn("github").catch(console.error);
}}
textDecor="underline"
>
Sign in
</Link>{" "}
to view or create new datasets!
</Text>
)}
</Center>
</AppShell>
);
}
return (
<AppShell title="Data">
<AppShell title="Data" requireAuth>
<PageHeaderContainer>
<Breadcrumb>
<BreadcrumbItem>

39
app/src/pages/experiments/index.tsx
View File

@@ -1,13 +1,4 @@
import {
SimpleGrid,
Icon,
Breadcrumb,
BreadcrumbItem,
Flex,
Center,
Text,
Link,
} from "@chakra-ui/react";
import { SimpleGrid, Icon, Breadcrumb, BreadcrumbItem, Flex } from "@chakra-ui/react";
import { RiFlaskLine } from "react-icons/ri";
import AppShell from "~/components/nav/AppShell";
import {
@@ -15,7 +6,6 @@ import {
ExperimentCardSkeleton,
NewExperimentCard,
} from "~/components/experiments/ExperimentCard";
import { signIn, useSession } from "next-auth/react";
import PageHeaderContainer from "~/components/nav/PageHeaderContainer";
import ProjectBreadcrumbContents from "~/components/nav/ProjectBreadcrumbContents";
import { useExperiments } from "~/utils/hooks";
@@ -23,33 +13,8 @@ import { useExperiments } from "~/utils/hooks";
export default function ExperimentsPage() {
const experiments = useExperiments();
const user = useSession().data;
const authLoading = useSession().status === "loading";
if (user === null || authLoading) {
return (
<AppShell title="Experiments">
<Center h="100%">
{!authLoading && (
<Text>
<Link
onClick={() => {
signIn("github").catch(console.error);
}}
textDecor="underline"
>
Sign in
</Link>{" "}
to view or create new experiments!
</Text>
)}
</Center>
</AppShell>
);
}
return (
<AppShell title="Experiments">
<AppShell title="Experiments" requireAuth>
<PageHeaderContainer>
<Breadcrumb>
<BreadcrumbItem>

2
app/src/pages/home/index.tsx
View File

@@ -58,7 +58,7 @@ export default function HomePage() {
}, [stats.data]);
return (
<AppShell>
<AppShell requireAuth>
<PageHeaderContainer>
<Breadcrumb>
<BreadcrumbItem>