Update MFA UI flags and lint guidance

This commit is contained in:
Haitao Pan 2026-01-25 19:07:57 +08:00
parent e6817ab1e0
commit 9ac93eece5
5 changed files with 74 additions and 55 deletions

View File

@ -28,7 +28,8 @@ yarn preview # Build and start production server
### Code Quality
```bash
yarn lint # Run ESLint
yarn lint # Run ESLint (currently fails under Next 16 CLI; use eslint command below)
./node_modules/.bin/eslint . --no-eslintrc --config .eslintrc.json --resolve-plugins-relative-to . # Run ESLint directly (ignore parent configs)
yarn typecheck # TypeScript type checking
yarn format # Format code with Prettier
```
@ -246,6 +247,7 @@ MUST NOT:
- No @/ imports inside packages
- Never "fix" libraries by polluting the app
- Always run `yarn lint` and `yarn typecheck` before completing tasks
- If `yarn lint` fails with "Invalid project directory .../lint" (Next 16 CLI), use `./node_modules/.bin/eslint .` instead
---

View File

@ -4,7 +4,8 @@
Required:
- yarn lint
- yarn lint (currently fails under Next 16 CLI; use eslint command below)
- ./node_modules/.bin/eslint . --no-eslintrc --config .eslintrc.json --resolve-plugins-relative-to .
- yarn typecheck
- yarn build

View File

@ -96,7 +96,11 @@ function formatTimestamp(value?: string) {
return date.toLocaleString()
}
export default function MfaSetupPanel() {
type MfaSetupPanelProps = {
showSummary?: boolean
}
export default function MfaSetupPanel({ showSummary = true }: MfaSetupPanelProps) {
const { language } = useLanguage()
const copy = translations[language].userCenter.mfa
const router = useRouter()
@ -435,6 +439,9 @@ export default function MfaSetupPanel() {
}, [])
if (!user) {
if (!showSummary) {
return null
}
return (
<Card>
<h2 className="text-xl font-semibold text-[var(--color-text)]">{copy.title}</h2>
@ -451,6 +458,7 @@ export default function MfaSetupPanel() {
return (
<>
{showSummary ? (
<Card>
<div className="space-y-6">
<div className="flex flex-col gap-6 sm:flex-row sm:items-start sm:justify-between">
@ -487,6 +495,7 @@ export default function MfaSetupPanel() {
</div>
</div>
</Card>
) : null}
{isDialogOpen ? (
<div

View File

@ -34,7 +34,11 @@ function resolveDisplayName(
return user.email
}
export default function UserOverview() {
type UserOverviewProps = {
hideMfaMainPrompt?: boolean
}
export default function UserOverview({ hideMfaMainPrompt = false }: UserOverviewProps) {
const router = useRouter()
const { language } = useLanguage()
const copy = translations[language].userCenter.overview
@ -114,7 +118,7 @@ export default function UserOverview() {
<p className="mt-1 text-xs text-[var(--color-text-subtle)] opacity-80">{copy.uuidNote}</p>
</div>
{requiresSetup ? (
{!hideMfaMainPrompt && requiresSetup ? (
<div className="rounded-[var(--radius-xl)] border border-[color:var(--color-warning-muted)] bg-[var(--color-warning-muted)] p-4 text-sm text-[var(--color-warning-foreground)] transition-colors">
<p className="text-base font-semibold">{copy.lockBanner.title}</p>
<p className="mt-1 text-sm">{copy.lockBanner.body}</p>
@ -180,6 +184,7 @@ export default function UserOverview() {
<p className="mt-3 text-xs text-[var(--color-text-subtle)]">{copy.cards.email.description}</p>
</Card>
{!hideMfaMainPrompt ? (
<Card>
<div className="flex items-start justify-between gap-4">
<div>
@ -195,6 +200,8 @@ export default function UserOverview() {
</Link>
</div>
</Card>
) : null}
</div>
</div>
)

View File

@ -5,8 +5,8 @@ import UserOverview from '../components/UserOverview'
export default function UserCenterAccountRoute() {
return (
<div className="space-y-6">
<UserOverview />
<MfaSetupPanel />
<UserOverview hideMfaMainPrompt />
<MfaSetupPanel showSummary={false} />
<SubscriptionPanel />
</div>
)