feat: persist collapsed sections in localStorage

- Collapsed/expanded state survives page refresh
- Key: logistics-section-collapsed
- Each toggle saves to localStorage immediately
This commit is contained in:
root 2026-06-30 13:12:50 +00:00
parent 70ec6ec7a8
commit 55d42bfdc8
1 changed files with 23 additions and 1 deletions

View File

@ -52,6 +52,7 @@ const DEFAULT_FUNNEL_ORDER = [
]; ];
const STORAGE_KEY = "logistics-section-order"; const STORAGE_KEY = "logistics-section-order";
const COLLAPSED_KEY = "logistics-section-collapsed";
// Load custom order from localStorage, merge with defaults // Load custom order from localStorage, merge with defaults
const loadCustomOrder = () => { const loadCustomOrder = () => {
@ -73,6 +74,26 @@ const saveCustomOrder = (order) => {
} }
}; };
// Load collapsed sections from localStorage
const loadCollapsedSections = () => {
try {
const raw = localStorage.getItem(COLLAPSED_KEY);
if (!raw) return new Set();
const parsed = JSON.parse(raw);
return new Set(Array.isArray(parsed) ? parsed : []);
} catch {
return new Set();
}
};
const saveCollapsedSections = (collapsedSet) => {
try {
localStorage.setItem(COLLAPSED_KEY, JSON.stringify([...collapsedSet]));
} catch {
// ignore
}
};
// 7 columns: Клиент | Город | Тип | Дата | Водитель | Статус | Обновлён // 7 columns: Клиент | Город | Тип | Дата | Водитель | Статус | Обновлён
const COLS = "grid-cols-[minmax(130px,2fr)_minmax(90px,1fr)_minmax(100px,0.8fr)_minmax(100px,1fr)_minmax(90px,1fr)_minmax(100px,1fr)_minmax(90px,0.8fr)]"; const COLS = "grid-cols-[minmax(130px,2fr)_minmax(90px,1fr)_minmax(100px,0.8fr)_minmax(100px,1fr)_minmax(90px,1fr)_minmax(100px,1fr)_minmax(90px,0.8fr)]";
const MIN_W = "min-w-[1080px]"; const MIN_W = "min-w-[1080px]";
@ -212,7 +233,7 @@ const SortableSection = ({ statusValue, label, groups, isCollapsed, onToggle, on
export const LogisticsReadinessBoard = ({ orderGroups = [], onSelectSet, statusOptions = ORDER_GROUP_DISPLAY_STATUS_OPTIONS, isLoading = false }) => { export const LogisticsReadinessBoard = ({ orderGroups = [], onSelectSet, statusOptions = ORDER_GROUP_DISPLAY_STATUS_OPTIONS, isLoading = false }) => {
const [filters, setFilters] = React.useState({ query: "", displayStatus: "all", city: "" }); const [filters, setFilters] = React.useState({ query: "", displayStatus: "all", city: "" });
const [collapsedSections, setCollapsedSections] = React.useState(new Set()); const [collapsedSections, setCollapsedSections] = React.useState(() => loadCollapsedSections());
const [sectionOrder, setSectionOrder] = React.useState(() => { const [sectionOrder, setSectionOrder] = React.useState(() => {
const custom = loadCustomOrder(); const custom = loadCustomOrder();
return custom || [...DEFAULT_FUNNEL_ORDER]; return custom || [...DEFAULT_FUNNEL_ORDER];
@ -351,6 +372,7 @@ export const LogisticsReadinessBoard = ({ orderGroups = [], onSelectSet, statusO
} else { } else {
next.add(statusValue); next.add(statusValue);
} }
saveCollapsedSections(next);
return next; return next;
}); });
}} }}