add inventory sort control to the ui

Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent)

Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>

trade-hub/frontend/src/app.js

@@ -17,7 +17,7 @@ const state = {
   totalPages: 1,
   view: "catalog",
   user: null,
-  inventory: { search: "", category: "" },
+  inventory: { search: "", category: "", sort: "name" },
 };
 
 let authMode = "login";
@@ -32,7 +32,7 @@ function cacheElements() {
     "error-banner", "loading", "empty-state", "results-grid",
     "pagination", "prev-page", "next-page", "page-info",
     "modal-backdrop", "modal-close", "modal-title", "modal-body",
-    "catalog-view", "inventory-view", "inv-search", "inv-category",
+    "catalog-view", "inventory-view", "inv-search", "inv-category", "inv-sort",
     "inv-summary", "inv-empty", "inv-table-wrap", "inv-tbody", "tab-mine",
     "auth-backdrop", "auth-close", "auth-title", "auth-form",
     "auth-username", "auth-password", "auth-error", "auth-submit",
@@ -394,8 +394,10 @@ function showCatalogView() {
 function resetInventoryView() {
   state.inventory.search = "";
   state.inventory.category = "";
+  state.inventory.sort = "name";
   els["inv-search"].value = "";
   els["inv-category"].value = "";
+  els["inv-sort"].value = "name";
   els["inv-summary"].textContent = "";
   renderInventory({ total: 0, items: [] });
 }
@@ -404,6 +406,7 @@ async function loadInventory() {
   const params = new URLSearchParams();
   if (state.inventory.search) params.set("search", state.inventory.search);
   if (state.inventory.category) params.set("category", state.inventory.category);
+  params.set("sort", state.inventory.sort);
   params.set("page", "1");
   params.set("page_size", String(INVENTORY_PAGE_SIZE));
 
@@ -674,6 +677,10 @@ function bindInventoryEvents() {
     state.inventory.category = els["inv-category"].value;
     loadInventory();
   });
+  els["inv-sort"].addEventListener("change", () => {
+    state.inventory.sort = els["inv-sort"].value;
+    loadInventory();
+  });
 }
 
 /* ---------- boot ---------- */

trade-hub/frontend/src/index.html

@@ -68,6 +68,12 @@
         <option value="ship-items">Ship Equipment</option>
         <option value="fps-items">FPS Items</option>
       </select>
+      <select id="inv-sort" aria-label="Sort inventory">
+        <option value="name">Sort: Name</option>
+        <option value="category">Sort: Category</option>
+        <option value="quantity">Sort: Quantity</option>
+        <option value="updated">Sort: Recently updated</option>
+      </select>
     </div>
     <div id="inv-summary" class="inv-summary"></div>
     <div id="inv-empty" class="empty-state hidden">

trade-hub/frontend/src/style.css

@@ -347,6 +347,7 @@ main {
 }
 #inv-search { flex: 2 1 280px; }
 #inv-category { flex: 1 1 180px; }
+#inv-sort { flex: 1 1 170px; }
 .inventory-controls input:focus,
 .inventory-controls select:focus { outline: none; border-color: var(--accent); }
 #inventory-view {