react-app/src/components/projects/DisposalPropertiesSimpleTable.tsx

Summary

Maintainability
A
0 mins
Test Coverage
import { PropertyTypes } from '@/constants/propertyTypes';
import { Agency } from '@/hooks/api/useAgencyApi';
import { formatMoney, pidFormatter } from '@/utilities/formatters';
import { Box, Typography } from '@mui/material';
import { DataGrid, GridColDef } from '@mui/x-data-grid';
import React from 'react';

interface IDisposalPropertiesTable {
  rows: Record<string, any>[];
}

const DisposalPropertiesTable = (props: IDisposalPropertiesTable) => {
  const columns: GridColDef[] = [
    {
      field: 'PropertyType',
      headerName: 'Type',
    },
    {
      field: 'PID/Address',
      headerName: 'PID/Address',
      flex: 1,
      valueGetter: (value, row) =>
        row.PropertyTypeId === PropertyTypes.BUILDING && row.Address1
          ? row.Address1
          : pidFormatter(row.PID) ?? row.PIN,
    },
    {
      field: 'Agency',
      headerName: 'Agency',
      flex: 1,
      valueGetter: (value: Agency) => value.Name,
    },
    {
      field: 'FiscalYear',
      headerName: 'Year',
      flex: 1,
      valueGetter: (value, row) => {
        return row.Fiscals?.map((a) => a.FiscalYear)?.sort((a, b) => b - a)?.[0] ?? 'N/A'; //Sort in reverse order to obtain most recent year.
      },
    },
    {
      field: 'AssessedValue',
      headerName: 'Assessed',
      flex: 1,
      valueGetter: (value, row) => {
        return row.Evaluations?.sort((a, b) => b.Year - a.Year)?.[0]?.Value ?? 'N/A';
      },
      valueFormatter: formatMoney,
    },
  ];

  if (!props.rows) return <></>;

  return !props.rows.length ? (
    <Box display={'flex'} justifyContent={'center'}>
      <Typography>No properties selected .</Typography>
    </Box>
  ) : (
    <DataGrid
      sx={{
        borderStyle: 'none',
        '& .MuiDataGrid-columnHeaders': {
          borderBottom: 'none',
        },
        '& div div div div >.MuiDataGrid-cell': {
          borderBottom: 'none',
          borderTop: '1px solid rgba(224, 224, 224, 1)',
        },
        '& .MuiDataGrid-row:hover': {
          backgroundColor: 'transparent',
        },
      }}
      disableRowSelectionOnClick
      hideFooter
      getRowId={(row) => row.Id + row.PropertyType}
      columns={columns}
      rows={props.rows ?? []}
    />
  );
};

export default DisposalPropertiesTable;