ability回数表示を削除, inventory無限をちょっとわかりやすくした

Author: na-trium-144

src/ui-components/Ability.svelte

@@ -1,13 +1,9 @@
 <script lang="ts">
 import Key from "./Key.svelte";
-type Props = { name: string; key: string; count: number };
-const { name, count, key }: Props = $props();
+type Props = { name: string; key: string; enabled: boolean };
+const { name, enabled, key }: Props = $props();
 </script>
-<span style="margin-right: 1rem; display: flex; align-items: end; color: {count > 0 ? "black" : "gray"};">
-  <Key withCtrl key={key} enabled={count > 0} />
+<span style="margin-right: 1rem; display: flex; align-items: end; color: {enabled ? "black" : "gray"};">
+  <Key withCtrl key={key} enabled={enabled} />
   <span style="margin-left:0.5rem; margin-right: 0.5rem;">{name}</span>
-  {#if isFinite(count)}
-    <span style="margin-right: 0.5rem; ">x</span>
-    <span style="">{count}</span>
-  {/if}
 </span>

src/ui-components/Game.svelte

@@ -101,21 +101,25 @@ onDestroy(() => bindings.destroy());
         />
       {/if}
     </div>
-    {#if !uiContext.inventoryIsInfinite}
-      <span style="">x</span>
-      <span style="">1</span>
-    {/if}
+    <span style="margin-right: 0.5rem;">x</span>
+    <span style="">{uiContext.inventoryIsInfinite ? "Inf" : "1"}</span>
   </div>
   <div
     class="uiBackground"
     style="position: fixed; left: 0; bottom: 0; right: 0; display: flex; align-items: end;"
   >
     <span style="margin-right: 1rem;">Abilities:</span>
-    <Ability key="C" name="Copy" count={uiContext.copy} />
-    <Ability key="X" name="Cut" count={uiContext.cut} />
-    <Ability key="V" name="Paste" count={uiContext.paste} />
-    <Ability key="Z" name="Undo" count={uiContext.undo} />
-    <Ability key="Y" name="Redo" count={uiContext.redo} />
+    {#if uiContext.copy}
+      <Ability key="C" name="Copy" enabled />
+    {/if}
+    {#if uiContext.cut}
+      <Ability key="X" name="Cut" enabled />
+    {/if}
+    {#if uiContext.paste}
+      <Ability key="V" name="Paste" enabled />
+    {/if}
+    <Ability key="Z" name="Undo" enabled={uiContext.undo > 0} />
+    <Ability key="Y" name="Redo" enabled={uiContext.redo > 0} />
   </div>
 </div>