Updating routes

apps/next/app/layout.tsx

@@ -9,6 +9,8 @@ import "./globals.css"
 
 import type { Viewport } from "next"
 
+import Navigation from "./navigation"
+
 const fontSans = FontSans({
   subsets: ["latin"],
   variable: "--font-sans",
@@ -27,7 +29,9 @@ export default function RootLayout({
           fontSans.variable
         )}
       >
-        <Providers>{children}</Providers>
+        <Providers>
+          <Navigation>{children}</Navigation>
+        </Providers>
       </body>
     </html>
   )

apps/next/app/login/new/page.tsx

@@ -12,7 +12,7 @@ export default async function Page() {
   } = await supabase.auth.getUser()
 
   if (user) {
-    user.is_anonymous ? redirect("/guest") : redirect("/settings/accounts")
+    redirect("/settings/accounts")
   }
 
   return <RegisterForm />

apps/next/app/login/new/passwordless/page.tsx

@@ -12,7 +12,7 @@ export default async function Page() {
   } = await supabase.auth.getUser()
 
   if (user) {
-    user.is_anonymous ? redirect("/guest") : redirect("/settings/accounts")
+    redirect("/settings")
   }
 
   return <RegisterFormPasswordless />

apps/next/app/login/otp/confirm/page.tsx

@@ -21,7 +21,7 @@ export default async function Page({
   } = await supabase.auth.getUser()
 
   if (user) {
-    redirect("/settings/accounts")
+    redirect("/settings")
   }
 
   if (!searchParams.email) {

apps/next/app/login/otp/page.tsx

@@ -12,7 +12,7 @@ export default async function Page() {
   } = await supabase.auth.getUser()
 
   if (user) {
-    redirect("/settings/accounts")
+    redirect("/settings")
   }
 
   return <OtpLoginForm />

apps/next/app/login/page.tsx

@@ -4,7 +4,6 @@ import { z } from "zod"
 import { LoginForm } from "@/components/user/login/login-form"
 
 import { createClient } from "@/modules/utils/server"
-import { isAnonymousUser } from "@/modules/user/helpers"
 
 export default async function Page({
   searchParams: { error },
@@ -18,7 +17,7 @@ export default async function Page({
   } = await supabase.auth.getUser()
 
   if (user) {
-    isAnonymousUser(user) ? redirect("/guest") : redirect("/settings/accounts")
+    redirect("/settings")
   }
 
   if (error) {

apps/next/app/login/reset/page.tsx

@@ -12,7 +12,7 @@ export default async function Page() {
   } = await supabase.auth.getUser()
 
   if (user) {
-    redirect("/settings/accounts")
+    redirect("/settings")
   }
 
   return <ResetPasswordForm />

apps/next/app/(authenticated)/layout.tsx → apps/next/app/navigation.tsx

@@ -1,9 +1,8 @@
 import { ApplicationLayout } from "@/components/application-layout"
 
 import { createClient } from "@/modules/utils/server"
-import { isAnonymousUser } from "@/modules/user/helpers"
 
-export default async function Layout({
+export default async function Navigation({
   children,
 }: {
   children: React.ReactNode
@@ -14,11 +13,12 @@ export default async function Layout({
     data: { user },
   } = await supabase.auth.getUser()
 
+  if (!user) {
+    return <>{children}</>
+  }
+
   return (
-    <ApplicationLayout
-      userId={user?.id}
-      isAnonymousUser={!!user && isAnonymousUser(user)}
-    >
+    <ApplicationLayout userId={user.id} isAnonymousUser={user.is_anonymous}>
       {children}
     </ApplicationLayout>
   )

apps/next/app/page.tsx

@@ -1,7 +1,6 @@
 import { redirect } from "next/navigation"
 
 import { createClient } from "@/modules/utils/server"
-import { isAnonymousUser } from "@/modules/user/helpers"
 
 export default async function Home() {
   const supabase = createClient()
@@ -11,7 +10,7 @@ export default async function Home() {
   } = await supabase.auth.getUser()
 
   if (user) {
-    isAnonymousUser(user) ? redirect("/guest") : redirect("/settings/accounts")
+    redirect("/settings")
   }
 
   redirect("/login")

apps/next/app/(authenticated)/settings/accounts/page.tsx → apps/next/app/settings/accounts/page.tsx

@@ -1,6 +1,6 @@
 import { redirect } from "next/navigation"
 
-import { Accounts } from "@/components/user/accounts"
+import { Accounts } from "@/components/user/settings/accounts"
 
 import { createClient } from "@/modules/utils/server"
 
@@ -15,5 +15,9 @@ export default async function Page() {
     redirect("/login")
   }
 
+  if (user.is_anonymous) {
+    redirect("/settings")
+  }
+
   return <Accounts userId={user.id} />
 }

apps/next/app/(authenticated)/settings/credentials/page.tsx → apps/next/app/settings/credentials/page.tsx

@@ -1,6 +1,6 @@
 import { redirect } from "next/navigation"
 
-import { CredentialsForm } from "@/components/user/credentials-form"
+import { CredentialsForm } from "@/components/user/settings/credentials-form"
 
 import { createClient } from "@/modules/utils/server"
 
@@ -11,9 +11,13 @@ export default async function Page() {
     data: { user },
   } = await supabase.auth.getUser()
 
-  if (!user?.email) {
+  if (!user) {
     redirect("/login")
   }
 
+  if (user.is_anonymous || !user.email) {
+    redirect("/settings")
+  }
+
   return <CredentialsForm userEmail={user.email} />
 }

apps/next/app/(authenticated)/settings/layout.tsx → apps/next/app/settings/layout.tsx

@@ -1,17 +1,36 @@
 import { DynamicNavigationLinks } from "@/components/dynamic-navigation-links"
 
-export default function Layout({ children }: { children: React.ReactNode }) {
+import { createClient } from "@/modules/utils/server"
+
+export default async function Layout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  const supabase = createClient()
+
+  const {
+    data: { user },
+  } = await supabase.auth.getUser()
+
+  if (!user) return null
+
   return (
     <section className="mx-auto max-w-5xl space-y-6 py-6">
       <header className="space-y-2">
         <h2 className="text-4xl font-semibold tracking-tight lg:text-5xl">
-          Settings
+          {!user.is_anonymous ? "Settings" : "Guest Settings"}
         </h2>
-        <p>Manage your accounts, profile and credentials settings</p>
+        <p>
+          {!user.is_anonymous
+            ? "Manage your accounts, profile and credentials settings"
+            : "Access to settings is restricted to anonymous users"}
+        </p>
       </header>
       <div className="flex flex-col gap-6 lg:flex-row">
         <nav className="-ml-4 h-full min-w-[30%]">
           <DynamicNavigationLinks
+            isAnonymousUser={user.is_anonymous}
             items={[
               {
                 href: "/settings/accounts",

apps/next/app/(authenticated)/settings/page.tsx → apps/next/app/settings/page.tsx

@@ -1,5 +1,7 @@
 import { redirect } from "next/navigation"
 
+import { GuestForm } from "@/components/user/settings/guest-form"
+
 import { createClient } from "@/modules/utils/server"
 
 export default async function Page() {
@@ -13,5 +15,9 @@ export default async function Page() {
     redirect("/login")
   }
 
+  if (user.is_anonymous) {
+    return <GuestForm />
+  }
+
   redirect("/settings/accounts")
 }

apps/next/app/(authenticated)/settings/profile/page.tsx → apps/next/app/settings/profile/page.tsx

@@ -1,6 +1,6 @@
 import { redirect } from "next/navigation"
 
-import { ProfileForm } from "@/components/user/profile-form"
+import { ProfileForm } from "@/components/user/settings/profile-form"
 
 import { createClient } from "@/modules/utils/server"
 
@@ -15,5 +15,9 @@ export default async function Page() {
     redirect("/login")
   }
 
+  if (user.is_anonymous) {
+    redirect("/settings")
+  }
+
   return <ProfileForm userId={user.id} />
 }

apps/next/components/application-layout.tsx

@@ -3,7 +3,7 @@
 import * as React from "react"
 import Link from "next/link"
 import { usePathname } from "next/navigation"
-import { Bookmark, PanelLeft, Settings } from "lucide-react"
+import { Bookmark, PanelLeft } from "lucide-react"
 
 import {
   Breadcrumb,
@@ -63,20 +63,6 @@ export const ApplicationLayout: React.FC<
             <SupabaseModulesIcon />
             <span className="sr-only">Supabase Modules</span>
           </Link>
-          {!isAnonymousUser && (
-            <Tooltip>
-              <TooltipTrigger asChild>
-                <Link
-                  href="/settings/accounts"
-                  className="flex size-9 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:text-foreground md:size-8"
-                >
-                  <Settings className="size-5" />
-                  <span className="sr-only">Settings</span>
-                </Link>
-              </TooltipTrigger>
-              <TooltipContent side="right">Settings</TooltipContent>
-            </Tooltip>
-          )}
           <Tooltip>
             <TooltipTrigger asChild>
               <Link
@@ -102,22 +88,10 @@ export const ApplicationLayout: React.FC<
             </SheetTrigger>
             <SheetContent side="left" className="sm:max-w-xs">
               <nav className="grid gap-6 text-lg font-medium">
-                <Link
-                  href="/"
-                  className="group flex size-9 shrink-0 items-center justify-center gap-2 rounded-full text-lg *:size-6 md:size-8 md:text-base"
-                >
+                <div className="group flex size-9 shrink-0 items-center justify-center gap-2 rounded-full text-lg *:size-6 md:size-8 md:text-base">
                   <SupabaseModulesIcon />
                   <span className="sr-only">Supabase Modules</span>
-                </Link>
-                <SheetClose asChild>
-                  <Link
-                    href={isAnonymousUser ? "/guest" : "/settings/accounts"}
-                    className="flex items-center gap-4 px-2.5 text-muted-foreground hover:text-foreground"
-                  >
-                    <Settings className="size-5" />
-                    Settings
-                  </Link>
-                </SheetClose>
+                </div>
                 <SheetClose asChild>
                   <Link
                     href="/bookmarks"

apps/next/components/bookmarks/bookmarks-list.tsx

@@ -31,7 +31,7 @@ export const BookmarksList: React.FC<{ userId: string }> = ({ userId }) => {
     return (
       <div className="flex h-full flex-col items-center justify-center">
         <div className="animate-pulse">
-          <CircleIcon className="size-8 animate-spin inline" />
+          <CircleIcon className="inline size-8 animate-spin" />
         </div>
       </div>
     )
@@ -131,7 +131,7 @@ const BookmarkDelete: React.FC<{ bookmarkId: string; userId: string }> = ({
       size={"sm"}
       className="-ml-3 block"
     >
-      {isPending && <Loader2 className="mr-1.5 size-4 animate-spin inline" />}
+      {isPending && <Loader2 className="mr-1.5 inline size-4 animate-spin" />}
       Delete
     </Button>
   )

apps/next/components/bookmarks/create-bookmark.tsx

@@ -88,7 +88,9 @@ const CreateBookmarkComponent: React.FC<{
           )}
         />
         <Button type="submit" disabled={isPending}>
-          {isPending && <CircleIcon className="mr-2 size-4 animate-spin inline" />}
+          {isPending && (
+            <CircleIcon className="mr-2 inline size-4 animate-spin" />
+          )}
           Save
         </Button>
       </form>

apps/next/components/dynamic-navigation-links.tsx

@@ -8,7 +8,8 @@ import { Button } from "@/components/ui/button"
 
 export const DynamicNavigationLinks: React.FC<{
   items: { href: string; label: string }[]
-}> = ({ items }) => {
+  isAnonymousUser?: boolean
+}> = ({ items, isAnonymousUser }) => {
   const pathname = usePathname()
 
   return (
@@ -17,7 +18,8 @@ export const DynamicNavigationLinks: React.FC<{
         <Button
           key={href}
           className="lg:w-full lg:justify-start"
-          asChild
+          asChild={!isAnonymousUser}
+          disabled={isAnonymousUser}
           variant="ghost"
         >
           {href === pathname ? (