react-app/src/components/property/PropertyNetValueTable.tsx

Summary

Maintainability
A
0 mins
Test Coverage
import { dateFormatter, formatMoney } from '@/utilities/formatters';
import { Box, Typography } from '@mui/material';
import { DataGrid, GridColDef } from '@mui/x-data-grid';
import React from 'react';

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

const PropertyNetValueTable = (props: IPropertyNetValueTable) => {
  const columns: GridColDef[] = [
    {
      field: 'FiscalYear',
      headerName: 'Year',
    },
    {
      field: 'EffectiveDate',
      headerName: 'Effective Date',
      flex: 1,
      renderCell: (params) => (params.value ? dateFormatter(params.value) : 'Not provided'),
    },
    {
      field: 'Value',
      headerName: 'Net Book Value',
      flex: 1,
      valueFormatter: formatMoney,
    },
  ];

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

  return !props.rows.length ? (
    <Box display={'flex'} justifyContent={'center'}>
      <Typography>No net book values recorded.</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.FiscalYear}
      columns={columns}
      rows={props.rows ?? []}
    />
  );
};

export default PropertyNetValueTable;