Skip to content

Commit f81becc

Browse files
emir-karabegwaleedlatif1
emir-karabeg
authored and
waleedlatif1
committed
fix(auth): consolidate fields and localize icons
1 parent dd6ef5e commit f81becc

15 files changed

Lines changed: 140 additions & 68 deletions

File tree

‎apps/sim/app/(auth)/components/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
export {
22
AuthDivider,
3+
AuthEmailInput,
34
AuthField,
45
AuthFormMessage,
56
AuthHeader,

‎apps/sim/app/(auth)/components/social-login-buttons.tsx‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,16 @@
11
'use client'
22

33
import { useState } from 'react'
4-
import { AuthFormMessage, AuthProviderGroup, AuthButton as Chip } from '@sim/auth-ui'
4+
import {
5+
AuthFormMessage,
6+
AuthGithubIcon,
7+
AuthGoogleIcon,
8+
AuthMicrosoftIcon,
9+
AuthProviderGroup,
10+
AuthButton as Chip,
11+
} from '@sim/auth-ui'
512
import { createLogger } from '@sim/logger'
613
import { getErrorMessage } from '@sim/utils/errors'
7-
import { GithubIcon, GoogleIcon, MicrosoftIcon } from '@/components/icons'
814
import { type SocialSignInProvider, startSocialSignIn } from '@/lib/auth/social-sign-in'
915
import { DEFAULT_POST_AUTH_ROUTE } from '@/app/(auth)/auth-redirect'
1016
import { SSOLoginButton } from '@/app/(auth)/components/sso-login-button'
@@ -23,9 +29,9 @@ interface SocialLoginButtonsProps {
2329

2430
/** Display order of the provider buttons. */
2531
const PROVIDERS = [
26-
{ provider: 'google', label: 'Google', icon: GoogleIcon },
27-
{ provider: 'microsoft', label: 'Microsoft', icon: MicrosoftIcon },
28-
{ provider: 'github', label: 'GitHub', icon: GithubIcon },
32+
{ provider: 'google', label: 'Google', icon: AuthGoogleIcon },
33+
{ provider: 'microsoft', label: 'Microsoft', icon: AuthMicrosoftIcon },
34+
{ provider: 'github', label: 'GitHub', icon: AuthGithubIcon },
2935
] as const
3036

3137
export function SocialLoginButtons({

‎apps/sim/app/(auth)/login/login-form.tsx‎

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,10 @@ import { quickValidateEmail } from '@/lib/messaging/email/validation'
1717
import { DEFAULT_POST_AUTH_ROUTE, POST_AUTH_REDIRECT_STORAGE_KEY } from '@/app/(auth)/auth-redirect'
1818
import {
1919
AuthDivider,
20+
AuthEmailInput,
2021
AuthField,
2122
AuthFormMessage,
2223
AuthHeader,
23-
AuthInput,
2424
AuthLegalFooter,
2525
AuthSubmitButton,
2626
AuthTextLink,
@@ -380,12 +380,10 @@ export default function LoginPage({
380380
}}
381381
>
382382
<AuthField htmlFor='recovery-email' label='Email'>
383-
<AuthInput
383+
<AuthEmailInput
384384
id='recovery-email'
385385
name='email'
386-
inputMode='email'
387386
type='email'
388-
autoComplete='email'
389387
autoFocus
390388
value={forgotPasswordEmail}
391389
disabled={isSubmittingReset}
@@ -431,15 +429,10 @@ export default function LoginPage({
431429
<form onSubmit={onSubmit} className='au:space-y-[var(--auth-group-gap)]'>
432430
<div className='au:space-y-5'>
433431
<AuthField htmlFor='email' label='Email' errors={emailFieldErrors}>
434-
<AuthInput
432+
<AuthEmailInput
435433
id='email'
436434
name='email'
437-
inputMode='email'
438-
placeholder='Enter your email'
439435
required
440-
autoCapitalize='none'
441-
autoComplete='email'
442-
autoCorrect='off'
443436
disabled={isLoading}
444437
value={email}
445438
onChange={handleEmailChange}
@@ -471,7 +464,6 @@ export default function LoginPage({
471464
autoCapitalize='none'
472465
autoComplete='current-password'
473466
autoCorrect='off'
474-
placeholder='Enter your password'
475467
disabled={isLoading}
476468
value={password}
477469
onChange={handlePasswordChange}

‎apps/sim/app/(auth)/oauth/consent/consent-view.tsx‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
'use client'
22

3-
import { AuthAccountMenu, AuthButton as Chip } from '@sim/auth-ui'
4-
import { Check } from '@sim/emcn/icons'
3+
import { AuthAccountMenu, AuthIcon, AuthButton as Chip } from '@sim/auth-ui'
54
import { getErrorMessage } from '@sim/utils/errors'
65
import {
76
OAUTH_SCOPE_DESCRIPTIONS,
@@ -149,8 +148,8 @@ export function OAuthConsentView({
149148
key={item}
150149
className='au:flex au:items-start au:gap-2 au:text-[var(--auth-primary)] au:text-body'
151150
>
152-
<Check
153-
aria-hidden='true'
151+
<AuthIcon
152+
name='check'
154153
className='au:mt-[3px] au:size-4 au:shrink-0 au:text-[var(--auth-secondary)]'
155154
/>
156155
<span>{OAUTH_SCOPE_DESCRIPTIONS[item]}</span>

‎apps/sim/app/(auth)/signup/signup-form.tsx‎

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import {
2323
} from '@/app/(auth)/auth-redirect'
2424
import {
2525
AuthDivider,
26+
AuthEmailInput,
2627
AuthField,
2728
AuthFormMessage,
2829
AuthHeader,
@@ -435,14 +436,9 @@ function SignupFormContent({
435436
/>
436437
</AuthField>
437438
<AuthField htmlFor='email' label='Email' errors={emailFieldErrors}>
438-
<AuthInput
439+
<AuthEmailInput
439440
id='email'
440441
name='email'
441-
inputMode='email'
442-
placeholder='Enter your email'
443-
autoCapitalize='none'
444-
autoComplete='email'
445-
autoCorrect='off'
446442
disabled={isLoading}
447443
value={email}
448444
onChange={handleEmailChange}
@@ -461,7 +457,6 @@ function SignupFormContent({
461457
autoCapitalize='none'
462458
autoComplete='new-password'
463459
aria-describedby='password-hint'
464-
placeholder='Enter your password'
465460
autoCorrect='off'
466461
disabled={isLoading}
467462
value={password}

‎apps/sim/app/(interfaces)/chat/components/auth/email/email-auth.tsx‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
'use client'
22

33
import { useEffect, useState } from 'react'
4-
import { AuthCodeEntry, AuthField, AuthHeader, AuthInput, AuthStack } from '@sim/auth-ui'
4+
import { AuthCodeEntry, AuthEmailInput, AuthField, AuthHeader, AuthStack } from '@sim/auth-ui'
55
import { createLogger } from '@sim/logger'
66
import { toError } from '@sim/utils/errors'
77
import { quickValidateEmail } from '@/lib/messaging/email/validation'
@@ -128,15 +128,11 @@ export default function EmailAuth({ identifier }: EmailAuthProps) {
128128
className='au:space-y-5'
129129
>
130130
<AuthField htmlFor='email' label='Email' errors={emailErrors}>
131-
<AuthInput
131+
<AuthEmailInput
132132
id='email'
133133
name='email'
134134
type='email'
135135
required
136-
autoCapitalize='none'
137-
autoComplete='email'
138-
autoCorrect='off'
139-
placeholder='Enter your email'
140136
value={email}
141137
onChange={handleEmailChange}
142138
error={hasEmailError}

‎apps/sim/app/f/[token]/public-file-email-auth.tsx‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
'use client'
22

33
import { useEffect, useState } from 'react'
4-
import { AuthCodeEntry, AuthField, AuthInput } from '@sim/auth-ui'
4+
import { AuthCodeEntry, AuthEmailInput, AuthField } from '@sim/auth-ui'
55
import { getErrorMessage } from '@sim/utils/errors'
66
import { normalizeEmail } from '@sim/utils/string'
77
import { useRouter } from 'next/navigation'
@@ -95,15 +95,11 @@ export function PublicFileEmailAuth({ token }: PublicFileEmailAuthProps) {
9595
className='au:space-y-5'
9696
>
9797
<AuthField htmlFor='email' label='Email' errors={error ? [error] : undefined}>
98-
<AuthInput
98+
<AuthEmailInput
9999
id='email'
100100
name='email'
101101
type='email'
102102
required
103-
autoCapitalize='none'
104-
autoComplete='email'
105-
autoCorrect='off'
106-
placeholder='Enter your email'
107103
value={email}
108104
onChange={(event) => {
109105
setEmail(event.target.value)

‎apps/sim/app/f/[token]/public-file-sso-auth.tsx‎

Lines changed: 6 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
'use client'
22

33
import { useState } from 'react'
4-
import { cn, AuthInput as Input, AuthLabel as Label } from '@sim/auth-ui'
4+
import { AuthEmailInput, AuthField } from '@sim/auth-ui'
55
import { getErrorMessage } from '@sim/utils/errors'
66
import { normalizeEmail } from '@sim/utils/string'
77
import { useRouter } from 'next/navigation'
@@ -66,28 +66,22 @@ export function PublicFileSSOAuth({ token }: PublicFileSSOAuthProps) {
6666
}}
6767
className='au:space-y-[var(--auth-group-gap)]'
6868
>
69-
<div className='au:space-y-2'>
70-
<Label htmlFor='email'>Work Email</Label>
71-
<Input
69+
<AuthField htmlFor='email' label='Work email' errors={error ? [error] : undefined}>
70+
<AuthEmailInput
7271
id='email'
7372
name='email'
7473
required
7574
type='email'
76-
autoCapitalize='none'
77-
autoComplete='email'
78-
autoCorrect='off'
7975
placeholder='Enter your work email'
8076
value={email}
8177
onChange={(e) => {
8278
setEmail(e.target.value)
8379
setError(null)
8480
}}
85-
className={cn(
86-
error && 'au:border-[var(--auth-error)] au:focus:border-[var(--auth-error)]'
87-
)}
81+
error={Boolean(error)}
82+
disabled={isLoading}
8883
/>
89-
{error ? <p className='au:text-[var(--auth-error)] au:text-caption'>{error}</p> : null}
90-
</div>
84+
</AuthField>
9185

9286
<AuthSubmitButton
9387
disabled={!email.trim()}

‎apps/sim/auth-migration/validation.json‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,28 @@
11
{
22
"date": "2026-10-29",
3+
"controlCleanup": {
4+
"changes": [
5+
"Centralized email placeholders, keyboard hints and autocomplete defaults in AuthEmailInput.",
6+
"Centralized the default password placeholder in PasswordInput.",
7+
"Refined the local visibility glyphs and localized provider logos and the consent checkmark.",
8+
"Consolidated public-file SSO validation into AuthField."
9+
],
10+
"validation": {
11+
"lint": "pass across 27 workspaces",
12+
"typeCheck": "pass across 27 workspaces",
13+
"audits": "61 passed",
14+
"desktopBuild": "pass",
15+
"blockRegistry": "pass",
16+
"focusedTests": "7 files and 24 tests passed, including the assistant-execution file",
17+
"browser": [
18+
"Recovery email placeholder and email input defaults verified in the running app.",
19+
"Mouse and keyboard visibility controls switch the input type and accessible label.",
20+
"Desktop and 390px mobile sign-in and recovery layouts visually verified.",
21+
"Signup renders the shared email and password controls."
22+
],
23+
"fullSuite": "Run before the final provider-logo and consent-icon import changes: 19/20 workspace tasks passed; App had 38,753 passing tests, 4 failures and 8 skips. Two failures were the previously documented executor timeouts; two were in unchanged tools/assistant-execution.test.ts, which passed in the final focused run. No unrelated test or timeout changes were made."
24+
}
25+
},
326
"base": "a0f47b1e87b0a26d9071cad1ce592666b7e7de07",
427
"runtime": {
528
"bun": "1.4.1",

‎apps/sim/ee/sso/components/sso-auth.tsx‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
'use client'
22

33
import { useState } from 'react'
4-
import { AuthField, AuthHeader, AuthInput, AuthStack } from '@sim/auth-ui'
4+
import { AuthEmailInput, AuthField, AuthHeader, AuthStack } from '@sim/auth-ui'
55
import { createLogger } from '@sim/logger'
66
import { useRouter } from 'next/navigation'
77
import { ApiClientError } from '@/lib/api/client/errors'
@@ -107,14 +107,11 @@ export default function SSOAuth({ identifier }: SSOAuthProps) {
107107
label='Work email'
108108
errors={showEmailValidationError ? emailErrors : undefined}
109109
>
110-
<AuthInput
110+
<AuthEmailInput
111111
id='email'
112112
name='email'
113113
required
114114
type='email'
115-
autoCapitalize='none'
116-
autoComplete='email'
117-
autoCorrect='off'
118115
placeholder='Enter your work email'
119116
value={email}
120117
onChange={handleEmailChange}

0 commit comments

Comments
 (0)