feat: Anonymous user access (#34)

chore: update supabase and supabase js client

chore: remove cache files from repo

refactor: use grouped routes for layout sharing for all authenticated routes

db: squash user migrations into single file

db: enable pg_cron and add job for anonymous users cleanup

apps/next/app/(authenticated)/bookmarks/layout.tsx

@@ -0,0 +1,13 @@
+export default function Layout({ children }: { children: React.ReactNode }) {
+  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">
+          Bookmarks
+        </h2>
+        <p>Add and manage your bookmarks</p>
+      </header>
+      <div className="w-full">{children}</div>
+    </section>
+  )
+}

apps/next/app/(authenticated)/guest/layout.tsx

@@ -0,0 +1,13 @@
+export default function Layout({ children }: { children: React.ReactNode }) {
+  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">
+          Guest page
+        </h2>
+        <p>This is page accessible to guest accounts</p>
+      </header>
+      <div className="w-full">{children}</div>
+    </section>
+  )
+}

apps/next/app/(authenticated)/guest/page.tsx

@@ -0,0 +1,20 @@
+import { redirect } from "next/navigation"
+
+import { GuestForm } from "@/components/user/guest-form"
+
+import { createClient } from "@/modules/utils/server"
+import { isAnonymousUser } from "@/modules/user/helpers"
+
+export default async function Page() {
+  const supabase = createClient()
+
+  const {
+    data: { user },
+  } = await supabase.auth.getUser()
+
+  if (!user || !isAnonymousUser(user)) {
+    redirect("/login")
+  }
+
+  return <GuestForm isAnonymousUser={user.is_anonymous ?? false} />
+}

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

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

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

@@ -0,0 +1,35 @@
+import { DynamicNavigationLinks } from "@/components/dynamic-navigation-links"
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  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
+        </h2>
+        <p>Manage your accounts, profile and credentials settings</p>
+      </header>
+      <div className="flex flex-col gap-6 lg:flex-row">
+        <nav className="-ml-4 h-full min-w-[30%]">
+          <DynamicNavigationLinks
+            items={[
+              {
+                href: "/settings/accounts",
+                label: "Accounts",
+              },
+              {
+                href: "/settings/profile",
+                label: "Profile",
+              },
+              {
+                href: "/settings/credentials",
+                label: "Credentials",
+              },
+            ]}
+          />
+        </nav>
+        <div className="w-full">{children}</div>
+      </div>
+    </section>
+  )
+}

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

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

apps/next/app/login/page.tsx

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

apps/next/app/page.tsx

@@ -1,6 +1,7 @@
 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()
@@ -10,7 +11,7 @@ export default async function Home() {
   } = await supabase.auth.getUser()
 
   if (user) {
-    redirect("/settings/accounts")
+    isAnonymousUser(user) ? redirect("/guest") : redirect("/settings/accounts")
   }
 
   redirect("/login")

apps/next/components/application-layout.tsx

@@ -22,8 +22,11 @@ import {
 import { ProfileDropdown } from "@/components/user/profile-dropdown"
 
 export const ApplicationLayout: React.FC<
-  React.PropsWithChildren<{ userId?: string }>
-> = ({ children, userId }) => {
+  React.PropsWithChildren<{
+    userId?: string
+    isAnonymousUser?: boolean
+  }>
+> = ({ children, userId, isAnonymousUser }) => {
   const pathname = usePathname()
 
   const paths = React.useMemo(() => {
@@ -55,18 +58,20 @@ export const ApplicationLayout: React.FC<
             <SupabaseModulesIcon />
             <span className="sr-only">Supabase Modules</span>
           </Link>
-          <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>
+          {!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
@@ -104,7 +109,7 @@ export const ApplicationLayout: React.FC<
                   <span className="sr-only">Supabase Modules</span>
                 </Link>
                 <Link
-                  href="/settings/accounts"
+                  href={isAnonymousUser ? "/guest" : "/settings/accounts"}
                   className="flex items-center gap-4 px-2.5 text-muted-foreground hover:text-foreground"
                 >
                   <Settings className="size-5" />
@@ -140,7 +145,7 @@ export const ApplicationLayout: React.FC<
               ))}
             </BreadcrumbList>
           </Breadcrumb>
-          <ProfileDropdown userId={userId} />
+          <ProfileDropdown userId={userId} isAnonymousUser={isAnonymousUser} />
         </header>
         <main className="px-6">{children}</main>
       </div>