chore: update deps, apply updated eslint ocnfig

src/components/auth/sign-in/sign-in.tsx

@@ -1,10 +1,10 @@
-import { DevTool } from '@hookform/devtools'
-import { zodResolver } from '@hookform/resolvers/zod'
 import { useForm } from 'react-hook-form'
 import { Link } from 'react-router-dom'
-import { z } from 'zod'
 
 import { Button, Card, ControlledCheckbox, ControlledTextField, Typography } from '../../ui'
+import { DevTool } from '@hookform/devtools'
+import { zodResolver } from '@hookform/resolvers/zod'
+import { z } from 'zod'
 
 import s from './sign-in.module.scss'
 
@@ -22,13 +22,13 @@ type Props = {
 
 export const SignIn = (props: Props) => {
   const { control, handleSubmit } = useForm<FormType>({
-    mode: 'onSubmit',
-    resolver: zodResolver(schema),
     defaultValues: {
       email: '',
       password: '',
       rememberMe: false,
     },
+    mode: 'onSubmit',
+    resolver: zodResolver(schema),
   })
 
   const handleFormSubmitted = handleSubmit(props.onSubmit)
@@ -37,37 +37,37 @@ export const SignIn = (props: Props) => {
     <>
       <DevTool control={control} />
       <Card className={s.card}>
-        <Typography variant="large" className={s.title}>
+        <Typography className={s.title} variant={'large'}>
           Sign In
         </Typography>
         <form onSubmit={handleFormSubmitted}>
           <div className={s.form}>
             <ControlledTextField
-              placeholder={'Email'}
+              control={control}
               label={'Email'}
               name={'email'}
-              control={control}
+              placeholder={'Email'}
             />
             <ControlledTextField
-              placeholder={'Password'}
-              label={'Password'}
-              type={'password'}
-              name={'password'}
               control={control}
+              label={'Password'}
+              name={'password'}
+              placeholder={'Password'}
+              type={'password'}
             />
           </div>
           <ControlledCheckbox
             className={s.checkbox}
-            label={'Remember me'}
             control={control}
+            label={'Remember me'}
             name={'rememberMe'}
             position={'left'}
           />
           <Typography
-            variant="body2"
             as={Link}
-            to="/recover-password"
             className={s.recoverPasswordLink}
+            to={'/recover-password'}
+            variant={'body2'}
           >
             Forgot Password?
           </Typography>
@@ -75,10 +75,10 @@ export const SignIn = (props: Props) => {
             Sign In
           </Button>
         </form>
-        <Typography className={s.caption} variant="body2">
+        <Typography className={s.caption} variant={'body2'}>
           {`Don't have an account?`}
         </Typography>
-        <Typography variant="link1" as={Link} to="/sign-up" className={s.signUpLink}>
+        <Typography as={Link} className={s.signUpLink} to={'/sign-up'} variant={'link1'}>
           Sign Up
         </Typography>
       </Card>