feat: public routes

src/webapp/app/(auth)/login/page.tsx

···
   Loader,
   Badge,
 } from '@mantine/core';
-import { Suspense, useEffect, useState } from 'react';
+import { Suspense, useEffect } from 'react';
 import { IoMdHelpCircleOutline } from 'react-icons/io';
 import SembleLogo from '@/assets/semble-logo.svg';
 import { useAuth } from '@/hooks/useAuth';
···
 import Link from 'next/link';
 
 function InnerPage() {
-  const { isAuthenticated, isLoading } = useAuth();
-  const [isRedirecting, setIsRedirecting] = useState(false);
+  const { isAuthenticated, isLoading, refreshAuth } = useAuth();
   const router = useRouter();
   const searchParams = useSearchParams();
   const isExtensionLogin = searchParams.get('extension-login') === 'true';
 
   useEffect(() => {
-    let timeoutId: NodeJS.Timeout;
-
     if (isAuthenticated && !isExtensionLogin) {
-      setIsRedirecting(true);
-
-      // redirect after 1 second
-      timeoutId = setTimeout(() => {
-        router.push('/home');
-      }, 1000);
+      refreshAuth();
+      router.push('/home');
     }
-
-    // clean up
-    return () => {
-      if (timeoutId) {
-        clearTimeout(timeoutId);
-      }
-    };
   }, [isAuthenticated, router, isExtensionLogin]);
 
-  if (isLoading) {
+  if (isAuthenticated) {
     return (
       <Stack align="center">
-        <Loader type="dots" />
-      </Stack>
-    );
-  }
-
-  if (isRedirecting) {
-    return (
-      <Stack align="center">
-        <Text fw={500} fz={'xl'}>
-          Already logged in, redirecting you to library
-        </Text>
         <Loader type="dots" />
       </Stack>
     );

src/webapp/app/(dashboard)/error.tsx

···
+'use client';
+
+import {
+  BackgroundImage,
+  Center,
+  Stack,
+  Image,
+  Badge,
+  Text,
+  Group,
+  Button,
+  Container,
+} from '@mantine/core';
+import SembleLogo from '@/assets/semble-logo.svg';
+import BG from '@/assets/semble-bg.webp';
+import Link from 'next/link';
+import { BiRightArrowAlt } from 'react-icons/bi';
+
+export default function Error() {
+  return (
+    <BackgroundImage
+      src={BG.src}
+      h={'100svh'}
+      pos={'fixed'}
+      top={0}
+      left={0}
+      style={{ zIndex: 102 }}
+    >
+      <Center h={'100svh'} py={{ base: '2rem', xs: '5rem' }}>
+        <Container size={'xl'} p={'md'} my={'auto'}>
+          <Stack>
+            <Stack align="center" gap={'xs'}>
+              <Image
+                src={SembleLogo.src}
+                alt="Semble logo"
+                w={48}
+                h={64.5}
+                mx={'auto'}
+              />
+              <Badge size="sm">Alpha</Badge>
+            </Stack>
+
+            <Stack>
+              <Text fz={'h1'} fw={600} ta={'center'}>
+                A social knowledge network for researchers
+              </Text>
+              <Text fz={'h3'} fw={600} c={'#1F6144'} ta={'center'}>
+                Follow your peers’ research trails. Surface and discover new
+                connections. Built on ATProto so you own your data.
+              </Text>
+            </Stack>
+
+            <Group justify="center" gap="md" mt={'lg'}>
+              <Button component={Link} href="/signup" size="lg">
+                Sign up
+              </Button>
+
+              <Button
+                component={Link}
+                href="/login"
+                size="lg"
+                color="dark"
+                rightSection={<BiRightArrowAlt size={22} />}
+              >
+                Log in
+              </Button>
+            </Group>
+          </Stack>
+        </Container>
+      </Center>
+    </BackgroundImage>
+  );
+}

src/webapp/app/(dashboard)/home/page.tsx

···
 import HomeContainer from '@/features/home/containers/homeContainer/HomeContainer';
+import { verifySessionOnServer } from '@/lib/auth/dal.server';
+import { redirect } from 'next/navigation';
 
-export default function Page() {
+export default async function Page() {
+  const session = await verifySessionOnServer();
+  if (!session) redirect('/login');
+
   return <HomeContainer />;
 }

src/webapp/app/(dashboard)/layout.tsx

···
-'use client';
-
-import { useEffect } from 'react';
-import { useRouter } from 'next/navigation';
-import { useAuth } from '@/hooks/useAuth';
 import Dashboard from '@/components/navigation/dashboard/Dashboard';
 
 interface Props {
   children: React.ReactNode;
 }
 export default function Layout(props: Props) {
-  const router = useRouter();
-  const { isAuthenticated, isLoading } = useAuth();
-
-  useEffect(() => {
-    if (!isLoading && !isAuthenticated) {
-      router.push('/login');
-    }
-  }, [isAuthenticated, isLoading, router]);
-
-  if (!isAuthenticated) {
-    return null; // Redirecting
-  }
-
   return <Dashboard>{props.children}</Dashboard>;
 }

src/webapp/app/api/auth/me/route.ts

···
 import { NextRequest, NextResponse } from 'next/server';
+import type { GetProfileResponse } from '@/api-client/ApiClient';
 import { cookies } from 'next/headers';
 import { isTokenExpiringSoon } from '@/lib/auth/token';
 
+const backendUrl = process.env.API_BASE_URL || 'http://127.0.0.1:3000';
+
+type AuthResult = {
+  isAuth: boolean;
+  user?: GetProfileResponse;
+};
+
 export async function GET(request: NextRequest) {
   try {
     const cookieStore = await cookies();
···
 
     // No tokens at all - not authenticated
     if (!accessToken && !refreshToken) {
-      return NextResponse.json({ error: 'Not authenticated' }, { status: 401 });
+      return NextResponse.json<AuthResult>({ isAuth: false }, { status: 401 });
     }
 
     // Check if accessToken is expired/missing or expiring soon (< 5 min)
     if ((!accessToken || isTokenExpiringSoon(accessToken, 5)) && refreshToken) {
       try {
         // Proxy the refresh request completely to backend
-        const backendUrl =
-          process.env.NEXT_PUBLIC_API_BASE_URL || 'http://127.0.0.1:3000';
         const refreshResponse = await fetch(
           `${backendUrl}/api/users/oauth/refresh`,
           {
···
         );
 
         if (!refreshResponse.ok) {
-          // Refresh failed - clear invalid tokens
-          const response = new NextResponse(
-            JSON.stringify({ error: 'Authentication failed' }),
+          // Refresh failed — clear tokens and mark as unauthenticated
+          const response = NextResponse.json<AuthResult>(
+            { isAuth: false },
             { status: 401 },
           );
           response.cookies.delete('accessToken');
           response.cookies.delete('refreshToken');
+
           return response;
         }
 
···
         });
 
         if (!profileResponse.ok) {
-          return NextResponse.json(
-            { error: 'Failed to fetch profile' },
-            { status: profileResponse.status },
+          return NextResponse.json<AuthResult>(
+            { isAuth: false },
+            { status: 401 },
           );
         }
 
         const user = await profileResponse.json();
 
         // Return user profile with backend's Set-Cookie headers
-        return new Response(JSON.stringify({ user }), {
+        const response = new Response(JSON.stringify({ isAuth: true, user }), {
           status: 200,
           headers: {
             'Content-Type': 'application/json',
             'Set-Cookie': refreshResponse.headers.get('set-cookie') || '',
           },
         });
+        return response;
       } catch (error) {
         console.error('Token refresh error:', error);
-        return NextResponse.json(
-          { error: 'Authentication failed' },
+        return NextResponse.json<AuthResult>(
+          { isAuth: false },
           { status: 500 },
         );
       }
···
       });
 
       if (!profileResponse.ok) {
-        return NextResponse.json(
-          { error: 'Failed to fetch profile' },
+        return NextResponse.json<AuthResult>(
+          { isAuth: false },
           { status: profileResponse.status },
         );
       }
 
       const user = await profileResponse.json();
-      return NextResponse.json({ user });
+      return NextResponse.json<AuthResult>({ isAuth: true, user });
     } catch (error) {
       console.error('Profile fetch error:', error);
-      return NextResponse.json(
-        { error: 'Failed to fetch profile' },
-        { status: 500 },
-      );
+      return NextResponse.json<AuthResult>({ isAuth: false }, { status: 500 });
     }
   } catch (error) {
     console.error('Auth me error:', error);
-    return NextResponse.json(
-      { error: 'Internal server error' },
-      { status: 500 },
-    );
+    return NextResponse.json<AuthResult>({ isAuth: false }, { status: 500 });
   }
 }

src/webapp/components/navigation/dashboard/Dashboard.tsx

···
+'use client';
+
 import AppLayout from '../appLayout/AppLayout';
+import GuestAppLayout from '../guestAppLayout/GuestAppLayout';
+import { useAuth } from '@/hooks/useAuth';
 
 interface Props {
   children: React.ReactNode;
 }
 
 export default function Dashboard(props: Props) {
+  const { isAuthenticated, isLoading } = useAuth();
+
+  if (isLoading) return null;
+
+  if (!isAuthenticated)
+    return <GuestAppLayout>{props.children}</GuestAppLayout>;
+
   return <AppLayout>{props.children}</AppLayout>;
 }

src/webapp/features/cards/lib/dal.ts

···
+import { verifySessionOnClient } from '@/lib/auth/dal';
 import { createSembleClient } from '@/services/apiClient';
 import { cache } from 'react';
 
···
 });
 
 export const getCardFromMyLibrary = cache(async (url: string) => {
-  // await verifySession();
+  const session = await verifySessionOnClient();
+  if (!session) throw new Error('No session found');
   const client = createSembleClient();
   const response = await client.getUrlStatusForMyLibrary({ url: url });
 
···
 });
 
 export const getMyUrlCards = cache(async (params?: PageParams) => {
-  // await verifySession();
+  const session = await verifySessionOnClient();
+  if (!session) throw new Error('No session found');
   const client = createSembleClient();
   const response = await client.getMyUrlCards({
     page: params?.page,
···
     url: string,
     { note, collectionIds }: { note?: string; collectionIds?: string[] },
   ) => {
-    // await verifySession();
+    const session = await verifySessionOnClient();
+    if (!session) throw new Error('No session found');
     const client = createSembleClient();
     const response = await client.addUrlToLibrary({
       url: url,
···
     cardId: string;
     collectionIds: string[];
   }) => {
-    // await verifySession();
+    const session = await verifySessionOnClient();
+    if (!session) throw new Error('No session found');
     const client = createSembleClient();
     const response = await client.removeCardFromCollection({
       cardId,
···
 );
 
 export const removeCardFromLibrary = cache(async (cardId: string) => {
-  // await verifySession();
+  const session = await verifySessionOnClient();
+  if (!session) throw new Error('No session found');
   const client = createSembleClient();
   const response = await client.removeCardFromLibrary({ cardId });
 
···
 });
 
 export const getLibrariesForCard = cache(async (cardId: string) => {
-  // await verifySession();
+  const session = await verifySessionOnClient();
+  if (!session) throw new Error('No session found');
   const client = createSembleClient();
   const response = await client.getLibrariesForCard(cardId);
 

src/webapp/features/collections/lib/dal.ts

···
+import { verifySessionOnClient } from '@/lib/auth/dal';
 import { createSembleClient } from '@/services/apiClient';
 import { cache } from 'react';
 
···
 
 export const getMyCollections = cache(
   async (params?: PageParams & SearchParams) => {
-    // await verifySession();
-
+    const session = await verifySessionOnClient();
+    if (!session) throw new Error('No session found');
     const client = createSembleClient();
     const response = await client.getMyCollections({
       page: params?.page,
···
 
 export const createCollection = cache(
   async (newCollection: { name: string; description: string }) => {
-    // await verifySession();
+    const session = await verifySessionOnClient();
+    if (!session) throw new Error('No session found');
     const client = createSembleClient();
     const response = await client.createCollection(newCollection);
 
···
 );
 
 export const deleteCollection = cache(async (id: string) => {
-  // await verifySession();
+  const session = await verifySessionOnClient();
+  if (!session) throw new Error('No session found');
   const client = createSembleClient();
   const response = await client.deleteCollection({ collectionId: id });
 
···
     name: string;
     description?: string;
   }) => {
-    // await verifySession();
+    const session = await verifySessionOnClient();
+    if (!session) throw new Error('No session found');
     const client = createSembleClient();
     const response = await client.updateCollection(collection);
 

src/webapp/features/notes/lib/dal.ts

···
+import { verifySessionOnClient } from '@/lib/auth/dal';
 import { createSembleClient } from '@/services/apiClient';
 import { cache } from 'react';
 
···
 
 export const updateNoteCard = cache(
   async (note: { cardId: string; note: string }) => {
-    // await verifySession();
+    const session = await verifySessionOnClient();
+    if (!session) throw new Error('No session found');
     const client = createSembleClient();
     const response = await client.updateNoteCard(note);
 

src/webapp/features/profile/components/profileMenu/ProfileMenu.tsx

···
   Group,
   Alert,
   Menu,
-  Stack,
   Image,
-  Text,
   Button,
 } from '@mantine/core';
 import useMyProfile from '../../lib/queries/useMyProfile';

src/webapp/features/profile/lib/dal.ts

···
+import { verifySessionOnClient } from '@/lib/auth/dal';
 import { createSembleClient } from '@/services/apiClient';
 import { cache } from 'react';
 
···
 });
 
 export const getMyProfile = cache(async () => {
-  // await verifySession();
+  const session = await verifySessionOnClient();
+  if (!session) throw new Error('No session found');
   const client = createSembleClient();
   const response = await client.getMyProfile();
 

src/webapp/hooks/useAuth.tsx

···
 import { useRouter } from 'next/navigation';
 import type { GetProfileResponse } from '@/api-client/ApiClient';
 import { ClientCookieAuthService } from '@/services/auth/CookieAuthService.client';
-
-const appUrl = process.env.NEXT_PUBLIC_APP_URL || 'http://127.0.0.1:4000';
+import { verifySessionOnClient } from '@/lib/auth/dal';
 
 interface AuthContextType {
   user: GetProfileResponse | null;
···
 
   const logout = async () => {
     await ClientCookieAuthService.clearTokens();
-    queryClient.removeQueries({ queryKey: ['authenticated user'] });
+    queryClient.clear();
     router.push('/login');
   };
 
   const query = useQuery<GetProfileResponse | null>({
     queryKey: ['authenticated user'],
     queryFn: async () => {
-      const response = await fetch(`${appUrl}/api/auth/me`, {
-        method: 'GET',
-        credentials: 'include', // HttpOnly cookies sent automatically
-      });
-      // unauthenticated
-      if (!response.ok) {
-        throw new Error('Not authenticated');
-      }
-
-      const data = await response.json();
-
-      return data.user as GetProfileResponse;
+      const session = await verifySessionOnClient();
+      return session;
     },
     staleTime: 5 * 60 * 1000, // cache for 5 minutes
     refetchOnWindowFocus: false,

src/webapp/lib/auth/dal.server.ts

···
+import { GetProfileResponse } from '@/api-client/ApiClient';
+import { cookies } from 'next/headers';
+import { cache } from 'react';
+
+const appUrl = process.env.APP_URL || 'http://127.0.0.1:4000';
+
+export const verifySessionOnServer = cache(async () => {
+  const cookieStore = await cookies();
+  const res = await fetch(`${appUrl}/api/auth/me`, {
+    headers: {
+      Cookie: cookieStore.toString(), // forward user's cookies
+    },
+  });
+
+  if (!res.ok) return null;
+
+  const { user }: { user: GetProfileResponse } = await res.json();
+
+  return user;
+});

src/webapp/lib/auth/dal.ts

···
 import type { GetProfileResponse } from '@/api-client/ApiClient';
-import { ClientCookieAuthService } from '@/services/auth';
-import { redirect } from 'next/navigation';
 import { cache } from 'react';
 
-const appUrl = process.env.APP_URL || 'http://127.0.0.1:4000';
+const appUrl = process.env.NEXT_PUBLIC_APP_URL || 'http://127.0.0.1:4000';
 
-export const verifySession = cache(
+export const verifySessionOnClient = cache(
   async (): Promise<GetProfileResponse | null> => {
     const response = await fetch(`${appUrl}/api/auth/me`, {
       method: 'GET',
···
     });
 
     if (!response.ok) {
-      await ClientCookieAuthService.clearTokens();
-      redirect('/login');
+      return null;
     }
 
-    const data = await response.json();
+    const { user }: { user: GetProfileResponse } = await response.json();
 
-    return data.user as GetProfileResponse;
+    return user;
   },
 );

src/webapp/lib/auth/token.ts

···
 export const isTokenExpiringSoon = (
   token: string | null | undefined,
-  bufferMinutes: number = 5,
+  bufferMinutes: number = 5, // 5 minutes
 ): boolean => {
   if (!token) return true;