improve: overall ux in auth page

src/features/auth/components/StepEnterNumber.tsx

@@ -7,9 +7,10 @@ import React, { useEffect, useState } from 'react'
 type Props = {
     onChange: React.ChangeEventHandler<HTMLInputElement>;
     value: string;
+    pending?: boolean | undefined
 } & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'id'>
 
-function StepEnterNumber({ onChange, disabled = false, value }: Props) {
+function StepEnterNumber({ onChange, pending, disabled, value }: Props) {
     const [error, setError] = useState('');
 
     const hasError = (e = error) => {
@@ -35,7 +36,8 @@ function StepEnterNumber({ onChange, disabled = false, value }: Props) {
                 alt='login banner'
                 width={100}
                 height={100}
-                unoptimized={true}
+                unoptimized
+                priority
             />
             <div className='w-full min-w-1/2 lg:max-w-1/2 h-full lg:px-9 py-7 flex flex-col justify-between lg:justify-center lg:gap-10'>
                 <div className='w-full'>
@@ -56,7 +58,7 @@ function StepEnterNumber({ onChange, disabled = false, value }: Props) {
                         onChange={onChange}
                         type='number' />
                 </div>
-                <Button disabled={disabled || hasError() || value.length <= 0} type='submit'>بعدی</Button>
+                <Button disabled={disabled || hasError() || value.length <= 0} pending={pending} type='submit'>بعدی</Button>
             </div>
         </>
     )