fix(frontend): avoid full reload on search input
This commit is contained in:
parent
7c524cda62
commit
48e44d022f
@ -1,6 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import { useCallback, useDeferredValue, useEffect, useMemo, useState } from "react";
|
||||
import { useCallback, useDeferredValue, useEffect, useMemo, useRef, useState } from "react";
|
||||
import { apiClient } from "@/lib/api";
|
||||
import { canManageEquipment, canManageEquipmentCategories } from "@/lib/permissions";
|
||||
import { displayUserName as sharedDisplayUserName, extractNextPage, formatDate, formatMoney, loadAllPages } from "@/lib/shared";
|
||||
@ -154,6 +154,7 @@ export function useEquipmentPage(user: User | null) {
|
||||
const [actionSuccess, setActionSuccess] = useState<string | null>(null);
|
||||
const [busyKey, setBusyKey] = useState<string | null>(null);
|
||||
const [nextPage, setNextPage] = useState<number | null>(null);
|
||||
const hasLoadedOnceRef = useRef(false);
|
||||
|
||||
const isCreateMode = createOpen && editingId === null;
|
||||
|
||||
@ -407,7 +408,9 @@ export function useEquipmentPage(user: User | null) {
|
||||
|
||||
void (async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
if (!hasLoadedOnceRef.current) {
|
||||
setLoading(true);
|
||||
}
|
||||
setError(null);
|
||||
const response = await fetchEquipmentPage(1);
|
||||
if (cancelled) return;
|
||||
@ -420,6 +423,7 @@ export function useEquipmentPage(user: User | null) {
|
||||
} finally {
|
||||
if (!cancelled) {
|
||||
setLoading(false);
|
||||
hasLoadedOnceRef.current = true;
|
||||
}
|
||||
}
|
||||
})();
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
||||
import { useCallback, useDeferredValue, useEffect, useMemo, useRef, useState } from "react";
|
||||
import { apiClient } from "@/lib/api";
|
||||
import { canManageRequests, canManageSupplier } from "@/lib/permissions";
|
||||
import { displayUserName, extractNextPage, loadAllPages } from "@/lib/shared";
|
||||
@ -143,6 +143,7 @@ export function useProcurementPage(user: User | null) {
|
||||
|
||||
const [scope, setScope] = useState<ScopeTab>("all");
|
||||
const [searchQuery, setSearchQuery] = useState("");
|
||||
const deferredSearchQuery = useDeferredValue(searchQuery);
|
||||
const [statusFilter, setStatusFilter] = useState("");
|
||||
const [urgencyFilter, setUrgencyFilter] = useState("");
|
||||
const [departmentFilter, setDepartmentFilter] = useState("");
|
||||
@ -161,6 +162,7 @@ export function useProcurementPage(user: User | null) {
|
||||
const [commentDrafts, setCommentDrafts] = useState<Record<number, string>>({});
|
||||
const [detailsCache, setDetailsCache] = useState<Record<number, ProcurementRequest>>({});
|
||||
const detailsCacheRef = useRef<Record<number, ProcurementRequest>>({});
|
||||
const hasLoadedOnceRef = useRef(false);
|
||||
|
||||
useEffect(() => {
|
||||
detailsCacheRef.current = detailsCache;
|
||||
@ -213,10 +215,10 @@ export function useProcurementPage(user: User | null) {
|
||||
if (urgencyFilter) params.urgency = urgencyFilter;
|
||||
if (departmentFilter) params.department = departmentFilter;
|
||||
if (periodFilter) params.period = periodFilter;
|
||||
if (searchQuery.trim()) params.search = searchQuery.trim();
|
||||
if (deferredSearchQuery.trim()) params.search = deferredSearchQuery.trim();
|
||||
return params;
|
||||
},
|
||||
[departmentFilter, periodFilter, scope, searchQuery, statusFilter, urgencyFilter],
|
||||
[deferredSearchQuery, departmentFilter, periodFilter, scope, statusFilter, urgencyFilter],
|
||||
);
|
||||
|
||||
const buildScopeCountParams = useCallback(
|
||||
@ -230,15 +232,17 @@ export function useProcurementPage(user: User | null) {
|
||||
if (urgencyFilter) params.urgency = urgencyFilter;
|
||||
if (departmentFilter) params.department = departmentFilter;
|
||||
if (periodFilter) params.period = periodFilter;
|
||||
if (searchQuery.trim()) params.search = searchQuery.trim();
|
||||
if (deferredSearchQuery.trim()) params.search = deferredSearchQuery.trim();
|
||||
return params;
|
||||
},
|
||||
[departmentFilter, periodFilter, searchQuery, statusFilter, urgencyFilter],
|
||||
[deferredSearchQuery, departmentFilter, periodFilter, statusFilter, urgencyFilter],
|
||||
);
|
||||
|
||||
const loadPage1 = useCallback(async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
if (!hasLoadedOnceRef.current) {
|
||||
setLoading(true);
|
||||
}
|
||||
setError(null);
|
||||
|
||||
const response: unknown = scope === "pending_approvals"
|
||||
@ -252,6 +256,7 @@ export function useProcurementPage(user: User | null) {
|
||||
setError("Не удалось загрузить заявки на закупку");
|
||||
} finally {
|
||||
setLoading(false);
|
||||
hasLoadedOnceRef.current = true;
|
||||
}
|
||||
}, [buildParams, scope]);
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user