From cb1ffaf957ff111f2b29244d27581cbbfdfe2be3 Mon Sep 17 00:00:00 2001 From: "(hoooooony)" <(cjh41820@gmail.com)> Date: Thu, 20 Jun 2024 21:04:10 +0900 Subject: [PATCH 1/2] =?UTF-8?q?fix=20:=20steps=20=EA=B0=9D=EC=B2=B4?= =?UTF-8?q?=EB=A1=9C=20=EA=B0=90=EC=8B=B8=EC=84=9C=20=EC=83=9D=EA=B8=B4=20?= =?UTF-8?q?=EB=AC=B8=EC=A0=9C=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Auth/FindPassword/entity.ts | 4 ++++ src/page/Auth/Signup/components/searchShop/index.tsx | 9 +++------ src/page/Auth/Signup/index.tsx | 11 ++--------- src/page/Auth/components/Common/index.tsx | 4 ++-- 4 files changed, 11 insertions(+), 17 deletions(-) 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/Signup/components/searchShop/index.tsx b/src/page/Auth/Signup/components/searchShop/index.tsx index 948301df..a1566446 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 : OutletProps = 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..ec6e7e17 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:OutletProps = 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 && (