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),
|
password: toBool(env.NEXT_PUBLIC_AUTH_PASSWORD, true),
|
||||||
magicLink: toBool(env.NEXT_PUBLIC_AUTH_MAGIC_LINK, false),
|
magicLink: toBool(env.NEXT_PUBLIC_AUTH_MAGIC_LINK, false),
|
||||||
passkey: toBool(env.NEXT_PUBLIC_AUTH_PASSKEY, true),
|
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.
|
// v0.1.0: GitHub + Google. Apple deferred until we need it.
|
||||||
oAuth: [SocialProvider.GOOGLE, SocialProvider.GITHUB],
|
oAuth: [SocialProvider.GOOGLE, SocialProvider.GITHUB],
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -29,6 +29,12 @@ export const SocialIcons: Record<SocialProviderType, Icon> = {
|
|||||||
[SocialProviderType.APPLE]: Icons.Apple,
|
[SocialProviderType.APPLE]: Icons.Apple,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const PROVIDER_LABELS: Record<SocialProviderType, string> = {
|
||||||
|
[SocialProviderType.GITHUB]: "GitHub",
|
||||||
|
[SocialProviderType.GOOGLE]: "Google",
|
||||||
|
[SocialProviderType.APPLE]: "Apple",
|
||||||
|
};
|
||||||
|
|
||||||
const SocialProvider = ({
|
const SocialProvider = ({
|
||||||
provider,
|
provider,
|
||||||
isSubmitting,
|
isSubmitting,
|
||||||
@@ -49,7 +55,7 @@ const SocialProvider = ({
|
|||||||
variant="outline"
|
variant="outline"
|
||||||
type="button"
|
type="button"
|
||||||
size="lg"
|
size="lg"
|
||||||
className="relative grow basis-28 gap-2"
|
className="relative w-full justify-center gap-2"
|
||||||
disabled={isSubmitting}
|
disabled={isSubmitting}
|
||||||
onClick={onClick}
|
onClick={onClick}
|
||||||
>
|
>
|
||||||
@@ -58,7 +64,9 @@ const SocialProvider = ({
|
|||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
<Icon className="size-5 dark:brightness-125" />
|
<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