{headRows
    // Filter table columns based on user selected input
    .filter(item => displayedColumns.includes(item.id))
    .map(row => (
      <TableCell
        key={row.id}
        align={row.numeric ? "right" : "left"}
        padding={row.disablePadding ? "none" : "default"}
        sortDirection={orderBy === row.id ? order : false}
      >
        <TableSortLabel
          active={orderBy === row.id}
          direction={order}
          onClick={createSortHandler(row.id)}
        >
          {useTranslation(row.label)}
        </TableSortLabel>
      </TableCell>
))}

import { useSelector } from "react-redux";

export const useTranslations = () =>
    useSelector(state => state.translations.data, []);