fix(web): auth UX polish batch — guest button, oauth labels
Some checks failed
CI / Tests / 🧪 Test (push) Has been cancelled
Some checks failed
CI / Tests / 🧪 Test (push) Has been cancelled
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>
This commit is contained in:
@@ -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],
|
||||
},
|
||||
|
||||
@@ -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>
|
||||
</>
|
||||
)}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user