kyuuseiryuu
76b68c0ea6
- Refactor `WebSocketService` and `common.ts` to use a unified topic system instead of custom prefixes. - Replace manual topic string concatenation with `getEventSubKey` and defined `WsServerSendTopics` types. - Update client-side components (`EventCard`, `GroupingPrediction`) to support real-time event subscriptions and notifications. - Move `useAuthSocket` and `WebScoketContext` initialization into `AppBarLayout` to ensure WebSocket state is available globally. - Add error handling to WebSocket message processing in the Bun server. - Implement a manual "Refresh Current Scores" button for `GroupingPrediction` to fetch fresh `nowScore` data. - Update `HydrateFallback` UI to display a loading message instead of a refresh button during long load times. - Add Service Worker (`sw.js`) build route to the Bun server configuration.
25 lines
874 B
TypeScript
25 lines
874 B
TypeScript
import { Outlet, useNavigation } from "react-router";
|
|
import { HydrateFallback } from "../HydrateFallback";
|
|
import { AppBar } from "../AppBar";
|
|
import styled from "styled-components";
|
|
import { useAuthSocket } from "../../hooks/useAuthSocket";
|
|
import { WebScoketContext } from "../../context/WebsocketContext";
|
|
import { Alert, Button } from "antd";
|
|
|
|
const StyledContainer = styled.div`
|
|
padding-bottom: 90px;
|
|
box-sizing: border-box;
|
|
`;
|
|
export const AppBarLayout = () => {
|
|
const navigation = useNavigation();
|
|
const loading = navigation.state === 'loading';
|
|
const [sender] = useAuthSocket();
|
|
return loading ? <HydrateFallback /> : (<StyledContainer>
|
|
<WebScoketContext.Provider value={{ messageSender: sender }}>
|
|
<Alert.ErrorBoundary>
|
|
<Outlet />
|
|
</Alert.ErrorBoundary>
|
|
<AppBar />
|
|
</WebScoketContext.Provider>
|
|
</StyledContainer>);
|
|
} |