fix(DEV-13054): add create counterparts from payables and approval policies

packages/sdk-react/src/components/approvalPolicies/ApprovalPolicyDetails/ApprovalPolicyForm/ApprovalPolicyForm.tsx

@@ -16,6 +16,11 @@ import {
   ApprovalPoliciesOperator,
   AmountTuple,
 } from '@/components/approvalPolicies/useApprovalPolicyTrigger';
+import {
+  CounterpartAutocomplete,
+  CounterpartsAutocompleteOptionProps,
+} from '@/components/counterparts/CounterpartAutocomplete';
+import { getCounterpartName } from '@/components/counterparts/helpers';
 import { RHFTextField } from '@/components/RHF/RHFTextField';
 import { useMoniteContext } from '@/core/context/MoniteContext';
 import { useCurrencies } from '@/core/hooks';
@@ -44,7 +49,6 @@ import * as yup from 'yup';
 
 import { ConditionsTable } from '../ConditionsTable';
 import { RulesTable } from '../RulesTable';
-import { AutocompleteCounterparts } from './AutocompleteCounterparts';
 import { AutocompleteTags } from './AutocompleteTags';
 import { AutocompleteUsers } from './AutocompleteUsers';
 
@@ -70,7 +74,7 @@ export interface FormValues {
   triggers: {
     was_created_by_user_id?: components['schemas']['EntityUserResponse'][];
     tags?: components['schemas']['TagReadSchema'][];
-    counterpart_id?: components['schemas']['CounterpartResponse'][];
+    counterpart_id?: CounterpartsAutocompleteOptionProps[];
     amount?: {
       currency: components['schemas']['CurrencyEnum'];
       value: AmountTuple[];
@@ -358,11 +362,14 @@ export const ApprovalPolicyForm = ({
         setValue('triggers.tags', tagsForTriggers?.data);
       }
 
-      if (
-        counterpartsForTriggers?.data &&
-        counterpartsForTriggers?.data.length > 0
-      ) {
-        setValue('triggers.counterpart_id', counterpartsForTriggers?.data);
+      if ((counterpartsForTriggers?.data?.length ?? 0) > 0) {
+        setValue(
+          'triggers.counterpart_id',
+          counterpartsForTriggers?.data.map((counterpart) => ({
+            id: counterpart.id,
+            label: getCounterpartName(counterpart),
+          }))
+        );
       }
 
       if (triggers.amount && triggers.amount?.value?.length > 0) {
@@ -912,10 +919,11 @@ export const ApprovalPolicyForm = ({
               {(triggerInEdit === 'counterpart_id' ||
                 (isAddingTrigger &&
                   currentTriggerType === 'counterpart_id')) && (
-                <AutocompleteCounterparts
+                <CounterpartAutocomplete
                   control={control}
                   name="triggers.counterpart_id"
                   label={t(i18n)`Counterparts`}
+                  multiple
                 />
               )}
               {(triggerInEdit === 'amount' ||

packages/sdk-react/src/components/approvalPolicies/ApprovalPolicyDetails/ConditionsTable/ConditionsTable.tsx

@@ -1,7 +1,6 @@
-import React, { ReactNode, useMemo } from 'react';
+import { ReactNode, useMemo } from 'react';
 
 import { User } from '@/components/approvalPolicies/ApprovalPolicyDetails/ApprovalPolicyView/User';
-import { getCounterpartName } from '@/components/counterparts/helpers';
 import { t } from '@lingui/macro';
 import { useLingui } from '@lingui/react';
 import AddCircleOutlineIcon from '@mui/icons-material/AddCircleOutline';
@@ -69,12 +68,11 @@ export const ConditionsTable = ({
           case 'counterpart_id':
             triggerValue = (
               <Stack direction="row" gap={1} sx={{ flexWrap: 'wrap' }}>
-                {triggers.counterpart_id?.map((counterpart) => (
-                  <Chip
-                    key={counterpart.id}
-                    label={getCounterpartName(counterpart)}
-                  />
-                ))}
+                {triggers.counterpart_id?.map((counterpart) => {
+                  return (
+                    <Chip key={counterpart.id} label={counterpart.label} />
+                  );
+                })}
               </Stack>
             );
             break;

packages/sdk-react/src/components/counterparts/Counterpart.types.ts

@@ -1,3 +1,5 @@
+import { AllowedCountries } from '@/enums/AllowedCountries';
+
 export enum CounterpartDataTestId {
   OrganizationView = 'OrganizationView',
   OrganizationForm = 'OrganizationForm',
@@ -27,3 +29,29 @@ export type CounterpartShowCategories = {
    */
   showCategories: boolean;
 };
+
+interface BaseCounterpartOCR {
+  email: string;
+  phone?: string;
+  isCustomer: boolean;
+  isVendor: boolean;
+  line1: string;
+  line2: string;
+  city: string;
+  state: string;
+  postalCode: string;
+  country?: keyof typeof AllowedCountries;
+}
+
+export interface DefaultValuesOCR<T extends BaseCounterpartOCR> {
+  tax_id: string;
+  counterpart: T;
+}
+
+export type DefaultValuesOCRIndividual = DefaultValuesOCR<
+  BaseCounterpartOCR & { firstName?: string; lastName?: string }
+>;
+
+export type DefaultValuesOCROrganization = DefaultValuesOCR<
+  BaseCounterpartOCR & { companyName: string }
+>;