From 43e97942cfb62a4e0e6f419bab2819bfe48431a0 Mon Sep 17 00:00:00 2001
From: Tommy <76645845+Tom-stack3@users.noreply.github.com>
Date: Sat, 23 Nov 2024 14:40:31 +0000
Subject: [PATCH] Pass locationFlatTree to ItemCard in order to display full
 location

---
 frontend/components/Item/Card.vue | 10 +++++++++-
 frontend/pages/items.vue          |  2 +-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/frontend/components/Item/Card.vue b/frontend/components/Item/Card.vue
index 30751c4b8..b68c82434 100644
--- a/frontend/components/Item/Card.vue
+++ b/frontend/components/Item/Card.vue
@@ -14,7 +14,7 @@
           :to="`/location/${item.location.id}`"
           loading="lazy"
         >
-          {{ item.location.name }}
+          {{ locationString }}
         </NuxtLink>
       </div>
     </div>
@@ -67,6 +67,14 @@
       type: Object as () => ItemOut | ItemSummary,
       required: true,
     },
+    locationFlatTree: {
+      type: Array as () => FlatTreeItem[],
+      required: true,
+    },
+  });
+
+  const locationString = computed(() => {
+    return props.locationFlatTree.find(l => l.id === props.item.location.id)?.treeString;
   });
 </script>
 
diff --git a/frontend/pages/items.vue b/frontend/pages/items.vue
index 8d46c1ee5..039626bcf 100644
--- a/frontend/pages/items.vue
+++ b/frontend/pages/items.vue
@@ -474,7 +474,7 @@
         <p>{{ $t("items.no_results") }}</p>
       </div>
       <div v-else ref="cardgrid" class="mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-3">
-        <ItemCard v-for="item in items" :key="item.id" :item="item" />
+        <ItemCard v-for="item in items" :key="item.id" :item="item" :location-flat-tree="locationFlatTree" />
       </div>
       <div v-if="items.length > 0 && (hasNext || hasPrev)" class="mt-10 flex flex-col items-center gap-2">
         <div class="flex">