📦 EqualifyEverything / equalify-v2-dashboard-mocks

📄 test.tsx · 50 lines
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50import { createFileRoute } from '@tanstack/react-router'
import CheckboxTable from '../../components/CheckboxTable'
import { fetchAllAudits } from '../../api/api'
import { keepPreviousData, useQuery } from '@tanstack/react-query';
import { useState } from 'react';

export const Route = createFileRoute('/audits/test')({
  component: RouteComponent,
})

function RouteComponent() {

  const { 
    data: audits = [],
    isLoading, 
    isFetching, 
    isError, 
    refetch 
  } = useQuery({
    queryKey: ['audits'],
    queryFn: () => fetchAllAudits(),
    placeholderData: keepPreviousData,
    staleTime: 30000,
  });

  const [checkedBoxes, setCheckedBoxes] = useState(new Set())


  return (
    <>
      <CheckboxTable 
        itemName={ 'schnarf' } 
        columns={[
          { key: 'name', label: 'Name' },
          { key: 'pages', label: 'Pages' },
          { key: 'checks', label: 'Checks' },
          { key: 'progress', label: 'Progress' },
          { key: 'status', label: 'Status' },
          { key: 'created', label: 'Created' },
          { key: 'lastRun', label: 'Last Run' },
        ]} 
        data={ audits } 
        onCheckedBoxesChange={ setCheckedBoxes } 
        expanded={ true } 
      />
      <div>Items selected: { checkedBoxes.size }</div>
    </>
  )
}