From 230294ebb6712120b57b5cedfe0de4e3a0af8c94 Mon Sep 17 00:00:00 2001
From: Michael Manganiello <adamantike@users.noreply.github.com>
Date: Wed, 25 Jun 2025 00:24:34 -0300
Subject: [PATCH] feat: Display number of items in Location/Label page (#805)

* feat: Display number of items in Location/Label page

When viewing a Location or Label page, the number of items directly
associated with that Location or Label is now displayed in the section
header.

* style: adjust the style on the item count

---------

Co-authored-by: Tonya <tonya@tokia.dev>
---
 frontend/components/Item/View/Selectable.vue | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/frontend/components/Item/View/Selectable.vue b/frontend/components/Item/View/Selectable.vue
index 78de9229..559c294c 100644
--- a/frontend/components/Item/View/Selectable.vue
+++ b/frontend/components/Item/View/Selectable.vue
@@ -3,6 +3,7 @@
   import type { ItemSummary } from "~~/lib/api/types/data-contracts";
   import MdiCardTextOutline from "~icons/mdi/card-text-outline";
   import MdiTable from "~icons/mdi/table";
+  import { Badge } from "@/components/ui/badge";
   import { Button, ButtonGroup } from "@/components/ui/button";
 
   type Props = {
@@ -29,7 +30,12 @@
 <template>
   <section>
     <BaseSectionHeader class="mb-2 mt-4 flex items-center justify-between">
-      {{ $t("components.item.view.selectable.items") }}
+      <div class="flex gap-2">
+        {{ $t("components.item.view.selectable.items") }}
+        <Badge>
+          {{ items.length }}
+        </Badge>
+      </div>
       <template #description>
         <div v-if="!viewSet">
           <ButtonGroup>