@matthew.ngo/react-filter-pilot
Version:
Powerful filtering, pagination, and sorting for React with TanStack Query integration
3 lines • 5.47 kB
JavaScript
import {a}from'../chunk-KDVV4H2M.js';import {useInfiniteQuery}from'@tanstack/react-query';import {useMemo,useState,useRef,useEffect,useCallback}from'react';import {getDefaultFilters,parseUrlParams,mergeFilters,buildUrlParams,transformFilterValue,isFilterActive}from'../utils';import {useDefaultUrlHandler}from'./useUrlHandler';/* @matthew.ngo/react-filter-pilot - MIT License */
function Pe(q){const{filterConfigs:a$1,sortConfig:F={},fetchConfig:s,urlHandler:W,initialFiltersProvider:N,enablePresets:p=false}=q,A=useDefaultUrlHandler(),T=W||A,g=useMemo(()=>getDefaultFilters(a$1),[a$1]),M=F.initialSortField?{field:F.initialSortField,direction:F.initialSortDirection||"asc"}:void 0,[d,S]=useState(g),[u,v]=useState(M),[b,D]=useState([]),o=useRef(d),U=useRef({}),[x,f]=useState(0);useEffect(()=>{a(async()=>{const t=T.getParams(),r=parseUrlParams(t,a$1);let n=g;if(N)try{const l=await N();n=mergeFilters(l,g);}catch{}const m=mergeFilters(r,n);if(S(m),o.current=m,F.syncWithUrl!==false){const l=t.get("sortBy"),E=t.get("sortOrder");l&&v({field:l,direction:E||"asc"});}},"initializeFromUrl")();},[]),useEffect(()=>{if(x===0)return;const e=T.getParams(),t=buildUrlParams(o.current,a$1);a$1.forEach(r=>{if(r.syncWithUrl!==false){const n=r.urlKey||r.name;e.delete(n);}}),t.forEach((r,n)=>{a$1.find(l=>l.urlKey===n||l.name===n)?.syncWithUrl!==false&&e.set(n,r);}),F.syncWithUrl!==false&&u?(e.set("sortBy",u.field),e.set("sortOrder",u.direction)):F.syncWithUrl!==false&&(e.delete("sortBy"),e.delete("sortOrder")),T.setParams(e);},[x,u,a$1,F.syncWithUrl,T]);const C=useMemo(()=>[s.queryKey||"filterPilotInfinite","filters",o.current,"sort",u],[o.current,u,s.queryKey,x]),V=useCallback(async({pageParam:e})=>{const t={filters:o.current,pagination:{page:1,pageSize:20},sort:u,cursor:e},r={...t};return r.filters={},Object.entries(t.filters).forEach(([n,m])=>{const l=a$1.find(X=>X.name===n),E=transformFilterValue(m,l?.transformForApi);r.filters[n]=E;}),s.fetchFn(r)},[u,a$1,s.fetchFn,o.current]),i=useInfiniteQuery({queryKey:C,queryFn:V,enabled:s.enabled!==false,staleTime:s.staleTime,gcTime:s.gcTime||s.cacheTime,refetchOnWindowFocus:s.refetchOnWindowFocus,refetchInterval:s.refetchInterval,refetchIntervalInBackground:s.refetchIntervalInBackground,getNextPageParam:s.getNextPageParam||(e=>e.nextCursor),getPreviousPageParam:s.getPreviousPageParam||(e=>e.previousCursor),initialPageParam:s.initialPageParam??null,maxPages:s.maxPages,select:s.select?e=>({...e,pages:e.pages.map(t=>s.select(t))}):void 0,retry:s.retry,retryDelay:s.retryDelay,networkMode:s.networkMode,meta:s.meta});useEffect(()=>{i.isSuccess&&i.data&&s.onSuccess?.(i.data.pages[i.data.pages.length-1]);},[i.isSuccess,i.data,s.onSuccess]),useEffect(()=>{i.isError&&i.error&&s.onError?.(i.error);},[i.isError,i.error,s.onError]);const R=useCallback((e,t)=>{const r=a$1.find(n=>n.name===String(e));S(n=>({...n,[e]:t})),r?.debounceMs?(U.current[String(e)]&&clearTimeout(U.current[String(e)]),U.current[String(e)]=setTimeout(()=>{o.current={...o.current,[e]:t},f(n=>n+1);},r.debounceMs)):(o.current={...o.current,[e]:t},f(n=>n+1));},[a$1]),O=useCallback(e=>{S(t=>({...t,...e})),o.current={...o.current,...e},f(t=>t+1);},[]),_=useCallback(()=>{S(g),o.current=g,f(e=>e+1);},[g]),B=useCallback(e=>{const t=g[e];R(e,t);},[g,R]),H=useCallback((e,t="asc")=>{v({field:e,direction:t}),f(r=>r+1);},[]),L=useCallback(e=>{v(t=>{if(!t||t.field!==e)return f(r=>r+1),{field:e,direction:"asc"};if(t.direction==="asc")return f(r=>r+1),{field:e,direction:"desc"};f(r=>r+1);});},[]),J=useCallback(()=>{v(void 0),f(e=>e+1);},[]),j=useCallback(()=>Object.entries(d).some(([e,t])=>{const r=a$1.find(n=>n.name===e);return isFilterActive(t,r?.defaultValue)}),[d,a$1]),z=useCallback(()=>Object.entries(d).reduce((e,[t,r])=>{const n=a$1.find(m=>m.name===t);return isFilterActive(r,n?.defaultValue)?e+1:e},0),[d,a$1]),Q=useMemo(()=>{if(p)return {savePreset:a(e=>{const t={id:Date.now().toString(),name:e,filters:d,createdAt:new Date};D(r=>[...r,t]);try{const r=`filterPilot_presets_${s.queryKey||"defaultInfinite"}`;localStorage.setItem(r,JSON.stringify([...b,t]));}catch{}},"savePreset"),loadPreset:a(e=>{O(e.filters);},"loadPreset"),deletePreset:a(e=>{const t=b.filter(r=>r.id!==e);D(t);try{const r=`filterPilot_presets_${s.queryKey||"defaultInfinite"}`;localStorage.setItem(r,JSON.stringify(t));}catch{}},"deletePreset"),getPresets:a(()=>b,"getPresets")}},[p,d,b,O,s.queryKey]);useEffect(()=>{if(p)try{const e=`filterPilot_presets_${s.queryKey||"defaultInfinite"}`,t=localStorage.getItem(e);t&&D(JSON.parse(t));}catch{}},[p,s.queryKey]);const $=useMemo(()=>i.data?.pages.flatMap(e=>e.data)||[],[i.data]),G=useMemo(()=>i.data?.pages[i.data.pages.length-1]?.totalRecords||0,[i.data]);return {filters:d,setFilterValue:R,setFilters:O,resetFilters:_,resetFilter:B,sort:u,setSort:H,toggleSort:L,clearSort:J,data:$,isLoading:i.isLoading,isError:i.isError,error:i.error,isFetching:i.isFetching,isFetchingNextPage:i.isFetchingNextPage,isFetchingPreviousPage:i.isFetchingPreviousPage,hasNextPage:i.hasNextPage??false,hasPreviousPage:i.hasPreviousPage??false,fetchNextPage:i.fetchNextPage,fetchPreviousPage:i.fetchPreviousPage,refetch:i.refetch,totalRecords:G,pageParams:i.data?.pageParams||[],hasActiveFilters:j,getActiveFiltersCount:z,getQueryKey:a(()=>C,"getQueryKey"),presets:Q}}a(Pe,"useFilterPilotInfinite");export{Pe as useFilterPilotInfinite};//# sourceMappingURL=useFilterPilotInfinite.js.map
//# sourceMappingURL=useFilterPilotInfinite.js.map