react-router-dom-filters

Type-safe filters

Create type-safe hooks for filtering data with React Router.

Installation

pnpm add react-router-dom-filters

npm install --save react-router-dom-filters

yarn add react-router-dom-filters

Usage

import { createFiltersHook } from 'react-router-dom-filters';

const filterKeys = ['instances', 'categories', 'sortBy'] as const;
export const useFilters = createFiltersHook(filterKeys);

const App = () => {
  const { activeFilters, updateFilters } = useFilters();

  const handleClick = () => {
    // ✨ Type-safe filter keys
    updateFilters({
      key: 'instances',
    //         👆 Type-safe filter keys ✨
      value: 'all',
    });
  }
  
  return (
    <div>
      <button onClick={handleClick}>Update</button>
    </div>
  );
};