packages/components/hooks/useSortedList.test.ts

   1 import { act, renderHook } from '@testing-library/react-hooks';
   2
   3 import { SORT_DIRECTION } from '@proton/shared/lib/constants';
   4
   5 import useSortedList from './useSortedList';
   6
   7 describe('useSortedList hook', () => {
   8     it('should return sorted list initially if config is provided', () => {
   9         const list = [{ t: 2 }, { t: 3 }, { t: 1 }];
  10         const { result } = renderHook(() => useSortedList(list, { key: 't', direction: SORT_DIRECTION.DESC }));
  11         expect(result.current.sortedList).toEqual([{ t: 3 }, { t: 2 }, { t: 1 }]);
  12         expect(result.current.sortConfig).toEqual({ key: 't', direction: SORT_DIRECTION.DESC });
  13     });
  14
  15     it('should not sort initially if no config is provided', () => {
  16         const list = [{ t: 2 }, { t: 3 }, { t: 1 }];
  17         const { result } = renderHook(() => useSortedList(list));
  18         expect(result.current.sortedList).toEqual(list);
  19         expect(result.current.sortConfig).toBeUndefined();
  20     });
  21
  22     it('should set initialize sorting config on sort when none was provided', () => {
  23         const list = [{ t: 2 }, { t: 3 }, { t: 1 }];
  24         const { result } = renderHook(() => useSortedList(list));
  25         act(() => result.current.toggleSort('t'));
  26         expect(result.current.sortedList).toEqual([{ t: 1 }, { t: 2 }, { t: 3 }]);
  27         expect(result.current.sortConfig).toEqual({ key: 't', direction: SORT_DIRECTION.ASC });
  28     });
  29
  30     it('should toggle sort direction for the same key', () => {
  31         const list = [{ t: 2 }, { t: 3 }, { t: 1 }];
  32         const { result } = renderHook(() => useSortedList(list, { key: 't', direction: SORT_DIRECTION.ASC }));
  33         expect(result.current.sortedList).toEqual([{ t: 1 }, { t: 2 }, { t: 3 }]);
  34         expect(result.current.sortConfig).toEqual({ key: 't', direction: SORT_DIRECTION.ASC });
  35
  36         act(() => result.current.toggleSort('t'));
  37
  38         expect(result.current.sortedList).toEqual([{ t: 3 }, { t: 2 }, { t: 1 }]);
  39         expect(result.current.sortConfig).toEqual({ key: 't', direction: SORT_DIRECTION.DESC });
  40     });
  41
  42     it('should change sort key and set direction to ascending for another key', () => {
  43         const list = [
  44             { t: 2, k: 'c' },
  45             { t: 3, k: 'b' },
  46             { t: 1, k: 'a' },
  47         ];
  48         const { result } = renderHook(() => useSortedList(list, { key: 't', direction: SORT_DIRECTION.ASC }));
  49         expect(result.current.sortedList).toEqual([
  50             { t: 1, k: 'a' },
  51             { t: 2, k: 'c' },
  52             { t: 3, k: 'b' },
  53         ]);
  54         expect(result.current.sortConfig).toEqual({ key: 't', direction: SORT_DIRECTION.ASC });
  55
  56         act(() => result.current.toggleSort('k'));
  57
  58         expect(result.current.sortedList).toEqual([
  59             { t: 1, k: 'a' },
  60             { t: 3, k: 'b' },
  61             { t: 2, k: 'c' },
  62         ]);
  63         expect(result.current.sortConfig).toEqual({ key: 'k', direction: SORT_DIRECTION.ASC });
  64     });
  65 });