feat: add listing publication readiness

apps/web/src/pages/AdminHomePage.vue

@@ -3,6 +3,7 @@ import { onMounted, ref } from 'vue';
 import { RouterLink } from 'vue-router';
 
 import { useAuth } from '@/composables/useAuth.js';
+import AdminListingStatus from '@/components/molecules/AdminListingStatus.vue';
 import { createAdminInventory, createAdminProduct, listAdminCategories, listAdminConditions, listAdminInventory, listAdminProducts } from '@/services/admin-catalog-service.js';
 import { createAdminListing, listAdminListings, markListingPending, publishAdminListing } from '@/services/admin-listing-service.js';
 
@@ -137,7 +138,7 @@ onMounted(load);
     <section class="admin-list" aria-labelledby="listings-title">
       <h2 id="listings-title">Listings</h2>
       <p v-if="!listings.length && !isLoading" class="state state--empty">No listings yet.</p>
-      <ul v-else><li v-for="listing in listings" :key="listing.id"><span>{{ listing.productName }}</span> · {{ listing.status }} · ${{ (listing.askingPriceMinor / 100).toFixed(2) }} <button v-if="listing.status === 'DRAFT'" class="button button--secondary" type="button" @click="transitionListing(publishAdminListing, listing.id)">Publish</button><button v-if="listing.status === 'DRAFT'" class="button button--secondary" type="button" @click="transitionListing(markListingPending, listing.id)">Mark pending</button></li></ul>
+      <div v-else class="admin-listing-stack"><AdminListingStatus v-for="listing in listings" :key="listing.id" :listing="listing" :is-saving="isSaving" @publish="transitionListing(publishAdminListing, listing.id)" @pending="transitionListing(markListingPending, listing.id)" /></div>
     </section>
   </section>
 </template>