From b2c72ebb0db9f8618d4f9ad01be3e6505d792878 Mon Sep 17 00:00:00 2001
From: aronmal <aron@mal-noh.de>
Date: Thu, 12 Jan 2023 09:59:57 +0100
Subject: [PATCH] Change way of imply param

---
 leaky-ships/components/Target.tsx       |  4 ++--
 leaky-ships/components/useGameEvent.tsx | 32 ++++++++++++-------------
 2 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/leaky-ships/components/Target.tsx b/leaky-ships/components/Target.tsx
index 085ad8d..94b52aa 100644
--- a/leaky-ships/components/Target.tsx
+++ b/leaky-ships/components/Target.tsx
@@ -3,9 +3,9 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { CSSProperties } from 'react';
 import classNames from 'classnames';
 
-function Target({ props: { preview, type, edges }, target: { x, y, show } }: { props: { preview?: boolean, type: string, edges: string[] }, target: { x: number, y: number, show: boolean } }) {
+function Target({ props: { preview, type, edges, imply }, target: { x, y, show } }: { props: { preview?: boolean, type: string, edges: string[], imply: boolean }, target: { x: number, y: number, show: boolean } }) {
     return (
-        <div className={classNames('hit-svg', preview ? 'target-preview' : 'target', type, { show: show }, ...edges)} style={{ '--x': x, '--y': y } as CSSProperties}>
+        <div className={classNames('hit-svg', preview ? 'target-preview' : 'target', type, { show: show }, ...edges, { imply: imply })} style={{ '--x': x, '--y': y } as CSSProperties}>
             <FontAwesomeIcon icon={faCrosshairs} />
         </div>
     )
diff --git a/leaky-ships/components/useGameEvent.tsx b/leaky-ships/components/useGameEvent.tsx
index 533a641..88c3537 100644
--- a/leaky-ships/components/useGameEvent.tsx
+++ b/leaky-ships/components/useGameEvent.tsx
@@ -14,16 +14,18 @@ function useGameEvent(count: number) {
     const [hits, DispatchHits] = useReducer(hitReducer, [] as HitType[]);
     const [mode, setMode] = useState<keyof typeof modes>('none')
     const [targetList, setTargetList] = useState<{
-        show: boolean;
-        x: number;
-        y: number;
-        edges: string[];
+        show: boolean,
+        x: number,
+        y: number,
+        edges: string[],
+        imply: boolean
     }[]>([])
     const [targetPreviewList, setTargetPreviewList] = useState<{
-        show: boolean;
-        x: number;
-        y: number;
-        edges: string[];
+        show: boolean,
+        x: number,
+        y: number,
+        edges: string[],
+        imply: boolean
     }[]>([])
 
     const modes = useMemo(() => ({
@@ -68,9 +70,9 @@ function useGameEvent(count: number) {
         return { fields, type }
     }, [modes, mode])
 
-    const Targets = useCallback((targets: { show: boolean, x: number, y: number, edges: string[] }[], preview?: boolean) => {
+    const Targets = useCallback((targets: { show: boolean, x: number, y: number, edges: string[], imply: boolean }[], preview?: boolean) => {
         const { type } = scopeGrid
-        return targets.map(({ edges, ...target }, i) => <Target key={i} props={{ type, preview, edges }} target={target} />)
+        return targets.map(({ edges, imply, ...target }, i) => <Target key={i} props={{ type, preview, edges, imply }} target={target} />)
     }, [scopeGrid])
 
     useEffect(() => {
@@ -83,13 +85,12 @@ function useGameEvent(count: number) {
                     y < 2,
                     y > count,
                 ].reduce((prev, curr) => prev || curr, false)
-                // console.log(!isHit(hits, x, y).length, !borders)
                 return !border
             }).map(field => {
                 const { x, y } = field
                 if (isHit(hits, x, y).length)
-                    return { ...field, edges: [...field.edges, 'imply'] }
-                return field
+                    return { ...field, imply: true }
+                return { ...field, imply: false }
             })
         setTargetList(e => {
             if (JSON.stringify(e) === JSON.stringify(result))
@@ -108,13 +109,12 @@ function useGameEvent(count: number) {
                     y < 2,
                     y > count + 1,
                 ].reduce((prev, curr) => prev || curr, false)
-                // console.log(!isHit(hits, x, y).length, !isSet(x, y), !borders)
                 return !border
             }).map(field => {
                 const { x, y } = field
                 if (isHit(hits, x, y).length || isSet(x, y))
-                    return { ...field, edges: [...field.edges, 'imply'] }
-                return field
+                    return { ...field, imply: true }
+                return { ...field, imply: false }
             })
         if (!targetPreviewPos.shouldShow)
             return