diff --git a/view-user/package-lock.json b/view-user/package-lock.json index d33b722..4504b5a 100755 --- a/view-user/package-lock.json +++ b/view-user/package-lock.json @@ -4227,7 +4227,6 @@ "resolved": "https://registry.npmjs.org/@svgr/webpack/-/webpack-8.1.0.tgz", "integrity": "sha512-LnhVjMWyMQV9ZmeEy26maJk+8HTIbd59cH4F2MJ439k9DqejRisfFNGAPvRYlKETuh9LrImlS8aKsBgKjMA8WA==", "dev": true, - "license": "MIT", "dependencies": { "@babel/core": "^7.21.3", "@babel/plugin-transform-react-constant-elements": "^7.21.3", diff --git a/view-user/src/pages/screen/index.tsx b/view-user/src/pages/screen/index.tsx index c6bb103..00684d8 100644 --- a/view-user/src/pages/screen/index.tsx +++ b/view-user/src/pages/screen/index.tsx @@ -1,5 +1,4 @@ import type { NextPage } from "next"; -import Image from "next/image"; import { useState, useEffect, useRef } from "react"; import Matter from "matter-js"; import { useSubscription } from "@apollo/client"; @@ -7,11 +6,9 @@ import { SubscribeListNumbersDocument, SubscribeCreatedStampTriggerDocument, SubscribeOneLatestReachLogDocument, -} from "@/types/graphql"; -import type { - SubscribeListNumbersSubscription, - SubscribeCreatedStampTriggerSubscription, - SubscribeOneLatestReachLogSubscription, + type SubscribeListNumbersSubscription, + type SubscribeCreatedStampTriggerSubscription, + type SubscribeOneLatestReachLogSubscription, } from "@/types/graphql"; import { NumberCardLarge, @@ -69,7 +66,7 @@ const Page: NextPage = () => { const render = useRef(null); const engine = useRef(null); const [latestCreatedAt, setLatestCreatedAt] = useState( - new Date().toString(), + new Date().toISOString(), ); const [bingoNumbers, setBingoNumbers] = useState< SubscribeListNumbersSubscription["numbers"] @@ -100,21 +97,23 @@ const Page: NextPage = () => { ); useEffect(() => { - if (triggers?.stampTriggers?.length) { - triggers.stampTriggers.forEach((stamp: Stamp) => { + const stamps = triggers?.stampTriggers; + if (stamps?.length) { + stamps.forEach((stamp: Stamp) => { addCircleById(stamp.name); - - if ( - stamp.createdAt && - new Date(stamp.createdAt) > new Date(latestCreatedAt) - ) { - setLatestCreatedAt(stamp.createdAt); - } }); - setLatestCreatedAt(latestCreatedAt); + const latestStamp = stamps.reduce((latest, stamp) => { + return new Date(stamp.createdAt) > new Date(latest.createdAt) + ? stamp + : latest; + }, stamps[0]); + + if (new Date(latestStamp.createdAt) > new Date(latestCreatedAt)) { + setLatestCreatedAt(latestStamp.createdAt); + } } - }, [triggers]); + }, [triggers, latestCreatedAt]); // ビンゴ番号のuseEffect useEffect(() => { @@ -175,14 +174,6 @@ const Page: NextPage = () => { }, }); - const ground = Bodies.rectangle( - window.innerWidth / 2, - window.innerHeight, - window.innerWidth + 10, - 20, - { isStatic: true, render: { visible: false } }, - ); - const rightWall = Bodies.rectangle( window.innerWidth, window.innerHeight / 2, @@ -199,7 +190,7 @@ const Page: NextPage = () => { { isStatic: true, render: { visible: false } }, ); - Composite.add(engine.current.world, [ground, leftWall, rightWall]); + Composite.add(engine.current.world, [leftWall, rightWall]); Render.run(render.current); const runner = Runner.create();