From 55424b11fb093b3c4a0af7a0385e02a6311f59bb Mon Sep 17 00:00:00 2001 From: "focp212@naver.com" Date: Mon, 22 Sep 2025 16:33:18 +0900 Subject: [PATCH] =?UTF-8?q?=ED=99=88=ED=99=94=EB=A9=B4=20=EB=B0=B0?= =?UTF-8?q?=EB=84=88=20=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/entities/common/model/constant.ts | 16 +++++++--- src/entities/common/model/store.ts | 26 ++++++++++++++++ src/entities/common/model/types.ts | 5 +++- src/entities/home/ui/auth-reguster.tsx | 10 ++----- src/entities/home/ui/home-bottom-banner.tsx | 33 ++++++++++++++------- src/entities/user/model/store.ts | 14 ++++----- src/entities/user/model/types.ts | 2 +- src/pages/home/home-page.tsx | 3 +- src/pages/transaction/billing/list-page.tsx | 2 +- src/pages/transaction/escrow/list-page.tsx | 2 +- src/shared/model/store.ts | 3 ++ src/shared/ui/assets/css/style-fix.css | 3 ++ src/shared/ui/menu/index.tsx | 2 +- 13 files changed, 87 insertions(+), 34 deletions(-) create mode 100644 src/entities/common/model/store.ts diff --git a/src/entities/common/model/constant.ts b/src/entities/common/model/constant.ts index 01e899e..0318fff 100644 --- a/src/entities/common/model/constant.ts +++ b/src/entities/common/model/constant.ts @@ -8,8 +8,12 @@ export const DEFAULT_PAGE_PARAM = { }; export const FilterMotionVariants = { - hidden: {x: '100%'}, - visible: {x: '0%'}, + hidden: { + x: '100%' + }, + visible: { + x: '0%' + }, }; export const FilterMotionDuration = { duration: 0.3 @@ -20,8 +24,12 @@ export const FilterMotionStyle = { }; export const BottomSheetMotionVaiants = { - hidden: { y: '100%' }, - visible: { y: '0%' }, + hidden: { + y: '100%' + }, + visible: { + y: '0%' + }, }; export const BottomSheetMotionDuration = { duration: 0.3 diff --git a/src/entities/common/model/store.ts b/src/entities/common/model/store.ts new file mode 100644 index 0000000..6086bc0 --- /dev/null +++ b/src/entities/common/model/store.ts @@ -0,0 +1,26 @@ +import { lens } from '@dhmk/zustand-lens'; +import { SetStateAction } from 'react'; +import { BannerInfo } from './types'; + +export interface BannerInfoState { + bannerInfo: BannerInfo; + setBannerInfo: (update: SetStateAction>) => void; +}; + +const initialState = { + bannerInfo: {} as BannerInfo, +} as BannerInfoState; + +export const createBannerInfoStore = lens((set, get) => ({ + ...initialState, + setBannerInfo: (update) => { + set((state: BannerInfoState) => { + const newBannerInfo = typeof update === 'function' ? update(state.bannerInfo) : update; + return { + ...state, + bannerInfo: { ...state.bannerInfo, ...newBannerInfo }, + }; + }); + }, + +})); diff --git a/src/entities/common/model/types.ts b/src/entities/common/model/types.ts index 8bc7307..9a88859 100644 --- a/src/entities/common/model/types.ts +++ b/src/entities/common/model/types.ts @@ -190,4 +190,7 @@ export interface EmptyTokenAddSendCodeResponse { export interface SectionArrowProps { isOpen?: boolean; -}; \ No newline at end of file +}; +export interface BannerInfo { + HomneBottomBanner: boolean; +}; diff --git a/src/entities/home/ui/auth-reguster.tsx b/src/entities/home/ui/auth-reguster.tsx index eaeeb9a..9ff2ed8 100644 --- a/src/entities/home/ui/auth-reguster.tsx +++ b/src/entities/home/ui/auth-reguster.tsx @@ -2,6 +2,7 @@ import { IMAGE_ROOT } from '@/shared/constants/common'; import { AuthRegisterProps } from '../model/types'; import { motion } from 'framer-motion'; import { useAppBridge } from '@/hooks/useAppBridge'; +import { BottomSheetMotionDuration, BottomSheetMotionVaiants } from '@/entities/common/model/constant'; export const AuthRegister = ({ setAuthRegisterOn, @@ -18,11 +19,6 @@ export const AuthRegister = ({ setAuthRegisterOn(false); }; - const variants = { - hidden: { y: '100%' }, - visible: { y: '0%' }, - }; - return ( <> { (authRegisterOn) && @@ -32,8 +28,8 @@ export const AuthRegister = ({ className="bottomsheet" initial="hidden" animate={ (authRegisterOn)? 'visible': 'hidden' } - variants={ variants } - transition={{ duration: 0.5 }} + variants={ BottomSheetMotionVaiants } + transition={ BottomSheetMotionDuration } >
diff --git a/src/entities/home/ui/home-bottom-banner.tsx b/src/entities/home/ui/home-bottom-banner.tsx index 64870d8..2cfcd13 100644 --- a/src/entities/home/ui/home-bottom-banner.tsx +++ b/src/entities/home/ui/home-bottom-banner.tsx @@ -1,20 +1,27 @@ import moment from 'moment'; +import { motion } from 'framer-motion'; import { IMAGE_ROOT } from '@/shared/constants/common'; import { useNavigate } from '@/shared/lib/hooks/use-navigate'; import { StorageKeys } from '@/shared/constants/local-storage'; import { setLocalStorage } from '@/shared/lib/web-view-bridge'; import { HomeBottomBannerProps } from '../model/types'; -import { motion } from 'framer-motion'; +import { useStore } from '@/shared/model/store'; +import { BottomSheetMotionDuration, BottomSheetMotionVaiants } from '@/entities/common/model/constant'; +import { useEffect, useState } from 'react'; export const HomeBottomBanner = ({ setBottomBannerOn, bottomBannerOn }: HomeBottomBannerProps) => { const { navigate } = useNavigate(); + + const [isFirstOpen, setIsFirstOpen] = useState(false); const onClickToClose = () => { - // close setBottomBannerOn(false); + useStore.getState().BannerStore.setBannerInfo({ + HomneBottomBanner: true + }); }; const onClickToCloseDay = () => { // 오늘 날짜 기록 @@ -23,22 +30,28 @@ export const HomeBottomBanner = ({ onClickToClose(); }; - const variants = { - hidden: { y: '100%' }, - visible: { y: '0%' }, - }; + useEffect(() => { + let bannerInfo = useStore.getState().BannerStore.bannerInfo; + if(!!bannerInfo.HomneBottomBanner){ + setIsFirstOpen(false); + } + else{ + setIsFirstOpen(true); + } + }, [bottomBannerOn]); + return ( <> - {bottomBannerOn && + {bottomBannerOn && isFirstOpen &&
}
>) => void; resetUserInfo: () => void; -} +}; const initialState = { - UserInfo: {} as UserInfo, + userInfo: {} as UserInfo, } as UserInfoState; export const createUserInfoStore = lens((set, get) => ({ ...initialState, setUserInfo: (update) => { set((state: UserInfoState) => { - const newUserInfo = typeof update === 'function' ? update(state.UserInfo) : update; + const newUserInfo = typeof update === 'function' ? update(state.userInfo) : update; return { ...state, - UserInfo: { ...state.UserInfo, ...newUserInfo }, + userInfo: { ...state.userInfo, ...newUserInfo }, }; }); }, diff --git a/src/entities/user/model/types.ts b/src/entities/user/model/types.ts index b0f08bc..66d3a79 100644 --- a/src/entities/user/model/types.ts +++ b/src/entities/user/model/types.ts @@ -21,7 +21,7 @@ export interface LoginResponse { available2FAMethod?: Array; requires2FA?: boolean; }; -export interface UserInfo extends LoginResponse{ +export interface UserInfo extends LoginResponse { } export interface UserParams { diff --git a/src/pages/home/home-page.tsx b/src/pages/home/home-page.tsx index 4ed6e4e..6de0250 100644 --- a/src/pages/home/home-page.tsx +++ b/src/pages/home/home-page.tsx @@ -10,7 +10,6 @@ import { useStore } from '@/shared/model/store'; import { StorageKeys } from '@/shared/constants/local-storage'; import { setLocalStorage, getLocalStorage } from '@/shared/lib/web-view-bridge'; import { useAppBridge } from '@/hooks/useAppBridge'; - import { HeaderType } from '@/entities/common/model/types'; import { useSetHeaderTitle, @@ -156,6 +155,8 @@ export const HomePage = () => { checkBottomBannerOpen(); checkAuthRegisterOpen(); + + }, []); const setBottomBannerEffect = (mode: boolean) => { diff --git a/src/pages/transaction/billing/list-page.tsx b/src/pages/transaction/billing/list-page.tsx index 5e70602..277e74d 100644 --- a/src/pages/transaction/billing/list-page.tsx +++ b/src/pages/transaction/billing/list-page.tsx @@ -22,7 +22,7 @@ import { export const BillingListPage = () => { const { navigate } = useNavigate(); - const userInfo = useStore((state) => state.UserStore.UserInfo); + const userInfo = useStore((state) => state.UserStore.userInfo); const [sortBy, setSortBy] = useState(SortByKeys.New); const [listItems, setListItems] = useState({}); diff --git a/src/pages/transaction/escrow/list-page.tsx b/src/pages/transaction/escrow/list-page.tsx index 89288f3..fe345bc 100644 --- a/src/pages/transaction/escrow/list-page.tsx +++ b/src/pages/transaction/escrow/list-page.tsx @@ -22,7 +22,7 @@ import { export const EscrowListPage = () => { const { navigate } = useNavigate(); - const userInfo = useStore((state) => state.UserStore.UserInfo); + const userInfo = useStore((state) => state.UserStore.userInfo); const [sortBy, setSortBy] = useState(SortByKeys.New); const [listItems, setListItems] = useState({}); diff --git a/src/shared/model/store.ts b/src/shared/model/store.ts index 0d6445b..ca57464 100644 --- a/src/shared/model/store.ts +++ b/src/shared/model/store.ts @@ -3,10 +3,12 @@ import { create } from 'zustand'; import { devtools, persist } from 'zustand/middleware'; import { immer } from 'zustand/middleware/immer'; import { createUserInfoStore, UserInfoState } from '@/entities/user/model/store'; +import { createBannerInfoStore, BannerInfoState } from '@/entities/common/model/store'; import { StorageKeys } from '@/shared/constants/local-storage'; export type RootStore = { UserStore: UserInfoState; + BannerStore: BannerInfoState; }; export const useStore = create()( devtools( @@ -14,6 +16,7 @@ export const useStore = create()( immer( withLenses(() => ({ UserStore: createUserInfoStore, + BannerStore: createBannerInfoStore, })), ), { diff --git a/src/shared/ui/assets/css/style-fix.css b/src/shared/ui/assets/css/style-fix.css index 03eac0f..4268767 100644 --- a/src/shared/ui/assets/css/style-fix.css +++ b/src/shared/ui/assets/css/style-fix.css @@ -75,3 +75,6 @@ main { .tab-pane.sub { padding-bottom: unset !important; } +.notice-box { + margin-top: 1rem; +} \ No newline at end of file diff --git a/src/shared/ui/menu/index.tsx b/src/shared/ui/menu/index.tsx index ea611a1..cdba423 100644 --- a/src/shared/ui/menu/index.tsx +++ b/src/shared/ui/menu/index.tsx @@ -15,7 +15,7 @@ export const Menu = ({ setMenuOn }: MenuProps) => { const { navigate } = useNavigate(); - const userInfo = useStore((state) => state.UserStore.UserInfo); + const userInfo = useStore((state) => state.UserStore.userInfo); const onClickToNavigate = (path: string) => { onClickToMenuClose();