From c7599c74722864d54c96a3f3d52e28290abb9eac Mon Sep 17 00:00:00 2001 From: nsfisis Date: Sun, 11 Aug 2024 22:51:03 +0900 Subject: refactor(frontend): add stronger typing to useWebSocket() --- frontend/app/components/GolfPlayApp.client.tsx | 11 +++++++---- frontend/app/components/GolfWatchApp.client.tsx | 13 +++++++------ frontend/app/hooks/useWebSocket.ts | 14 ++++++++++++++ 3 files changed, 28 insertions(+), 10 deletions(-) create mode 100644 frontend/app/hooks/useWebSocket.ts (limited to 'frontend/app') diff --git a/frontend/app/components/GolfPlayApp.client.tsx b/frontend/app/components/GolfPlayApp.client.tsx index 70c463f..4e200e2 100644 --- a/frontend/app/components/GolfPlayApp.client.tsx +++ b/frontend/app/components/GolfPlayApp.client.tsx @@ -1,14 +1,15 @@ import { useEffect, useState } from "react"; -import useWebSocket, { ReadyState } from "react-use-websocket"; import { useDebouncedCallback } from "use-debounce"; import type { components } from "../.server/api/schema"; +import useWebSocket, { ReadyState } from "../hooks/useWebSocket"; import GolfPlayAppConnecting from "./GolfPlayApps/GolfPlayAppConnecting"; import GolfPlayAppFinished from "./GolfPlayApps/GolfPlayAppFinished"; import GolfPlayAppGaming from "./GolfPlayApps/GolfPlayAppGaming"; import GolfPlayAppStarting from "./GolfPlayApps/GolfPlayAppStarting"; import GolfPlayAppWaiting from "./GolfPlayApps/GolfPlayAppWaiting"; -type WebSocketMessage = components["schemas"]["GamePlayerMessageS2C"]; +type GamePlayerMessageS2C = components["schemas"]["GamePlayerMessageS2C"]; +type GamePlayerMessageC2S = components["schemas"]["GamePlayerMessageC2S"]; type Game = components["schemas"]["Game"]; @@ -26,8 +27,10 @@ export default function GolfPlayApp({ ? `ws://localhost:8002/iosdc-japan/2024/code-battle/sock/golf/${game.game_id}/play?token=${sockToken}` : `wss://t.nil.ninja/iosdc-japan/2024/code-battle/sock/golf/${game.game_id}/play?token=${sockToken}`; - const { sendJsonMessage, lastJsonMessage, readyState } = - useWebSocket(socketUrl, {}); + const { sendJsonMessage, lastJsonMessage, readyState } = useWebSocket< + GamePlayerMessageS2C, + GamePlayerMessageC2S + >(socketUrl); const [gameState, setGameState] = useState("connecting"); diff --git a/frontend/app/components/GolfWatchApp.client.tsx b/frontend/app/components/GolfWatchApp.client.tsx index a9c9989..cef6f9a 100644 --- a/frontend/app/components/GolfWatchApp.client.tsx +++ b/frontend/app/components/GolfWatchApp.client.tsx @@ -1,6 +1,6 @@ import { useEffect, useState } from "react"; -import useWebSocket, { ReadyState } from "react-use-websocket"; import type { components } from "../.server/api/schema"; +import useWebSocket, { ReadyState } from "../hooks/useWebSocket"; import GolfWatchAppConnecting from "./GolfWatchApps/GolfWatchAppConnecting"; import GolfWatchAppFinished from "./GolfWatchApps/GolfWatchAppFinished"; import GolfWatchAppGaming, { @@ -9,7 +9,8 @@ import GolfWatchAppGaming, { import GolfWatchAppStarting from "./GolfWatchApps/GolfWatchAppStarting"; import GolfWatchAppWaiting from "./GolfWatchApps/GolfWatchAppWaiting"; -type WebSocketMessage = components["schemas"]["GameWatcherMessageS2C"]; +type GameWatcherMessageS2C = components["schemas"]["GameWatcherMessageS2C"]; +type GameWatcherMessageC2S = never; type Game = components["schemas"]["Game"]; @@ -27,10 +28,10 @@ export default function GolfWatchApp({ ? `ws://localhost:8002/iosdc-japan/2024/code-battle/sock/golf/${game.game_id}/watch?token=${sockToken}` : `wss://t.nil.ninja/iosdc-japan/2024/code-battle/sock/golf/${game.game_id}/watch?token=${sockToken}`; - const { lastJsonMessage, readyState } = useWebSocket( - socketUrl, - {}, - ); + const { lastJsonMessage, readyState } = useWebSocket< + GameWatcherMessageS2C, + GameWatcherMessageC2S + >(socketUrl); const [gameState, setGameState] = useState("connecting"); diff --git a/frontend/app/hooks/useWebSocket.ts b/frontend/app/hooks/useWebSocket.ts new file mode 100644 index 0000000..8fe688f --- /dev/null +++ b/frontend/app/hooks/useWebSocket.ts @@ -0,0 +1,14 @@ +import useWebSocketOriginal, { ReadyState } from "react-use-websocket"; + +export { ReadyState }; + +// Typed version of useWebSocket() hook. +export default function useWebSocket( + url: string, +): { + sendJsonMessage: (message: SendMessage) => void; + lastJsonMessage: ReceiveMessage; + readyState: ReadyState; +} { + return useWebSocketOriginal(url); +} -- cgit v1.2.3-70-g09d2 From 34d61fcc7035ebd7ffb636d13308166c90b474b2 Mon Sep 17 00:00:00 2001 From: nsfisis Date: Sun, 11 Aug 2024 22:15:36 +0900 Subject: feat: simplify starting procedure --- Makefile | 2 +- backend/admin/handler.go | 2 +- backend/admin/templates/game_edit.html | 4 +- backend/api/generated.go | 160 +++++-------------------- backend/fixtures/dev.sql | 14 +-- backend/game/hub.go | 120 +++++-------------- backend/game/message.go | 14 --- backend/game/models.go | 12 +- frontend/app/.server/api/schema.d.ts | 18 +-- frontend/app/components/GolfPlayApp.client.tsx | 7 +- openapi/api-server.yaml | 31 +---- 11 files changed, 85 insertions(+), 299 deletions(-) (limited to 'frontend/app') diff --git a/Makefile b/Makefile index 5cda0b3..9e776e9 100644 --- a/Makefile +++ b/Makefile @@ -3,7 +3,7 @@ DOCKER_COMPOSE := docker compose -f compose.local.yaml all: down build reset up reset: - echo "UPDATE games SET state = 'waiting_entries', started_at = NULL WHERE game_id = 7;" | make psql-query + echo "UPDATE games SET state = 'waiting', started_at = NULL WHERE game_id = 7;" | make psql-query .PHONY: build build: diff --git a/backend/admin/handler.go b/backend/admin/handler.go index d540f57..5398107 100644 --- a/backend/admin/handler.go +++ b/backend/admin/handler.go @@ -231,7 +231,7 @@ func (h *Handler) postGameEdit(c echo.Context) error { { // TODO: - if state != row.State && state == "prepare" { + if state != row.State && state == "starting" { err := h.hubs.StartGame(int(gameID)) if err != nil { return echo.NewHTTPError(http.StatusInternalServerError, err.Error()) diff --git a/backend/admin/templates/game_edit.html b/backend/admin/templates/game_edit.html index c1e38a6..66f3b9e 100644 --- a/backend/admin/templates/game_edit.html +++ b/backend/admin/templates/game_edit.html @@ -25,9 +25,7 @@