Function SortableHeader

app/src/components/sorting.tsx:70–84

(props: {
  title: string;
  field: T;
  isNumeric?: boolean;
})

};

export const SortableHeader = <T extends string>(props: {
  title: string;
  field: T;
  isNumeric?: boolean;
}) => {
  const sortOrder = useSortOrder<T>();

  return (
    <Th onClick={() => sortOrder.toggle(props.field)} cursor="pointer">
      <HStack justify={props.isNumeric ? "end" : undefined}>
        <Text>{props.title}</Text> <SortArrows<T> field={props.field} />
      </HStack>
    </Th>
  );
};