perf(dashboard): lazy load order details only when needed; skip fetch on non-order tabs

This commit is contained in:
root 2026-08-06 13:40:20 +00:00
parent 44d3f0f16d
commit fefb8065be
5 changed files with 17 additions and 13 deletions

View File

@ -1,8 +1,8 @@
const isLocalhost = self.location.hostname === "localhost" || self.location.hostname === "127.0.0.1";
if (!isLocalhost) {
const STATIC_CACHE = "construction-delivery-static-v97";
const RUNTIME_CACHE = "construction-delivery-runtime-v97";
const STATIC_CACHE = "construction-delivery-static-v98";
const RUNTIME_CACHE = "construction-delivery-runtime-v98";
const APP_SHELL_URLS = ["/", "/index.html", "/manifest.webmanifest", "/icons/icon-192.png", "/icons/icon-512.png"];
self.addEventListener("install", (event) => {

View File

@ -9,7 +9,7 @@ import {
} from "../services/orderGroupViews";
import { getErrorMessage } from "../utils/deliveryUtils";
export const useOrderGroups = () => {
export const useOrderGroups = ({ enabled = true, details = false } = {}) => {
const [orderGroups, setOrderGroups] = React.useState(() => []);
const FILTERS_STORAGE_KEY = "supersam_order_filters";
const [filters, setFilters] = React.useState(() => {
@ -27,7 +27,7 @@ export const useOrderGroups = () => {
} catch (e) {}
}, [filters]);
const [selectedOrderGroupId, setSelectedOrderGroupId] = React.useState(null);
const [isLoading, setIsLoading] = React.useState(true);
const [isLoading, setIsLoading] = React.useState(enabled);
const [loadError, setLoadError] = React.useState("");
const [isSavingDeliveryChoice, setIsSavingDeliveryChoice] = React.useState(false);
const [isSavingDriverAssignment, setIsSavingDriverAssignment] = React.useState(false);
@ -39,7 +39,9 @@ export const useOrderGroups = () => {
}
setLoadError("");
const groupsResult = await fetchOrderGroups();
if (!enabled) { setOrderGroups([]); setIsLoading(false); return; }
const groupsResult = await fetchOrderGroups({ details });
if (!groupsResult) {
return;
@ -54,7 +56,7 @@ export const useOrderGroups = () => {
setOrderGroups(groupsResult.data || []);
setIsLoading(false);
}, []);
}, [enabled, details]);
// Initial load
React.useEffect(() => {
@ -64,18 +66,19 @@ export const useOrderGroups = () => {
await loadLiveData(true);
if (cancelled) return;
};
doLoad();
if (enabled) doLoad(); else { setOrderGroups([]); setIsLoading(false); }
return () => { cancelled = true; };
}, [loadLiveData]);
}, [loadLiveData, enabled]);
// Refetch on window focus to keep data fresh across tabs/pages
React.useEffect(() => {
if (!enabled) return undefined;
const handleFocus = () => {
loadLiveData(false); // silent refetch, no loading spinner
};
window.addEventListener("focus", handleFocus);
return () => window.removeEventListener("focus", handleFocus);
}, [loadLiveData]);
}, [loadLiveData, enabled]);
React.useEffect(() => {
if (!orderGroups.length) {

View File

@ -102,7 +102,7 @@ export const DashboardPage = () => {
statusOptions,
isLoading,
loadError,
} = useOrderGroups();
} = useOrderGroups({ enabled: ["orders", "logistics", "deliveries"].includes(activeSection), details: false });
// Derived City List
const cities = React.useMemo(() => {

View File

@ -38,7 +38,7 @@ export const GroupDetailPage = () => {
saveShipmentData,
isLoading,
refetch,
} = useOrderGroups();
} = useOrderGroups({ details: true });
// Drivers
const [drivers, setDrivers] = React.useState([]);

View File

@ -286,6 +286,7 @@ export const mapOrderGroupRowToDeliveryGroup = (row) => {
};
const ORDER_GROUP_SELECT_FIELDS = `id, group_key, order_numbers, status, delivery_status, sms_sent_at, created_at, updated_at, created_from_exchange_at, source_key, customer_name, customer_phone, customer_phone_normalized, customer_date, orders_total, orders_ready, orders_not_ready, source_orders, order_list, order_list_structured, delivery_invitation_id, delivery_link, delivery_link_code, notification_status, sms_attempts, first_sms_sent_at, second_sms_sent_at, last_sms_error, next_notification_check_at, delivery_date, delivery_time, delivery_address, customer_address, delivery_date_source, manual_confirmation_at, paid_storage_at, assigned_driver_id, assigned_driver:users!order_groups_assigned_driver_id_fkey(id, name), driver_shipment_data, delivery_type, pickup_date, pickup_time_slot, has_delivery_problem, delivery_problem_note, pickup_code, synced_to_1c_at, manager_name, manager_email, manager_tel, payed_ship, is_payed_ship, delivery_invitation:delivery_invitations!order_groups_delivery_invitation_id_fkey(opened_at, access_count, last_accessed_at), called, called_at, called_comment, order_history(id, action, old_status, new_status, user_id, metadata, created_at)`;
const ORDER_GROUP_LIST_SELECT_FIELDS = `id, group_key, order_numbers, status, delivery_status, sms_sent_at, created_at, updated_at, created_from_exchange_at, source_key, customer_name, customer_phone, customer_phone_normalized, customer_date, orders_total, orders_ready, orders_not_ready, notification_status, first_sms_sent_at, second_sms_sent_at, delivery_date, delivery_time, delivery_address, customer_address, delivery_date_source, manual_confirmation_at, paid_storage_at, assigned_driver_id, assigned_driver:users!order_groups_assigned_driver_id_fkey(id, name), driver_shipment_data, delivery_type, pickup_date, pickup_time_slot, has_delivery_problem, delivery_problem_note, pickup_code, synced_to_1c_at, manager_name, manager_email, manager_tel, payed_ship, is_payed_ship, called, called_at, called_comment`;
export const updateOrderGroupDeliveryChoice = async ({
orderGroupId,
@ -562,12 +563,12 @@ export const updateDeliveryStatus = async ({ orderGroupId, status, details, ship
}, "Ошибка обновления статуса доставки");
};
export const fetchOrderGroups = async () => {
export const fetchOrderGroups = async ({ details = true } = {}) => {
return safeSupabaseCall(async () => {
const client = requireSupabase();
const { data, error } = await client
.from("order_groups")
.select(ORDER_GROUP_SELECT_FIELDS)
.select(details ? ORDER_GROUP_SELECT_FIELDS : ORDER_GROUP_LIST_SELECT_FIELDS)
.order("updated_at", { ascending: false });
if (error) {