fix: show errors in data tables

Author: OliverDudgeon

src/components/DataTable/DataTable.tsx

@@ -6,6 +6,7 @@ import {
   SearchRounded as SearchRoundedIcon,
 } from "@mui/icons-material";
 import {
+  Alert,
   Box,
   IconButton,
   InputAdornment,
@@ -116,7 +117,7 @@ export interface DataTableProps<Data extends Record<string, any>> {
    */
   isLoading?: boolean;
   /**
-   * If true, displays the provided `error`.
+   * If truthy, displays the provided `error`.
    */
   error?: string;
 }
@@ -151,6 +152,7 @@ export const DataTable = <Data extends Record<string, any>>(props: DataTableProp
     customTableProps,
     customCellProps,
     customRowProps,
+    error,
   } = props;
   const tableData = useMemo(() => data ?? [], [data]);
 
@@ -252,6 +254,7 @@ export const DataTable = <Data extends Record<string, any>>(props: DataTableProp
 
   const tableContents = (
     <>
+      {error ? <Alert severity="error">{error}</Alert> : null}
       {!!ToolbarChild || !!enableSearch ? (
         <Toolbar sx={{ pt: 2, alignItems: "flex-start", gap: 1 }}>
           {ToolbarChild}

src/features/ProjectTable/ProjectTable.tsx

@@ -137,7 +137,7 @@ export const ProjectTable = ({ currentProject, openUploadDialog }: ProjectTableP
   return (
     <Box
       sx={{
-        "& .MuiPaper-root": {
+        "& .MuiPaper-root:last-child": {
           // Set height to fill remaining space, pushing footer just off screen
           // 164px is the height of the header and toolbar
           height: "calc(100vh - 164px)",
@@ -149,7 +149,7 @@ export const ProjectTable = ({ currentProject, openUploadDialog }: ProjectTableP
         subRowsEnabled
         columns={columns}
         data={rows}
-        error={getErrorMessage(error)}
+        error={error ? getErrorMessage(error) : undefined}
         getRowId={(row) => row.fullPath}
         isLoading={isLoading}
         toolbarContent={