From 15409b56ba9b31497f6872524570e5ba4e1622ff Mon Sep 17 00:00:00 2001
From: "Burgstede, W.Y. (Ysbrand, Student B-CREA)"
 <w.y.burgstede@student.utwente.nl>
Date: Sat, 22 Jun 2024 22:10:53 +0200
Subject: [PATCH] Solve the item edit and the shortest graph problems

---
 resources/js/Pages/Items/Edit.vue  |  4 ++-
 resources/js/Pages/Items/Graph.vue | 47 +++++++++++++++++++-----------
 2 files changed, 33 insertions(+), 18 deletions(-)

diff --git a/resources/js/Pages/Items/Edit.vue b/resources/js/Pages/Items/Edit.vue
index a81f52c..c09b7da 100644
--- a/resources/js/Pages/Items/Edit.vue
+++ b/resources/js/Pages/Items/Edit.vue
@@ -208,7 +208,9 @@ const submit = () => {
                                 <option v-for="selectableItem in items"
                                         :value="selectableItem.id"
                                         :key="selectableItem.id"
-                                        :selected="selectableItem.id.toString()===selectedItemId">
+                                        :selected="
+                                        // @ts-ignore
+                                        selectableItem.id===selectedItemId||selectableItem.id.toString()===selectedItemId">
                                     {{ selectableItem.title }}
                                 </option>
                             </select>
diff --git a/resources/js/Pages/Items/Graph.vue b/resources/js/Pages/Items/Graph.vue
index 8534e90..b6117d9 100644
--- a/resources/js/Pages/Items/Graph.vue
+++ b/resources/js/Pages/Items/Graph.vue
@@ -12,7 +12,7 @@ import {
     ForceEdgeDatum,
 } from "v-network-graph/lib/force-layout"
 import Card from "@/Components/Card.vue";
-import {Item, PageProps} from "@/types";
+import {Item} from "@/types";
 import SelectedItemDropdown from "@/CustomComponents/SelectedItemDropdown.vue";
 import PrimaryButton from "@/Components/PrimaryButton.vue";
 import axios from "axios";
@@ -30,6 +30,23 @@ const props = defineProps<{
     initialSelectedItems: Item[]
 }>();
 
+
+const selectedItems = ref(new Set<Item>(props.initialSelectedItems ?? []))
+onMounted(() => {
+    watch(selectedItems.value, (selected) => {
+        axios.post(route('graph.syncSelected'), {
+            selected: Array.from(selected).map((item: Item) => item.id)
+        }).then(()=>{
+            router.reload({
+                only: ['items', 'nodes', 'initialSelectedItems'],
+                onSuccess: (e) => {
+                    calculate(e);
+                }
+            })
+        })
+    })
+});
+
 const page = usePage();
 const nodes = ref({})
 const edges = ref({})
@@ -56,12 +73,24 @@ const calculate = (pageProps: any) =>{
     });
 
     //filter out the myEdges where source is target and target is source from another item
+    let sameEdges = new Map<string, number>();
     Array.from(myEdges).forEach((edge: Edge, index: number) => {
+        //@ts-ignore
+        sameEdges.set(`${edge.source}-${edge.target}`, sameEdges.get(`${edge.source}-${edge.target}`) + 1 || 1)
         if (!myEdges.has({source: edge.target, target: edge.source})) {
             //@ts-ignore
             edges.value[`edge${index}`] = edge
         }
     });
+    //if the node is not needed, because it is referenced by all selected nodes and therefore there is a shorter path, delete it.
+    //@ts-ignore
+    sameEdges.entries().forEach(([key, value]) => {
+        if (value >= selectedItems.value.size && selectedItems.value.size > 0) {
+            const [_, target] = key.split('-')
+            //@ts-ignore
+            delete nodes.value[target]
+        }
+    })
 }
 
 calculate(page);
@@ -130,22 +159,6 @@ const configs = reactive(
         },
     })
 )
-
-const selectedItems = ref(new Set<Item>(props.initialSelectedItems ?? []))
-onMounted(() => {
-    watch(selectedItems.value, (selected) => {
-        axios.post(route('graph.syncSelected'), {
-            selected: Array.from(selected).map((item: Item) => item.id)
-        }).then(()=>{
-            router.reload({
-                only: ['items', 'nodes', 'initialSelectedItems'],
-                onSuccess: (e) => {
-                    calculate(e);
-                }
-            })
-        })
-    })
-});
 </script>
 
 <template>