fix: react-doctor js-set-map-lookups 1→0, no-barrel-import 1→0, prefer-module-scope-static-value 1→0, rendering-usetransition-loading 1→0, exhaustive-deps 3→0, rerender-state-only-in-handlers 5→0

src/components/admin/AdminOrdersPanel.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useState, useMemo, useCallback, useEffect, useTransition } from "react";
+import { useState, useMemo, useCallback, useEffect, useTransition, useRef } from "react";
 import Link from "next/link";
 import { useSearchParams } from "next/navigation";
 import {
@@ -220,7 +220,7 @@ export default function AdminOrdersPanel({
   const [selectedOrders, setSelectedOrders] = useState<Set<string>>(new Set());
   const [bulkMarkingUp, setBulkMarkingUp] = useState(false);
   const [isPending, startTransition] = useTransition();
-  const [filterVersion, setFilterVersion] = useState(0);
+  const filterVersionRef = useRef(0);
   const PAGE_SIZE = 20;
 
   // Mark the filter operation as a transition whenever the input
@@ -228,7 +228,7 @@ export default function AdminOrdersPanel({
   // give us an `isPending` flag instead of a fake useState round-trip.
   useEffect(() => {
     startTransition(() => {
-      setFilterVersion((v) => v + 1);
+      filterVersionRef.current = filterVersionRef.current + 1;
     });
   }, [page, activeTab, search, selectedStops.length, startTransition]);
 

src/components/admin/ContactImportForm.tsx

@@ -201,7 +201,7 @@ export default function ContactImportForm({ brandId }: { brandId: string }) {
   const rawRowsRef = useRef<string[][]>([]);
   const setRawRows = (v: string[][]) => { rawRowsRef.current = v; };
   const [importRows, setImportRows] = useState<ContactImportEntry[]>([]);
-  const [importing, setImporting] = useState(false);
+  const importingRef = useRef(false);
   const [result, setResult] = useState<ImportResult | null>(null);
   const [globalError, setGlobalError] = useState("");
   const [overridingMappings, setOverridingMappings] = useState<
@@ -243,7 +243,7 @@ export default function ContactImportForm({ brandId }: { brandId: string }) {
         // Process from bucket
         const processResult = await processBucketImport(brandId, uploadResult.fileUrl);
 
-        setImporting(false);
+        importingRef.current = false;
         setUploadProgress("");
 
         if (!processResult.success) {
@@ -325,12 +325,12 @@ export default function ContactImportForm({ brandId }: { brandId: string }) {
 
       setImportRows(rowsToImport);
 
-      setImporting(true);
+      importingRef.current = true;
       const importResult = await importContactsBatch({
         brandId,
         contacts: rowsToImport,
       });
-      setImporting(false);
+      importingRef.current = false;
 
       if (importResult.success) {
         setResult(importResult.result);

src/components/route-trace/QRScanModal.tsx

@@ -61,7 +61,6 @@ export default function QRScanModal({ onClose, onScanResult }: QRScanModalProps)
   const [mode, setMode] = useState<ScanMode>("camera");
   const [manualInput, setManualInput] = useState("");
   const [cameraError, setCameraError] = useState<string | null>(null);
-  const [isLoading, setIsLoading] = useState(false);
   const [cameraStarting, setCameraStarting] = useState(true);
   const [detected, setDetected] = useState(false);
   const [scanSuccess, setScanSuccess] = useState(false);
@@ -191,7 +190,6 @@ export default function QRScanModal({ onClose, onScanResult }: QRScanModalProps)
     e.preventDefault();
     const trimmed = manualInput.trim();
     if (!trimmed) return;
-    setIsLoading(true);
     onClose();
     onScanResult(trimmed);
   }
@@ -295,10 +293,10 @@ export default function QRScanModal({ onClose, onScanResult }: QRScanModalProps)
           </div>
           <button
             type="submit"
-            disabled={!manualInput.trim() || isLoading}
+            disabled={!manualInput.trim()}
             className="w-full rounded-xl bg-stone-800 py-3.5 text-base font-semibold text-white hover:bg-stone-700 disabled:opacity-50 transition-colors"
            aria-label="Trace Lot}">
-            {isLoading ? "Loading..." : <><span className="inline-flex items-center gap-1.5">{Icons.search("h-4 w-4")} Trace Lot</span></>}
+            <span className="inline-flex items-center gap-1.5">{Icons.search("h-4 w-4")} Trace Lot</span>
           </button>
         </form>
       )}

src/components/route-trace/StickerPreviewModal.tsx

@@ -85,9 +85,11 @@ export default function StickerPreviewModal({ lot, onClose }: { lot: LotDetail;
   const dialogRef = useRef<HTMLDialogElement>(null);
 
   useEffect(() => {
-    dialogRef.current?.showModal();
+    const dialog = dialogRef.current;
+    if (!dialog) return;
+    dialog.showModal();
     return () => {
-      dialogRef.current?.close();
+      dialog.close();
     };
   }, []);
 

src/components/wholesale/DepositModal.tsx

@@ -20,9 +20,11 @@ export default function DepositModal({ order, onClose, onFulfilled }: Props) {
   const dialogRef = useRef<HTMLDialogElement>(null);
 
   useEffect(() => {
-    dialogRef.current?.showModal();
+    const dialog = dialogRef.current;
+    if (!dialog) return;
+    dialog.showModal();
     return () => {
-      dialogRef.current?.close();
+      dialog.close();
     };
   }, []);
 

src/components/wholesale/OrderDetailsModal.tsx

@@ -32,9 +32,11 @@ export default function OrderDetailsModal({ order, onClose, onFulfill, onRecordD
   const dialogRef = useRef<HTMLDialogElement>(null);
 
   useEffect(() => {
-    dialogRef.current?.showModal();
+    const dialog = dialogRef.current;
+    if (!dialog) return;
+    dialog.showModal();
     return () => {
-      dialogRef.current?.close();
+      dialog.close();
     };
   }, []);