diff --git a/src/page/Auth/FindPassword/ChangePassword/index.tsx b/src/page/Auth/FindPassword/ChangePassword/index.tsx index a2d0f933..a84753b6 100644 --- a/src/page/Auth/FindPassword/ChangePassword/index.tsx +++ b/src/page/Auth/FindPassword/ChangePassword/index.tsx @@ -13,7 +13,7 @@ export default function ChangePassword() { register, formState: { errors, isValid }, getValues, clearErrors, } = useFormContext(); - const steps: OutletProps = useOutletContext(); + const steps = useOutletContext(); const { setIsStepComplete } = steps; useEffect(() => { diff --git a/src/page/Auth/FindPassword/Verify/index.tsx b/src/page/Auth/FindPassword/Verify/index.tsx index 072c4dd2..b8bac937 100644 --- a/src/page/Auth/FindPassword/Verify/index.tsx +++ b/src/page/Auth/FindPassword/Verify/index.tsx @@ -81,7 +81,7 @@ export default function Verify() { const [isSent, setIsSent] = useState(false); const debounce = useDebounce(code, { getValues, setError, setIsSent }); - const steps: OutletProps = useOutletContext(); + const steps = useOutletContext(); const { setCertificationCode, isCertified } = useCheckCode( steps.setIsStepComplete, diff --git a/src/page/Auth/FindPassword/entity.ts b/src/page/Auth/FindPassword/entity.ts index 661e5788..d3e118e8 100644 --- a/src/page/Auth/FindPassword/entity.ts +++ b/src/page/Auth/FindPassword/entity.ts @@ -8,4 +8,8 @@ export interface OutletProps { setIsComplete: React.Dispatch>; isStepComplete: boolean; setIsStepComplete: React.Dispatch>; + isSearch: boolean; + setIsSearch: React.Dispatch>; + isShopSelect: boolean; + setIsShopSelect: React.Dispatch>; } diff --git a/src/page/Auth/FindPassword/index.tsx b/src/page/Auth/FindPassword/index.tsx index a5418a56..30d2ecfd 100644 --- a/src/page/Auth/FindPassword/index.tsx +++ b/src/page/Auth/FindPassword/index.tsx @@ -4,7 +4,7 @@ import { OutletProps } from './entity'; import Verify from './Verify'; export default function FindPassword() { - const steps: OutletProps = useOutletContext(); + const steps = useOutletContext(); const { index } = steps; return ( <> diff --git a/src/page/Auth/Signup/components/searchShop/index.tsx b/src/page/Auth/Signup/components/searchShop/index.tsx index 948301df..3c4b3d32 100644 --- a/src/page/Auth/Signup/components/searchShop/index.tsx +++ b/src/page/Auth/Signup/components/searchShop/index.tsx @@ -4,22 +4,19 @@ import { ChangeEvent, useEffect, useState } from 'react'; import { useFormContext } from 'react-hook-form'; import { useOutletContext } from 'react-router-dom'; import cn from 'utils/ts/className'; +import { OutletProps } from 'page/Auth/FindPassword/entity'; import styles from './searchShop.module.scss'; -interface Step { - isShopSelect: boolean; - setIsShopSelect: (state: boolean) => void; -} interface ShopInfo { shop_name: string; shop_id: number | null; } export default function SearchShop() { const [searchText, setSearchText] = useState(''); - const { steps, setValue } = useOutletContext<{ steps: Step; setValue: Function }>(); + const steps = useOutletContext(); const { shopList, isError } = useShopList(); const { - watch, + watch, setValue, } = useFormContext(); function handleClickShop(e: React.MouseEvent) { const { name, id } = JSON.parse(e.currentTarget.value); diff --git a/src/page/Auth/Signup/index.tsx b/src/page/Auth/Signup/index.tsx index 08e18ce0..44339ac9 100644 --- a/src/page/Auth/Signup/index.tsx +++ b/src/page/Auth/Signup/index.tsx @@ -1,18 +1,11 @@ import { useEffect, useState } from 'react'; import { useOutletContext } from 'react-router-dom'; +import { OutletProps } from 'page/Auth/FindPassword/entity'; import AgreeStep from './components/agreeStep'; import OwnerInfoStep from './components/ownerInfoStep'; import PhoneStep from './components/phoneStep'; import SearchShop from './components/searchShop'; -interface Step { - index: number; - previousStep: () => void; - setIsStepComplete: (state: boolean) => void; - isSearch: boolean; - setIsSearch: (state: boolean) => void; -} - interface SelectOptions { personal: boolean; koin: boolean; @@ -25,7 +18,7 @@ const initialSelectOption: SelectOptions = { export default function SignUp() { const [selectItems, setSelectItems] = useState(initialSelectOption); - const { steps } = useOutletContext<{ steps: Step; }>(); + const steps = useOutletContext(); const [stepPhoneComplete, setStepPhoneComplete] = useState(false); const handleSelect = (option: keyof SelectOptions | 'all') => { diff --git a/src/page/Auth/components/Common/index.tsx b/src/page/Auth/components/Common/index.tsx index 48be3318..3cb69fe0 100644 --- a/src/page/Auth/components/Common/index.tsx +++ b/src/page/Auth/components/Common/index.tsx @@ -74,7 +74,7 @@ export default function CommonLayout() { mode: 'onChange', }); const { - formState: { errors }, setError, getValues, setValue, + formState: { errors }, setError, getValues, } = method; const steps = useStep(isFindPassword ? 'find' : 'register'); @@ -159,7 +159,7 @@ export default function CommonLayout() {
{isComplete ? - : } + : }
{!isComplete && !isSearch && (