Merge branch 'code100x:main' into main

code100x · May 19, 2024 · 35dd2d3 · 35dd2d3
2 parents 36fe3f3 + 308b8df
commit 35dd2d3
Showing 1 changed file with 36 additions and 32 deletions.
diff --git a/src/components/Appbar.tsx b/src/components/Appbar.tsx
@@ -17,10 +17,12 @@ import ProfileDropdown from './profile-menu/ProfileDropdown';
 import { ThemeToggler } from './ThemeToggler';
 
 export const Appbar = () => {
-  const session = useSession();
+  const { data: session, status: sessionStatus } = useSession();
   const [sidebarOpen, setSidebarOpen] = useRecoilState(sidebarOpenAtom);
   const currentPath = usePathname();
 
+  const isLoading = sessionStatus === 'loading';
+
   return (
     <>
       <nav className="fixed z-50 top-0 px-4 w-full h-16 border-b shadow-sm bg-background/80 backdrop-blur-md flex items-center gap-2 print:hidden">
@@ -35,38 +37,40 @@ export const Appbar = () => {
         <div className="md:max-w-screen-2xl mx-auto flex items-center justify-between w-full">
           <Logo onFooter={false} />
 
-          {session?.data?.user ? (
-            <>
-              <div className="hidden md:block">
-                <SearchBar />
-              </div>
-              <div className="flex items-center space-x-2">
-                {/* Search Bar for smaller devices */}
-                <MobileScreenSearch />
-                <ProfileDropdown />
-              </div>
-            </>
-          ) : (
-            <div className="flex items-center space-x-2">
-              <div className="hidden sm:flex items-center justify-around md:w-auto md:block space-x-3">
-                <AppbarAuth />
+          {session?.user
+            ? !isLoading && (
+                <>
+                  <div className="hidden md:block">
+                    <SearchBar />
+                  </div>
+                  <div className="flex items-center space-x-2">
+                    {/* Search Bar for smaller devices */}
+                    <MobileScreenSearch />
+                    <ProfileDropdown />
+                  </div>
+                </>
+              )
+            : !isLoading && (
+                <div className="flex items-center space-x-2">
+                  <div className="hidden sm:flex items-center justify-around md:w-auto md:block space-x-3">
+                    <AppbarAuth />
 
-                <Button size={'sm'} asChild>
-                  <Link
-                    href={'https://harkirat.classx.co.in/new-courses'}
-                    target="_blank"
-                  >
-                    <p className="text-white">Join now</p>{' '}
-                    <Sparkles className="text-white ml-2 h-4 w-4 hover:translate-x-0.5 ease-linear duration-200" />
-                  </Link>
-                </Button>
-              </div>
-              <ThemeToggler />
-              <div className="block sm:hidden">
-                <NavigationMenu />
-              </div>
-            </div>
-          )}
+                    <Button size={'sm'} asChild>
+                      <Link
+                        href={'https://harkirat.classx.co.in/new-courses'}
+                        target="_blank"
+                      >
+                        <p className="text-white">Join now</p>{' '}
+                        <Sparkles className="text-white ml-2 h-4 w-4 hover:translate-x-0.5 ease-linear duration-200" />
+                      </Link>
+                    </Button>
+                  </div>
+                  <ThemeToggler />
+                  <div className="block sm:hidden">
+                    <NavigationMenu />
+                  </div>
+                </div>
+              )}
         </div>
       </nav>
       <div className="h-16 w-full print:hidden" />