feat(ui): list parity — row tinting, received-orders status filter, more sortable cols, search-aware empties, skeleton suppression

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

src/admin/pages/Offers.tsx

@@ -240,6 +240,9 @@ export default function Offers() {
   const [page, setPage] = useState(1);
   const [statusFilter, setStatusFilter] = useState("");
   const [customerFilter, setCustomerFilter] = useState<number | "">("");
+  // Track first successful load so later refetches (filter/customer/tab/page
+  // change) keep the table visible instead of flashing the full skeleton.
+  const hasLoadedOnce = useRef(false);
 
   const { data: customers } = useQuery(offerCustomersOptions());
 
@@ -303,6 +306,12 @@ export default function Offers() {
     }),
   );
 
+  // Mark first load done in an effect (not during render) to avoid a
+  // render-phase ref mutation.
+  useEffect(() => {
+    if (!isPending) hasLoadedOnce.current = true;
+  }, [isPending]);
+
   const duplicateMutation = useApiMutation<
     number,
     { message?: string; error?: string }
@@ -456,7 +465,10 @@ export default function Offers() {
     }
   };
 
-  if (isPending) {
+  // Only show the full-page skeleton on the very first load; on subsequent
+  // refetches (filter/customer/tab/page change) keep the table visible (the
+  // Card dims via isFetching) so it doesn't flash.
+  if (isPending && !hasLoadedOnce.current) {
     return <LoadingState />;
   }