From e8ad7a5b19de42ca5fa0bdf8d639ec3be42d1b2d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alejandro=20Guti=C3=A9rrez?=
 <35082514+alezmad@users.noreply.github.com>
Date: Sun, 5 Apr 2026 14:55:09 +0100
Subject: [PATCH] =?UTF-8?q?fix(web):=20auth=20UX=20polish=20batch=20?=
 =?UTF-8?q?=E2=80=94=20guest=20button,=20oauth=20labels?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Three launch-visible friction fixes:

#3: "Continuar como invitado" (anonymous sign-in) removed. claudemesh
    requires an account — mesh membership, invite issuance, and audit
    trails are all tied to a user.id. Flipping the toggle is enough:
    the AnonymousLogin component is gated by
    `authConfig.providers.anonymous` in login.tsx, so disabling the
    flag makes the button disappear from both /login and /register.

#4: OAuth buttons now show proper brand labels. Was rendering lowercase
    "github" / "google" / "apple" via capitalize CSS (which users read
    as "is this broken?"). Now renders "Continue with GitHub" /
    "Continue with Google" / "Continue with Apple" next to the existing
    brand icons. Also swapped layout: was `grow basis-28` (side-by-side
    chips), now `w-full justify-center` (stacked full-width buttons) —
    matches claude.com login styling more closely.

#6: Session hydration race on /dashboard — NON-ISSUE verified. The
    0-mesh redirect runs in a Server Component AFTER
    /dashboard/layout.tsx's getSession() gate. Server api.ts forwards
    cookies to the Hono backend, so no client-side auth state is in
    play. No fix needed.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 apps/web/src/config/auth.ts                         |  3 ++-
 apps/web/src/modules/auth/form/social-providers.tsx | 12 ++++++++++--
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/apps/web/src/config/auth.ts b/apps/web/src/config/auth.ts
index 209ed05..13eb0b2 100644
--- a/apps/web/src/config/auth.ts
+++ b/apps/web/src/config/auth.ts
@@ -17,7 +17,8 @@ export const authConfig = authConfigSchema.parse({
     password: toBool(env.NEXT_PUBLIC_AUTH_PASSWORD, true),
     magicLink: toBool(env.NEXT_PUBLIC_AUTH_MAGIC_LINK, false),
     passkey: toBool(env.NEXT_PUBLIC_AUTH_PASSKEY, true),
-    anonymous: toBool(env.NEXT_PUBLIC_AUTH_ANONYMOUS, true),
+    // claudemesh requires auth — mesh membership is tied to an account
+    anonymous: toBool(env.NEXT_PUBLIC_AUTH_ANONYMOUS, false),
     // v0.1.0: GitHub + Google. Apple deferred until we need it.
     oAuth: [SocialProvider.GOOGLE, SocialProvider.GITHUB],
   },
diff --git a/apps/web/src/modules/auth/form/social-providers.tsx b/apps/web/src/modules/auth/form/social-providers.tsx
index db3e1a0..d18da15 100644
--- a/apps/web/src/modules/auth/form/social-providers.tsx
+++ b/apps/web/src/modules/auth/form/social-providers.tsx
@@ -29,6 +29,12 @@ export const SocialIcons: Record<SocialProviderType, Icon> = {
   [SocialProviderType.APPLE]: Icons.Apple,
 };
 
+const PROVIDER_LABELS: Record<SocialProviderType, string> = {
+  [SocialProviderType.GITHUB]: "GitHub",
+  [SocialProviderType.GOOGLE]: "Google",
+  [SocialProviderType.APPLE]: "Apple",
+};
+
 const SocialProvider = ({
   provider,
   isSubmitting,
@@ -49,7 +55,7 @@ const SocialProvider = ({
       variant="outline"
       type="button"
       size="lg"
-      className="relative grow basis-28 gap-2"
+      className="relative w-full justify-center gap-2"
       disabled={isSubmitting}
       onClick={onClick}
     >
@@ -58,7 +64,9 @@ const SocialProvider = ({
       ) : (
         <>
           <Icon className="size-5 dark:brightness-125" />
-          <span className="leading-none capitalize">{provider}</span>
+          <span className="leading-none">
+            Continue with {PROVIDER_LABELS[provider]}
+          </span>
         </>
       )}