Fix the selected items being set when initially loading the index page

ysbrandB · Jun 14, 2024 · 13e7525 · 13e7525
1 parent c143223
commit 13e7525
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 6 deletions.
diff --git a/app/Http/Controllers/ItemController.php b/app/Http/Controllers/ItemController.php
@@ -23,7 +23,7 @@ public function index(Request $request)
             });
         }
         return Inertia::render('Items/Index', [
-            'oldSelectedItems'=> $request->session()->get('selected'),
+            'initialSelectedItems'=> Item::whereIn('id', $request->session()->get('selected'))->get(),
             'items' => $items->get(),
             'attributeTypes' => AttributeType::with('attributes')->orderBy('created_at', 'desc')->get(),
             'initialFilters' => $filters,

diff --git a/resources/js/Pages/Items/Index.vue b/resources/js/Pages/Items/Index.vue
@@ -14,11 +14,11 @@ import axios from "axios";
 
 const props = defineProps<{
     items: Item[],
-    oldSelectedItems?: Item[],
+    initialSelectedItems?: Item[],
     attributeTypes: AttributeType[],
-    initialFilters: Record<number, number[]>
+    initialFilters: Record<number, number[]>,
 }>();
-const selectedItems = ref(new Set<Item>());
+const selectedItems = ref(new Set<Item>(props.initialSelectedItems??[]));
 const reloadWithFilters = (filters: Record<number, number[]>) => {
     router.reload({
         data: {
@@ -29,7 +29,6 @@ const reloadWithFilters = (filters: Record<number, number[]>) => {
 };
 
 watch(selectedItems.value, (selected) => {
-    console.log(`selectedItems is ${Array.from(selected).map((item: Item) => item.id)}`)
     axios.post(route('graph.syncSelected'), {
         selected: Array.from(selected).map((item: Item) => item.id)
     });
@@ -43,7 +42,7 @@ watch(selectedItems.value, (selected) => {
                 <h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">Items</h2>
                 <div class="flex flex-row justify-end">
                     <primary-button
-                        @click="router.get(route('graph.index'), {'selected': Array.from(selectedItems).map((item: Item) => item.id)})">
+                        @click="router.get(route('graph.index'))">
                         See overview
                     </primary-button>
                     <pill :color="''" v-for="item in selectedItems" class="cursor-pointer bg-red-100"