From 9d8bb8e20b2e1e174b9baa23dee237579457b0f2 Mon Sep 17 00:00:00 2001 From: aronmal Date: Wed, 16 Aug 2023 05:19:31 +0200 Subject: [PATCH] Fixed all eslint errors --- leaky-ships/global.d.ts | 2 +- leaky-ships/package.json | 1 - leaky-ships/playwright.config.ts | 3 +- leaky-ships/pnpm-lock.yaml | 12 +- leaky-ships/src/components/Bluetooth.tsx | 10 +- leaky-ships/src/components/BurgerMenu.tsx | 9 +- .../src/components/Gamefield/BorderTiles.tsx | 95 +++--- .../src/components/Gamefield/EventBar.tsx | 89 +++--- .../src/components/Gamefield/Gamefield.tsx | 14 +- .../components/Gamefield/GamefieldPointer.tsx | 36 ++- .../src/components/Gamefield/HitElems.tsx | 23 +- leaky-ships/src/components/Gamefield/Item.tsx | 48 +-- .../src/components/Gamefield/Labeling.tsx | 16 +- leaky-ships/src/components/Gamefield/Ship.tsx | 50 +-- .../src/components/Gamefield/Ships.tsx | 9 +- .../src/components/Gamefield/Targets.tsx | 81 ++--- leaky-ships/src/components/Grid.tsx | 127 ++++---- leaky-ships/src/components/Grid2.tsx | 133 ++++---- leaky-ships/src/components/Lobby/Button.tsx | 29 +- leaky-ships/src/components/Lobby/Icon.tsx | 14 +- .../src/components/Lobby/LobbyFrame.tsx | 31 +- leaky-ships/src/components/Lobby/Player.tsx | 48 ++- .../Lobby/SettingsFrame/Setting.tsx | 20 +- .../Lobby/SettingsFrame/Settings.tsx | 12 +- leaky-ships/src/components/Logo.tsx | 38 +-- leaky-ships/src/components/OptionButton.tsx | 29 +- leaky-ships/src/hooks/useDraw.ts | 11 +- leaky-ships/src/hooks/useGameProps.ts | 290 +++++++++--------- leaky-ships/src/hooks/useShips.ts | 7 +- leaky-ships/src/hooks/useSocket.ts | 25 +- leaky-ships/src/interfaces/frontend.ts | 2 +- leaky-ships/src/lib/backend/sendError.ts | 2 +- leaky-ships/src/lib/utils/helpers.ts | 4 +- leaky-ships/src/routes/api/game/[id].ts | 3 +- leaky-ships/src/routes/api/game/create.ts | 2 +- leaky-ships/src/routes/api/game/join.ts | 1 + leaky-ships/src/routes/api/ws.ts | 4 +- leaky-ships/src/routes/game.tsx | 66 ++-- leaky-ships/src/routes/start.tsx | 71 +++-- 39 files changed, 709 insertions(+), 758 deletions(-) diff --git a/leaky-ships/global.d.ts b/leaky-ships/global.d.ts index 15395df..8134082 100644 --- a/leaky-ships/global.d.ts +++ b/leaky-ships/global.d.ts @@ -2,5 +2,5 @@ import { PrismaClient } from "@prisma/client" import "@total-typescript/ts-reset" declare global { - var prismaClient: PrismaClient + let prismaClient: PrismaClient } diff --git a/leaky-ships/package.json b/leaky-ships/package.json index 7011155..22e7247 100644 --- a/leaky-ships/package.json +++ b/leaky-ships/package.json @@ -28,7 +28,6 @@ "classnames": "^2.3.2", "colors": "^1.4.0", "http-status": "^1.6.2", - "immer": "^10.0.2", "nodemailer": "6.9.4", "prisma": "^4.16.2", "socket.io": "^4.7.2", diff --git a/leaky-ships/playwright.config.ts b/leaky-ships/playwright.config.ts index 5818cee..63f5b78 100644 --- a/leaky-ships/playwright.config.ts +++ b/leaky-ships/playwright.config.ts @@ -1,10 +1,11 @@ import { defineConfig, devices } from "@playwright/test" +import dotenv from "dotenv" /** * Read environment variables from file. * https://github.com/motdotla/dotenv */ -require("dotenv").config() +dotenv.config() /** * See https://playwright.dev/docs/test-configuration. diff --git a/leaky-ships/pnpm-lock.yaml b/leaky-ships/pnpm-lock.yaml index 4e5063e..433d30f 100644 --- a/leaky-ships/pnpm-lock.yaml +++ b/leaky-ships/pnpm-lock.yaml @@ -56,9 +56,6 @@ dependencies: http-status: specifier: ^1.6.2 version: 1.6.2 - immer: - specifier: ^10.0.2 - version: 10.0.2 nodemailer: specifier: 6.9.4 version: 6.9.4 @@ -3521,10 +3518,6 @@ packages: engines: {node: '>= 4'} dev: true - /immer@10.0.2: - resolution: {integrity: sha512-Rx3CqeqQ19sxUtYV9CU911Vhy8/721wRFnJv3REVGWUmoAcIwzifTsdmJte/MV+0/XpM35LZdQMBGkRIoLPwQA==} - dev: false - /immutable@4.3.2: resolution: {integrity: sha512-oGXzbEDem9OOpDWZu88jGiYCvIsLHMvGw+8OXlpsvTFvIQplQbjg1B1cvKg8f7Hoch6+NGjpPsH1Fr+Mc2D1aA==} @@ -4789,7 +4782,7 @@ packages: zustand: ^4.3.0 dependencies: solid-js: 1.7.11 - zustand: 4.4.1(immer@10.0.2)(react@18.2.0) + zustand: 4.4.1(react@18.2.0) dev: false /source-map-js@1.0.2: @@ -5375,7 +5368,7 @@ packages: resolution: {integrity: sha512-+dTu2m6gmCbO9Ahm4ZBDapx2O6ZY9QSPXst2WXjcznPMwf2YNpn3RevLx4KkZp1OPW/ouFcoBtBzFz/LeY69oA==} dev: false - /zustand@4.4.1(immer@10.0.2)(react@18.2.0): + /zustand@4.4.1(react@18.2.0): resolution: {integrity: sha512-QCPfstAS4EBiTQzlaGP1gmorkh/UL1Leaj2tdj+zZCZ/9bm0WS7sI2wnfD5lpOszFqWJ1DcPnGoY8RDL61uokw==} engines: {node: '>=12.7.0'} peerDependencies: @@ -5390,7 +5383,6 @@ packages: react: optional: true dependencies: - immer: 10.0.2 react: 18.2.0 use-sync-external-store: 1.2.0(react@18.2.0) dev: false diff --git a/leaky-ships/src/components/Bluetooth.tsx b/leaky-ships/src/components/Bluetooth.tsx index 2d9d98f..e726498 100644 --- a/leaky-ships/src/components/Bluetooth.tsx +++ b/leaky-ships/src/components/Bluetooth.tsx @@ -48,7 +48,7 @@ function Bluetooth() { if (!isWebBluetoothEnabled()) return return getDeviceInfo() .then(connectGatt) - .then((_) => { + .then(() => { console.log("Reading UV Index...") return gattCharacteristic.readValue() }) @@ -108,7 +108,7 @@ function Bluetooth() { if (!isWebBluetoothEnabled()) return gattCharacteristic .startNotifications() - .then((_) => { + .then(() => { console.log("Start reading...") setStartDisabled(true) setStopDisabled(false) @@ -119,7 +119,7 @@ function Bluetooth() { if (!isWebBluetoothEnabled()) return gattCharacteristic .stopNotifications() - .then((_) => { + .then(() => { console.log("Stop reading...") setStartDisabled(false) setStopDisabled(true) @@ -141,7 +141,7 @@ function Bluetooth() { ) } diff --git a/leaky-ships/src/components/Lobby/Icon.tsx b/leaky-ships/src/components/Lobby/Icon.tsx index a41d13b..0d50a69 100644 --- a/leaky-ships/src/components/Lobby/Icon.tsx +++ b/leaky-ships/src/components/Lobby/Icon.tsx @@ -1,10 +1,6 @@ import { JSX } from "solid-js" -function Icon({ - src, - children, - onClick, -}: { +function Icon(props: { src: string children: JSX.Element onClick?: () => void @@ -12,14 +8,14 @@ function Icon({ return ( ) } diff --git a/leaky-ships/src/components/Lobby/LobbyFrame.tsx b/leaky-ships/src/components/Lobby/LobbyFrame.tsx index ec3d811..7675a3e 100644 --- a/leaky-ships/src/components/Lobby/LobbyFrame.tsx +++ b/leaky-ships/src/components/Lobby/LobbyFrame.tsx @@ -2,7 +2,7 @@ import { faRightFromBracket, faSpinnerThird, } from "@fortawesome/pro-solid-svg-icons" -import { JSX, createEffect, createMemo, createSignal } from "solid-js" +import { JSX, createEffect, createSignal } from "solid-js" import { useNavigate } from "solid-start" import { FontAwesomeIcon } from "~/components/FontAwesomeIcon" import { useGameProps } from "~/hooks/useGameProps" @@ -14,38 +14,35 @@ import Button from "./Button" import Icon from "./Icon" import Player from "./Player" -function WithDots({ children }: { children: JSX.Element }) { +function WithDots(props: { children: JSX.Element }) { const [dots, setDots] = createSignal(1) createEffect(() => { const interval = setInterval(() => setDots((e) => (e % 3) + 1), 1000) return () => clearInterval(interval) - }, []) + }) return ( <> - {children + " "} + {props.children + " "} {Array.from(Array(dots()), () => ".").join("")} - {Array.from(Array(3 - dots()), (_, i) => ( -   + {Array.from(Array(3 - dots()), () => ( + <>  ))} ) } -function LobbyFrame({ openSettings }: { openSettings: () => void }) { +function LobbyFrame(props: { openSettings: () => void }) { const { payload, userStates, full, leave, reset } = useGameProps() const { isConnected } = useSocket() const navigate = useNavigate() const session = useSession() const [launchTime, setLaunchTime] = createSignal(3) - const launching = createMemo( - () => - payload?.users.length === 2 && - !userStates.filter((user) => !user.isReady).length, - [payload?.users.length, userStates], - ) + const launching = () => + payload?.users.length === 2 && + !userStates.filter((user) => !user.isReady).length createEffect(() => { if (!launching() || launchTime() > 0) return @@ -66,7 +63,7 @@ function LobbyFrame({ openSettings }: { openSettings: () => void }) { createEffect(() => { if (payload?.game?.id || !isConnected) return socket.emit("update", full) - }, [full, payload?.game?.id, isConnected]) + }) createEffect(() => { if ( @@ -91,7 +88,7 @@ function LobbyFrame({ openSettings }: { openSettings: () => void }) { ) : ( <> {"Game-PIN: "} - {isConnected ? ( + {isConnected() ? ( {payload?.gamePin ?? "----"} ) : ( @@ -99,12 +96,12 @@ function LobbyFrame({ openSettings }: { openSettings: () => void }) { )} - + Settings
- {isConnected ? ( + {isConnected() ? ( <> { const interval = setInterval(() => setCount((e) => (e + 1) % 4), 1000) return () => clearInterval(interval) - }, []) + }) - const icon = createMemo(() => { + const icon = () => { switch (count()) { case 0: return faHourglass3 @@ -35,26 +35,20 @@ function HourGlass() { default: return faHourglassClock } - }, [count]) + } return ( ) } -function Player({ - src, - i, - userId, -}: { - src: string - i: number - userId?: string -}) { +function Player(props: { src: string; i: number; userId?: string }) { const { payload, userStates, setIsReady } = useGameProps() - const player = createMemo(() => payload?.users[i], [i, payload?.users]) - const { isReady, isConnected } = userStates[i] - const primary = createMemo(() => userId && userId === payload?.users[i]?.id) + const player = () => payload?.users[props.i] + const isReady = () => userStates[props.i].isReady + const isConnected = () => userStates[props.i].isConnected + const primary = () => + props.userId && props.userId === payload?.users[props.i]?.id return (
@@ -67,7 +61,11 @@ function Player({ {player?.name ?? "Spieler " + (player()?.index === 2 ? "2" : "1")}

- {src} + {props.src} {primary() ? (
- Erlaube Zuschauer - Erlaube spezial Items - Erlaube den Chat - Erlaube zeichen/makieren + Erlaube Zuschauer + Erlaube spezial Items + Erlaube den Chat + Erlaube zeichen/makieren
diff --git a/leaky-ships/src/components/Logo.tsx b/leaky-ships/src/components/Logo.tsx index 8c95182..2eb6f19 100644 --- a/leaky-ships/src/components/Logo.tsx +++ b/leaky-ships/src/components/Logo.tsx @@ -1,50 +1,50 @@ import classNames from "classnames" -function Logo({ small }: { small?: boolean }) { +function Logo(props: { small?: boolean }) { return (

Leaky Ships

- +
) } -function Screws({ small }: { small?: boolean }) { +function Screws(props: { small?: boolean }) { return ( <> @@ -52,11 +52,7 @@ function Screws({ small }: { small?: boolean }) { ) } -function Screw({ - orientation, - rotation, - small, -}: { +function Screw(props: { orientation: string rotation: string small?: boolean @@ -65,15 +61,15 @@ function Screw({

diff --git a/leaky-ships/src/components/OptionButton.tsx b/leaky-ships/src/components/OptionButton.tsx index bfc0e54..a54b656 100644 --- a/leaky-ships/src/components/OptionButton.tsx +++ b/leaky-ships/src/components/OptionButton.tsx @@ -1,37 +1,36 @@ import { IconDefinition } from "@fortawesome/fontawesome-svg-core" import classNames from "classnames" -import { JSX } from "solid-js" +import { JSX, Show } from "solid-js" import { FontAwesomeIcon } from "./FontAwesomeIcon" -function OptionButton({ - id, - icon, - callback, - node, - disabled, -}: { - id: string +function OptionButton(props: { + text: string icon: IconDefinition callback?: () => void node?: JSX.Element + nodeWhen?: boolean disabled?: boolean }) { return ( ) diff --git a/leaky-ships/src/hooks/useDraw.ts b/leaky-ships/src/hooks/useDraw.ts index 60311f2..f323c33 100644 --- a/leaky-ships/src/hooks/useDraw.ts +++ b/leaky-ships/src/hooks/useDraw.ts @@ -8,7 +8,7 @@ function drawLine({ prevPoint, currentPoint, ctx, color }: Draw) { const lineColor = color const lineWidth = 5 - let startPoint = prevPoint ?? currentPoint + const startPoint = prevPoint ?? currentPoint ctx.beginPath() ctx.lineWidth = lineWidth ctx.strokeStyle = lineColor @@ -79,7 +79,7 @@ export const useDraw = () => { canvas.removeEventListener("mousemove", handler) window.removeEventListener("mouseup", mouseUpHandler) } - }, [color, mouseDown]) + }) createEffect(() => { const canvas = canvasRef @@ -94,7 +94,7 @@ export const useDraw = () => { socket.emit("canvas-state", canvasRef.toDataURL()) } - const canvasStateFromServer = (state: string, index: number) => { + const canvasStateFromServer = (state: string) => { console.log("I received the state") const img = new Image() img.src = state @@ -103,10 +103,9 @@ export const useDraw = () => { } } - const socketDrawLine = (props: DrawLineProps, index: number) => { - const { prevPoint, currentPoint, color } = props + const socketDrawLine = (props: DrawLineProps) => { if (!ctx) return console.log("no ctx here") - drawLine({ prevPoint, currentPoint, ctx, color }) + drawLine({ ctx, ...props }) } socket.on("playerEvent", playerEvent) diff --git a/leaky-ships/src/hooks/useGameProps.ts b/leaky-ships/src/hooks/useGameProps.ts index b1d9f04..be7e8db 100644 --- a/leaky-ships/src/hooks/useGameProps.ts +++ b/leaky-ships/src/hooks/useGameProps.ts @@ -1,5 +1,4 @@ import { GameState, MoveType } from "@prisma/client" -import { produce } from "immer" import { getPayloadwithChecksum } from "~/lib/getPayloadwithChecksum" import { socket } from "~/lib/socket" import { @@ -17,6 +16,7 @@ import { // import { toast } from "react-toastify" import create from "solid-zustand" +import { Accessor, Setter, createSignal } from "solid-js" import { EventBarModes, GameSettings, @@ -29,8 +29,10 @@ import { const initialState: optionalGamePropsSchema & { userStates: { - isReady: boolean - isConnected: boolean + isReady: Accessor + setIsReady: Setter + isConnected: Accessor + setIsConnected: Setter }[] menu: keyof EventBarModes mode: number @@ -45,10 +47,11 @@ const initialState: optionalGamePropsSchema & { target: initlialTarget, targetPreview: initlialTargetPreview, mouseCursor: initlialMouseCursor, - userStates: Array.from(Array(2), () => ({ - isReady: false, - isConnected: false, - })), + userStates: Array.from(Array(2), () => { + const [isReady, setIsReady] = createSignal(false) + const [isConnected, setIsConnected] = createSignal(false) + return { isReady, setIsReady, isConnected, setIsConnected } + }), } export type State = typeof initialState @@ -78,137 +81,129 @@ export type Action = { export const useGameProps = create()((set) => ({ ...initialState, setActiveIndex: (i, selfIndex) => - set( - produce((state: State) => { - if (!state.payload) return - state.payload.activeIndex = i - if (i === selfIndex) { - state.menu = "moves" - state.mode = 0 - } else { - state.menu = "main" - state.mode = -1 - } - }), - ), + set((state: State) => { + if (!state.payload) return state + state.payload.activeIndex = i + if (i === selfIndex) { + state.menu = "moves" + state.mode = 0 + } else { + state.menu = "main" + state.mode = -1 + } + return state + }), DispatchMove: (move, i) => - set( - produce((state: State) => { - if (!state.payload) return - const list = targetList(move, move.type) - state.payload.users.map((e) => { - if (!e) return e - if (i === e.index) e.moves.push(move) - else if (move.type !== MoveType.radar) - e.hits.push( - ...list.map(({ x, y }) => ({ - hit: !!intersectingShip(e.ships, { - ...move, - size: 1, - variant: 0, - }).fields.length, - x, - y, - })), - ) - - return e - }) - }), - ), - setTarget: (dispatch) => - set( - produce((state: State) => { - if (typeof dispatch === "function") - state.target = dispatch(state.target) - else state.target = dispatch - }), - ), - setTargetPreview: (dispatch) => - set( - produce((state: State) => { - if (typeof dispatch === "function") - state.targetPreview = dispatch(state.targetPreview) - else state.targetPreview = dispatch - }), - ), - setMouseCursor: (dispatch) => - set( - produce((state: State) => { - if (typeof dispatch === "function") - state.mouseCursor = dispatch(state.mouseCursor) - else state.mouseCursor = dispatch - }), - ), - setShips: (ships, index) => - set( - produce((state: State) => { - if (!state.payload) return - state.payload.users = state.payload.users.map((e) => { - if (!e || e.index !== index) return e - e.ships = ships - return e - }) - }), - ), - removeShip: ({ size, variant, x, y }, index) => - set( - produce((state: State) => { - state.payload?.users.map((e) => { - if (!e || e.index !== index) return - const indexToRemove = e.ships.findIndex( - (ship) => - ship.size === size && - ship.variant === variant && - ship.x === x && - ship.y === y, + set((state: State) => { + if (!state.payload) return state + const list = targetList(move, move.type) + state.payload.users.map((e) => { + if (!e) return e + if (i === e.index) e.moves.push(move) + else if (move.type !== MoveType.radar) + e.hits.push( + ...list.map(({ x, y }) => ({ + hit: !!intersectingShip(e.ships, { + ...move, + size: 1, + variant: 0, + }).fields.length, + x, + y, + })), ) - e.ships.splice(indexToRemove, 1) - return e - }) - }), - ), + + return e + }) + return state + }), + setTarget: (dispatch) => + set((state: State) => { + if (typeof dispatch === "function") state.target = dispatch(state.target) + else state.target = dispatch + return state + }), + setTargetPreview: (dispatch) => + set((state: State) => { + if (typeof dispatch === "function") + state.targetPreview = dispatch(state.targetPreview) + else state.targetPreview = dispatch + return state + }), + setMouseCursor: (dispatch) => + set((state: State) => { + if (typeof dispatch === "function") + state.mouseCursor = dispatch(state.mouseCursor) + else state.mouseCursor = dispatch + return state + }), + setShips: (ships, index) => + set((state: State) => { + if (!state.payload) return state + state.payload.users = state.payload.users.map((e) => { + if (!e || e.index !== index) return e + e.ships = ships + return e + }) + return state + }), + removeShip: ({ size, variant, x, y }, index) => + set((state: State) => { + state.payload?.users.map((e) => { + if (!e || e.index !== index) return + const indexToRemove = e.ships.findIndex( + (ship) => + ship.size === size && + ship.variant === variant && + ship.x === x && + ship.y === y, + ) + e.ships.splice(indexToRemove, 1) + return e + }) + return state + }), setPlayer: (payload) => { let hash: string | null = null - set( - produce((state: State) => { - if (!state.payload) return - state.payload.users = payload.users - const body = getPayloadwithChecksum(state.payload) - if (!body.hash) { - // toast.warn("Something is wrong... ", { - // toastId: "st_wrong", - // theme: "colored", - // }) - return - } - hash = body.hash - state.hash = hash - }), - ) + set((state: State) => { + if (!state.payload) return state + state.payload.users = payload.users + const body = getPayloadwithChecksum(state.payload) + if (!body.hash) { + // toast.warn("Something is wrong... ", { + // toastId: "st_wrong", + // theme: "colored", + // }) + + return state + } + hash = body.hash + state.hash = hash + return state + }) return hash }, setSetting: (settings) => { let hash: string | null = null - set( - produce((state: State) => { - if (!state.payload?.game) return - Object.assign(state.payload.game, settings) - const body = getPayloadwithChecksum(state.payload) - if (!body.hash) { - // toast.warn("Something is wrong... ", { - // toastId: "st_wrong", - // theme: "colored", - // }) - return - } - hash = body.hash - state.hash = hash - }), - ) + set((state: State) => { + if (!state.payload?.game) return state + Object.assign(state.payload.game, settings) + const body = getPayloadwithChecksum(state.payload) + if (!body.hash) { + // toast.warn("Something is wrong... ", { + // toastId: "st_wrong", + // theme: "colored", + // }) + return state + } + hash = body.hash + state.hash = hash + return state + }) return hash }, full: (newGameProps) => + // eslint-disable-next-line solid/reactivity set((state) => { if (state.hash === newGameProps.hash) { console.log("Everything up to date.") @@ -239,31 +234,26 @@ export const useGameProps = create()((set) => ({ }) }, setIsReady: ({ i, isReady }) => - set( - produce((state: State) => { - state.userStates[i].isReady = isReady - state.userStates[i].isConnected = true - }), - ), + set((state: State) => { + state.userStates[i].setIsReady(isReady) + state.userStates[i].setIsConnected(true) + return state + }), gameState: (newState: GameState) => - set( - produce((state: State) => { - if (!state.payload?.game) return - state.payload.game.state = newState - state.userStates = state.userStates.map((e) => ({ - ...e, - isReady: false, - })) - }), - ), + set((state: State) => { + if (!state.payload?.game) return state + state.payload.game.state = newState + state.userStates.forEach((e) => { + e.setIsReady(false) + }) + return state + }), setIsConnected: ({ i, isConnected }) => - set( - produce((state: State) => { - state.userStates[i].isConnected = isConnected - if (isConnected) return - state.userStates[i].isReady = false - }), - ), + set((state: State) => { + state.userStates[i].setIsConnected(isConnected) + if (!isConnected) state.userStates[i].setIsReady(false) + return state + }), reset: () => { set(initialState) }, diff --git a/leaky-ships/src/hooks/useShips.ts b/leaky-ships/src/hooks/useShips.ts index ad7b5ce..05dcd7a 100644 --- a/leaky-ships/src/hooks/useShips.ts +++ b/leaky-ships/src/hooks/useShips.ts @@ -1,4 +1,3 @@ -import { createMemo } from "solid-js" import { ShipProps } from "../interfaces/frontend" import { useGameProps } from "./useGameProps" import useIndex from "./useIndex" @@ -7,10 +6,8 @@ function useShips() { const gameProps = useGameProps() const { selfIndex } = useIndex() - const ships = createMemo( - () => - gameProps.payload?.users.find((e) => e?.index === selfIndex)?.ships ?? [], - ) + const ships = () => + gameProps.payload?.users.find((e) => e?.index === selfIndex)?.ships ?? [] const setShips = (ships: ShipProps[]) => gameProps.setShips(ships, selfIndex) const removeShip = (ship: ShipProps) => gameProps.removeShip(ship, selfIndex) diff --git a/leaky-ships/src/hooks/useSocket.ts b/leaky-ships/src/hooks/useSocket.ts index 732b17c..d30b0cc 100644 --- a/leaky-ships/src/hooks/useSocket.ts +++ b/leaky-ships/src/hooks/useSocket.ts @@ -1,6 +1,6 @@ import status from "http-status" // import { toast } from "react-toastify" -import { createEffect, createMemo, createSignal } from "solid-js" +import { createEffect, createSignal } from "solid-js" import { useNavigate } from "solid-start" import { socket } from "~/lib/socket" import { GamePropsSchema } from "~/lib/zodSchemas" @@ -28,11 +28,8 @@ function useSocket() { } = useGameProps() const navigate = useNavigate() - const isConnected = createMemo( - () => - selfIndex >= 0 ? userStates[selfIndex].isConnected : isConnectedState(), - [selfIndex, isConnectedState(), userStates], - ) + const isConnected = () => + selfIndex >= 0 ? userStates[selfIndex].isConnected() : isConnectedState() createEffect(() => { if (selfIndex < 0) return @@ -40,7 +37,7 @@ function useSocket() { i: selfIndex, isConnected: isConnectedState(), }) - }, [selfIndex, isConnectedState(), setIsConnected]) + }) createEffect(() => { const connect = () => { @@ -66,7 +63,7 @@ function useSocket() { const playerEvent = (event: PlayerEvent) => { const { type, i } = event - let message: string + // let message: string console.log("playerEvent", type) switch (type) { case "disconnect": @@ -74,11 +71,11 @@ function useSocket() { i, isConnected: false, }) - message = "Player is disconnected." + // message = "Player is disconnected." break case "leave": - message = "Player has left the lobby." + // message = "Player has left the lobby." break case "connect": @@ -86,12 +83,12 @@ function useSocket() { i, isConnected: true, }) - socket.emit("isReady", userStates[selfIndex].isReady) - message = "Player has joined the lobby." + socket.emit("isReady", userStates[selfIndex].isReady()) + // message = "Player has joined the lobby." break default: - message = "Not defined yet." + // message = "Not defined yet." break } // toast.info(message, { toastId: message }) @@ -172,7 +169,7 @@ function useSocket() { return { isConnected: - selfIndex >= 0 ? userStates[selfIndex].isConnected : isConnectedState(), + selfIndex >= 0 ? userStates[selfIndex].isConnected : isConnectedState, } } diff --git a/leaky-ships/src/interfaces/frontend.ts b/leaky-ships/src/interfaces/frontend.ts index 6580f9b..e5c62ec 100644 --- a/leaky-ships/src/interfaces/frontend.ts +++ b/leaky-ships/src/interfaces/frontend.ts @@ -23,7 +23,7 @@ export interface TargetList extends Position { edges: string[] } export interface Mode { - pointerGrid: any[][] + pointerGrid: void[][] type: MoveType } export interface ItemProps { diff --git a/leaky-ships/src/lib/backend/sendError.ts b/leaky-ships/src/lib/backend/sendError.ts index 4792072..24d346f 100644 --- a/leaky-ships/src/lib/backend/sendError.ts +++ b/leaky-ships/src/lib/backend/sendError.ts @@ -2,7 +2,7 @@ import { APIEvent, json } from "solid-start" import { rejectionError } from "./errors" import logging from "./logging" -export default function sendError( +export default function sendError( request: APIEvent["request"], err: rejectionError | Error, ) { diff --git a/leaky-ships/src/lib/utils/helpers.ts b/leaky-ships/src/lib/utils/helpers.ts index e73492d..9e6f6f8 100644 --- a/leaky-ships/src/lib/utils/helpers.ts +++ b/leaky-ships/src/lib/utils/helpers.ts @@ -153,8 +153,8 @@ export const shipProps = ( orientation: targetPreview.orientation, }) export function shipFields(ship: ShipProps, i?: number) { - let fields: IndexedPosition[] = [] - let borders: IndexedPosition[] = [] + const fields: IndexedPosition[] = [] + const borders: IndexedPosition[] = [] for ( let x = ship.x; x <= (ship.orientation === "h" ? ship.x + ship.size - 1 : ship.x); diff --git a/leaky-ships/src/routes/api/game/[id].ts b/leaky-ships/src/routes/api/game/[id].ts index c58603b..6c61bad 100644 --- a/leaky-ships/src/routes/api/game/[id].ts +++ b/leaky-ships/src/routes/api/game/[id].ts @@ -11,6 +11,7 @@ interface Data { } export async function GET({ request }: APIEvent) { + // eslint-disable-next-line @typescript-eslint/no-explicit-any const body = request.json() as any //TODO const gameId = body.query.id const session = await getSession(request, authOptions) @@ -39,6 +40,6 @@ export async function GET({ request }: APIEvent) { sendResponse(request, { message: "Here is the game.", - body: { game }, + body: { game } as Data, }) } diff --git a/leaky-ships/src/routes/api/game/create.ts b/leaky-ships/src/routes/api/game/create.ts index 83e2b12..8c7b57b 100644 --- a/leaky-ships/src/routes/api/game/create.ts +++ b/leaky-ships/src/routes/api/game/create.ts @@ -19,7 +19,7 @@ export async function POST({ request }: APIEvent) { .toString() .padStart(4, "0") - let created = false + const created = false let game = await getAnyRunningGame(id) if (game) { diff --git a/leaky-ships/src/routes/api/game/join.ts b/leaky-ships/src/routes/api/game/join.ts index d81bad1..dd614f0 100644 --- a/leaky-ships/src/routes/api/game/join.ts +++ b/leaky-ships/src/routes/api/game/join.ts @@ -74,6 +74,7 @@ export async function POST({ request }: APIEvent) { body, type: ["debug", "infoCyan"], }) + // eslint-disable-next-line @typescript-eslint/no-explicit-any } catch (err: any) { await logging( "HERE".red + err.code + err.meta + err.message, diff --git a/leaky-ships/src/routes/api/ws.ts b/leaky-ships/src/routes/api/ws.ts index 7efad93..b57fd60 100644 --- a/leaky-ships/src/routes/api/ws.ts +++ b/leaky-ships/src/routes/api/ws.ts @@ -33,7 +33,7 @@ export async function GET({ request }: { request: RequestWithSocket }) { // io.use(authenticate) io.use(async (socket, next) => { try { - // @ts-ignore + // @ts-expect-error TODO add correct server const session = await getSession(socket.request, authOptions) if (!session) return next(new Error(status["401"])) socket.data.user = session.user @@ -66,7 +66,7 @@ export async function GET({ request }: { request: RequestWithSocket }) { }) next() - } catch (err: any) { + } catch { logging("Unkonwn error - " + status["401"], ["warn"], socket.request) next(new Error(status["401"])) } diff --git a/leaky-ships/src/routes/game.tsx b/leaky-ships/src/routes/game.tsx index 90f5c3f..7b22717 100644 --- a/leaky-ships/src/routes/game.tsx +++ b/leaky-ships/src/routes/game.tsx @@ -1,40 +1,40 @@ // import { toast } from "react-toastify" -import { createEffect } from "solid-js" -import { useNavigate } from "solid-start" -import { useGameProps } from "~/hooks/useGameProps" -import { useSession } from "~/hooks/useSession" +// import { createEffect } from "solid-js" +// import { useNavigate } from "solid-start" +// import { useGameProps } from "~/hooks/useGameProps" +// import { useSession } from "~/hooks/useSession" export default function Game() { - const { payload } = useGameProps() - const navigate = useNavigate() - const session = useSession() + // const { payload } = useGameProps() + // const navigate = useNavigate() + // const session = useSession() - createEffect(() => { - const gameId = payload?.game?.id - const path = gameId ? "/game" : "/start" - // toast.promise(navigate(path), { - // pending: { - // render: "Wird weitergeleitet...", - // toastId: "pageLoad", - // }, - // success: { - // render: gameId - // ? "Spiel gefunden!" - // : session?.user.id - // ? "Kein laufendes Spiel." - // : "Kein laufendes Spiel. Bitte anmelden.", - // toastId: "pageLoad", - // theme: session?.user.id ? "dark" : undefined, - // type: gameId ? "success" : "info", - // }, - // error: { - // render: "Es ist ein Fehler aufgetreten 🤯", - // type: "error", - // toastId: "pageLoad", - // theme: "colored", - // }, - // }) - }) + // createEffect(() => { + // const gameId = payload?.game?.id + // const path = gameId ? "/game" : "/start" + // toast.promise(navigate(path), { + // pending: { + // render: "Wird weitergeleitet...", + // toastId: "pageLoad", + // }, + // success: { + // render: gameId + // ? "Spiel gefunden!" + // : session?.user.id + // ? "Kein laufendes Spiel." + // : "Kein laufendes Spiel. Bitte anmelden.", + // toastId: "pageLoad", + // theme: session?.user.id ? "dark" : undefined, + // type: gameId ? "success" : "info", + // }, + // error: { + // render: "Es ist ein Fehler aufgetreten 🤯", + // type: "error", + // toastId: "pageLoad", + // theme: "colored", + // }, + // }) + // }) return (
diff --git a/leaky-ships/src/routes/start.tsx b/leaky-ships/src/routes/start.tsx index ed75f2d..66a0eeb 100644 --- a/leaky-ships/src/routes/start.tsx +++ b/leaky-ships/src/routes/start.tsx @@ -4,7 +4,7 @@ import { GamePropsSchema } from "~/lib/zodSchemas" // import OtpInput from "react-otp-input" // import { Icons, toast } from "react-toastify" import status from "http-status" -import { createEffect, createMemo, createSignal } from "solid-js" +import { createEffect, createSignal } from "solid-js" import { useLocation, useNavigate, useSearchParams } from "solid-start" import BurgerMenu from "~/components/BurgerMenu" import { FontAwesomeIcon } from "~/components/FontAwesomeIcon" @@ -30,28 +30,28 @@ export function isAuthenticated(res: Response) { // }) } -const handleConfirmation = () => { - const toastId = "confirm" - // toast.warn( - //
- //

You are already in another round, do you want to:

- // - // or - // - //
, - // { autoClose: false, toastId }, - // ) -} +// const handleConfirmation = () => { +// const toastId = "confirm" +// toast.warn( +//
+//

You are already in another round, do you want to:

+// +// or +// +//
, +// { autoClose: false, toastId }, +// ) +// } export default function Start() { - const [otp, setOtp] = createSignal("") + const [otp] = createSignal("") const gameProps = useGameProps() const location = useLocation() const navigate = useNavigate() const session = useSession() const [searchParams] = useSearchParams() - const query = createMemo(() => { + const query = () => { switch (searchParams["q"]) { case "join": return { join: true } @@ -60,7 +60,7 @@ export default function Start() { default: return {} } - }) + } const gameFetch = async (pin?: string) => { const gameRequestPromise = fetch( @@ -73,8 +73,8 @@ export default function Start() { .then(isAuthenticated) .then((game) => GamePropsSchema.parse(game)) - const move = !pin ? "erstellt" : "angefragt" - const toastId = "pageLoad" + // const move = !pin ? "erstellt" : "angefragt" + // const toastId = "pageLoad" // toast("Raum wird " + move, { // icon: Icons.spinner(), // toastId, @@ -163,13 +163,13 @@ export default function Start() {
navigate( location.pathname.concat( @@ -180,9 +180,11 @@ export default function Start() { } icon={faUserPlus} disabled={!session.latest} + nodeWhen={query().join && !!session.latest} node={ - query().join && session.latest - ? // + { + // -} // renderInput={(props) => } // /> - null - : null + } + } /> navigate( - location.pathname.concat( - "?", - new URLSearchParams({ q: "watch" }).toString(), - ), + location.pathname + + "?" + + new URLSearchParams({ + q: "watch", + }).toString(), ) } + nodeWhen={query().watch} node={ - query().watch - ? // + { + // -} // renderInput={(props) => } // /> - null - : null + } + } />