import * as React from 'react' ; import { useQuery } from 'react-query' ; import { subHours } from 'date-fns' ; import { getTickets , CompanyTicketRes } from '../api' ; async function fetchLastTickets ( { queryKey } ) { const [ _key , companyId ] = queryKey ; const to = new Date ( ) ; const from = new Date ( subHours ( to , 24 ) ) ; return await getTickets ( { companyId , from , to } ) ; } export function useLastTickets ( companyId ? ) { return useQuery ( companyId && [ 'tickets' , companyId ] , fetchLastTickets , { refetchInterval : 10000 , } ) ; } type GroupedTickets = { [ key ] : { open : CompanyTicketRes [ ] ; closed : CompanyTicketRes [ ] ; } ; } ; export function useLastTicketsGrouped ( companyId ? ) { const { data , ... rest } = useLastTickets ( companyId ) ; const groupedData = React . useMemo ( ( ) => { return data ?. reduce ( ( acc , ticket ) => { if ( ! acc [ ticket . areaId ] ) acc [ ticket . areaId ] = { open : [ ] , closed : [ ] } ; if ( ticket . leftAt ) acc [ ticket . areaId ] . closed . push ( ticket ) ; else acc [ ticket . areaId ] . open . push ( ticket ) ; return acc ; } , { } as GroupedTickets ) ; } , [ data ] ) ; return { data : groupedData , ... rest } ; } export function useLastAreaTickets ( companyId ? , areaId ? ) { const { data , ... rest } = useLastTickets ( companyId ) ; const filteredData = React . useMemo ( ( ) => { return data ?. filter ( ( ticket ) => ticket . areaId === areaId ) ; } , [ data , areaId ] ) ; return { data : filteredData , ... rest } ; }