Skip to content

Commit bdebbd0

Browse files
aster-voidnakaterm
authored andcommitted
fixed 608: it was because it was loading auth state. (#613)
closes #608
1 parent 8bb074f commit bdebbd0

File tree

10 files changed

+104
-97
lines changed

10 files changed

+104
-97
lines changed

web/app/chat/layout.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,18 @@ import BottomBar from "~/components/BottomBar";
22
import Header from "~/components/Header";
33
import { NavigateByAuthState } from "~/components/common/NavigateByAuthState";
44

5-
export default function ChatPageLayout({
5+
export default function Layout({
66
children,
77
}: {
88
children: React.ReactNode;
99
}) {
1010
return (
11-
<NavigateByAuthState type="toLoginForUnauthenticated">
11+
<>
1212
<Header title="チャット/Chat" />
13-
<div className="flex-1 overflow-hidden">{children}</div>
13+
<NavigateByAuthState type="toLoginForUnauthenticated">
14+
<div className="flex-1 overflow-hidden">{children}</div>
15+
</NavigateByAuthState>
1416
<BottomBar activeTab="3_chat" />
15-
</NavigateByAuthState>
17+
</>
1618
);
1719
}

web/app/friends/layout.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,18 @@ import BottomBar from "~/components/BottomBar";
22
import Header from "~/components/Header";
33
import { NavigateByAuthState } from "~/components/common/NavigateByAuthState";
44

5-
export default function FriendsPageLayout({
5+
export default function Layout({
66
children,
77
}: {
88
children: React.ReactNode;
99
}) {
1010
return (
11-
<NavigateByAuthState type="toLoginForUnauthenticated">
11+
<>
1212
<Header title="フレンド/Friends" />
13-
<div className="grow overflow-y-auto">{children}</div>
13+
<NavigateByAuthState type="toLoginForUnauthenticated">
14+
<div className="grow overflow-y-auto">{children}</div>
15+
</NavigateByAuthState>
1416
<BottomBar activeTab="1_friends" />
15-
</NavigateByAuthState>
17+
</>
1618
);
1719
}

web/app/friends/page.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { useState } from "react";
33

44
// https://nextjs.org/docs/messages/react-hydration-error#solution-2-disabling-ssr-on-specific-components
55
import dynamic from "next/dynamic";
6+
67
const NoSSRMatchings = dynamic(() => import("~/components/match/matching"), {
78
ssr: false,
89
});

web/app/home/layout.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,18 @@ import BottomBar from "~/components/BottomBar";
22
import Header from "~/components/Header";
33
import { NavigateByAuthState } from "~/components/common/NavigateByAuthState";
44

5-
export default function HomePageLayout({
5+
export default function Layout({
66
children,
77
}: {
88
children: React.ReactNode;
99
}) {
1010
return (
11-
<NavigateByAuthState type="toLoginForUnauthenticated">
11+
<>
1212
<Header title="ホーム/Home" />
13-
<div className="grow overflow-y-auto ">{children}</div>
13+
<NavigateByAuthState type="toLoginForUnauthenticated">
14+
<div className="grow overflow-y-auto ">{children}</div>
15+
</NavigateByAuthState>
1416
<BottomBar activeTab="0_home" />
15-
</NavigateByAuthState>
17+
</>
1618
);
1719
}

web/app/home/page.tsx

Lines changed: 46 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ import { useAboutMe, useRecommended } from "~/api/user";
1010
import { Card } from "~/components/Card";
1111
import { DraggableCard } from "~/components/DraggableCard";
1212
import FullScreenCircularProgress from "~/components/common/FullScreenCircularProgress";
13-
import { NavigateByAuthState } from "~/components/common/NavigateByAuthState";
1413
import PersonDetailedMenu from "./components/PersonDetailedMenu";
1514

1615
export default function Home() {
@@ -84,60 +83,55 @@ export default function Home() {
8483
if (error) throw error;
8584

8685
return (
87-
<NavigateByAuthState type="toLoginForUnauthenticated">
88-
<div className="flex h-full flex-col items-center justify-center p-4">
89-
{displayedUser && (
90-
<>
91-
<div className="flex h-full flex-col items-center justify-center">
92-
{nextUser && (
93-
<div className="relative h-full w-full">
94-
<div className="-translate-x-4 -translate-y-4 inset-0 z-0 mt-4 transform">
95-
<Card displayedUser={nextUser} currentUser={currentUser} />
96-
</div>
97-
<motion.div
98-
animate={controls}
99-
className="absolute inset-0 z-10 mt-4 flex items-center justify-center"
100-
>
101-
<DraggableCard
102-
displayedUser={displayedUser}
103-
currentUser={currentUser}
104-
onSwipeLeft={reject}
105-
onSwipeRight={accept}
106-
clickedButton={clickedButton}
107-
/>
108-
</motion.div>
86+
<div className="flex h-full flex-col items-center justify-center p-4">
87+
{displayedUser && (
88+
<>
89+
<div className="flex h-full flex-col items-center justify-center">
90+
{nextUser && (
91+
<div className="relative h-full w-full">
92+
<div className="-translate-x-4 -translate-y-4 inset-0 z-0 mt-4 transform">
93+
<Card displayedUser={nextUser} currentUser={currentUser} />
10994
</div>
110-
)}
111-
<button
112-
type="button"
113-
onClick={() => setOpenDetailedMenu(!openDetailedMenu)}
114-
>
115-
てすと
116-
</button>
117-
<div className="button-container mt-4 mb-4 flex w-full justify-center space-x-8">
118-
<CloseButton
119-
onclick={onClickClose}
120-
icon={<CloseIconStyled />}
121-
/>
122-
<GoodButton
123-
onclick={onClickHeart}
124-
icon={<FavoriteIconStyled />}
125-
/>
95+
<motion.div
96+
animate={controls}
97+
className="absolute inset-0 z-10 mt-4 flex items-center justify-center"
98+
>
99+
<DraggableCard
100+
displayedUser={displayedUser}
101+
currentUser={currentUser}
102+
onSwipeLeft={reject}
103+
onSwipeRight={accept}
104+
clickedButton={clickedButton}
105+
/>
106+
</motion.div>
126107
</div>
127-
</div>
128-
{openDetailedMenu && (
129-
<PersonDetailedMenu
130-
onClose={() => {
131-
setOpenDetailedMenu(false);
132-
}}
133-
displayedUser={displayedUser}
134-
currentUser={currentUser}
135-
/>
136108
)}
137-
</>
138-
)}
139-
</div>
140-
</NavigateByAuthState>
109+
<button
110+
type="button"
111+
onClick={() => setOpenDetailedMenu(!openDetailedMenu)}
112+
>
113+
てすと
114+
</button>
115+
<div className="button-container mt-4 mb-4 flex w-full justify-center space-x-8">
116+
<CloseButton onclick={onClickClose} icon={<CloseIconStyled />} />
117+
<GoodButton
118+
onclick={onClickHeart}
119+
icon={<FavoriteIconStyled />}
120+
/>
121+
</div>
122+
</div>
123+
{openDetailedMenu && (
124+
<PersonDetailedMenu
125+
onClose={() => {
126+
setOpenDetailedMenu(false);
127+
}}
128+
displayedUser={displayedUser}
129+
currentUser={currentUser}
130+
/>
131+
)}
132+
</>
133+
)}
134+
</div>
141135
);
142136
}
143137

web/app/search/layout.tsx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,18 @@
11
import BottomBar from "~/components/BottomBar";
22
import Header from "~/components/Header";
3+
import { NavigateByAuthState } from "~/components/common/NavigateByAuthState";
34

4-
export default function HomePageLayout({
5+
export default function Layout({
56
children,
67
}: {
78
children: React.ReactNode;
89
}) {
910
return (
1011
<>
1112
<Header title="検索/Search" />
12-
<div className="grow overflow-y-auto">{children}</div>
13+
<NavigateByAuthState type="toLoginForUnauthenticated">
14+
<div className="grow overflow-y-auto">{children}</div>
15+
</NavigateByAuthState>
1316
<BottomBar activeTab="2_search" />
1417
</>
1518
);

web/app/settings/layout.tsx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,18 @@
11
import BottomBar from "~/components/BottomBar";
22
import Header from "~/components/Header";
3+
import { NavigateByAuthState } from "~/components/common/NavigateByAuthState";
34

4-
export default function SettingsPageLayout({
5+
export default function Layout({
56
children,
67
}: {
78
children: React.ReactNode;
89
}) {
910
return (
1011
<>
1112
<Header title="設定/Settings" />
12-
<div className="grow overflow-y-auto">{children}</div>
13+
<NavigateByAuthState type="toLoginForUnauthenticated">
14+
<div className="grow overflow-y-auto">{children}</div>
15+
</NavigateByAuthState>
1316
<BottomBar activeTab="4_settings" />
1417
</>
1518
);

web/app/settings/page.tsx

Lines changed: 22 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -24,29 +24,27 @@ function Item({
2424

2525
export default function Settings() {
2626
return (
27-
<NavigateByAuthState type="toLoginForUnauthenticated">
28-
<div className="flex flex-col justify-start">
29-
<h2 className="p-4 pb-2 text-gray-500 text-xs">基本情報</h2>
30-
<ul className="w-full">
31-
<Item href="/settings/profile" title="プロフィール" />
32-
<Item href="/settings/courses" title="授業" />
33-
<Item href="/settings/interests" title="興味分野" />
34-
<Item href="/settings/card" title="カードのプレビュー" />
35-
</ul>
36-
<h2 className="p-4 py-2 text-gray-500 text-xs">その他</h2>
37-
<ul className="w-full">
38-
<Item href="/tutorial" title="CourseMateの使い方" />
39-
<Item href="/settings/notification" title="運営からのお知らせ" />
40-
<Item href="/settings/contact" title="お問い合わせ" />
41-
<Item href="/faq" title="よくあるご質問" />
42-
<Item href="/settings/aboutUs" title="About Us" />
43-
<Item href="/settings/disclaimer" title="免責事項" />
44-
<Item href="/settings/delete" title="アカウント削除" />
45-
<li>
46-
<LogOutButton />
47-
</li>
48-
</ul>
49-
</div>
50-
</NavigateByAuthState>
27+
<div className="flex flex-col justify-start">
28+
<h2 className="p-4 pb-2 text-gray-500 text-xs">基本情報</h2>
29+
<ul className="w-full">
30+
<Item href="/settings/profile" title="プロフィール" />
31+
<Item href="/settings/courses" title="授業" />
32+
<Item href="/settings/interests" title="興味分野" />
33+
<Item href="/settings/card" title="カードのプレビュー" />
34+
</ul>
35+
<h2 className="p-4 py-2 text-gray-500 text-xs">その他</h2>
36+
<ul className="w-full">
37+
<Item href="/tutorial" title="CourseMateの使い方" />
38+
<Item href="/settings/notification" title="運営からのお知らせ" />
39+
<Item href="/settings/contact" title="お問い合わせ" />
40+
<Item href="/faq" title="よくあるご質問" />
41+
<Item href="/settings/aboutUs" title="About Us" />
42+
<Item href="/settings/disclaimer" title="免責事項" />
43+
<Item href="/settings/delete" title="アカウント削除" />
44+
<li>
45+
<LogOutButton />
46+
</li>
47+
</ul>
48+
</div>
5149
);
5250
}

web/app/tutorial/layout.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,20 +2,22 @@ import Link from "next/link";
22
import Header from "~/components/Header";
33
import { NavigateByAuthState } from "~/components/common/NavigateByAuthState";
44

5-
export default function TutorialPageLayout({
5+
export default function Layout({
66
children,
77
}: {
88
children: React.ReactNode;
99
}) {
1010
return (
11-
<NavigateByAuthState type="toLoginForUnauthenticated">
11+
<>
1212
<Header title="チュートリアル/Tutorial" />
13-
<div className="flex-1">{children}</div>
13+
<NavigateByAuthState type="toLoginForUnauthenticated">
14+
<div className="flex-1">{children}</div>
15+
</NavigateByAuthState>
1416
<div className="m-4 text-center">
1517
<Link href="/home" className="btn btn-primary w-full">
1618
ホーム画面へ
1719
</Link>
1820
</div>
19-
</NavigateByAuthState>
21+
</>
2022
);
2123
}

web/components/common/FullScreenCircularProgress.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
export default function FullScreenCircularProgress() {
22
return (
3-
<div className="flex h-[100vh] items-center justify-center">
3+
<div className="flex h-full items-center justify-center">
44
<span className="loading loading-spinner loading-lg text-primary" />
55
</div>
66
);

0 commit comments

Comments
 (0)