ui: update side nav

pingcap · Apr 16, 2024 · f68726a · f68726a
1 parent 03c15fb
commit f68726a
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 22 deletions.
diff --git a/src/app/(main)/nav.tsx b/src/app/(main)/nav.tsx
@@ -1,5 +1,6 @@
 'use client';
 
+import { deleteChat } from '@/client/operations/chats';
 import { Ask } from '@/components/ask';
 import { type NavGroup, SiteNav } from '@/components/site-nav';
 import { SiteNavFooter } from '@/components/site-nav-footer';
@@ -11,13 +12,12 @@ import { Skeleton } from '@/components/ui/skeleton';
 import { useAsk } from '@/components/use-ask';
 import { useHref } from '@/components/use-href';
 import type { Chat } from '@/core/repositories/chat';
-import { useUser } from '@/lib/auth';
 import type { Page } from '@/lib/database';
 import { fetcher } from '@/lib/fetch';
 import { cn } from '@/lib/utils';
-import { deleteChat } from '@/client/operations/chats';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { ActivitySquareIcon, BinaryIcon, CogIcon, CommandIcon, FileIcon, GlobeIcon, HomeIcon, ImportIcon, ListIcon, MenuIcon, MessagesSquareIcon, PlusIcon } from 'lucide-react';
+import { useSession } from 'next-auth/react';
 import Link from 'next/link';
 import { useEffect, useMemo, useState } from 'react';
 import useSWR from 'swr';
@@ -30,14 +30,18 @@ export function Nav () {
   const ask = useAsk(() => {
     setOpen(false);
   });
-  const user = useUser();
+  const session = useSession();
+  const user = session.data?.user;
+  const isLoggedIn = user && user.role !== 'anonymous';
   const { data: history, mutate, isLoading } = useSWR(['get', '/api/v1/chats'], fetcher<Page<Chat>>, {
     revalidateOnMount: false,
   });
 
   useEffect(() => {
     if (user?.id) {
       void mutate();
+    } else {
+      void mutate(undefined, { revalidate: false });
     }
   }, [user?.id]);
 
@@ -56,7 +60,7 @@ export function Nav () {
   }, []);
 
   const groups = useMemo(() => {
-    const disableIfNotAuthenticated = !user ? <><Link className="font-semibold underline" href={`/auth/login?callbackUrl=${encodeURIComponent(href)}`}>Login</Link> to continue</> : false;
+    const disableIfNotAuthenticated = !isLoggedIn ? <><Link className="font-semibold underline" href={`/auth/login?callbackUrl=${encodeURIComponent(href)}`}>Login</Link> to continue</> : false;
 
     const groups: NavGroup[] = [
       {
@@ -75,31 +79,33 @@ export function Nav () {
               title: chat.title,
               variant: (active: boolean) => (active ? 'secondary' : 'ghost'),
               className: conversationItemClassName,
-              onDelete: () => {
+              onDelete: isLoggedIn ? () => {
                 deleteChat(chat.id).then(() => mutate(undefined, { revalidate: true }));
-              },
+              } : undefined,
             }
           )) ?? []),
         ],
       },
     ];
 
-    groups.push({
-      title: 'Admin',
-      items: [
-        { href: '/dashboard', title: 'Overview', icon: ActivitySquareIcon },
-        { href: '/explore', title: 'Documents', icon: FileIcon },
-        { href: '/sources', title: 'Data Sources', icon: ImportIcon },
-        { href: '/indexes', title: 'Indexes', icon: BinaryIcon },
-        { href: '/import-tasks', title: 'Import Tasks', icon: GlobeIcon },
-        { href: '/index-tasks', title: 'Index Tasks', icon: ListIcon },
-        { href: '/settings', title: 'Settings', icon: CogIcon },
-      ],
-      sectionProps: { className: 'mt-auto mb-0' },
-    });
+    if (user?.role === 'admin') {
+      groups.push({
+        title: 'Admin',
+        items: [
+          { href: '/dashboard', title: 'Overview', icon: ActivitySquareIcon },
+          { href: '/explore', title: 'Documents', icon: FileIcon },
+          { href: '/sources', title: 'Data Sources', icon: ImportIcon },
+          { href: '/indexes', title: 'Indexes', icon: BinaryIcon },
+          { href: '/import-tasks', title: 'Import Tasks', icon: GlobeIcon },
+          { href: '/index-tasks', title: 'Index Tasks', icon: ListIcon },
+          { href: '/settings', title: 'Settings', icon: CogIcon },
+        ],
+        sectionProps: { className: 'mt-auto mb-0' },
+      });
+    }
 
     return groups;
-  }, [user, history, href]);
+  }, [isLoggedIn, user?.role, history, href]);
 
   return (
     <>

diff --git a/src/app/api/v1/authentication/providers/route.ts b/src/app/api/v1/authentication/providers/route.ts
@@ -22,11 +22,10 @@ export const POST = defineHandler({
 });
 
 const searchParamsSchema = z.object({
-  enabled: z.boolean().optional(),
+  enabled: z.coerce.boolean().optional(),
 });
 
 export const GET = defineHandler({
-  auth: 'admin',
   searchParams: searchParamsSchema
 }, async ({
   searchParams: { enabled }

diff --git a/src/components/use-ask.ts b/src/components/use-ask.ts
@@ -1,10 +1,12 @@
 import { __setMessage } from '@/app/(main)/(public)/c/[id]/internal';
 import { handleErrors } from '@/lib/fetch';
+import { useSession } from 'next-auth/react';
 import { useRouter } from 'next/navigation';
 import { useCallback, useState, useTransition } from 'react';
 import { mutate } from 'swr'
 
 export function useAsk(onFinish?: () => void) {
+  const session = useSession();
   const router = useRouter();
   const [loading, setLoading] = useState(false);
   const [transitioning, startTransition] = useTransition();