#3881 create select material to copy modal

src/frontend/src/hooks/bom.hooks.ts

@@ -1,5 +1,5 @@
 import { useMutation, useQuery, useQueryClient } from 'react-query';
-import { Assembly, Manufacturer, Material, MaterialType, Unit, WbsNumber, wbsPipe } from 'shared';
+import { Assembly, Manufacturer, Material, MaterialType, ProjectPreview, Unit, WbsNumber, wbsPipe } from 'shared';
 import { useToast } from '../hooks/toasts.hooks';
 import {
   assignMaterialToAssembly,
@@ -326,3 +326,33 @@ export const useGetMaterialsForWbsElement = (wbsNum: WbsNumber) => {
     return data;
   });
 };
+
+export const useGetMaterialsForCar = (carNumber: number | null, projects: ProjectPreview[]) => {
+  const projectsInCar = projects.filter((p) => p.wbsNum.carNumber === carNumber);
+
+  return useQuery<Material[], Error>(
+    ['materials', 'car', carNumber ?? 'none'],
+    async () => {
+      const results = await Promise.all(
+        projectsInCar.map(async (p) => {
+          const { data } = await getMaterialsForWbsElement({
+            carNumber: p.wbsNum.carNumber,
+            projectNumber: p.wbsNum.projectNumber,
+            workPackageNumber: 0
+          });
+          return data;
+        })
+      );
+
+      const flat = results.flat();
+      const seen = new Set<string>();
+      return flat.filter((material) => {
+        const key = `${material.name.toLowerCase()}-${material.assemblyId ?? 'no-assembly'}`;
+        if (seen.has(key)) return false;
+        seen.add(key);
+        return true;
+      });
+    },
+    { enabled: carNumber !== null && projectsInCar.length > 0 }
+  );
+};

src/frontend/src/pages/ProjectDetailPage/ProjectViewContainer/BOM/BOMTableWrapper.tsx

@@ -298,6 +298,7 @@ const BOMTableWrapper: React.FC<BOMTableWrapperProps> = ({
       flex: 1.5,
       field: 'name',
       headerName: 'Name',
+      type: 'string',
       sortable: false,
       filterable: false,
       hide: hideColumn[3],

src/frontend/src/pages/ProjectDetailPage/ProjectViewContainer/BOM/MaterialForm/MaterialFormView.tsx

@@ -2,6 +2,7 @@ import {
   Accordion,
   AccordionDetails,
   AccordionSummary,
+  Button,
   FormControl,
   FormHelperText,
   FormLabel,
@@ -14,7 +15,7 @@ import {
 } from '@mui/material';
 import { Box } from '@mui/system';
 import { Control, Controller, FieldErrors, UseFormHandleSubmit, UseFormSetValue, UseFormWatch } from 'react-hook-form';
-import { Assembly, Manufacturer, MaterialType, Unit } from 'shared';
+import { Assembly, Manufacturer, Material, MaterialType, Unit } from 'shared';
 import ReactHookTextField from '../../../../../components/ReactHookTextField';
 import { MaterialFormInput } from './MaterialForm';
 import NERFormModal from '../../../../../components/NERFormModal';
@@ -26,6 +27,7 @@ import { displayEnum } from '../../../../../utils/pipes';
 import { MaterialStatus } from 'shared';
 import React, { useState } from 'react';
 import { AddCircle } from '@mui/icons-material';
+import SelectMaterialToCopyModal from './SelectMaterialToCopyModal';
 
 export interface MaterialFormViewProps {
   submitText: 'Add' | 'Edit';
@@ -42,7 +44,6 @@ export interface MaterialFormViewProps {
   watch: UseFormWatch<MaterialFormInput>;
   createManufacturer: (name: string) => void;
   setValue: UseFormSetValue<MaterialFormInput>;
-  copyFromExistingBomAction?: React.ReactNode;
   fromRRForm?: boolean;
 }
 
@@ -77,6 +78,23 @@ const MaterialFormView: React.FC<MaterialFormViewProps> = ({
   const price = watch('price');
   const subtotal = quantity && price ? quantity * price : 0;
 
+  const [copyModalOpen, setCopyModalOpen] = React.useState(false);
+
+  const handleCopySelect = (m: Material) => {
+    setValue('name', m.name ?? '');
+    setValue('materialTypeName', m.materialTypeName ?? '');
+    setValue('manufacturerName', m.manufacturerName ?? '');
+    setValue('manufacturerPartNumber', m.manufacturerPartNumber ?? '');
+    setValue('pdmFileName', m.pdmFileName ?? '');
+    setValue('linkUrl', m.linkUrl ?? '');
+    setValue('quantity', m.quantity != null ? Number(m.quantity) : undefined);
+    setValue('unitName', m.unitName ?? undefined);
+    setValue('price', m.price != null ? m.price / 100 : undefined);
+    setValue('notes', m.notes ?? '');
+    setValue('assemblyId', undefined);
+
+    setCopyModalOpen(false);
+  };
   const optionalFields = (
     <Grid container spacing={2}>
       <Grid item xs={12}>
@@ -504,7 +522,7 @@ const MaterialFormView: React.FC<MaterialFormViewProps> = ({
           )}
         </Grid>
       </Grid>
-      {/*submitText === 'Add' && (
+      {submitText === 'Add' && (
         <Grid item xs={12} sx={{ pl: 0, pr: 0 }}>
           <Box
             sx={{
@@ -514,7 +532,7 @@ const MaterialFormView: React.FC<MaterialFormViewProps> = ({
             <Button
               variant="contained"
               disableElevation
-              onClick={() => {}}
+              onClick={() => setCopyModalOpen(true)}
               sx={{
                 mx: 0,
                 textTransform: 'none',
@@ -527,7 +545,13 @@ const MaterialFormView: React.FC<MaterialFormViewProps> = ({
             </Button>
           </Box>
         </Grid>
-      )*/}
+      )}
+      <SelectMaterialToCopyModal
+        open={copyModalOpen}
+        onHide={() => setCopyModalOpen(false)}
+        onSelect={handleCopySelect}
+        assemblies={assemblies ?? []}
+      />
     </NERFormModal>
   );
 };