simplify actionsMenu

front/src/Components/ActionsMenu/ActionsMenu.svelte

@@ -1,16 +1,13 @@
 <script lang="typescript">
     import { fly } from "svelte/transition";
-    import { ActionsMenuInterface, actionsMenuStore } from '../../Stores/ActionsMenuStore';
-    import { requestActionsMenuStore, actionsMenuPlayerNameStore, requestVisitCardsStore } from '../../Stores/GameStore';
-    import { onDestroy, onMount,  } from "svelte";
+    import { ActionsMenuData, actionsMenuStore } from '../../Stores/ActionsMenuStore';
+    import { onDestroy } from "svelte";
 
     import type { Unsubscriber } from "svelte/store";
 
-    let possibleActions: Map<string, ActionsMenuInterface>;
-    let playerName: string | null;
+    let actionsMenuData: ActionsMenuData | undefined;
 
     let actionsMenuStoreUnsubscriber: Unsubscriber | null;
-    let actionsMenuPlayerNameStoreUnsubscriber: Unsubscriber | null;
 
     function onKeyDown(e: KeyboardEvent) {
         if (e.key === "Escape") {
@@ -19,45 +16,40 @@
     }
 
     function closeActionsMenu() {
-        requestActionsMenuStore.set(false);
+        actionsMenuStore.clear();
     }
 
     actionsMenuStoreUnsubscriber = actionsMenuStore.subscribe(value => {
-        possibleActions = value;
-    });
-
-    actionsMenuPlayerNameStoreUnsubscriber = actionsMenuPlayerNameStore.subscribe(value => {
-        playerName = value;
+        actionsMenuData = value;
     });
 
     onDestroy(() => {
         if (actionsMenuStoreUnsubscriber) {
             actionsMenuStoreUnsubscriber();
         }
-        if (actionsMenuPlayerNameStoreUnsubscriber) {
-            actionsMenuPlayerNameStoreUnsubscriber();
-        }
     });
 
 </script>
 
 <svelte:window on:keydown={onKeyDown} />
 
-<div class="actions-menu nes-container is-rounded">
-    <button type="button" class="nes-btn is-error close" on:click={closeActionsMenu}>&times</button>
-    <h2>{playerName}</h2>
-    <div class="actions">
-        {#each [...possibleActions] as [key, menuAction]}
-            <button
-                type="button"
-                class="nes-btn"
-                on:click|preventDefault={() => { menuAction.callback(); }}
-            >
-                {menuAction.displayName}
-            </button>
-            {/each}
+{#if actionsMenuData}
+    <div class="actions-menu nes-container is-rounded">
+        <button type="button" class="nes-btn is-error close" on:click={closeActionsMenu}>&times</button>
+        <h2>{actionsMenuData.playerName}</h2>
+        <div class="actions">
+            {#each [...actionsMenuData.actions] as { actionName, callback }}
+                <button
+                    type="button"
+                    class="nes-btn"
+                    on:click|preventDefault={() => { callback(); }}
+                >
+                    {actionName}
+                </button>
+                {/each}
+        </div>
     </div>
-</div>
+{/if}
 
 <style lang="scss">
     .actions-menu {        

front/src/Components/App.svelte

@@ -17,7 +17,7 @@
     import { loginSceneVisibleStore } from "../Stores/LoginSceneStore";
     import EnableCameraScene from "./EnableCamera/EnableCameraScene.svelte";
     import VisitCard from "./VisitCard/VisitCard.svelte";
-    import { requestVisitCardsStore, requestActionsMenuStore } from "../Stores/GameStore";
+    import { requestVisitCardsStore } from "../Stores/GameStore";
 
     import type { Game } from "../Phaser/Game/Game";
     import { chatVisibilityStore } from "../Stores/ChatStore";
@@ -49,6 +49,7 @@
     import { peerStore } from "../Stores/PeerStore";
     import FollowMenu from "./FollowMenu/FollowMenu.svelte";
 import ActionsMenu from './ActionsMenu/ActionsMenu.svelte';
+import { actionsMenuStore } from '../Stores/ActionsMenuStore';
 
     export let game: Game;
 </script>
@@ -153,7 +154,7 @@ import ActionsMenu from './ActionsMenu/ActionsMenu.svelte';
     {#if $requestVisitCardsStore}
         <VisitCard visitCardUrl={$requestVisitCardsStore} />
     {/if}
-    {#if $requestActionsMenuStore}
+    {#if $actionsMenuStore}
         <ActionsMenu />
     {/if}
     {#if $errorStore.length > 0}