mock shop page: order listings

database_migrations/000020_mock_shop_listing_name_index.down.sql

@@ -0,0 +1,21 @@
+BEGIN;
+
+
+
+DROP INDEX mock.shop_tiktok_listings_name;
+DROP INDEX mock.shop_shopify_listings_name;
+DROP INDEX mock.shop_woo_commerce_listings_name;
+DROP INDEX mock.shop_wix_listings_name;
+DROP INDEX mock.shop_squarespace_listings_name;
+DROP INDEX mock.shop_square_online_listings_name;
+DROP INDEX mock.shop_zoho_listings_name;
+DROP INDEX mock.shop_ecwid_listings_name;
+DROP INDEX mock.shop_big_cartel_listings_name;
+DROP INDEX mock.shop_amazon_listings_name;
+DROP INDEX mock.shop_walmart_marketplace_listings_name;
+DROP INDEX mock.shop_ebay_listings_name;
+DROP INDEX mock.shop_etsy_listings_name;
+
+
+
+COMMIT;

database_migrations/000020_mock_shop_listing_name_index.up.sql

@@ -0,0 +1,21 @@
+BEGIN;
+
+
+
+CREATE INDEX shop_tiktok_listings_name ON mock.shop_tiktok_listings (name);
+CREATE INDEX shop_shopify_listings_name ON mock.shop_shopify_listings (name);
+CREATE INDEX shop_woo_commerce_listings_name ON mock.shop_woo_commerce_listings (name);
+CREATE INDEX shop_wix_listings_name ON mock.shop_wix_listings (name);
+CREATE INDEX shop_squarespace_listings_name ON mock.shop_squarespace_listings (name);
+CREATE INDEX shop_square_online_listings_name ON mock.shop_square_online_listings (name);
+CREATE INDEX shop_zoho_listings_name ON mock.shop_zoho_listings (name);
+CREATE INDEX shop_ecwid_listings_name ON mock.shop_ecwid_listings (name);
+CREATE INDEX shop_big_cartel_listings_name ON mock.shop_big_cartel_listings (name);
+CREATE INDEX shop_amazon_listings_name ON mock.shop_amazon_listings (name);
+CREATE INDEX shop_walmart_marketplace_listings_name ON mock.shop_walmart_marketplace_listings (name);
+CREATE INDEX shop_ebay_listings_name ON mock.shop_ebay_listings (name);
+CREATE INDEX shop_etsy_listings_name ON mock.shop_etsy_listings (name);
+
+
+
+COMMIT;

internal/domains/accounts/mocks.go

@@ -400,6 +400,8 @@ func (db *Store) ListMockListingsForShop(ctx context.Context, acctID int64, plat
 				WHERE
 					(account_id IS NULL OR account_id = @account_id)
 					AND (shop_id IS NULL OR shop_id = @shop_id)
+				ORDER BY
+					name
 			`,
 			shopTableName,
 			listingsTableName,

styles/index.css

@@ -268,6 +268,9 @@
   .ml-\[1em\] {
     margin-left: 1em;
   }
+  .box-border {
+    box-sizing: border-box;
+  }
   .block {
     display: block;
   }
@@ -355,6 +358,9 @@
   .list-none {
     list-style-type: none;
   }
+  .grid-cols-\[1fr_1fr\] {
+    grid-template-columns: 1fr 1fr;
+  }
   .grid-cols-\[2fr_8fr_2fr\] {
     grid-template-columns: 2fr 8fr 2fr;
   }
@@ -796,6 +802,11 @@
       padding-block: calc(8vw - 0.5em);
     }
   }
+  .sm\:grid-cols-\[1fr_1fr\] {
+    @media (width >= 40rem) {
+      grid-template-columns: 1fr 1fr;
+    }
+  }
   .md\:grid-cols-\[1fr_1fr\] {
     @media (width >= 48rem) {
       grid-template-columns: 1fr 1fr;

templates/pages/accounts/{acctID.int64}/platforms/{platform}/shops/mocks/{shopID}/index.html.tmpl

@@ -16,7 +16,6 @@
 	hx-get={{ printf "/ui/accounts/%d/platforms/amazon/shops/mocks/%s" $acctID $shopID }}
 	hx-trigger={{ printf "sse:accounts_%d_platforms_amazon_shops_mocks_%s_listings" $acctID $shopID }}
 	hx-select="#listing-section"
-	hx-swap="morph"
 >
 	<header class="p-[1em]">
 		<h2 class="text-center">
@@ -216,6 +215,7 @@
 		<ul class="max-h-[50em] overflow-y-auto flex flex-col gap-[1em]">
 		{{- range $listing := .Accounts.ListMockListingsForShop $acctID $platform $shopID }}
 			<li
+				id="listing-{{$listing.ListingID}}"
 				class="
 					p-[1em]
 					grid grid-cols-[max-content_1fr] gap-x-[1em]