Skip to content

Commit 0a2562b

Browse files
chore: fix conflicts
1 parent 9547361 commit 0a2562b

File tree

123 files changed

+620
-457
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

123 files changed

+620
-457
lines changed

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

Lines changed: 102 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -387,29 +387,41 @@ export default function LoginPage({
387387
<div className='flex items-center justify-between'>
388388
<Label htmlFor='email'>Email</Label>
389389
</div>
390-
<Input
391-
id='email'
392-
name='email'
393-
placeholder='Enter your email'
394-
required
395-
autoCapitalize='none'
396-
autoComplete='email'
397-
autoCorrect='off'
398-
value={email}
399-
onChange={handleEmailChange}
400-
className={cn(
401-
showEmailValidationError &&
402-
emailErrors.length > 0 &&
403-
'border-red-500 focus:border-red-500'
404-
)}
405-
/>
406-
{showEmailValidationError && emailErrors.length > 0 && (
407-
<div className='mt-1 space-y-1 text-red-400 text-xs'>
408-
{emailErrors.map((error, index) => (
409-
<p key={index}>{error}</p>
410-
))}
390+
<div className='relative'>
391+
<Input
392+
id='email'
393+
name='email'
394+
placeholder='Enter your email'
395+
required
396+
autoCapitalize='none'
397+
autoComplete='email'
398+
autoCorrect='off'
399+
value={email}
400+
onChange={handleEmailChange}
401+
className={cn(
402+
showEmailValidationError &&
403+
emailErrors.length > 0 &&
404+
'border-red-500 focus:border-red-500'
405+
)}
406+
/>
407+
<div
408+
className={cn(
409+
'absolute right-0 left-0 z-10 grid transition-[grid-template-rows] duration-200 ease-out',
410+
showEmailValidationError && emailErrors.length > 0
411+
? 'grid-rows-[1fr]'
412+
: 'grid-rows-[0fr]'
413+
)}
414+
aria-live='polite'
415+
>
416+
<div className='overflow-hidden'>
417+
<div className='mt-1 space-y-1 text-red-400 text-xs'>
418+
{emailErrors.map((error, index) => (
419+
<p key={index}>{error}</p>
420+
))}
421+
</div>
422+
</div>
411423
</div>
412-
)}
424+
</div>
413425
</div>
414426
<div className='space-y-2'>
415427
<div className='flex items-center justify-between'>
@@ -423,40 +435,52 @@ export default function LoginPage({
423435
</button>
424436
</div>
425437
<div className='relative'>
426-
<Input
427-
id='password'
428-
name='password'
429-
required
430-
type={showPassword ? 'text' : 'password'}
431-
autoCapitalize='none'
432-
autoComplete='current-password'
433-
autoCorrect='off'
434-
placeholder='Enter your password'
435-
value={password}
436-
onChange={handlePasswordChange}
438+
<div className='relative'>
439+
<Input
440+
id='password'
441+
name='password'
442+
required
443+
type={showPassword ? 'text' : 'password'}
444+
autoCapitalize='none'
445+
autoComplete='current-password'
446+
autoCorrect='off'
447+
placeholder='Enter your password'
448+
value={password}
449+
onChange={handlePasswordChange}
450+
className={cn(
451+
'pr-10',
452+
showValidationError &&
453+
passwordErrors.length > 0 &&
454+
'border-red-500 focus:border-red-500'
455+
)}
456+
/>
457+
<button
458+
type='button'
459+
onClick={() => setShowPassword(!showPassword)}
460+
className='-translate-y-1/2 absolute top-1/2 right-3 text-[#999] transition hover:text-[#ECECEC]'
461+
aria-label={showPassword ? 'Hide password' : 'Show password'}
462+
>
463+
{showPassword ? <EyeOff size={18} /> : <Eye size={18} />}
464+
</button>
465+
</div>
466+
<div
437467
className={cn(
438-
'pr-10',
439-
showValidationError &&
440-
passwordErrors.length > 0 &&
441-
'border-red-500 focus:border-red-500'
468+
'absolute right-0 left-0 z-10 grid transition-[grid-template-rows] duration-200 ease-out',
469+
showValidationError && passwordErrors.length > 0
470+
? 'grid-rows-[1fr]'
471+
: 'grid-rows-[0fr]'
442472
)}
443-
/>
444-
<button
445-
type='button'
446-
onClick={() => setShowPassword(!showPassword)}
447-
className='-translate-y-1/2 absolute top-1/2 right-3 text-[#999] transition hover:text-[#ECECEC]'
448-
aria-label={showPassword ? 'Hide password' : 'Show password'}
473+
aria-live='polite'
449474
>
450-
{showPassword ? <EyeOff size={18} /> : <Eye size={18} />}
451-
</button>
452-
</div>
453-
{showValidationError && passwordErrors.length > 0 && (
454-
<div className='mt-1 space-y-1 text-red-400 text-xs'>
455-
{passwordErrors.map((error, index) => (
456-
<p key={index}>{error}</p>
457-
))}
475+
<div className='overflow-hidden'>
476+
<div className='mt-1 space-y-1 text-red-400 text-xs'>
477+
{passwordErrors.map((error, index) => (
478+
<p key={index}>{error}</p>
479+
))}
480+
</div>
481+
</div>
458482
</div>
459-
)}
483+
</div>
460484
</div>
461485
</div>
462486

@@ -465,6 +489,7 @@ export default function LoginPage({
465489
disabled={isLoading}
466490
loading={isLoading}
467491
loadingText='Signing in'
492+
className='!mt-6'
468493
>
469494
Sign in
470495
</BrandedButton>
@@ -558,17 +583,33 @@ export default function LoginPage({
558583
resetStatus.type === 'error' && 'border-red-500 focus:border-red-500'
559584
)}
560585
/>
561-
{resetStatus.type === 'error' && (
562-
<div className='mt-1 text-red-400 text-xs'>
563-
<p>{resetStatus.message}</p>
586+
<div
587+
className={cn(
588+
'grid transition-[grid-template-rows] duration-200 ease-out',
589+
resetStatus.type === 'error' ? 'grid-rows-[1fr]' : 'grid-rows-[0fr]'
590+
)}
591+
aria-live='polite'
592+
>
593+
<div className='overflow-hidden'>
594+
<div className='mt-1 text-red-400 text-xs'>
595+
<p>{resetStatus.message}</p>
596+
</div>
564597
</div>
565-
)}
598+
</div>
566599
</div>
567-
{resetStatus.type === 'success' && (
568-
<div className='mt-1 text-[#4CAF50] text-xs'>
569-
<p>{resetStatus.message}</p>
600+
<div
601+
className={cn(
602+
'grid transition-[grid-template-rows] duration-200 ease-out',
603+
resetStatus.type === 'success' ? 'grid-rows-[1fr]' : 'grid-rows-[0fr]'
604+
)}
605+
aria-live='polite'
606+
>
607+
<div className='overflow-hidden'>
608+
<div className='mt-1 text-[#4CAF50] text-xs'>
609+
<p>{resetStatus.message}</p>
610+
</div>
570611
</div>
571-
)}
612+
</div>
572613
<BrandedButton
573614
type='button'
574615
onClick={handleForgotPassword}
@@ -584,4 +625,4 @@ export default function LoginPage({
584625
</Modal>
585626
</>
586627
)
587-
}
628+
}

0 commit comments

Comments
 (0)