[비즈니스] 비밀번호 자동완성 막기 (#377)

* fix: 비밀번호 자동완성 방지

* fix: 계좌번호 바텀시트 마운트 시 계좌번호 input에 포커스

src/page/Auth/Login/index.tsx

@@ -72,6 +72,7 @@ export default function Login() {
               type={isBlind ? 'text' : 'password'}
               placeholder={isMobile ? '비밀번호' : '비밀번호 입력'}
               {...register('password')}
+              autoComplete="new-password"
             />
             <button
               type="button"

src/page/MyShopPage/components/BankList/index.tsx

@@ -1,6 +1,7 @@
 import { OwnerShop } from 'model/shopInfo/ownerShop';
-import { UseFormSetValue, UseFormRegister } from 'react-hook-form';
+import { UseFormSetValue, UseFormRegister, UseFormSetFocus } from 'react-hook-form';
 import { bank } from 'utils/constant/bank';
+import { useEffect } from 'react';
 import cn from 'utils/ts/className';
 import showToast from 'utils/ts/showToast';
 import styles from './index.module.scss';
@@ -11,11 +12,12 @@ interface Props {
   setValue: UseFormSetValue<OwnerShop>;
   bankName: string | null;
   account_number: string | null;
+  setFocus: UseFormSetFocus<OwnerShop>;
 }
 
 const NUMBER_REGEX = /^[0-9-]+$/;
 export default function BankList({
-  close, register, setValue, bankName, account_number,
+  close, register, setValue, bankName, account_number, setFocus,
 }: Props) {
   const validation = () => {
     if (account_number && !NUMBER_REGEX.test(account_number)) {
@@ -28,6 +30,12 @@ export default function BankList({
     }
     close();
   };
+
+  useEffect(() => {
+    setFocus('account_number');
+    // eslint-disable-next-line
+  }, []); // 마운트 시 한 번만 포커스
+
   return (
     <div className={styles.overlay} onClick={validation} role="button" aria-hidden>
       <div className={styles.modal} onClick={(e) => e.stopPropagation()} role="button" aria-hidden>

src/page/MyShopPage/components/EditShopInfoModal/index.tsx

@@ -65,7 +65,7 @@ export default function EditShopInfoModal({
   } = CheckSameTime();
 
   const {
-    register, control, handleSubmit, setValue, formState: { errors },
+    register, control, handleSubmit, setValue, formState: { errors }, setFocus,
   } = useForm<OwnerShop>({
     resolver: zodResolver(OwnerShop),
     defaultValues: {
@@ -353,6 +353,7 @@ export default function EditShopInfoModal({
                 account_number={account}
                 setValue={setValue}
                 close={() => setIsOpen(false)}
+                setFocus={setFocus}
               />
             )}
             <label htmlFor="description" className={styles['mobile-main-info__label']}>
@@ -623,6 +624,7 @@ export default function EditShopInfoModal({
                 account_number={account}
                 setValue={setValue}
                 close={() => setIsOpen(false)}
+                setFocus={setFocus}
               />
             )}
           </div>