@topconsultnpm/sdkui-react 6.20.0-test1 → 6.21.0-dev1.2

package/lib/components/features/documents/TMMasterDetailDcmts.js

@@ -3,7 +3,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react';
 import { DcmtTypeListCacheService, SDK_Localizator } from '@topconsultnpm/sdk-ts';
 import TMRelationViewer from './TMRelationViewer';
 import TMContextMenu from '../../NewComponents/ContextMenu/TMContextMenu';
-import { genUniqueId, IconMultipleSelection, IconCheckFile, IconDetailDcmts, SDKUI_Localizator, IconMail, IconDcmtTypeOnlyMetadata, IconCopy, IconMenuVertical, IconDataList, IconPreview, IconSearchCheck, IconBoard, IconDcmtTypeSys, IconShow, getMoreInfoTasksForDocument } from '../../../helper';
+import { IconMultipleSelection, IconCheckFile, IconDetailDcmts, SDKUI_Localizator, IconMenuVertical, IconDataList, IconPreview, IconSearchCheck, IconBoard, IconDcmtTypeSys, IconShow, getMoreInfoTasksForDocument } from '../../../helper';
 import { FormModes, SearchResultContext } from '../../../ts';
 import { TMColors } from '../../../utils/theme';
 import ShowAlert from '../../base/TMAlert';
@@ -14,14 +14,15 @@ import { TMPanelManagerProvider, useTMPanelManagerContext } from '../../layout/p
 import TMSearchResult from '../search/TMSearchResult';
 import TMDcmtForm from './TMDcmtForm';
 import { TMNothingToShow } from './TMDcmtPreview';
+import { Spinner } from '../..';
 const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, deviceType, inputDcmts, isForMaster, showCurrentDcmtIndicator = true, allowNavigation, canNext, canPrev, onNext, onPrev, onBack, appendMasterDcmts, onTaskCreateRequest }) => {
-    const [id, setID] = useState('');
     const [focusedItem, setFocusedItem] = useState();
     const [selectedItems, setSelectedItems] = useState([]);
     const [showZeroDcmts, setShowZeroDcmts] = useState(false);
     const [allowMultipleSelection, setAllowMultipleSelection] = useState(false);
     const [dtdMaster, setDtdMaster] = useState();
-    useEffect(() => { setID(genUniqueId()); }, []);
+    const [noRelationsOnFirstLoad, setNoRelationsOnFirstLoad] = useState(false);
+    const [isCheckingFirstLoad, setIsCheckingFirstLoad] = useState(true);
     // Load dtdMaster when inputDcmts changes
     useEffect(() => {
         const loadDtdMaster = async () => {
@@ -40,10 +41,31 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
     }, [inputDcmts?.length, inputDcmts?.[0]?.TID, isForMaster]);
     const handleFocusedItemChanged = useCallback((item) => {
         setFocusedItem(item);
+        if (item) {
+            setIsCheckingFirstLoad(false);
+        }
     }, []);
     const handleSelectedItemsChanged = useCallback((items) => {
         setSelectedItems(items);
     }, []);
+    const handleNoRelationsFound = useCallback(() => {
+        if (isCheckingFirstLoad) {
+            setNoRelationsOnFirstLoad(true);
+        }
+    }, [isCheckingFirstLoad]);
+    // Show warning alert and navigate back when no relations found on first load
+    useEffect(() => {
+        if (noRelationsOnFirstLoad) {
+            setNoRelationsOnFirstLoad(false);
+            ShowAlert({
+                message: SDKUI_Localizator.RelatedDcmtsNotFound,
+                title: SDKUI_Localizator.RelationsNotFound,
+                duration: 3000,
+                mode: 'warning',
+            });
+            onBack?.();
+        }
+    }, [noRelationsOnFirstLoad, onBack]);
     const commandsMenuItems = [
         {
             icon: _jsx(IconMultipleSelection, { color: allowMultipleSelection ? TMColors.tertiary : TMColors.text_normal }),
@@ -66,85 +88,9 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
             onClick: () => {
                 appendMasterDcmts?.(focusedItem?.tid, focusedItem?.did);
             }
-        },
-        {
-            icon: _jsx(IconMail, {}),
-            name: "Invia per posta",
-            disabled: false,
-            beginGroup: true,
-            submenu: [
-                {
-                    icon: _jsx(IconMail, {}),
-                    name: "I documenti selezionati",
-                    disabled: false,
-                    onClick: () => ShowAlert({ message: "TODO", mode: 'info', title: `${"TODO"}`, duration: 3000 })
-                },
-                {
-                    icon: _jsx(IconMail, {}),
-                    name: "I documenti di primo livello e tutti i documenti correlati",
-                    disabled: false,
-                    onClick: () => ShowAlert({ message: "TODO", mode: 'info', title: `${"TODO"}`, duration: 3000 })
-                },
-                {
-                    icon: _jsx(IconMail, {}),
-                    name: "I documenti di primo livello e i documenti correlati personalizzando l'operazione",
-                    disabled: false,
-                    onClick: () => ShowAlert({ message: "TODO", mode: 'info', title: `${"TODO"}`, duration: 3000 })
-                },
-            ]
-        },
-        {
-            icon: _jsx(IconDcmtTypeOnlyMetadata, {}),
-            name: "Unisci in un file PDF",
-            disabled: false,
-            submenu: [
-                {
-                    icon: _jsx(IconDcmtTypeOnlyMetadata, {}),
-                    name: "I documenti selezionati",
-                    disabled: false,
-                    onClick: () => ShowAlert({ message: "TODO", mode: 'info', title: `${"TODO"}`, duration: 3000 })
-                },
-                {
-                    icon: _jsx(IconDcmtTypeOnlyMetadata, {}),
-                    name: "I documenti di primo livello e tutti i documenti correlati",
-                    disabled: false,
-                    onClick: () => ShowAlert({ message: "TODO", mode: 'info', title: `${"TODO"}`, duration: 3000 })
-                },
-                {
-                    icon: _jsx(IconDcmtTypeOnlyMetadata, {}),
-                    name: "I documenti di primo livello e i documenti correlati personalizzando l'operazione",
-                    disabled: false,
-                    onClick: () => ShowAlert({ message: "TODO", mode: 'info', title: `${"TODO"}`, duration: 3000 })
-                },
-            ]
-        },
-        {
-            icon: _jsx(IconCopy, {}),
-            name: "Copia in una cartella",
-            disabled: false,
-            submenu: [
-                {
-                    icon: _jsx(IconCopy, {}),
-                    name: "I documenti selezionati",
-                    disabled: false,
-                    onClick: () => ShowAlert({ message: "TODO", mode: 'info', title: `${"TODO"}`, duration: 3000 })
-                },
-                {
-                    icon: _jsx(IconCopy, {}),
-                    name: "I documenti di primo livello e tutti i documenti correlati",
-                    disabled: false,
-                    onClick: () => ShowAlert({ message: "TODO", mode: 'info', title: `${"TODO"}`, duration: 3000 })
-                },
-                {
-                    icon: _jsx(IconCopy, {}),
-                    name: "I documenti di primo livello e i documenti correlati personalizzando l'operazione",
-                    disabled: false,
-                    onClick: () => ShowAlert({ message: "TODO", mode: 'info', title: `${"TODO"}`, duration: 3000 })
-                },
-            ]
         }
     ];
-    const toolbar = _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '10px' }, children: [allowMultipleSelection && _jsx("p", { style: { color: TMColors.colorHeader, textAlign: 'center', padding: '1px 4px', borderRadius: '3px', display: 'flex' }, children: `${selectedItems.length} selezionati` }), allowNavigation && canPrev != undefined && _jsx(TMSaveFormButtonPrevious, { btnStyle: 'icon', iconColor: 'white', isModified: false, formMode: FormModes.ReadOnly, canPrev: canPrev, onPrev: onPrev }), allowNavigation && canNext != undefined && _jsx(TMSaveFormButtonNext, { btnStyle: 'icon', iconColor: 'white', isModified: false, formMode: FormModes.ReadOnly, canNext: canNext, onNext: onNext }), _jsx(TMContextMenu, { items: commandsMenuItems, trigger: 'left', children: _jsx(IconMenuVertical, { color: 'white', cursor: 'pointer' }) })] });
+    const toolbar = _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '10px' }, children: [allowMultipleSelection && _jsx("p", { style: { color: TMColors.colorHeader, textAlign: 'center', padding: '1px 4px', borderRadius: '3px', display: 'flex' }, children: `${selectedItems.filter(item => item.isDcmt).length} selezionati` }), allowNavigation && canPrev != undefined && _jsx(TMSaveFormButtonPrevious, { btnStyle: 'icon', iconColor: 'white', isModified: false, formMode: FormModes.ReadOnly, canPrev: canPrev, onPrev: onPrev }), allowNavigation && canNext != undefined && _jsx(TMSaveFormButtonNext, { btnStyle: 'icon', iconColor: 'white', isModified: false, formMode: FormModes.ReadOnly, canNext: canNext, onNext: onNext }), _jsx(TMContextMenu, { items: commandsMenuItems, trigger: 'left', children: _jsx(IconMenuVertical, { color: 'white', cursor: 'pointer' }) })] });
     const getTitle = () => isForMaster ? `${SDKUI_Localizator.DcmtsMaster} - ${dtdMaster?.nameLoc}` : SDKUI_Localizator.DcmtsDetail;
     const isMobile = deviceType === DeviceType.MOBILE;
     const tmTreeView = useMemo(() => _jsx(_Fragment, { children: !inputDcmts || inputDcmts.length === 0
@@ -153,7 +99,7 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
             :
                 _jsx(TMRelationViewerWrapper, { inputDcmts: inputDcmts, isForMaster: isForMaster, showCurrentDcmtIndicator: showCurrentDcmtIndicator, showZeroDcmts: showZeroDcmts, 
                     // customItemRender={customItemRender}
-                    allowMultipleSelection: allowMultipleSelection, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: handleFocusedItemChanged, onSelectedItemsChanged: handleSelectedItemsChanged }) }), [inputDcmts, isForMaster, showCurrentDcmtIndicator, showZeroDcmts, allowMultipleSelection, focusedItem, selectedItems, handleFocusedItemChanged, handleSelectedItemsChanged]);
+                    allowMultipleSelection: allowMultipleSelection, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: handleFocusedItemChanged, onSelectedItemsChanged: handleSelectedItemsChanged, onNoRelationsFound: handleNoRelationsFound }) }), [inputDcmts, isForMaster, showCurrentDcmtIndicator, showZeroDcmts, allowMultipleSelection, focusedItem, selectedItems, handleFocusedItemChanged, handleSelectedItemsChanged, handleNoRelationsFound]);
     const tmFormOrResult = useMemo(() => _jsx(TMFormOrResultWrapper, { deviceType: deviceType, focusedItem: focusedItem, onTaskCreateRequest: onTaskCreateRequest, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), [focusedItem, deviceType, allTasks, handleNavigateToWGs, handleNavigateToDossiers]);
     const initialPanelDimensions = {
         'tmTreeView': { width: '50%', height: '100%' },
@@ -231,7 +177,7 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
             toolbarOptions: { icon: _jsx(IconSearchCheck, { fontSize: 24 }), visible: false, orderNumber: 2, isActive: allInitialPanelVisibility['tmFormOrResult'] }
         }
     ], [tmTreeView, tmFormOrResult, focusedItem?.isDcmt, dtdMaster]);
-    return (_jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'tmTreeView', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }));
+    return (_jsxs("div", { style: { width: '100%', height: '100%', position: 'relative' }, children: [isCheckingFirstLoad && (_jsx(Spinner, { description: SDKUI_Localizator.Loading, flat: true })), _jsx("div", { style: isCheckingFirstLoad ? { position: 'absolute', width: 0, height: 0, overflow: 'hidden', opacity: 0, pointerEvents: 'none' } : { width: '100%', height: '100%' }, children: _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'tmTreeView', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }) })] }));
 };
 export default TMMasterDetailDcmts;
 /**
@@ -240,7 +186,7 @@ export default TMMasterDetailDcmts;
  * - Panel visibility toggling
  * - Focus delay handling
  */
-const TMRelationViewerWrapper = ({ inputDcmts, isForMaster, showCurrentDcmtIndicator, showZeroDcmts, customItemRender, allowMultipleSelection, focusedItem, selectedItems, onFocusedItemChanged, onSelectedItemsChanged }) => {
+const TMRelationViewerWrapper = ({ inputDcmts, isForMaster, showCurrentDcmtIndicator, showZeroDcmts, customItemRender, allowMultipleSelection, focusedItem, selectedItems, onFocusedItemChanged, onSelectedItemsChanged, onNoRelationsFound }) => {
     const { setPanelVisibilityById, setToolbarButtonVisibility } = useTMPanelManagerContext();
     // Handle focused item changes with panel visibility management
     const handleFocusedItemChanged = useCallback((item) => {
@@ -259,7 +205,7 @@ const TMRelationViewerWrapper = ({ inputDcmts, isForMaster, showCurrentDcmtIndic
             setToolbarButtonVisibility('tmDcmtForm', false);
         }
     }, [onFocusedItemChanged, setPanelVisibilityById, setToolbarButtonVisibility]);
-    return (_jsx(TMRelationViewer, { inputDcmts: inputDcmts, isForMaster: isForMaster, showCurrentDcmtIndicator: showCurrentDcmtIndicator, initialShowZeroDcmts: showZeroDcmts, customItemRender: customItemRender, allowMultipleSelection: allowMultipleSelection, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: handleFocusedItemChanged, onSelectedItemsChanged: onSelectedItemsChanged, maxDepthLevel: 1, invertMasterNavigation: false }));
+    return (_jsx(TMRelationViewer, { inputDcmts: inputDcmts, isForMaster: isForMaster, showCurrentDcmtIndicator: showCurrentDcmtIndicator, initialShowZeroDcmts: showZeroDcmts, customItemRender: customItemRender, allowMultipleSelection: allowMultipleSelection, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: handleFocusedItemChanged, onSelectedItemsChanged: onSelectedItemsChanged, maxDepthLevel: 1, invertMasterNavigation: false, onNoRelationsFound: onNoRelationsFound }));
 };
 const TMFormOrResultWrapper = ({ deviceType, focusedItem, onTaskCreateRequest, allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers }) => {
     const { setPanelVisibilityById } = useTMPanelManagerContext();
@@ -267,7 +213,7 @@ const TMFormOrResultWrapper = ({ deviceType, focusedItem, onTaskCreateRequest, a
             _jsx(TMDcmtForm, { groupId: 'tmFormOrResult', TID: focusedItem?.tid, DID: focusedItem.did, allowButtonsRefs: true, isClosable: deviceType !== DeviceType.MOBILE, allowNavigation: false, allowRelations: deviceType !== DeviceType.MOBILE, showDcmtFormSidebar: false, onClose: () => {
                     setPanelVisibilityById('tmTreeView', true);
                 }, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, moreInfoTasks: getMoreInfoTasksForDocument(allTasks, focusedItem?.tid, focusedItem?.did) }) :
-            _jsx(TMSearchResult, { groupId: 'tmFormOrResult', isClosable: deviceType !== DeviceType.MOBILE, context: SearchResultContext.METADATA_SEARCH, allowFloatingBar: false, allowRelations: false, openDcmtFormAsModal: true, searchResults: focusedItem?.searchResult ?? [], showSearchResultSidebar: false, onTaskCreateRequest: onTaskCreateRequest, onClose: () => {
+            _jsx(TMSearchResult, { groupId: 'tmFormOrResult', isClosable: deviceType !== DeviceType.MOBILE, context: SearchResultContext.METADATA_SEARCH, allowFloatingBar: false, allowRelations: false, openDcmtFormAsModal: true, searchResults: focusedItem?.searchResult ?? [], showSearchResultSidebar: false, showDcmtFormSidebar: false, onTaskCreateRequest: onTaskCreateRequest, onClose: () => {
                     setPanelVisibilityById('tmTreeView', true);
                 }, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }) }));
 };

package/lib/components/features/documents/TMRelationViewer.d.ts

@@ -16,8 +16,9 @@ export interface RelationTreeItem extends ITMTreeItem {
     isRoot?: boolean;
     isMaster?: boolean;
     isCorrelated?: boolean;
-    isLoaded?: boolean;
     isSeparator?: boolean;
+    isInfoMessage?: boolean;
+    isLogDel?: number;
     values?: any;
     searchResult?: SearchResultDescriptor[];
     itemsCount?: number;
@@ -92,6 +93,11 @@ export interface TMRelationViewerProps {
      * If not provided, uses the document type name.
      */
     labelMainContainer?: string;
+    /**
+     * Callback invoked when no relations are found for any of the input documents.
+     * Useful to notify parent component that there are no correlated documents to display.
+     */
+    onNoRelationsFound?: () => void;
 }
 /**
  * Check if document type has detail relations