apply suggestions

src/components/editor/BasketCourt.tsx

@@ -1,10 +1,4 @@
-import {
+import { ReactElement, ReactNode, RefObject } from "react"
-    ReactElement,
-    ReactNode,
-    RefObject,
-    useLayoutEffect,
-    useState,
-} from "react"
 import { Action } from "../../model/tactic/Action"
 
 import { CourtAction } from "./CourtAction.tsx"
@@ -36,14 +30,6 @@ export function BasketCourt({
     courtImage,
     courtRef,
 }: BasketCourtProps) {
-    const [forceEmptyComponents, setForceEmptyComponents] = useState(true)
-
-    useLayoutEffect(() => {
-        setForceEmptyComponents(false)
-    }, [setForceEmptyComponents])
-
-    const usedComponents = forceEmptyComponents ? [] : components
-
     return (
         <div
             className="court-container"
@@ -51,8 +37,8 @@ export function BasketCourt({
             style={{ position: "relative" }}>
             {courtImage}
 
-            {usedComponents.map(renderComponent)}
+            {courtRef.current && components.map(renderComponent)}
-            {usedComponents.flatMap(renderActions)}
+            {courtRef.current && components.flatMap(renderActions)}
 
             {previewAction && (
                 <CourtAction

src/editor/PlayerDomains.ts

@@ -41,7 +41,7 @@ export function getPlayerNextTo(
 ): PlayerLike | undefined {
     const playerOrigin =
         player.type === "player" ? player : getOrigin(player, components)
-    const pathItems = playerOrigin.path?.items!
+    const pathItems = playerOrigin.path!.items
 
     // add one as there is a shifting because a Player is never at the head of its own path
     const idx = pathItems.indexOf(player.id) + 1 // is 0 if the player is the origin
@@ -49,11 +49,9 @@ export function getPlayerNextTo(
     const targetIdx = idx + n
 
     // remove the screen phantom
-    const result =
+    return targetIdx == 0
-        targetIdx == 0
+        ? playerOrigin
-            ? playerOrigin
+        : getComponent<PlayerLike>(pathItems[targetIdx - 1], components)
-            : getComponent<PlayerLike>(pathItems[targetIdx - 1], components)
-    return result
 }
 
 //FIXME this function can be a bottleneck if the phantom's position is
@@ -219,22 +217,20 @@ export function removePlayer(
                 -1,
                 content.components,
             )!
-            const actionIdx = playerBefore.actions.findIndex(
+            const actions = playerBefore.actions.filter(
                 (a) => a.target === pos.attach,
             )
             content = updateComponent(
                 {
                     ...playerBefore,
-                    actions: playerBefore.actions.toSpliced(actionIdx, 1),
+                    actions,
                 },
                 content,
             )
         }
 
         const origin = getOrigin(player, content.components)
-        content = truncatePlayerPath(origin, player, content)
+        return truncatePlayerPath(origin, player, content)
-        console.log(content)
-        return content
     }
 
     content = clearPlayerPath(player, content)