change export file name to include name of table and a timestamp, and add title props to table views to make this work

frontend/src/components/CrossSearch/CrossSearchExportMenuItem.tsx

@@ -14,7 +14,7 @@ export const CrossSearchExportMenuItem = ({ handleClose }: { handleClose: () =>
   const token = useUser().token
   const fetchOptions = token ? { headers: { Authorization: `Bearer ${token}` } } : {}
 
-  const filename = `cross_search${currentDateAsString()}.csv`
+  const filename = `cross_search-${currentDateAsString()}.csv`
 
   const fetchCSVFile = async () => {
     setLoading(true)

frontend/src/components/DetailView/StagingView.tsx

@@ -25,6 +25,7 @@ export const StagingView = <T extends MRT_RowData>() => {
         <SelectingTable<Reference, T>
           buttonText="Add existing reference"
           data={data}
+          title="References"
           isError={isError}
           columns={referenceTableColumns}
           idFieldName="rid"

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

@@ -15,6 +15,7 @@ export const SelectingTable = <T extends MRT_RowData, ParentType extends object>
   buttonText,
   data,
   columns,
+  title,
   editingAction,
   tableRowAction,
   fieldName,
@@ -26,6 +27,7 @@ export const SelectingTable = <T extends MRT_RowData, ParentType extends object>
   buttonText: string
   data: T[] | undefined
   columns: MRT_ColumnDef<T>[]
+  title: string
   editingAction?: (object: T) => void
   tableRowAction?: (row: T) => void
   fieldName: keyof ParentType
@@ -74,6 +76,7 @@ export const SelectingTable = <T extends MRT_RowData, ParentType extends object>
         <TableView<T>
           data={filteredData}
           columns={columns}
+          title={title}
           isFetching={false}
           visibleColumns={visibleColumns}
           selectorFn={editingAction ?? defaultEditingAction}

frontend/src/components/Locality/Tabs/LithologyTab.tsx

@@ -192,6 +192,7 @@ export const LithologyTab = () => {
                 isError={isError}
                 columns={selectingTableColumns}
                 data={sedimentaryStructuresData}
+                title="Sedimentary structures"
                 fieldName="now_ss"
                 idFieldName="ss_value"
                 editingAction={(newSed: SedimentaryStructureValues) => {

frontend/src/components/Locality/Tabs/MuseumTab.tsx

@@ -38,6 +38,7 @@ export const MuseumTab = () => {
           <SelectingTable<Museum, LocalityDetailsType>
             buttonText="Select Museum"
             data={museumData}
+            title="Museums"
             isError={isError}
             columns={columns}
             fieldName="now_mus"

frontend/src/components/Locality/Tabs/ProjectTab.tsx

@@ -43,6 +43,7 @@ export const ProjectTab = () => {
           <SelectingTable<Project, LocalityDetailsType>
             buttonText="Select Project"
             data={projectData}
+            title="Projects"
             columns={columns}
             isError={isError}
             idFieldName="pid"

frontend/src/components/Locality/Tabs/SpeciesTab.tsx

@@ -117,6 +117,7 @@ export const SpeciesTab = () => {
           <SelectingTable<Species, LocalityDetailsType>
             buttonText="Select Species"
             data={speciesData}
+            title="Species"
             isError={isError}
             columns={speciesColumns}
             fieldName="now_ls"

frontend/src/components/Reference/Tabs/AuthorTab.tsx

@@ -124,6 +124,7 @@ export const AuthorTab: React.FC<AuthorTabProps> = ({ field_num_param, tab_name
             <SelectingTable<ReferenceAuthorType, ReferenceDetailsType>
               buttonText={`Select ${buttonText}`}
               data={authorData}
+              title="Authors"
               isError={isError}
               columns={authorColumns}
               fieldName="ref_authors"

frontend/src/components/Reference/Tabs/JournalTab.tsx

@@ -88,6 +88,7 @@ export const JournalTab: React.FC<JournalTabProps> = ({ tab_name = 'Journal' })
             <SelectingTable<ReferenceJournalType, ReferenceDetailsType>
               buttonText="Select Journal"
               data={journalData}
+              title="Journals"
               isError={isError}
               columns={journalColumns}
               fieldName="ref_journal"

frontend/src/components/Region/Tabs/CoordinatorTab.tsx

@@ -106,6 +106,7 @@ export const CoordinatorTab = () => {
           <SelectingTable<PersonDetailsType, RegionDetails>
             buttonText="Select Coordinator"
             data={personsData}
+            title="Coordinators"
             isError={isError}
             columns={personTableColumns}
             fieldName="now_reg_coord_people"

frontend/src/components/Sequence/SequenceTable.tsx

@@ -31,6 +31,7 @@ export const SequenceTable = ({ selectorFn }: { selectorFn?: (id: Sequence) => v
       selectorFn={selectorFn}
       idFieldName="sequence"
       columns={columns}
+      title="Sequences"
       isFetching={isFetching}
       visibleColumns={visibleColumns}
       data={sequenceQueryData}

frontend/src/components/Species/Tabs/LocalityTab.tsx

@@ -50,6 +50,7 @@ export const LocalityTab = () => {
     <SelectingTable<Editable<Locality>, SpeciesDetailsType>
       buttonText="Select Locality"
       columns={columns}
+      title="Localities"
       isError={isError}
       data={localitiesData}
       fieldName="now_ls"

frontend/src/components/Species/Tabs/TaxonomyTab.tsx

@@ -25,6 +25,7 @@ export const TaxonomyTab = () => {
       <SelectingTable<Species, Species>
         buttonText="Copy existing taxonomy"
         data={speciesQueryData}
+        title="Species"
         isError={isError}
         columns={smallSpeciesTableColumns}
         fieldName="order_name" // this doesn't do anything here but is required

frontend/src/components/TableView/TableToolBar.tsx

@@ -12,6 +12,7 @@ import { usePageContext } from '../Page'
 
 export const TableToolBar = <T extends MRT_RowData>({
   table,
+  tableName,
   combinedExport,
   kmlExport,
   svgExport,
@@ -21,6 +22,7 @@ export const TableToolBar = <T extends MRT_RowData>({
   showNewButton,
 }: {
   table: MRT_TableInstance<T>
+  tableName: string
   combinedExport?: (lids: number[]) => Promise<void>
   kmlExport?: (table: MRT_TableInstance<T>) => void
   svgExport?: (table: MRT_TableInstance<T>) => void
@@ -87,7 +89,7 @@ export const TableToolBar = <T extends MRT_RowData>({
           ) : (
             <MenuItem
               onClick={() => {
-                exportRows(table)
+                exportRows(table, tableName)
                 handleClose()
               }}
             >

frontend/src/components/TableView/TableView.tsx

@@ -57,10 +57,9 @@ export const TableView = <T extends MRT_RowData>({
   idFieldName: keyof T
   checkRowRestriction?: (row: T) => boolean
   selectorFn?: (id: T) => void
-  // here
   tableRowAction?: (row: T) => void
   url?: string
-  title?: string
+  title: string
   combinedExport?: (lids: number[]) => Promise<void>
   kmlExport?: (table: MRT_TableInstance<T>) => void
   svgExport?: (table: MRT_TableInstance<T>) => void
@@ -259,6 +258,7 @@ export const TableView = <T extends MRT_RowData>({
           {title && <Box className="title">{title}</Box>}
           <TableToolBar<T>
             table={table}
+            tableName={title}
             combinedExport={combinedExport}
             kmlExport={kmlExport}
             svgExport={svgExport}

frontend/src/components/TableView/helpers.tsx

@@ -1,15 +1,17 @@
 import { MRT_RowData, MRT_TableInstance } from 'material-react-table'
 import { mkConfig, generateCsv, download } from 'export-to-csv'
 import { AcceptedData } from 'node_modules/export-to-csv/output/lib/types'
+import { currentDateAsString } from '@/shared/currentDateAsString'
 
 export type ExportFn<T> = (data: T) => { [k: string]: AcceptedData }
 
-export const exportRows = <T extends MRT_RowData>(table: MRT_TableInstance<T>) => {
+export const exportRows = <T extends MRT_RowData>(table: MRT_TableInstance<T>, tableName: string) => {
   const csvConfig = mkConfig({
     fieldSeparator: ',',
     decimalSeparator: '.',
     useKeysAsHeaders: true,
     quoteStrings: true, // If true, will wrap all values in double quotes
+    filename: `${tableName.toLowerCase()}-${currentDateAsString()}`,
   })
   const rowData = table.getPrePaginationRowModel().rows.map(row => {
     const r = {} as Record<string, AcceptedData>