Fix ownership conflicts

src/lib/components/InventoryList.svelte

@@ -5,18 +5,15 @@
     import {Button} from "$lib/components/ui/button/index.js";
     import {Grid} from "$lib/grid";
 
-    let { i18n = new Localization("en-GB"), inventories = $bindable(), grid, multiplier } = $props();
+    let { i18n = new Localization("en-GB"), inventories, onRemoveInventory, grid, multiplier } = $props();
     let valid = $derived.by(() => {
         let valids = [];
         valids[0] = typeof inventories !== "undefined";
         valids[1] = typeof grid !== "undefined";
         valids[2] = typeof multiplier !== "undefined";
+        valids[3] = typeof onRemoveInventory !== "undefined";
         return !valids.includes(false);
     });
-
-    function removeInventory(index: number) {
-        thrusters.splice(index, 1);
-    }
 </script>
 
 <div class="max-h-full flex flex-col gap-2 overflow-y-auto">
@@ -24,7 +21,7 @@
         {#each inventories as inventory, index}
             <p class="flex gap-2 justify-between">
                 - {i18n.localize(inventory.details.name)} {i18n.localize("volume")}: {applyUnits(i18n, inventory.getVolume(grid, multiplier), "l")}
-                <Button variant="destructive" onclick={() => removeInventory(index)}>X</Button>
+                <Button variant="destructive" onclick={() => onRemoveInventory(index)}>X</Button>
             </p>
         {/each}
     {:else}

src/lib/components/ThrusterList.svelte

@@ -5,18 +5,15 @@
     import {applyUnits, Localization} from "$lib/constants";
     import {Grid} from "$lib/grid";
 
-    let { i18n = new Localization("en-GB"), thrusters = $bindable(), grid, atmosphere } = $props();
+    let { i18n = new Localization("en-GB"), thrusters, onRemoveThruster, grid, atmosphere } = $props();
     let valid = $derived.by(() => {
         let valids = [];
         valids[0] = typeof thrusters !== "undefined";
         valids[1] = typeof grid !== "undefined";
         valids[2] = typeof atmosphere !== "undefined";
+        valids[3] = typeof onRemoveThruster !== "undefined";
         return !valids.includes(false);
     });
-
-    function removeThruster(index: number) {
-        thrusters.splice(index, 1);
-    }
 </script>
 
 
@@ -25,7 +22,7 @@
         {#each thrusters as thruster, index}
             <p class="gap-2 flex justify-between">
                 - {i18n.localize(thruster.details.size)} {i18n.localize(thruster.details.type.details.name)}: {applyUnits(i18n, thruster.getThrust(grid, atmosphere), "N")}
-                <Button variant="destructive" onclick={() => removeThruster(index)}>X</Button>
+                <Button variant="destructive" onclick={() => onRemoveThruster(index)}>X</Button>
             </p>
         {/each}
     {:else}

src/lib/containers.svelte.ts

@@ -56,7 +56,6 @@ export class Inventory {
     }
 
     getVolume(grid: Grid, multiplier: number): number {
-        console.log(this.details.capacity.get(grid), multiplier);
         return (this.details.capacity.get(grid) || 0) * multiplier;
     }
 }

src/lib/ship.svelte.ts

@@ -68,8 +68,12 @@ export class Ship {
         return volume;
     }
 
-    spliceInventories(index: number, length: number): void {
+    removeThruster(index: number): void {
-        this.inventories.splice(index, length);
+        this.thrusters.splice(index, 1);
+    }
+
+    removeInventory(index: number): void {
+        this.inventories.splice(index, 1);
     }
 
     getTotalThrust(atmosphere: number): number {

src/routes/+page.svelte

@@ -65,17 +65,23 @@
     let maxWeight: number = $derived(ship.getTotalMaxThrust() / (gravity * 9.81))
 
     let maxVehicleWeight: number = $derived(maxWeight - ship.getTotalVolume(inventoryMultiplier) * material.density)
-    $inspect(maxVehicleWeight);
-    $inspect(`${maxWeight} - ${ship.getTotalVolume(inventoryMultiplier)} * ${material.density} = ${maxVehicleWeight}`)
 
     function addInventory(newInventory: Inventory) {
         ship.addInventory(newInventory);
     }
 
+    function removeInventory(index: number) {
+        ship.removeInventory(index);
+    }
+
     function addThruster(newThruster: Thruster) {
         ship.addThruster(newThruster);
     }
 
+    function removeThruster(index: number) {
+        ship.removeThruster(index);
+    }
+
     onMount(() => {
         if (navigator) {
             i18n.language = navigator.language;
@@ -83,7 +89,6 @@
 
         let ret = getFromLocalStorage("version");
         if (ret.result) {
-            console.log(ret);
             if (ret.value !== STORAGE_VERSION) {
                 localStorage.clear();
                 localStorage.setItem("version", STORAGE_VERSION);
@@ -188,7 +193,7 @@
                 </Card.Header>
                 <Card.Content class="flex flex-col gap-3 overflow-hidden">
                     <Separator />
-                    <ThrusterList i18n={i18n} bind:thrusters={ship.thrusters} grid={ship.grid} atmosphere={atmosphericDensity}/>
+                    <ThrusterList i18n={i18n} thrusters={ship.thrusters} onRemoveThruster={removeThruster} grid={ship.grid} atmosphere={atmosphericDensity}/>
                 </Card.Content>
             </Card.Root>
         </Card.Content>
@@ -213,7 +218,7 @@
                 </Card.Header>
                 <Card.Content class="flex flex-col gap-3 overflow-hidden">
                     <Separator />
-                    <InventoryList i18n={i18n} bind:inventories={ship.inventories} grid={ship.grid} multiplier={inventoryMultiplier} />
+                    <InventoryList i18n={i18n} inventories={ship.inventories} onRemoveInventory={removeInventory} grid={ship.grid} multiplier={inventoryMultiplier} />
                 </Card.Content>
             </Card.Root>
         </Card.Content>