updateson the create ordera nd testfile as done

src/pages/doormile/orders/CreateOrder.jsx

@@ -192,18 +192,47 @@ export default function CreateOrder() {
   const [searchCustQuery, setSearchCustQuery] = useState('');
 
   // Local persistent saved contacts for new/recent customers
-  const [savedContacts, setSavedContacts] = useState(() => {
+  const readSavedContacts = () => {
     try {
       const data = localStorage.getItem('doormile_saved_contacts');
       return data ? JSON.parse(data) : [];
     } catch {
       return [];
     }
-  });
+  };
+  const [savedContacts, setSavedContacts] = useState(readSavedContacts);
+
+  // Re-read the browser copy when it changes elsewhere. It used to be read
+  // once, on mount: a contact saved in another tab never appeared in a Create
+  // Order tab that was already open (clicking "Create order" again doesn't
+  // remount it). `storage` fires for other tabs, the custom event for this
+  // one, and focus covers anything missed while the tab was in the background.
+  useEffect(() => {
+    const refresh = () => setSavedContacts(readSavedContacts());
+    const onStorage = (e) => {
+      if (!e.key || e.key === 'doormile_saved_contacts') refresh();
+    };
+    window.addEventListener('storage', onStorage);
+    window.addEventListener('doormile_saved_contacts_updated', refresh);
+    window.addEventListener('focus', refresh);
+    return () => {
+      window.removeEventListener('storage', onStorage);
+      window.removeEventListener('doormile_saved_contacts_updated', refresh);
+      window.removeEventListener('focus', refresh);
+    };
+  }, []);
 
   const [saveForLater, setSaveForLater] = useState(true);
   const [isSavedNow, setIsSavedNow] = useState(false);
 
+  // "Saved" describes the contact currently in the form. Editing the name,
+  // phone or address makes it a different contact, so the button goes back to
+  // "Save Contact" — it used to stay "Saved" and suggest the new details were
+  // already stored when they weren't.
+  useEffect(() => {
+    setIsSavedNow(false);
+  }, [dropCust.firstname, dropCust.contactno, dropCust.address]);
+
   // Map pin picker modal target ('pickup' | 'drop' | null)
   const [mapPickerTarget, setMapPickerTarget] = useState(null);
 
@@ -246,14 +275,34 @@ export default function CreateOrder() {
     [hubList, tenantLocations]
   );
 
-  const { data: customerList = [], isLoading: isCustomersLoading } = useQuery({
+  const { data: customerList = [], isLoading: isAdminCustomersLoading } = useQuery({
     queryKey: ['adminCustomers'],
     queryFn: getAdminCustomers
   });
 
+  // The store "save for later" writes to (POST /admin/tenantcustomers) and the
+  // Customers page reads. The picker used to read only /admin/customers — the
+  // customer-app accounts — so a contact saved on the server never showed up
+  // here; only this browser's local copy did, which another browser, profile
+  // or incognito window can't see. Same query key as the Customers page, so
+  // the two share one cached list.
+  const { data: tenantCustomerList = [], isLoading: isTenantCustomersLoading } = useQuery({
+    queryKey: ['doormile', 'tenant-customers'],
+    queryFn: getTenantCustomers,
+    staleTime: 60_000
+  });
+  const isCustomersLoading = isAdminCustomersLoading || isTenantCustomersLoading;
+
   // Combined customers: Merge server customers with locally saved/recent customer contacts
   const allCustomers = useMemo(() => {
-    const list = [...(customerList || [])];
+    // Tenant customers carry firstname/lastname; the picker renders `name`.
+    const savedOnServer = (tenantCustomerList || []).map((c) => ({
+      ...c,
+      name: c.name || [c.firstname, c.lastname].filter(Boolean).join(' ') || undefined,
+      phone: c.phone || c.contactno,
+      isSavedForLater: true
+    }));
+    const list = [...savedOnServer, ...(customerList || [])];
     const seenPhones = new Set();
     const result = [];
 
@@ -276,7 +325,7 @@ export default function CreateOrder() {
       result.push(c);
     }
     return result;
-  }, [customerList, savedContacts]);
+  }, [customerList, tenantCustomerList, savedContacts]);
 
   const matchedCustomer = useMemo(() => {
     const cleanPhone = String(dropCust.contactno || '').replace(/\D/g, '');
@@ -1818,7 +1867,7 @@ export default function CreateOrder() {
                   const hasPin = Boolean(cust.latitude && cust.longitude);
                   return (
                     <div
-                      key={cust.appcustomerid || cust.id || cust.phone || Math.random()}
+                      key={cust.appcustomerid || cust.tenantcustomerid || cust.id || cust.phone || Math.random()}
                       className="p-3 hover:bg-slate-50 rounded-lg flex items-center justify-between gap-3 transition-colors"
                     >
                       <div className="min-w-0 flex-1">