- Extract club information (clubId, clubName) from event page in `getEventInfo`. - Update `getMatchDetail` to return both `detail` and `summary`. - Introduce `MatchSummary` interface in `src/types/index.ts`. - Update `EventPage` to display the club name and link to the club page. - Adjust `EventSubscribeService` and loaders to handle the new return structure. - Clean up test files and mock data loading logic.
104 lines
3.1 KiB
TypeScript
104 lines
3.1 KiB
TypeScript
import { createBrowserRouter } from "react-router";
|
|
import ProfilePage from "./page/ProfilePage";
|
|
import EventPage from "./page/EventPage";
|
|
import type { MatchInfo, MatchSummary, XCXMember } from "./types";
|
|
import { FindUserPage } from "./page/FindUserPage";
|
|
import { FavePlayersPage } from "./page/FavPlayersPage";
|
|
import { UserCenter } from "./page/UserCenter";
|
|
import { CallbackPage } from "./page/Logto/Callback";
|
|
import App from "./App";
|
|
import { ClubEventsPage } from "./page/ClubEvents";
|
|
import { HydrateFallback } from "./components/HydrateFallback";
|
|
import { AppBarLayout } from './components/Layout';
|
|
|
|
export const route = createBrowserRouter([
|
|
{
|
|
path: '/',
|
|
element: <AppBarLayout />,
|
|
children: [
|
|
{
|
|
path: '',
|
|
index: true,
|
|
Component: App,
|
|
HydrateFallback: () => <HydrateFallback />
|
|
},
|
|
{
|
|
path: '/club/:id',
|
|
Component: ClubEventsPage,
|
|
HydrateFallback: () => <HydrateFallback />,
|
|
loader: async ({ params }) => {
|
|
const id = params.id;
|
|
const [info] = await Promise.all([
|
|
fetch(`/api/club/${id}`).then(r => r.json()),
|
|
]);
|
|
return { info };
|
|
},
|
|
},
|
|
{
|
|
path: '/fav-players',
|
|
Component: FavePlayersPage,
|
|
},
|
|
{
|
|
path: '/event/:matchId',
|
|
loader: async ({ params }) => {
|
|
const { detail: info, summary } = await fetch(`/api/match/${params.matchId}`)
|
|
.then(res => res.json())
|
|
.then(data => data as {
|
|
detail: MatchInfo,
|
|
summary: MatchSummary,
|
|
});
|
|
const members = info.itemId
|
|
? await (await fetch(`/api/match/${params.matchId}/${info.itemId}`)).json()
|
|
: info.players.map((e, i) => ({
|
|
number: i + 1,
|
|
uid: e.uid,
|
|
name: e.name,
|
|
score: e.score,
|
|
realname: e.name,
|
|
} as XCXMember));
|
|
const uids = info.players.map(e => e.uid);
|
|
const uidScore = await fetch(`/api/user/nowScores`, {
|
|
method: "POST",
|
|
body: JSON.stringify({ uids }),
|
|
}).then(res => res.json()).catch(() => ({}));
|
|
return { info, members, uidScore: new Map(Object.entries(uidScore)), summary };
|
|
},
|
|
Component: EventPage,
|
|
HydrateFallback: () => <HydrateFallback />
|
|
},
|
|
{
|
|
path: 'profile/:uid',
|
|
loader: async ({ params }) => {
|
|
const { uid } = params;
|
|
const profile = await (await fetch(`/api/user/${uid}`)).json();
|
|
const tags = await (await fetch(`/api/user/${uid}/tags`)).json();
|
|
return { profile, uid, tags };
|
|
},
|
|
Component: ProfilePage,
|
|
HydrateFallback: () => <HydrateFallback />
|
|
},
|
|
{
|
|
path: 'find',
|
|
Component: FindUserPage,
|
|
},
|
|
{
|
|
path: 'user-center',
|
|
Component: UserCenter,
|
|
},
|
|
{
|
|
path: 'auth',
|
|
children: [
|
|
{
|
|
path: 'callback',
|
|
Component: CallbackPage,
|
|
},
|
|
],
|
|
},
|
|
],
|
|
},
|
|
{
|
|
path: '/dev',
|
|
Component: HydrateFallback,
|
|
}
|
|
]);
|