fix(DEV-13777): invoice split screen and new component for customer

packages/sdk-react/src/components/counterparts/CounterpartDetails/CounterpartDetails.tsx

@@ -2,6 +2,7 @@ import { useCallback, useMemo } from 'react';
 
 import { CounterpartVatForm } from '@/components/counterparts/CounterpartDetails/CounterpartVatForm';
 import { MoniteScopedProviders } from '@/core/context/MoniteScopedProviders';
+import { CircularProgress } from '@mui/material';
 
 import { CounterpartAddressFormUpdate } from './CounterpartAddressFormUpdate';
 import { CounterpartBankForm } from './CounterpartBankForm';
@@ -35,6 +36,7 @@ const CounterpartDetailsBase = (props: CounterpartsDetailsProps) => {
     onAddressEdit,
     onAddressUpdate,
     contactId,
+    onClose,
     onContactEdit,
     onContactCreate,
     onContactUpdate,
@@ -60,7 +62,7 @@ const CounterpartDetailsBase = (props: CounterpartsDetailsProps) => {
   const defaultValues = props.type ? props.defaultValues : undefined;
 
   const renderSubResource = useCallback(() => {
-    if (!counterpartId) return null;
+    if (!counterpartId) return <CircularProgress color="inherit" size={20} />;
 
     switch (counterpartView) {
       case COUNTERPART_VIEW.view:
@@ -145,6 +147,7 @@ const CounterpartDetailsBase = (props: CounterpartsDetailsProps) => {
     onBankCreate,
     onBankEdit,
     onBankUpdate,
+    onClose,
     onContactCancel,
     onContactCreate,
     onContactEdit,
@@ -174,6 +177,7 @@ const CounterpartDetailsBase = (props: CounterpartsDetailsProps) => {
             id={counterpartId}
             onCancel={showView}
             onCreate={onCreate}
+            onClose={props.onClose}
             onUpdate={onUpdate}
             showCategories={showCategories}
             defaultValues={defaultValues}

packages/sdk-react/src/components/counterparts/CounterpartDetails/CounterpartForm/CounterpartIndividualForm/CounterpartIndividualForm.tsx

@@ -179,7 +179,7 @@ export const CounterpartIndividualForm = (props: CounterpartsFormProps) => {
           {dialogContext?.isDialogContent && (
             <IconWrapper
               aria-label={t(i18n)`Counterpart Close`}
-              onClick={dialogContext.onClose}
+              onClick={props.onClose || dialogContext.onClose}
               color="inherit"
             >
               <CloseIcon />
@@ -386,7 +386,11 @@ export const CounterpartIndividualForm = (props: CounterpartsFormProps) => {
           <Button
             variant="outlined"
             color="inherit"
-            onClick={isUpdateMode ? props.onCancel : dialogContext?.onClose}
+            onClick={
+              isUpdateMode
+                ? props.onCancel
+                : props.onClose || dialogContext?.onClose
+            }
           >
             {t(i18n)`Cancel`}
           </Button>

packages/sdk-react/src/components/counterparts/CounterpartDetails/CounterpartForm/useCounterpartForm.tsx

@@ -18,6 +18,7 @@ export type CounterpartsFormProps = {
    */
   id?: string;
   onCancel?: () => void;
+  onClose?: () => void;
   onCreate?: (id: string) => void;
   onUpdate?: (id: string) => void;
   /**

packages/sdk-react/src/components/counterparts/CounterpartDetails/CounterpartView/CounterpartView.tsx

@@ -174,7 +174,6 @@ export const CounterpartView = (props: CounterpartViewProps) => {
       />
     );
   }
-
   return (
     <>
       <Grid container alignItems="center">

packages/sdk-react/src/components/counterparts/CounterpartDetails/CounterpartView/useCounterpartView.tsx

@@ -24,6 +24,8 @@ export type CounterpartViewProps = {
 
   onAddressEdit?: (id: string) => void;
 
+  onClose?: () => void;
+
   onContactCreate?: () => void;
   onContactEdit?: (id: string) => void;
   onContactDelete?: (id: string) => void;

packages/sdk-react/src/components/counterparts/CounterpartDetails/useCounterpartDetails.tsx

@@ -62,6 +62,8 @@ interface CommonCounterpartDetailsProps
    */
   onDelete?: (id: CounterpartId) => void;
 
+  onClose?: () => void;
+
   onContactCreate?: (id: CounterpartId) => void;
   onContactUpdate?: (id: CounterpartId) => void;
   onContactDelete?: (id: CounterpartId) => void;
@@ -149,6 +151,7 @@ export function useCounterpartDetails(props: CounterpartsDetailsProps) {
     }
   }, [actions, props.id, props.type]);
 
+  const onClose = useLatest(props.onClose);
   const onCreateImmutable = useLatest(props.onCreate);
   const onCreate = useCallback(
     (id: string) => {
@@ -311,6 +314,7 @@ export function useCounterpartDetails(props: CounterpartsDetailsProps) {
     vatId,
     counterpartView,
     actions,
+    onClose,
     onCreate,
     onUpdate,
     onEdit,