feat: add inventory workflow stepper

apps/web/src/pages/AdminHomePage.vue

@@ -4,6 +4,7 @@ import { RouterLink } from "vue-router";
 
 import { useAuth } from "@/composables/useAuth.js";
 import AdminListingStatus from "@/components/molecules/AdminListingStatus.vue";
+import InventoryWorkflowStepper from "@/components/molecules/InventoryWorkflowStepper.vue";
 import {
   createAdminInventory,
   createAdminProduct,
@@ -62,6 +63,35 @@ const acquisitions = ref([]);
 const dashboard = ref(null);
 const valuations = ref({});
 const hasValuations = computed(() => Object.keys(valuations.value).length > 0);
+const workflowSteps = computed(() => {
+  const completed = [
+    products.value.length > 0,
+    providerMappings.value.length > 0,
+    inventory.value.length > 0,
+    Boolean(dashboard.value && inventory.value.length && dashboard.value.counts.missingImages === 0),
+    hasValuations.value,
+    listings.value.some(({ status }) => status === "AVAILABLE"),
+  ];
+  const currentIndex = completed.findIndex((isComplete) => !isComplete);
+  const steps = [
+    ["workflow-product", "Product", "Identify item"],
+    ["workflow-mapping", "Sources", "Link markets"],
+    ["workflow-inventory", "Copy", "Add physical copy"],
+    ["workflow-images", "Images", "Add photos"],
+    ["workflow-pricing", "Pricing", "Check value"],
+    ["workflow-listing", "List", "Publish offer"],
+  ];
+  return steps.map(([id, label, description], index) => ({
+    id,
+    label,
+    description,
+    status: completed[index]
+      ? "complete"
+      : index === currentIndex
+        ? "current"
+        : "pending",
+  }));
+});
 const categories = ref([]);
 const conditions = ref([]);
 const isLoading = ref(true);
@@ -642,8 +672,10 @@ onMounted(load);
       </dl>
     </section>
 
+    <InventoryWorkflowStepper :steps="workflowSteps" />
+
     <div class="admin-workspace-grid">
-      <form class="showcase-panel" @submit.prevent="createProduct">
+      <form id="workflow-product" class="showcase-panel" @submit.prevent="createProduct">
         <h2>Add product</h2>
         <label class="fixture-label" for="product-name">Name</label>
         <input
@@ -676,7 +708,7 @@ onMounted(load);
           Create product
         </button>
       </form>
-      <form class="showcase-panel" @submit.prevent="createProviderMapping">
+      <form id="workflow-mapping" class="showcase-panel" @submit.prevent="createProviderMapping">
         <h2>Link provider mapping</h2>
         <label class="fixture-label" for="mapping-product">Product</label>
         <select
@@ -730,7 +762,7 @@ onMounted(load);
           Save provider mapping
         </button>
       </form>
-      <form class="showcase-panel" @submit.prevent="createInventory">
+      <form id="workflow-inventory" class="showcase-panel" @submit.prevent="createInventory">
         <h2>Add inventory copy</h2>
         <label class="fixture-label" for="inventory-product">Product</label>
         <select
@@ -772,7 +804,7 @@ onMounted(load);
           Create copy
         </button>
       </form>
-      <form class="showcase-panel" @submit.prevent="createListing">
+      <form id="workflow-listing" class="showcase-panel" @submit.prevent="createListing">
         <h2>Create listing draft</h2>
         <label class="fixture-label" for="listing-inventory"
           >Inventory copy</label
@@ -929,7 +961,7 @@ onMounted(load);
           Record acquisition
         </button>
       </form>
-      <form class="showcase-panel" @submit.prevent="calculatePricing">
+      <form id="workflow-pricing" class="showcase-panel" @submit.prevent="calculatePricing">
         <h2 id="pricing-title">Calculate market value</h2>
         <label class="fixture-label" for="pricing-inventory"
           >Inventory copy</label
@@ -1047,6 +1079,7 @@ onMounted(load);
       class="admin-list"
       aria-labelledby="inventory-title"
     >
+      <span id="workflow-images" aria-hidden="true"></span>
       <h2 id="inventory-title">Physical inventory</h2>
       <div class="admin-list__actions">
         <button