enable ability to define columns by default table by table

frontend/src/components/CrossSearch/CrossSearchTable.tsx

@@ -11,7 +11,7 @@ export const CrossSearchTable = ({ selectorFn }: { selectorFn?: (newObject: Cros
       {
         id: 'id',
         accessorKey: 'lid',
-        header: 'Id',
+        header: 'Location Id',
         size: 20,
       },
       {
@@ -81,6 +81,10 @@ export const CrossSearchTable = ({ selectorFn }: { selectorFn?: (newObject: Cros
     []
   )
 
+  const hiddenColumns = {
+    id: false,
+  }
+
   const checkRowRestriction = (row: CrossSearch) => {
     return !!row.loc_status
   }
@@ -92,6 +96,7 @@ export const CrossSearchTable = ({ selectorFn }: { selectorFn?: (newObject: Cros
       checkRowRestriction={checkRowRestriction}
       idFieldName="lid"
       columns={columns}
+      hiddenColumns={hiddenColumns}
       data={CrossSearchQuery.data}
       url="crosssearch"
     />

frontend/src/components/DetailView/common/SelectingTable.tsx

@@ -42,6 +42,10 @@ export const SelectingTable = <T extends MRT_RowData, ParentType extends object>
     return new Set(selectedItems.map(item => item[idFieldName] as T))
   }, [selectedItems, idFieldName])
 
+  const hiddenColumns = {
+    id: false,
+  }
+
   const filteredData = useMemo(() => {
     if (!data) return []
     return data.filter(row => {
@@ -58,6 +62,7 @@ export const SelectingTable = <T extends MRT_RowData, ParentType extends object>
         <TableView<T>
           data={filteredData}
           columns={columns}
+          hiddenColumns={hiddenColumns}
           selectorFn={editingAction ?? defaultEditingAction}
           idFieldName={idFieldName}
         />

frontend/src/components/Locality/LocalityTable.tsx

@@ -39,6 +39,10 @@ export const LocalityTable = ({ selectorFn }: { selectorFn?: (newObject: Localit
     []
   )
 
+  const hiddenColumns = {
+    id: false,
+  }
+
   const combinedExport = async (lids: number[]) => {
     if (isLoading) {
       notify('Please wait for the last request to complete.', 'warning')
@@ -71,6 +75,7 @@ export const LocalityTable = ({ selectorFn }: { selectorFn?: (newObject: Localit
       checkRowRestriction={checkRowRestriction}
       idFieldName="lid"
       columns={columns}
+      hiddenColumns={hiddenColumns}
       data={localitiesQuery.data}
       url="locality"
       combinedExport={combinedExport}

frontend/src/components/Person/PersonTable.tsx

@@ -62,12 +62,17 @@ export const PersonTable = ({ selectorFn }: { selectorFn?: (id: PersonDetailsTyp
     []
   )
 
+  const hiddenColumns = {
+    id: false,
+  }
+
   return (
     <TableView<PersonDetailsType>
       title="People"
       selectorFn={selectorFn}
       idFieldName="initials"
       columns={columns}
+      hiddenColumns={hiddenColumns}
       data={personQuery.data}
       url="person"
     />

frontend/src/components/Project/ProjectTable.tsx

@@ -37,12 +37,17 @@ export const ProjectTable = ({ selectorFn }: { selectorFn?: (id: Project) => voi
     []
   )
 
+  const hiddenColumns = {
+    id: false,
+  }
+
   return (
     <TableView<Project>
       title="Projects"
       selectorFn={selectorFn}
       idFieldName="pid"
       columns={columns}
+      hiddenColumns={hiddenColumns}
       data={projectQuery.data}
       url="project"
     />

frontend/src/components/Reference/ReferenceTable.tsx

@@ -6,12 +6,17 @@ import { referenceTableColumns } from '@/common'
 export const ReferenceTable = ({ selectorFn }: { selectorFn?: (id: Reference) => void }) => {
   const referenceQuery = useGetAllReferencesQuery()
 
+  const hiddenColumns = {
+    id: false,
+  }
+
   return (
     <TableView<Reference>
       title="References"
       selectorFn={selectorFn}
       idFieldName="rid"
       columns={referenceTableColumns}
+      hiddenColumns={hiddenColumns}
       data={referenceQuery.data}
       url="reference"
     />

frontend/src/components/Region/RegionTable.tsx

@@ -23,12 +23,17 @@ export const RegionTable = ({ selectorFn }: { selectorFn?: (id: Region) => void
     []
   )
 
+  const hiddenColumns = {
+    id: false,
+  }
+
   return (
     <TableView<Region>
       title="Regions"
       selectorFn={selectorFn}
       idFieldName="reg_coord_id"
       columns={columns}
+      hiddenColumns={hiddenColumns}
       data={regionQuery.data}
       url="region"
     />

frontend/src/components/Sequence/SequenceTable.tsx

@@ -23,11 +23,16 @@ export const SequenceTable = ({ selectorFn }: { selectorFn?: (id: Sequence) => v
     []
   )
 
+  const hiddenColumns = {
+    id: false,
+  }
+
   return (
     <TableView<Sequence>
       selectorFn={selectorFn}
       idFieldName="sequence"
       columns={columns}
+      hiddenColumns={hiddenColumns}
       data={sequenceQuery.data}
       url="sequence"
     />

frontend/src/components/Species/SpeciesTable.tsx

@@ -63,12 +63,18 @@ export const SpeciesTable = ({ selectorFn }: { selectorFn?: (id: Species) => voi
     []
   )
 
+  const hiddenColumns = {
+    name: false,
+    id: false,
+  }
+
   return (
     <TableView<Species>
       title="Species"
       selectorFn={selectorFn}
       idFieldName="species_id"
       columns={columns}
+      hiddenColumns={hiddenColumns}
       data={speciesQuery.data}
       url="species"
     />

frontend/src/components/TableView/TableView.tsx

@@ -7,6 +7,7 @@ import {
   MRT_PaginationState,
   useMaterialReactTable,
   MaterialReactTable,
+  MRT_VisibilityState,
 } from 'material-react-table'
 import { Box, Button, CircularProgress, Divider, Paper, Tooltip, Typography } from '@mui/material'
 import { Link, useLocation, useNavigate } from 'react-router-dom'
@@ -29,6 +30,7 @@ const defaultPaginationSmall: MRT_PaginationState = { pageIndex: 0, pageSize: 10
 export const TableView = <T extends MRT_RowData>({
   data,
   columns,
+  hiddenColumns,
   idFieldName,
   checkRowRestriction,
   selectorFn,
@@ -40,6 +42,7 @@ export const TableView = <T extends MRT_RowData>({
   title?: string
   data: T[] | undefined
   columns: MRT_ColumnDef<T>[]
+  hiddenColumns: MRT_VisibilityState
   idFieldName: keyof T
   checkRowRestriction?: (row: T) => boolean
   selectorFn?: (id: T) => void
@@ -92,7 +95,7 @@ export const TableView = <T extends MRT_RowData>({
       density: 'compact',
     },
     initialState: {
-      columnVisibility: { id: false },
+      columnVisibility: hiddenColumns, // HERE ERalfnkJAKFÖLCN!!!!!!!!!!!!!!!
     },
     onColumnFiltersChange: setColumnFilters,
     renderRowActions: ({ row }) => <ActionComponent {...{ selectorFn, url, checkRowRestriction, row, idFieldName }} />,

frontend/src/components/TimeBound/TimeBoundTable.tsx

@@ -30,12 +30,18 @@ export const TimeBoundTable = ({ selectorFn }: { selectorFn?: (newTimeBound: Tim
     ],
     []
   )
+
+  const hiddenColumns = {
+    id: false,
+  }
+
   return (
     <TableView<TimeBound>
       title="Time bounds"
       selectorFn={selectorFn}
       idFieldName="bid"
       columns={columns}
+      hiddenColumns={hiddenColumns}
       data={time_boundQuery.data}
       url="time-bound"
     />

frontend/src/components/TimeUnit/TimeUnitTable.tsx

@@ -40,12 +40,17 @@ export const TimeUnitTable = ({ selectorFn }: { selectorFn?: (newTimeUnit: TimeU
     []
   )
 
+  const hiddenColumns = {
+    id: false,
+  }
+
   return (
     <TableView<TimeUnit>
       title="Time units"
       selectorFn={selectorFn}
       idFieldName="tu_name"
       columns={columns}
+      hiddenColumns={hiddenColumns}
       data={time_unitQuery.data}
       url="time-unit"
     />