CodeCow/stack
1
0
Fork 0
mirror of https://github.com/stack-auth/stack.git synced 2026-06-13 21:01:21 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Improve auth method review surfaces.

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Developing-Gamer 2026-05-27 12:31:13 -07:00
parent a4a7b0f2c9
commit 3a2186d349
2 changed files with 40 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/auth-methods/page-client.tsx
View File

@ -162,7 +162,7 @@ function DisabledProvidersDialog({ open, onOpenChange }: { open?: boolean, onOpe
placeholder="Search for a provider..."
value={providerSearch}
onChange={(e) => setProviderSearch(e.target.value)}
leadingIcon={<MagnifyingGlassIcon size={14} />}
leadingIcon={<MagnifyingGlassIcon className="h-3.5 w-3.5" />}
/>
<div className="flex gap-2 flex-wrap justify-center">
{filteredProviders
@ -448,6 +448,7 @@ function useEmailVerificationToggle() {
open={!!pendingChange}
onClose={() => setPendingChange(null)}
title="Enable email verification requirement"
size="2xl"
danger
okButton={{
label: "Apply Change",
@ -468,35 +469,50 @@ function useEmailVerificationToggle() {
<Typography variant="secondary" type="label">
Affected users
</Typography>
<div className="rounded-xl ring-1 ring-black/[0.06] dark:ring-white/[0.06] overflow-hidden">
<table className="w-full text-sm">
<thead className="bg-foreground/[0.04]">
<div className="overflow-hidden rounded-xl ring-1 ring-black/[0.06] dark:ring-white/[0.06]">
<table className="w-full table-fixed text-sm">
<colgroup>
<col className="w-[22%]" />
<col />
<col className="w-[7.5rem]" />
</colgroup>
<thead className="bg-zinc-50 dark:bg-background">
<tr>
<th className="px-3 py-2 text-left font-medium">User</th>
<th className="px-3 py-2 text-left font-medium">Email</th>
<th className="px-3 py-2 text-left font-medium">Reason</th>
<th className="px-3 py-2 text-left font-medium whitespace-nowrap">Reason</th>
</tr>
</thead>
<tbody>
{pendingChange.affectedUsers.map((user) => (
<tr key={user.id} className="border-t border-black/[0.06] dark:border-white/[0.06]">
<td className="px-3 py-2">
{user.displayName || <span className="text-muted-foreground italic">No name</span>}
</td>
<td className="px-3 py-2">
{user.primaryEmail || <span className="text-muted-foreground italic">No email</span>}
</td>
<td className="px-3 py-2">
<DesignBadge
label={user.restrictedReason.type === "email_not_verified" ? "Email not verified" : "Anonymous user"}
color="orange"
size="sm"
/>
</td>
</tr>
))}
</tbody>
</table>
<div className="max-h-52 overflow-y-auto border-t border-black/[0.06] dark:border-white/[0.06]">
<table className="w-full table-fixed text-sm">
<colgroup>
<col className="w-[22%]" />
<col />
<col className="w-[7.5rem]" />
</colgroup>
<tbody>
{pendingChange.affectedUsers.map((user) => (
<tr key={user.id} className="border-t border-black/[0.06] dark:border-white/[0.06] first:border-t-0">
<td className="px-3 py-2 align-middle">
{user.displayName || <span className="text-muted-foreground italic">No name</span>}
</td>
<td className="px-3 py-2 align-middle truncate" title={user.primaryEmail ?? undefined}>
{user.primaryEmail || <span className="text-muted-foreground italic">No email</span>}
</td>
<td className="px-3 py-2 align-middle">
<DesignBadge
label={user.restrictedReason.type === "email_not_verified" ? "Not verified" : "Anonymous"}
color="orange"
size="sm"
contentMode="text"
/>
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
{pendingChange.totalAffectedCount > pendingChange.affectedUsers.length && (
<Typography variant="secondary" type="footnote">

4
apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/auth-methods/providers.tsx
View File

@ -80,9 +80,6 @@ export const providerFormSchema = yupObject({
export type ProviderFormValues = yup.InferType<typeof providerFormSchema>
/** Modal chrome — "Floating soft" (variant G). */
const PROVIDER_DIALOG_CHROME_CLASS = "border-0 rounded-3xl bg-background shadow-2xl shadow-black/30 dark:shadow-black/60";
function ProviderHeader({ providerId }: { providerId: string }) {
return (
<div className="flex items-center gap-3">
@ -329,7 +326,6 @@ export function ProviderSettingDialog(props: Props & { open: boolean, onClose: (
title={`${toTitle(props.id)} OAuth provider`}
cancelButton
okButton={{ label: 'Save' }}
contentClassName={PROVIDER_DIALOG_CHROME_CLASS}
render={(form) => (
<OAuthProviderSettingsForm
form={form}