Merge pull request #1214 from Chia-Network/refactor/create-edit-proje…

…ct-form-stepper

Refactor/create edit project form stepper

src/renderer/api/cadt/v1/projects/projects.api.ts

@@ -81,5 +81,9 @@ const projectsApi = cadtApi.injectEndpoints({
   }),
 });
 
-export const { useGetProjectsQuery, useGetProjectQuery, useDeleteProjectMutation, useStageProjectMutation } =
-  projectsApi;
+export const { 
+  useGetProjectsQuery, 
+  useGetProjectQuery, 
+  useDeleteProjectMutation, 
+  useStageProjectMutation 
+} = projectsApi;

src/renderer/api/cadt/v1/units/units.api.ts

@@ -75,11 +75,15 @@ const unitsApi = cadtApi.injectEndpoints({
     }),
 
     stageUnit: builder.mutation<any, Unit>({
-      query: (unit) => ({
-        url: `/v1/units`,
-        method: 'POST',
-        body: unit,
-      }),
+      query: (unit) => {
+        delete unit.warehouseProjectId;
+
+        return {
+          url: `/v1/units`,
+          method: 'POST',
+          body: unit,
+        };
+      },
       invalidatesTags: [stagedUnitsTag],
     }),
   }),

src/renderer/components/blocks/forms/CoBenifetForm.tsx → src/renderer/components/blocks/forms/CoBenifetsForm.tsx

@@ -1,5 +1,5 @@
-import { forwardRef, useImperativeHandle, useRef } from 'react';
-import { Form, Formik, FormikProps } from 'formik';
+import { useRef, forwardRef, useImperativeHandle } from 'react';
+import { Formik, Form, FormikProps } from 'formik';
 import { Field, Repeater } from '@/components';
 import * as yup from 'yup';
 import { CoBenefit } from '@/schemas/CoBenefit.schema';
@@ -14,17 +14,17 @@ const validationSchema = yup.object({
   ),
 });
 
-interface CoBenefitFormProps {
+interface CoBenefitsFormProps {
   readonly?: boolean;
   data?: CoBenefit[];
   picklistOptions?: PickList;
 }
 
-export interface CoBenefitFormRef {
+export interface CoBenefitsFormRef {
   submitForm: () => Promise<any>;
 }
 
-const CoBenefitForm = forwardRef<CoBenefitFormRef, CoBenefitFormProps>(
+const CoBenefitsForm = forwardRef<CoBenefitsFormRef, CoBenefitsFormProps>(
   ({ readonly = false, data, picklistOptions }, ref) => {
     const formikRef = useRef<FormikProps<any>>(null);
 
@@ -70,4 +70,4 @@ const CoBenefitForm = forwardRef<CoBenefitFormRef, CoBenefitFormProps>(
   },
 );
 
-export { CoBenefitForm };
+export { CoBenefitsForm };

src/renderer/components/blocks/forms/EstimationForm.tsx → src/renderer/components/blocks/forms/EstimationsForm.tsx

@@ -18,17 +18,18 @@ const validationSchema = yup.object({
   ),
 });
 
-interface EstimationFormProps {
+interface EstimationsFormProps {
   readonly?: boolean;
   data?: Estimation[];
 }
 
-export interface EstimationFormRef {
+export interface EstimationsFormRef {
   submitForm: () => Promise<any>;
 }
 
-const EstimationForm = forwardRef<EstimationFormRef, EstimationFormProps>(({ readonly = false, data }, ref) => {
-  const formikRef = useRef<FormikProps<any>>(null);
+const EstimationsForm = forwardRef<EstimationsFormRef, EstimationsFormProps>(
+  ({ readonly = false, data, }, ref) => {
+    const formikRef = useRef<FormikProps<any>>(null);
 
   useImperativeHandle(ref, () => ({
     submitForm: () => validateAndSubmitFieldArrayForm(formikRef, 'estimations'),
@@ -88,4 +89,4 @@ const EstimationForm = forwardRef<EstimationFormRef, EstimationFormProps>(({ rea
   );
 });
 
-export { EstimationForm };
+export { EstimationsForm };

src/renderer/components/blocks/forms/IssuanceForm.tsx → src/renderer/components/blocks/forms/IssuancesForm.tsx

@@ -21,20 +21,20 @@ const validationSchema = yup.object({
   ),
 });
 
-interface IssuanceFormProps {
+interface IssuancesFormProps {
   readonly?: boolean;
   data?: Issuance[] | undefined;
   showUnits?: boolean;
   picklistOptions?: PickList | undefined;
 }
 
-export interface IssuanceFormRef {
+export interface IssuancesFormRef {
   submitForm: () => Promise<any>;
 }
 
 const defaultIssuanceData: Issuance[] = [];
 
-const IssuanceForm = forwardRef<IssuanceFormRef, IssuanceFormProps>(
+const IssuancesForm = forwardRef<IssuancesFormRef, IssuancesFormProps>(
   ({ readonly = false, data = defaultIssuanceData, showUnits = false, picklistOptions }, ref) => {
     const formikRef = useRef<FormikProps<any>>(null);
 
@@ -122,4 +122,4 @@ const IssuanceForm = forwardRef<IssuanceFormRef, IssuanceFormProps>(
   },
 );
 
-export { IssuanceForm };
+export { IssuancesForm };

src/renderer/components/blocks/forms/LabelForm.tsx → src/renderer/components/blocks/forms/LabelsForm.tsx

@@ -13,22 +13,14 @@ const validationSchema = yup.object({
       labelType: yup.string().required('Label type is required'),
       labelLink: yup.string().url('Must be a valid URL').nullable(),
       validityPeriodStartDate: yup.date().nullable(),
-      validityPeriodEndDate: yup
-        .date()
-        .nullable()
+      validityPeriodEndDate: yup.date().nullable()
         .when('validityPeriodStartDate', (validityPeriodStartDate, schema) =>
-          validityPeriodStartDate
-            ? schema.min(validityPeriodStartDate, 'Validity Period End Date must be after the start date')
-            : schema,
+          validityPeriodStartDate ? schema.min(validityPeriodStartDate, 'Validity Period End Date must be after the start date') : schema
         ),
       creditingPeriodStartDate: yup.date().nullable(),
-      creditingPeriodEndDate: yup
-        .date()
-        .nullable()
+      creditingPeriodEndDate: yup.date().nullable()
         .when('creditingPeriodStartDate', (creditingPeriodStartDate, schema) =>
-          creditingPeriodStartDate
-            ? schema.min(creditingPeriodStartDate, 'Crediting Period End Date must be after the start date')
-            : schema,
+          creditingPeriodStartDate ? schema.min(creditingPeriodStartDate, 'Crediting Period End Date must be after the start date') : schema
         ),
       unitQuantity: yup
         .number()
@@ -39,17 +31,17 @@ const validationSchema = yup.object({
   ),
 });
 
-interface LabelFormFormProps {
+interface LabelsFormProps {
   readonly?: boolean;
   data?: Label[];
   picklistOptions?: PickList | null;
 }
 
-export interface LabelFormRef {
+export interface LabelsFormRef {
   submitForm: () => Promise<any>;
 }
 
-const LabelForm = forwardRef<LabelFormRef, LabelFormFormProps>(
+const LabelsForm = forwardRef<LabelsFormRef, LabelsFormProps>(
   ({ readonly = false, data, picklistOptions }, ref) => {
     const formikRef = useRef<FormikProps<any>>(null);
 
@@ -86,7 +78,7 @@ const LabelForm = forwardRef<LabelFormRef, LabelFormFormProps>(
               {(label: Label, index: number, name: string) => (
                 <>
                   <div className="grid grid-cols-1 md:grid-cols-2 gap-x-4">
-                    <Field name="label" label="Label" type="text" readonly={readonly} initialValue={label.label} />
+                    <Field name={`${name}[${index}].label`} label="Label" type="text" readonly={readonly} initialValue={label.label} />
                     <Field
                       name={`${name}[${index}].labelType`}
                       label="Label Type"
@@ -102,8 +94,6 @@ const LabelForm = forwardRef<LabelFormRef, LabelFormFormProps>(
                       readonly={readonly}
                       initialValue={label.labelLink}
                     />
-                  </div>
-                  <div className="grid grid-cols-1 md:grid-cols-2 gap-x-4">
                     <Field
                       name={`${name}[${index}].validityPeriodStartDate`}
                       label="Validity Period Start Date"
@@ -150,4 +140,4 @@ const LabelForm = forwardRef<LabelFormRef, LabelFormFormProps>(
   },
 );
 
-export { LabelForm };
+export { LabelsForm };

src/renderer/components/blocks/forms/ProjectForm.tsx

@@ -45,25 +45,25 @@ export interface ProjectFormRef {
 }
 
 const defaultProjectData: Project = {
-  projectName: '',
-  projectId: '',
-  projectDeveloper: '',
-  program: '',
-  projectLink: '',
-  sector: '',
-  projectType: '',
-  projectStatus: '',
-  projectStatusDate: new Date(),
-  coveredByNDC: '',
-  ndcInformation: '',
-  currentRegistry: '',
-  registryOfOrigin: '',
-  originProjectId: '',
-  unitMetric: '',
-  methodology: '',
-  validationBody: '',
-  validationDate: new Date(),
-  projectTags: '',
+  projectName: null,
+  projectId: null,
+  projectDeveloper: null,
+  program: null,
+  projectLink: null,
+  sector: null,
+  projectType: null,
+  projectStatus: null,
+  projectStatusDate: null,
+  coveredByNDC: null,
+  ndcInformation: null,
+  currentRegistry: null,
+  registryOfOrigin: null,
+  originProjectId: null,
+  unitMetric: null,
+  methodology: null,
+  validationBody: null,
+  validationDate: null,
+  projectTags: null,
 };
 
 const getDefaultInitialValues = (data: Partial<Project>): Project => {

src/renderer/components/blocks/forms/ProjectLocationForm.tsx → src/renderer/components/blocks/forms/ProjectLocationsForm.tsx

@@ -17,17 +17,17 @@ const validationSchema = yup.object({
   ),
 });
 
-interface ProjectLocationFormProps {
+interface ProjectLocationsFormProps {
   readonly?: boolean;
   data?: ProjectLocation[];
   picklistOptions?: PickList;
 }
 
-export interface ProjectLocationFormRef {
+export interface ProjectLocationsFormRef {
   submitForm: () => Promise<any>;
 }
 
-const ProjectLocationForm = forwardRef<ProjectLocationFormRef, ProjectLocationFormProps>(
+const ProjectLocationsForm = forwardRef<ProjectLocationsFormRef, ProjectLocationsFormProps>(
   ({ readonly = false, data, picklistOptions }, ref) => {
     const formikRef = useRef<FormikProps<any>>(null);
 
@@ -98,4 +98,4 @@ const ProjectLocationForm = forwardRef<ProjectLocationFormRef, ProjectLocationFo
   }
 );
 
-export { ProjectLocationForm };
+export { ProjectLocationsForm };

src/renderer/components/blocks/forms/RatingForm.tsx → src/renderer/components/blocks/forms/RatingsForm.tsx

@@ -1,4 +1,4 @@
-import { forwardRef, useImperativeHandle, useRef } from 'react';
+import { forwardRef, useRef, useImperativeHandle } from 'react';
 import { Form, Formik, FormikProps } from 'formik';
 import { Field, Repeater } from '@/components';
 import * as yup from 'yup';
@@ -18,18 +18,19 @@ const validationSchema = yup.object({
   ),
 });
 
-interface RatingFormProps {
+interface RatingsFormProps {
   readonly?: boolean;
   data?: Rating[];
   picklistOptions?: PickList | null;
 }
 
-export interface RatingFormRef {
+export interface RatingsFormRef {
   submitForm: () => Promise<any>;
 }
 
-const RatingForm = forwardRef<RatingFormRef, RatingFormProps>(({ readonly = false, data, picklistOptions }, ref) => {
-  const formikRef = useRef<FormikProps<any>>(null);
+const RatingsForm = forwardRef<RatingsFormRef, RatingsFormProps>(
+  ({ readonly = false, data, picklistOptions }, ref) => {
+    const formikRef = useRef<FormikProps<any>>(null);
 
   useImperativeHandle(ref, () => ({
     submitForm: () => validateAndSubmitFieldArrayForm(formikRef, 'projectRatings'),
@@ -107,4 +108,4 @@ const RatingForm = forwardRef<RatingFormRef, RatingFormProps>(({ readonly = fals
   );
 });
 
-export { RatingForm };
+export { RatingsForm };

src/renderer/components/blocks/forms/RelatedProjectForm.tsx → src/renderer/components/blocks/forms/RelatedProjectsForm.tsx

@@ -16,16 +16,16 @@ const validationSchema = yup.object({
   ),
 });
 
-interface RelatedProjectFormProps {
+interface RelatedProjectsFormProps {
   readonly?: boolean;
   data?: RelatedProject[];
 }
 
-export interface RelatedProjectFormRef {
+export interface RelatedProjectsFormRef {
   submitForm: () => Promise<any>;
 }
 
-const RelatedProjectForm = forwardRef<RelatedProjectFormRef, RelatedProjectFormProps>(
+const RelatedProjectsForm = forwardRef<RelatedProjectsFormRef, RelatedProjectsFormProps>(
   ({ readonly = false, data }, ref) => {
     const formikRef = useRef<FormikProps<any>>(null);
     const [orgUid] = useQueryParamState('orgUid');
@@ -96,4 +96,4 @@ const RelatedProjectForm = forwardRef<RelatedProjectFormRef, RelatedProjectFormP
   },
 );
 
-export { RelatedProjectForm };
+export { RelatedProjectsForm };