feat: Ajout persistence des filtres sur page staff/payslips

This commit is contained in:
odentas 2025-12-02 14:15:58 +01:00
parent 64299cd9a5
commit ab61fb1852

View file

@ -147,20 +147,45 @@ export default function PayslipsGrid({ initialData, activeOrgId }: { initialData
// Selection state
const [selectedPayslipIds, setSelectedPayslipIds] = useState<Set<string>>(new Set());
// filters / sorting / pagination
const [q, setQ] = useState("");
const [structureFilter, setStructureFilter] = useState<string | null>(null);
const [typeFilter, setTypeFilter] = useState<string | null>(null);
const [processedFilter, setProcessedFilter] = useState<string | null>(null);
const [transferFilter, setTransferFilter] = useState<string | null>(null);
const [aemFilter, setAemFilter] = useState<string | null>(null);
const [periodFrom, setPeriodFrom] = useState<string | null>(null);
const [periodTo, setPeriodTo] = useState<string | null>(null);
const [sortField, setSortField] = useState<string>("period_start");
const [sortOrder, setSortOrder] = useState<'asc'|'desc'>('desc');
// Key for localStorage
const FILTERS_STORAGE_KEY = 'staff-payslips-filters';
// Helper functions for localStorage
const saveFiltersToStorage = (filters: any) => {
try {
localStorage.setItem(FILTERS_STORAGE_KEY, JSON.stringify(filters));
} catch (error) {
console.warn('Failed to save filters to localStorage:', error);
}
};
const loadFiltersFromStorage = () => {
try {
const saved = localStorage.getItem(FILTERS_STORAGE_KEY);
return saved ? JSON.parse(saved) : null;
} catch (error) {
console.warn('Failed to load filters from localStorage:', error);
return null;
}
};
// Load saved filters or use defaults
const savedFilters = loadFiltersFromStorage();
// filters / sorting / pagination - with localStorage persistence
const [q, setQ] = useState(savedFilters?.q || "");
const [structureFilter, setStructureFilter] = useState<string | null>(savedFilters?.structureFilter || null);
const [typeFilter, setTypeFilter] = useState<string | null>(savedFilters?.typeFilter || null);
const [processedFilter, setProcessedFilter] = useState<string | null>(savedFilters?.processedFilter || null);
const [transferFilter, setTransferFilter] = useState<string | null>(savedFilters?.transferFilter || null);
const [aemFilter, setAemFilter] = useState<string | null>(savedFilters?.aemFilter || null);
const [periodFrom, setPeriodFrom] = useState<string | null>(savedFilters?.periodFrom || null);
const [periodTo, setPeriodTo] = useState<string | null>(savedFilters?.periodTo || null);
const [sortField, setSortField] = useState<string>(savedFilters?.sortField || "period_start");
const [sortOrder, setSortOrder] = useState<'asc'|'desc'>(savedFilters?.sortOrder || 'desc');
const [page, setPage] = useState(0);
const [limit, setLimit] = useState(50);
const [showFilters, setShowFilters] = useState(false);
const [showFilters, setShowFilters] = useState(savedFilters?.showFilters || false);
const totalCountRef = useRef<number | null>(null);
// Selection helpers
@ -200,6 +225,24 @@ export default function PayslipsGrid({ initialData, activeOrgId }: { initialData
const [preselectedContractId, setPreselectedContractId] = useState<string | null>(null);
const isFirstRender = useRef(true);
// Save filters to localStorage whenever they change
useEffect(() => {
const filters = {
q,
structureFilter,
typeFilter,
processedFilter,
transferFilter,
aemFilter,
periodFrom,
periodTo,
sortField,
sortOrder,
showFilters
};
saveFiltersToStorage(filters);
}, [q, structureFilter, typeFilter, processedFilter, transferFilter, aemFilter, periodFrom, periodTo, sortField, sortOrder, showFilters]);
// Fetch initial au montage du composant
useEffect(() => {
fetchServer(0);