Skip to content

Commit a5cad5f

Browse files
committed
fix: 초대장 보관함 헤더 제거
1 parent 437b937 commit a5cad5f

File tree

6 files changed

+54
-52
lines changed

6 files changed

+54
-52
lines changed
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
'use client';
2+
3+
import { useEffect, useState } from 'react';
4+
5+
export default function ClientOnly({ children }: { children: React.ReactNode }) {
6+
const [mounted, setMounted] = useState(false);
7+
8+
useEffect(() => setMounted(true), []);
9+
10+
if (!mounted) return null;
11+
12+
return children;
13+
}

apps/tuk-web/src/app/gathering/[gatheringId]/invites/src/components/GatheringInviteList.tsx

Lines changed: 14 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -4,42 +4,25 @@ import { useState } from 'react';
44

55
import ReceiveInviteList from '@/app/gathering/[gatheringId]/invites/src/components/ReceiveInviteList';
66
import SendInviteList from '@/app/gathering/[gatheringId]/invites/src/components/SendInviteList';
7-
import { Header, Tabs, LeftArrowIcon } from '@/shared/components';
8-
import { useAppBridge } from '@/shared/components/provider/AppBridgeProvider';
9-
import { AppBridgeMessageType } from '@/shared/lib';
7+
import { Tabs } from '@/shared/components';
108

119
const GatheringInviteList = () => {
1210
const [tab, setTab] = useState('sent');
1311

14-
const { send } = useAppBridge();
15-
1612
return (
17-
<>
18-
<Header>
19-
<Header.Left
20-
onClick={() => send({ type: AppBridgeMessageType.NAVIGATE_BACK, payload: '' })}
21-
>
22-
<Header.Button>
23-
<LeftArrowIcon />
24-
</Header.Button>
25-
<Header.LeftText>초대장 보관함</Header.LeftText>
26-
</Header.Left>
27-
</Header>
28-
29-
<Tabs value={tab} onChange={setTab}>
30-
<Tabs.List>
31-
<Tabs.Trigger value="sent">보낸 초대장</Tabs.Trigger>
32-
<Tabs.Trigger value="received">받은 초대장</Tabs.Trigger>
33-
</Tabs.List>
34-
35-
<Tabs.Content value="sent">
36-
<SendInviteList />
37-
</Tabs.Content>
38-
<Tabs.Content value="received">
39-
<ReceiveInviteList />
40-
</Tabs.Content>
41-
</Tabs>
42-
</>
13+
<Tabs value={tab} onChange={setTab}>
14+
<Tabs.List>
15+
<Tabs.Trigger value="sent">보낸 초대장</Tabs.Trigger>
16+
<Tabs.Trigger value="received">받은 초대장</Tabs.Trigger>
17+
</Tabs.List>
18+
19+
<Tabs.Content value="sent">
20+
<SendInviteList />
21+
</Tabs.Content>
22+
<Tabs.Content value="received">
23+
<ReceiveInviteList />
24+
</Tabs.Content>
25+
</Tabs>
4326
);
4427
};
4528

apps/tuk-web/src/app/gathering/[gatheringId]/invites/src/components/ReceiveInviteList.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { QueryErrorResetBoundary } from '@tanstack/react-query';
22
import { Suspense } from 'react';
33
import { ErrorBoundary } from 'react-error-boundary';
44

5+
import ClientOnly from '@/app/gathering/[gatheringId]/invites/src/components/ClientOnly';
56
import InviteListErrorFallback from '@/app/gathering/[gatheringId]/invites/src/components/InviteListErrorFallback';
67
import InvitListSkeleton from '@/app/gathering/[gatheringId]/invites/src/components/InvitListSkeleton';
78
import ReceiveInviteListContent from '@/app/gathering/[gatheringId]/invites/src/components/ReceiveInviteListContent';
@@ -11,9 +12,11 @@ const ReceiveInviteList = () => {
1112
<QueryErrorResetBoundary>
1213
{({ reset }) => (
1314
<ErrorBoundary onReset={reset} FallbackComponent={InviteListErrorFallback}>
14-
<Suspense fallback={<InvitListSkeleton />}>
15-
<ReceiveInviteListContent />
16-
</Suspense>
15+
<ClientOnly>
16+
<Suspense fallback={<InvitListSkeleton />}>
17+
<ReceiveInviteListContent />
18+
</Suspense>
19+
</ClientOnly>
1720
</ErrorBoundary>
1821
)}
1922
</QueryErrorResetBoundary>

apps/tuk-web/src/app/gathering/[gatheringId]/invites/src/components/SendInviteList.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { QueryErrorResetBoundary } from '@tanstack/react-query';
22
import { Suspense } from 'react';
33
import { ErrorBoundary } from 'react-error-boundary';
44

5+
import ClientOnly from '@/app/gathering/[gatheringId]/invites/src/components/ClientOnly';
56
import InviteListErrorFallback from '@/app/gathering/[gatheringId]/invites/src/components/InviteListErrorFallback';
67
import InvitListSkeleton from '@/app/gathering/[gatheringId]/invites/src/components/InvitListSkeleton';
78
import SendInviteListContent from '@/app/gathering/[gatheringId]/invites/src/components/SendInviteListContent';
@@ -11,9 +12,11 @@ const SendInviteList = () => {
1112
<QueryErrorResetBoundary>
1213
{({ reset }) => (
1314
<ErrorBoundary onReset={reset} FallbackComponent={InviteListErrorFallback}>
14-
<Suspense fallback={<InvitListSkeleton />}>
15-
<SendInviteListContent />
16-
</Suspense>
15+
<ClientOnly>
16+
<Suspense fallback={<InvitListSkeleton />}>
17+
<SendInviteListContent />
18+
</Suspense>
19+
</ClientOnly>
1720
</ErrorBoundary>
1821
)}
1922
</QueryErrorResetBoundary>

apps/tuk-web/src/shared/components/Tabs.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export const Tabs = ({
2727

2828
const TabsList = ({ children }: { children: ReactNode }) => {
2929
return (
30-
<div className="sticky top-16 z-10 flex h-[3.375rem] gap-4 border-b border-gray-200 bg-white-default px-5">
30+
<div className="sticky top-0 z-10 flex h-[3.375rem] gap-4 border-b border-gray-200 bg-white-default px-5">
3131
{children}
3232
</div>
3333
);

apps/tuk-web/src/shared/lib/api/rest/index.ts

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -6,28 +6,28 @@ import { getBridgeSender } from '@/shared/lib/app-bridge/bridgeSender';
66
export { RestAPI } from './rest';
77
export type { RestAPIConfig, RestAPIProtocol } from './types';
88

9-
const defaultJsonInstance = (baseURL: string) =>
10-
new RestAPIInstance(baseURL, {
11-
withCredentials: false,
12-
authHeader: () => {
13-
if (typeof window === 'undefined') return null;
14-
const token = sessionStorage.getItem('accessToken');
15-
return token ? { Authorization: `Bearer ${token}` } : null;
16-
},
17-
bridgeSend: msg => getBridgeSender()?.(msg),
18-
});
19-
209
// const defaultJsonInstance = (baseURL: string) =>
2110
// new RestAPIInstance(baseURL, {
2211
// withCredentials: false,
2312
// authHeader: () => {
2413
// if (typeof window === 'undefined') return null;
25-
// const token =
26-
// 'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiIzMiIsIm1lbWJlcklkIjoiMzIiLCJ0b2tlblR5cGUiOiJBQ0NFU1MiLCJpYXQiOjE3NTUwMDM4NTQsImV4cCI6MTc1NzU5NTg1NH0.sXHpNsim8-nIUdCjnAcOIZGsg2gUo8rnpkBmN-z5dKU';
27-
// return token ? { Authorization: `Bearer ${token.trim()}` } : null;
14+
// const token = sessionStorage.getItem('accessToken');
15+
// return token ? { Authorization: `Bearer ${token}` } : null;
2816
// },
17+
// bridgeSend: msg => getBridgeSender()?.(msg),
2918
// });
3019

20+
const defaultJsonInstance = (baseURL: string) =>
21+
new RestAPIInstance(baseURL, {
22+
withCredentials: false,
23+
authHeader: () => {
24+
if (typeof window === 'undefined') return null;
25+
const token =
26+
'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiIzMiIsIm1lbWJlcklkIjoiMzIiLCJ0b2tlblR5cGUiOiJBQ0NFU1MiLCJpYXQiOjE3NTUwMDM4NTQsImV4cCI6MTc1NzU5NTg1NH0.sXHpNsim8-nIUdCjnAcOIZGsg2gUo8rnpkBmN-z5dKU';
27+
return token ? { Authorization: `Bearer ${token.trim()}` } : null;
28+
},
29+
});
30+
3131
const formInstance = (baseURL: string) =>
3232
new RestAPIInstance(baseURL, {
3333
withCredentials: false,

0 commit comments

Comments
 (0)