@topconsultnpm/sdkui-react 6.20.0-dev1.99 → 6.20.0-dev2.1

package/lib/components/features/search/TMSearchResult.js

@@ -3,7 +3,7 @@ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { SDK_Globals, DataColumnTypes, MetadataDataDomains, DataListViewModes, MetadataFormats, LayoutModes, DcmtTypeListCacheService, SystemMIDsAsNumber, RetrieveFileOptions, DcmtOpers, GeneralRetrieveFormats, AccessLevelsEx, LayoutCacheService, UserListCacheService } from '@topconsultnpm/sdk-ts';
 import styled from 'styled-components';
 import { getAllFieldSelectedDcmtsOrFocused, getCommandsMenuItems, getSelectedDcmtsOrFocused } from './TMSearchResultsMenuItems';
-import { genUniqueId, IconShow, IconBoard, IconDcmtTypeSys, SDKUI_Localizator, IconDelete, IconRefresh, IconMenuVertical, deepCompare, generateUniqueColumnKeys, searchResultDescriptorToSimpleArray, searchResultToMetadataValues, IconSearchCheck, TMImageLibrary, convertSearchResultDescriptorToFileItems, IconCustom, isApprovalWorkflowView, SDKUI_Globals, getMoreInfoTasksForDocument } from '../../../helper';
+import { genUniqueId, IconShow, IconBoard, IconDcmtTypeSys, SDKUI_Localizator, IconDelete, IconRefresh, IconMenuVertical, deepCompare, generateUniqueColumnKeys, searchResultDescriptorToSimpleArray, searchResultToMetadataValues, IconSearchCheck, TMImageLibrary, convertSearchResultDescriptorToFileItems, IconCustom, isApprovalWorkflowView, SDKUI_Globals, getMoreInfoTasksForDocument, IconInfo, IconCache } from '../../../helper';
 import { useDcmtOperations } from '../../../hooks/useDcmtOperations';
 import { useInputAttachmentsDialog, useInputCvtFormatDialog } from '../../../hooks/useInputDialog';
 import { useRelatedDocuments } from '../../../hooks/useRelatedDocuments';
@@ -36,6 +36,7 @@ import ShowAlert from '../../base/TMAlert';
 import TMSpinner from '../../base/TMSpinner';
 import TMChooserForm from '../../forms/TMChooserForm';
 import TMModal from '../../base/TMModal';
+import TMTooltip from '../../base/TMTooltip';
 import TMSearch from './TMSearch';
 import TMArchive from '../archive/TMArchive';
 import TMCustomButton from '../../base/TMCustomButton';
@@ -44,6 +45,7 @@ import { getDcmtCicoStatus } from '../../../helper/checkinCheckoutManager';
 import TMViewHistoryDcmt from './TMViewHistoryDcmt';
 import TMBlogCommentForm from '../blog/TMBlogCommentForm';
 import { useCheckInOutOperations } from '../../../hooks/useCheckInOutOperations';
+import { useFloatingBarPinnedItems } from '../../../hooks/useFloatingBarPinnedItems';
 import TMDcmtCheckoutInfoForm from './TMDcmtCheckoutInfoForm';
 import { useDataListItem } from '../../../hooks/useDataListItem';
 import { useDataUserIdItem } from '../../../hooks/useDataUserIdItem';
@@ -96,6 +98,9 @@ const TMSearchResult = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, a
     // State to control whether the export form (for exporting to Excel/CSV/txt and others) should be shown
     const [showExportForm, setShowExportForm] = useState(false);
     const [showSignSettingsForm, setShowSignSettingsForm] = useState(false);
+    const [indexingInfoCache, setIndexingInfoCache] = useState(new Map());
+    const [showIndexingInfo, setShowIndexingInfo] = useState(false);
+    const [loadingIndexingInfo, setLoadingIndexingInfo] = useState(false);
     const floatingBarContainerRef = useRef(null);
     const [confirmFormat, ConfirmFormatDialog] = useInputCvtFormatDialog();
     const { openConfirmAttachmentsDialog, ConfirmAttachmentsDialog } = useInputAttachmentsDialog();
@@ -107,6 +112,7 @@ const TMSearchResult = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, a
     const [customButton, setCustomButton] = useState();
     const deviceType = useDeviceType();
     const isMobile = deviceType === DeviceType.MOBILE;
+    const { pinnedItemIds, togglePin, setPinnedItemIds } = useFloatingBarPinnedItems();
     const selectedDocs = getSelectedDcmtsOrFocused(selectedItems, focusedItem);
     const allFieldSelectedDocs = useMemo(() => getAllFieldSelectedDcmtsOrFocused(selectedItems, focusedItem), [selectedItems, focusedItem]);
     // Disable the "Sign/Approve" button if:
@@ -594,14 +600,14 @@ const TMSearchResult = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, a
             && !showTodoDcmtForm);
     }, [showToppyForApprove, showToppyDraggableHelpCenter, selectedDocs, showApprovePopup, showRejectPopup, showReAssignPopup, showMoreInfoPopup, editPdfForm, openS4TViewer, showTodoDcmtForm]);
     const floatingMenuItems = useMemo(() => {
-        const baseMenuItems = getCommandsMenuItems(isMobile, fromDTD, allUsers, selectedItems, focusedItem, context, showFloatingBar, workingGroupContext, showSearch, setShowFloatingBar, openFormHandler, openSharedArchiveHandler, showSharedDcmtsHandler, downloadDcmtsAsync, runOperationAsync, onRefreshSearchAsync, refreshSelectionDataRowsAsync, onRefreshAfterAddDcmtToFavs, confirmFormat, openConfirmAttachmentsDialog, openTaskFormHandler, openDetailDcmtsFormHandler, openMasterDcmtsFormHandler, openBatchUpdateFormHandler, openExportForm, handleToggleSearch, handleSignApprove, openSignSettingsForm, handleCheckOutOperationCallback, handleCheckInOperationCallback, showCheckoutInformationFormCallback, showHistoryCallback, copyCheckoutPathToClipboardOperationCallback, openWGsCopyMoveForm, openCommentFormCallback, openEditPdf, openAddDocumentForm, passToArchiveCallback, archiveMasterDocuments, archiveDetailDocuments, currentTIDHasMasterRelations, currentTIDHasDetailRelations, canArchiveMasterRelation, canArchiveDetailRelation, pairManyToMany, hasManyToManyRelation);
+        const baseMenuItems = getCommandsMenuItems(isMobile, fromDTD, allUsers, selectedItems, focusedItem, context, showFloatingBar, workingGroupContext, showSearch, setShowFloatingBar, openFormHandler, openSharedArchiveHandler, showSharedDcmtsHandler, downloadDcmtsAsync, runOperationAsync, onRefreshSearchAsync, refreshSelectionDataRowsAsync, onRefreshAfterAddDcmtToFavs, confirmFormat, openConfirmAttachmentsDialog, openTaskFormHandler, openDetailDcmtsFormHandler, openMasterDcmtsFormHandler, openBatchUpdateFormHandler, openExportForm, handleToggleSearch, handleSignApprove, openSignSettingsForm, handleCheckOutOperationCallback, handleCheckInOperationCallback, showCheckoutInformationFormCallback, showHistoryCallback, copyCheckoutPathToClipboardOperationCallback, openWGsCopyMoveForm, openCommentFormCallback, openEditPdf, openAddDocumentForm, passToArchiveCallback, archiveMasterDocuments, archiveDetailDocuments, currentTIDHasMasterRelations, currentTIDHasDetailRelations, canArchiveMasterRelation, canArchiveDetailRelation, pairManyToMany, hasManyToManyRelation, pinnedItemIds, togglePin);
         const customButtons = customButtonMenuItems();
         return customButtons.name ? baseMenuItems.concat([customButtons]) : baseMenuItems;
     }, [
         isMobile, fromDTD, allUsers, selectedItems, focusedItem, context,
         showFloatingBar, workingGroupContext, showSearch, currentTIDHasMasterRelations,
         currentTIDHasDetailRelations, canArchiveMasterRelation, canArchiveDetailRelation,
-        hasManyToManyRelation, customButtonsLayout
+        hasManyToManyRelation, customButtonsLayout, pinnedItemIds, togglePin
     ]);
     const searchResutlToolbar = _jsxs(_Fragment, { children: [(dcmtsReturned != dcmtsFound) && _jsx("p", { style: { textAlign: 'center', padding: '1px 4px', borderRadius: '3px', display: 'flex' }, children: `${dcmtsReturned}/${dcmtsFound} restituiti` }), context === SearchResultContext.FAVORITES_AND_RECENTS &&
                 _jsx("div", { style: { display: 'flex', alignItems: 'center', gap: '5px' }, children: _jsx(TMButton, { btnStyle: 'icon', icon: _jsx(IconDelete, { color: 'white' }), caption: "Rimuovi da " + (selectedSearchResult?.category === "Favorites" ? '"Preferiti"' : '"Recenti"'), disabled: getSelectedDcmtsOrFocused(selectedItems, focusedItem).length <= 0, onClick: removeDcmtFromFavsOrRecents }) }), _jsx(TMButton, { btnStyle: 'icon', icon: _jsx(IconRefresh, { color: 'white' }), caption: SDKUI_Localizator.Refresh, onClick: onRefreshSearchAsync }), _jsx(TMContextMenu, { items: floatingMenuItems, trigger: "left", children: _jsx(IconMenuVertical, { color: 'white', cursor: 'pointer' }) })] });
@@ -612,7 +618,7 @@ const TMSearchResult = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, a
                                                 _jsx(TMLayoutItem, { children: _jsx(TMSearchResultSelector, { searchResults: currentSearchResults, disableAccordionIfSingleCategory: disableAccordionIfSingleCategory, selectedTID: selectedSearchResultTID, selectedSearchResult: selectedSearchResult, autoSelectFirst: !isMobile || currentSearchResults.length === 1, onSelectionChanged: onSearchResultSelectionChanged }) })
                                                 :
                                                     _jsx(_Fragment, {}), _jsx(TMLayoutItem, { children: _jsx(TMSearchResultGrid, { showSearch: showSearch, fromDTD: fromDTD, allUsers: allUsers, inputFocusedItem: focusedItem, inputSelectedItems: selectedItems, searchResult: searchResults.length > 1 ? selectedSearchResult : searchResults[0], lastUpdateSearchTime: lastUpdateSearchTime, openInOffice: openInOffice, onDblClick: () => openFormHandler(LayoutModes.Update), floatingMenuItems: floatingMenuItems, onSelectionChanged: (items) => { setSelectedItems(items); }, onVisibleItemChanged: setVisibleItems, onFocusedItemChanged: setFocusedItem, onDownloadDcmtsAsync: async (inputDcmts, downloadType, downloadMode, _y, confirmAttachments) => await downloadDcmtsAsync(inputDcmts, downloadType, downloadMode, onFileOpened, confirmAttachments), showExportForm: showExportForm, onCloseExportForm: onCloseExportForm }) })] }), allowFloatingBar && showFloatingBar && deviceType !== DeviceType.MOBILE &&
-                                        _jsx(TMFloatingMenuBar, { containerRef: floatingBarContainerRef, contextMenuItems: floatingMenuItems, isConstrained: true, defaultPosition: { x: 1, y: 88 }, contextMenuDefaultPinnedIds: ['rel-det', 'rel-mst', 'dl'], defaultOrientation: 'horizontal' })] }), showApprovePopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: onWFOperationCompleted, selectedItems: getSelectedDcmtsOrFocused(selectedItems, focusedItem), isReject: 0, onClose: () => setShowApprovePopup(false) }), showRejectPopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: onWFOperationCompleted, selectedItems: getSelectedDcmtsOrFocused(selectedItems, focusedItem), isReject: 1, onClose: () => setShowRejectPopup(false) }), showReAssignPopup && _jsx(WorkFlowReAssignPopUp, { deviceType: deviceType, onCompleted: onWFOperationCompleted, selectedItems: getSelectedDcmtsOrFocused(selectedItems, focusedItem), onClose: () => setShowReAssignPopup(false) }), showMoreInfoPopup && _jsx(WorkFlowMoreInfoPopUp, { TID: focusedItem?.TID, DID: focusedItem?.DID, deviceType: deviceType, onCompleted: onWFOperationCompleted, onClose: () => setShowMoreInfoPopup(false) }), isOpenBatchUpdate && _jsx(TMBatchUpdateForm, { isModal: true, titleModal: `${SDKUI_Localizator.BatchUpdate} (${getSelectionDcmtInfo().length} documenti selezionati)`, inputDcmts: getSelectionDcmtInfo(), TID: focusedItem ? focusedItem?.TID : selectedItems[0]?.TID, DID: focusedItem ? focusedItem?.DID : selectedItems[0]?.DID, onBack: () => {
+                                        _jsx(TMFloatingMenuBar, { containerRef: floatingBarContainerRef, contextMenuItems: floatingMenuItems, isConstrained: true, defaultPosition: { x: 1, y: 88 }, defaultPinnedItems: ['rel-det', 'rel-mst', 'dl'], defaultOrientation: 'horizontal', hasContextMenu: false, pinnedItemIds: pinnedItemIds, onPinChange: setPinnedItemIds })] }), showApprovePopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: onWFOperationCompleted, selectedItems: getSelectedDcmtsOrFocused(selectedItems, focusedItem), isReject: 0, onClose: () => setShowApprovePopup(false) }), showRejectPopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: onWFOperationCompleted, selectedItems: getSelectedDcmtsOrFocused(selectedItems, focusedItem), isReject: 1, onClose: () => setShowRejectPopup(false) }), showReAssignPopup && _jsx(WorkFlowReAssignPopUp, { deviceType: deviceType, onCompleted: onWFOperationCompleted, selectedItems: getSelectedDcmtsOrFocused(selectedItems, focusedItem), onClose: () => setShowReAssignPopup(false) }), showMoreInfoPopup && _jsx(WorkFlowMoreInfoPopUp, { TID: focusedItem?.TID, DID: focusedItem?.DID, deviceType: deviceType, onCompleted: onWFOperationCompleted, onClose: () => setShowMoreInfoPopup(false) }), isOpenBatchUpdate && _jsx(TMBatchUpdateForm, { isModal: true, titleModal: `${SDKUI_Localizator.BatchUpdate} (${getSelectionDcmtInfo().length} documenti selezionati)`, inputDcmts: getSelectionDcmtInfo(), TID: focusedItem ? focusedItem?.TID : selectedItems[0]?.TID, DID: focusedItem ? focusedItem?.DID : selectedItems[0]?.DID, onBack: () => {
                                     setIsOpenBatchUpdate(false);
                                 }, onSavedCallbackAsync: async () => {
                                     setIsOpenBatchUpdate(false);
@@ -730,17 +736,65 @@ const TMSearchResult = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, a
     const tmBlog = useMemo(() => _jsx(TMDcmtBlog, { tid: focusedItem?.TID, did: focusedItem?.DID, fetchBlogDataTrigger: refreshBlogTrigger, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), [focusedItem, allTasks, refreshBlogTrigger, handleNavigateToWGs, handleNavigateToDossiers]);
     const tmSysMetadata = useMemo(() => _jsx(TMMetadataValues, { layoutMode: LayoutModes.Update, openChooserBySingleClick: true, TID: focusedItem?.TID, isReadOnly: true, deviceType: deviceType, metadataValues: currentMetadataValues.filter(o => (o.mid != undefined && o.mid <= 100)), metadataValuesOrig: currentMetadataValues.filter(o => (o.mid != undefined && o.mid <= 100)), validationItems: [] }), [focusedItem, currentMetadataValues, deviceType]);
     const tmDcmtPreview = useMemo(() => _jsx(TMDcmtPreviewWrapper, { currentDcmt: currentDcmt }, refreshPreviewTrigger), [currentDcmt, refreshPreviewTrigger]);
+    const handleToggleIndexingInfo = async () => {
+        if (!focusedItem)
+            return;
+        if (showIndexingInfo) {
+            setShowIndexingInfo(false);
+            return;
+        }
+        const cacheKey = `${focusedItem.TID}-${focusedItem.DID}`;
+        if (indexingInfoCache.has(cacheKey)) {
+            setShowIndexingInfo(true);
+            return;
+        }
+        try {
+            setLoadingIndexingInfo(true);
+            const msg = await SDK_Globals.tmSession?.NewSearchEngine().FreeSearchGetDcmtInfoAsync(focusedItem.TID, focusedItem.DID);
+            setIndexingInfoCache(prev => new Map(prev).set(cacheKey, msg ?? ''));
+            setShowIndexingInfo(true);
+        }
+        catch (e) {
+            TMExceptionBoxManager.show({ exception: e });
+        }
+        finally {
+            setLoadingIndexingInfo(false);
+        }
+    };
+    const tmFullTextSearch = useMemo(() => {
+        if (!focusedItem) {
+            return (_jsxs(StyledPlaceholder, { children: [" ", _jsx("p", { children: "Seleziona un documento per visualizzare i dettagli della ricerca full-text" }), " "] }));
+        }
+        // const ftExplanationsColumnIndex = selectedSearchResult?.dtdResult?.columns?.findIndex( col => col.caption === 'FTExplanations' );
+        const ftExplanationsColumnIndex = selectedSearchResult?.selectMIDs?.findIndex(mid => mid === 0); //nosonar
+        if (ftExplanationsColumnIndex === undefined || ftExplanationsColumnIndex < 0) {
+            return (_jsxs(StyledPlaceholder, { children: [" ", _jsx("p", { children: "Nessuna info full-text disponibile" }), " "] }));
+        }
+        const row = selectedSearchResult?.dtdResult?.rows?.[focusedItem.rowIndex];
+        if (!row) {
+            return (_jsxs(StyledPlaceholder, { children: [" ", _jsx("p", { children: "Documento non trovato" }), " "] }));
+        }
+        const ftExplanation = row[ftExplanationsColumnIndex];
+        if (!ftExplanation) {
+            return (_jsxs(StyledPlaceholder, { children: [" ", _jsx("p", { children: "Nessuna info disponibile per questo documento" }), " "] }));
+        }
+        const cacheKey = `${focusedItem.TID}-${focusedItem.DID}`;
+        const cachedInfo = indexingInfoCache.get(cacheKey);
+        return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', height: '100%', overflow: 'hidden' }, children: [_jsx("div", { style: { padding: '10px', overflow: 'auto', flex: 1 }, children: _jsx("div", { dangerouslySetInnerHTML: { __html: ftExplanation } }) }), _jsxs(StyledIndexingInfoSection, { children: [_jsxs(StyledIndexingToggle, { onClick: handleToggleIndexingInfo, disabled: loadingIndexingInfo, children: [_jsxs(StyledLeftContent, { children: [_jsx(IconInfo, {}), _jsx("span", { children: showIndexingInfo ? 'Nascondi info' : SDKUI_Localizator.IndexingInformation })] }), _jsxs(StyledRightContent, { children: [cachedInfo && (_jsx(TMTooltip, { content: "Da cache", children: _jsx(StyledCachedIcon, { children: _jsx(IconCache, {}) }) })), _jsx(StyledChevron, { "$isOpen": showIndexingInfo, children: "\u25BC" })] })] }), loadingIndexingInfo && (_jsxs("div", { style: { marginTop: '10px', color: '#666' }, children: [SDKUI_Localizator.Loading, "..."] })), showIndexingInfo && cachedInfo && !loadingIndexingInfo && (_jsx(StyledIndexingInfoBox, { children: _jsx("div", { dangerouslySetInnerHTML: { __html: cachedInfo } }) }))] })] }));
+    }, [selectedSearchResult, focusedItem, indexingInfoCache, showIndexingInfo, loadingIndexingInfo]);
     const allInitialPanelVisibility = {
         'tmSearchResult': true,
         'tmBlog': false,
         'tmSysMetadata': false,
         'tmDcmtPreview': false,
+        // 'tmFullTextSearch': false,
     };
     const initialPanelDimensions = {
         'tmSearchResult': { width: '25%', height: '100%' },
         'tmBlog': { width: '25%', height: '100%' },
         'tmSysMetadata': { width: '25%', height: '100%' },
         'tmDcmtPreview': { width: '25%', height: '100%' },
+        // 'tmFullTextSearch': { width: '25%', height: '100%' },
     };
     const initialPanels = useMemo(() => [
         {
@@ -778,8 +832,16 @@ const TMSearchResult = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, a
             name: SDKUI_Localizator.PreviewDocument,
             contentOptions: { component: tmDcmtPreview },
             toolbarOptions: { icon: _jsx(IconShow, { fontSize: 24 }), visible: true, orderNumber: 4, isActive: allInitialPanelVisibility['tmDcmtPreview'] }
-        }
-    ], [tmSearchResult, tmBlog, tmSysMetadata, tmDcmtPreview, showToolbarHeader]);
+        },
+        // ...(context === SearchResultContext.FREE_SEARCH ? [
+        //     {
+        //         id: 'tmFullTextSearch',
+        //         name: 'Ricerca FullText',
+        //         contentOptions: { component: tmFullTextSearch, panelContainer: { title: 'Ricerca FullText', allowMaximize: !isMobile } },
+        //         toolbarOptions: { icon: <IconMenuFullTextSearch fontSize={24} />, visible: true, orderNumber: 5, isActive: allInitialPanelVisibility['tmFullTextSearch'] }
+        //     }
+        // ] : [])
+    ], [tmSearchResult, tmBlog, tmSysMetadata, tmDcmtPreview, tmFullTextSearch, showToolbarHeader, context, isMobile]);
     return (_jsxs(StyledMultiViewPanel, { "$isVisible": isVisible, children: [_jsx(StyledMultiViewPanel, { "$isVisible": !isOpenDcmtForm && !isOpenDetails && !isOpenMaster, style: {
                     display: 'flex',
                     flexDirection: isMobile ? 'column' : 'row',
@@ -792,7 +854,7 @@ const TMSearchResult = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, a
                             :
                                 _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'tmSearchResult', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", parentId: groupId, showToolbar: showSearchResultSidebar }) }) }) }) }), _jsx(StyledMultiViewPanel, { "$isVisible": isOpenDetails, children: isOpenDetails && _jsx(TMMasterDetailDcmts, { deviceType: deviceType, isForMaster: false, inputDcmts: getSelectionDcmtInfo(), allowNavigation: focusedItem && selectedItems.length <= 0, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), onBack: () => setIsOpenDetails(false), allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }) }), _jsxs(StyledMultiViewPanel, { "$isVisible": isOpenMaster, children: [isOpenMaster && _jsx(TMMasterDetailDcmts, { deviceType: deviceType, inputDcmts: getSelectionDcmtInfo(), isForMaster: true, allowNavigation: focusedItem && selectedItems.length <= 0, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), onBack: () => setIsOpenMaster(false), appendMasterDcmts: handleAddItem, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), secondaryMasterDcmts.length > 0 && secondaryMasterDcmts.map((dcmt, index) => {
                         return (_jsx(StyledModalContainer, { style: { backgroundColor: 'white' }, children: _jsx(TMMasterDetailDcmts, { deviceType: deviceType, inputDcmts: [dcmt], isForMaster: true, allowNavigation: false, onBack: () => handleRemoveItem(dcmt.TID, dcmt.DID), appendMasterDcmts: handleAddItem, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }) }, `${index}-${dcmt.DID}`));
-                    })] }), _jsx(StyledMultiViewPanel, { "$isVisible": isOpenDcmtForm, children: isOpenDcmtForm && focusedItem?.TID !== undefined && focusedItem?.DID !== undefined && _jsx(TMDcmtForm, { isModal: openDcmtFormAsModal || (dcmtFormLayoutMode === LayoutModes.Ark && focusedItem?.DID), titleModal: fromDTD?.name ?? '', TID: focusedItem.TID, DID: focusedItem.DID, allowButtonsRefs: true, layoutMode: dcmtFormLayoutMode, count: visibleItems.length, itemIndex: visibleItems.findIndex(o => o.rowIndex === focusedItem?.rowIndex) + 1, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), onClose: () => { setIsOpenDcmtForm(false); }, onWFOperationCompleted: onWFOperationCompleted, onTaskCreateRequest: onTaskCreateRequest, onSavedAsyncCallback: handleSavedAsyncCallback, openS4TViewer: openS4TViewer, onOpenS4TViewerRequest: onOpenS4TViewerRequest, onReferenceClick: onReferenceClick, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, moreInfoTasks: getMoreInfoTasksForDocument(allTasks, focusedItem?.TID, focusedItem?.DID) }) }), isOpenArchiveRelationForm && _jsx(TMDcmtForm, { isModal: true, titleModal: SDKUI_Localizator.Archive + ' - ' + (archiveType === 'detail' ? SDKUI_Localizator.DcmtsDetail : SDKUI_Localizator.DcmtsMaster), TID: archiveRelatedDcmtFormTID, layoutMode: LayoutModes.Ark, inputMids: archiveRelatedDcmtFormMids, showBackButton: false, allowButtonsRefs: false, onClose: () => {
+                    })] }), _jsx(StyledMultiViewPanel, { "$isVisible": isOpenDcmtForm, children: isOpenDcmtForm && focusedItem?.TID !== undefined && focusedItem?.DID !== undefined && _jsx(TMDcmtForm, { isModal: openDcmtFormAsModal || (dcmtFormLayoutMode === LayoutModes.Ark && focusedItem?.DID), titleModal: fromDTD?.name ?? '', TID: focusedItem.TID, DID: focusedItem.DID, allowButtonsRefs: true, layoutMode: dcmtFormLayoutMode, count: visibleItems.length, itemIndex: visibleItems.findIndex(o => o.rowIndex === focusedItem?.rowIndex) + 1, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), onClose: () => { setIsOpenDcmtForm(false); }, onWFOperationCompleted: onWFOperationCompleted, onTaskCreateRequest: onTaskCreateRequest, onSavedAsyncCallback: handleSavedAsyncCallback, openS4TViewer: openS4TViewer, onOpenS4TViewerRequest: onOpenS4TViewerRequest, onReferenceClick: onReferenceClick, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, moreInfoTasks: getMoreInfoTasksForDocument(allTasks, focusedItem?.TID, focusedItem?.DID), showDcmtFormSidebar: showSearchResultSidebar }) }), isOpenArchiveRelationForm && _jsx(TMDcmtForm, { isModal: true, titleModal: SDKUI_Localizator.Archive + ' - ' + (archiveType === 'detail' ? SDKUI_Localizator.DcmtsDetail : SDKUI_Localizator.DcmtsMaster), TID: archiveRelatedDcmtFormTID, layoutMode: LayoutModes.Ark, inputMids: archiveRelatedDcmtFormMids, showBackButton: false, allowButtonsRefs: false, onClose: () => {
                     setIsOpenArchiveRelationForm(false);
                     setArchiveType(undefined);
                     setArchiveRelatedDcmtFormTID(undefined);
@@ -803,7 +865,7 @@ const TMSearchResult = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, a
                     setArchiveRelatedDcmtFormTID(undefined);
                     setArchiveRelatedDcmtFormMids([]);
                     await onRefreshSearchAsync?.();
-                }, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), (showSignSettingsForm && fromDTD) && _jsx(TMSignSettingsForm, { fromDTD: fromDTD, inputDcmts: allFieldSelectedDocs, onCloseSignSettingsForm: closeSignSettingsForm, onSavedAsyncCallback: handleSavedAsyncCallback }), (showHistory && fromDTD && getSelectedDcmtsOrFocused(selectedItems, focusedItem).length > 0) && _jsx(TMViewHistoryDcmt, { fromDTD: fromDTD, deviceType: deviceType, inputDcmt: getSelectedDcmtsOrFocused(selectedItems, focusedItem)[0], onClose: hideHistoryCallback, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), (commentFormState.show && getSelectedDcmtsOrFocused(selectedItems, focusedItem).length > 0) && _jsx(TMBlogCommentForm, { context: { engine: 'SearchEngine', object: { tid: getSelectedDcmtsOrFocused(selectedItems, focusedItem)[0].TID, did: getSelectedDcmtsOrFocused(selectedItems, focusedItem)[0].DID } }, onClose: hideCommentFormCallback, refreshCallback: triggerBlogRefresh, participants: [], showAttachmentsSection: true, allArchivedDocumentsFileItems: convertSearchResultDescriptorToFileItems(currentSearchResults ?? []), isCommentRequired: commentFormState.isRequired, removeAndEditAttachment: commentFormState.removeAndEditAttachment, selectedAttachmentDid: [Number(getSelectedDcmtsOrFocused(selectedItems, focusedItem)[0].DID)] })] }));
+                }, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, showDcmtFormSidebar: showSearchResultSidebar }), (showSignSettingsForm && fromDTD) && _jsx(TMSignSettingsForm, { fromDTD: fromDTD, inputDcmts: allFieldSelectedDocs, onCloseSignSettingsForm: closeSignSettingsForm, onSavedAsyncCallback: handleSavedAsyncCallback }), (showHistory && fromDTD && getSelectedDcmtsOrFocused(selectedItems, focusedItem).length > 0) && _jsx(TMViewHistoryDcmt, { fromDTD: fromDTD, deviceType: deviceType, inputDcmt: getSelectedDcmtsOrFocused(selectedItems, focusedItem)[0], onClose: hideHistoryCallback, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), (commentFormState.show && getSelectedDcmtsOrFocused(selectedItems, focusedItem).length > 0) && _jsx(TMBlogCommentForm, { context: { engine: 'SearchEngine', object: { tid: getSelectedDcmtsOrFocused(selectedItems, focusedItem)[0].TID, did: getSelectedDcmtsOrFocused(selectedItems, focusedItem)[0].DID } }, onClose: hideCommentFormCallback, refreshCallback: triggerBlogRefresh, participants: [], showAttachmentsSection: true, allArchivedDocumentsFileItems: convertSearchResultDescriptorToFileItems(currentSearchResults ?? []), isCommentRequired: commentFormState.isRequired, removeAndEditAttachment: commentFormState.removeAndEditAttachment, selectedAttachmentDid: [Number(getSelectedDcmtsOrFocused(selectedItems, focusedItem)[0].DID)] })] }));
 };
 export default TMSearchResult;
 const TMSearchResultGrid = ({ openInOffice, fromDTD, allUsers, inputFocusedItem, showSearch, allowMultipleSelection = true, showExportForm = false, onCloseExportForm, onFocusedItemChanged, onDownloadDcmtsAsync, onVisibleItemChanged, inputSelectedItems = [], lastUpdateSearchTime, searchResult, floatingMenuItems, onSelectionChanged, onDblClick }) => {
@@ -1283,3 +1345,101 @@ const TMDcmtPreviewWrapper = ({ currentDcmt, isVisible }) => {
     const isMobile = deviceType === DeviceType.MOBILE;
     return (_jsx(TMDcmtPreview, { onClosePanel: (!isMobile && countVisibleLeafPanels() > 1) ? () => setPanelVisibilityById('tmDcmtPreview', false) : undefined, allowMaximize: !isMobile && countVisibleLeafPanels() > 1, onMaximizePanel: (!isMobile && countVisibleLeafPanels() > 1) ? () => toggleMaximize("tmDcmtPreview") : undefined, dcmtData: currentDcmt, isResizingActive: isResizingActive, isVisible: isVisible }));
 };
+// Styled Components
+const StyledPlaceholder = styled.div `
+    padding: 20px;
+    text-align: center;
+    color: #888;
+`;
+const StyledIndexingInfoSection = styled.div `
+    padding: 15px;
+    border-top: 1px solid #e0e0e0;
+    background: linear-gradient(to bottom, #f9f9f9, #f5f5f5);
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+`;
+const StyledIndexingToggle = styled.button `
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    padding: 10px 16px;
+    background: white;
+    border: 1px solid #d0d0d0;
+    border-radius: 6px;
+    cursor: ${props => props.disabled ? 'not-allowed' : 'pointer'};
+    transition: all 0.2s ease;
+    font-size: 14px;
+    font-weight: 500;
+    color: #333;
+    opacity: ${props => props.disabled ? 0.6 : 1};
+    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+
+    &:hover:not(:disabled) {
+        background: #f8f8f8;
+        border-color: #2196F3;
+        box-shadow: 0 2px 4px rgba(33, 150, 243, 0.2);
+    }
+
+    &:active:not(:disabled) {
+        transform: translateY(1px);
+        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
+    }
+
+    svg {
+        color: #2196F3;
+        font-size: 18px;
+    }
+`;
+const StyledLeftContent = styled.div `
+    display: flex;
+    align-items: center;
+    gap: 8px;
+`;
+const StyledRightContent = styled.div `
+    display: flex;
+    align-items: center;
+    gap: 8px;
+`;
+const StyledCachedIcon = styled.div `
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #4CAF50;
+    font-size: 16px;
+    
+    svg {
+        color: #4CAF50;
+    }
+`;
+const StyledChevron = styled.span `
+    transition: transform 0.2s ease;
+    transform: ${props => props.$isOpen ? 'rotate(180deg)' : 'rotate(0deg)'};
+    color: #666;
+    font-size: 12px;
+`;
+const StyledIndexingInfoBox = styled.div `
+    background: white;
+    border: 1px solid #e0e0e0;
+    border-radius: 6px;
+    padding: 12px;
+    max-height: 200px;
+    overflow: auto;
+    font-family: 'Courier New', monospace;
+    font-size: 12px;
+    color: #333;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    animation: slideDown 0.2s ease;
+
+    @keyframes slideDown {
+        from {
+            opacity: 0;
+            transform: translateY(-10px);
+        }
+        to {
+            opacity: 1;
+            transform: translateY(0);
+        }
+    }
+`;

package/lib/components/features/search/TMSearchResultsMenuItems.d.ts

@@ -8,4 +8,4 @@ export declare const signatureInformationCallback: (isMobile: boolean, inputDcmt
 export declare const getCommandsMenuItems: (isMobile: boolean, dtd: DcmtTypeDescriptor | undefined, allUsers: Array<UserDescriptor>, selectedItems: Array<any>, focusedItem: any, context: SearchResultContext, showFloatingBar: boolean, workingGroupContext: WorkingGroupDescriptor | undefined, showSearch: boolean, setShowFloatingBar: React.Dispatch<React.SetStateAction<boolean>>, openFormHandler: (layoutMode: LayoutModes) => void, openSharedArchiveHandler: () => Promise<void>, showSharedDcmtsHandler: () => Promise<void>, downloadDcmtsAsync: (inputDcmts: DcmtInfo[] | undefined, downloadType: DownloadTypes, downloadMode: DownloadModes, onFileDownloaded?: (dcmtFile: File | undefined) => void, confirmAttachments?: (list: FileDescriptor[]) => Promise<string[] | undefined>, skipConfirmation?: boolean) => Promise<void>, runOperationAsync: (inputDcmts: DcmtInfo[] | undefined, dcmtOperationType: DcmtOperationTypes, actionAfterOperationAsync?: () => Promise<void>) => Promise<void>, onRefreshSearchAsync: (() => Promise<void>) | undefined, onRefreshDataRowsAsync: (() => Promise<void>) | undefined, onRefreshAfterAddDcmtToFavs: (() => void) | undefined, confirmFormat: () => Promise<FileFormats>, confirmAttachments: (list: FileDescriptor[]) => Promise<string[] | undefined>, openTaskFormHandler: () => void, openDetailDcmtsFormHandler: (value: boolean) => void, openMasterDcmtsFormHandler: (value: boolean) => void, openBatchUpdateFormHandler: (value: boolean) => void, openExportForm: () => void, handleToggleSearch: () => void, handleSignApprove: () => void, openSignSettingsForm: () => void, handleCheckOutOperationCallback: (checkout: boolean) => Promise<void>, handleCheckInOperationCallback: () => void, showCheckoutInformationFormCallback: () => void, viewHistoryCallback: () => void, copyCheckoutPathToClipboardOperationCallback: () => void, openWGsCopyMoveForm?: ((mode: "copyToWgDraft" | "copyToWgArchivedDoc", dcmtTypeDescriptor: DcmtTypeDescriptor, documents: Array<DcmtInfo>) => void), openCommentFormCallback?: ((documents: Array<DcmtInfo>) => void), openEditPdf?: ((documents: Array<DcmtInfo>) => void), openAddDocumentForm?: () => void, passToArchiveCallback?: (outputMids: Array<{
     mid: number;
     value: string;
-}>, tid?: number) => void, archiveMasterDocuments?: (tid: number | undefined) => Promise<void>, archiveDetailDocuments?: (tid: number | undefined) => Promise<void>, hasMasterRelation?: boolean, hasDetailRelation?: boolean, canArchiveMasterRelation?: boolean, canArchiveDetailRelation?: boolean, pairManyToManyDocuments?: (isPairing: boolean) => Promise<void>, hasManyToManyRelation?: boolean) => Array<TMContextMenuItemProps>;
+}>, tid?: number) => void, archiveMasterDocuments?: (tid: number | undefined) => Promise<void>, archiveDetailDocuments?: (tid: number | undefined) => Promise<void>, hasMasterRelation?: boolean, hasDetailRelation?: boolean, canArchiveMasterRelation?: boolean, canArchiveDetailRelation?: boolean, pairManyToManyDocuments?: (isPairing: boolean) => Promise<void>, hasManyToManyRelation?: boolean, pinnedItemIds?: string[], onTogglePin?: (id: string) => void) => Array<TMContextMenuItemProps>;

package/lib/components/features/search/TMSearchResultsMenuItems.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { AccessLevels, AccessLevelsEx, AppModules, FileFormats, LayoutModes, SDK_Globals, DcmtTypeListCacheService, LicenseModuleStatus } from '@topconsultnpm/sdk-ts';
-import { IconActivity, IconArchiveDoc, IconBatchUpdate, IconCheckFile, IconCheckIn, IconCircleInfo, IconCloseCircle, IconConvertFilePdf, IconDelete, IconDotsVerticalCircleOutline, IconDownload, IconEdit, IconExportTo, IconFileDots, IconHide, IconInfo, IconMenuCAArchive, IconPlatform, IconPreview, IconRelation, IconSearch, IconShow, IconStar, IconSubstFile, IconUndo, IconUserGroupOutline, SDKUI_Localizator, searchResultToMetadataValues, IconSignaturePencil, IconArchiveMaster, IconArchiveDetail, IconDetailDcmts, isPdfEditorEnabled, IconPair, IconUnpair, IconSharedDcmt, IconShare, IconCopy, IconMoveToFolder } from '../../../helper';
+import { IconActivity, IconArchiveDoc, IconBatchUpdate, IconCheckFile, IconCheckIn, IconCircleInfo, IconCloseCircle, IconConvertFilePdf, IconDelete, IconDotsVerticalCircleOutline, IconDownload, IconEdit, IconExportTo, IconFileDots, IconHide, IconInfo, IconMenuCAArchive, IconPlatform, IconPreview, IconRelation, IconSearch, IconShow, IconStar, IconSubstFile, IconUndo, IconUserGroupOutline, SDKUI_Localizator, searchResultToMetadataValues, IconSignaturePencil, IconArchiveMaster, IconArchiveDetail, IconDetailDcmts, isPdfEditorEnabled, IconPair, IconUnpair, IconSharedDcmt, IconShare, IconCopy, IconMoveToFolder, IconPin } from '../../../helper';
 import ShowAlert from '../../base/TMAlert';
 import { TMMessageBoxManager, ButtonNames, TMExceptionBoxManager } from '../../base/TMPopUp';
 import TMSpinner from '../../base/TMSpinner';
@@ -80,8 +80,28 @@ export const signatureInformationCallback = async (isMobile, inputDcmts) => {
         TMSpinner.hide();
     }
 };
-export const getCommandsMenuItems = (isMobile, dtd, allUsers, selectedItems, focusedItem, context, showFloatingBar, workingGroupContext, showSearch, setShowFloatingBar, openFormHandler, openSharedArchiveHandler, showSharedDcmtsHandler, downloadDcmtsAsync, runOperationAsync, onRefreshSearchAsync, onRefreshDataRowsAsync, onRefreshAfterAddDcmtToFavs, confirmFormat, confirmAttachments, openTaskFormHandler, openDetailDcmtsFormHandler, openMasterDcmtsFormHandler, openBatchUpdateFormHandler, openExportForm, handleToggleSearch, handleSignApprove, openSignSettingsForm, handleCheckOutOperationCallback, handleCheckInOperationCallback, showCheckoutInformationFormCallback, viewHistoryCallback, copyCheckoutPathToClipboardOperationCallback, openWGsCopyMoveForm, openCommentFormCallback, openEditPdf, openAddDocumentForm, passToArchiveCallback, archiveMasterDocuments, archiveDetailDocuments, hasMasterRelation, hasDetailRelation, canArchiveMasterRelation, canArchiveDetailRelation, pairManyToManyDocuments, hasManyToManyRelation) => {
+export const getCommandsMenuItems = (isMobile, dtd, allUsers, selectedItems, focusedItem, context, showFloatingBar, workingGroupContext, showSearch, setShowFloatingBar, openFormHandler, openSharedArchiveHandler, showSharedDcmtsHandler, downloadDcmtsAsync, runOperationAsync, onRefreshSearchAsync, onRefreshDataRowsAsync, onRefreshAfterAddDcmtToFavs, confirmFormat, confirmAttachments, openTaskFormHandler, openDetailDcmtsFormHandler, openMasterDcmtsFormHandler, openBatchUpdateFormHandler, openExportForm, handleToggleSearch, handleSignApprove, openSignSettingsForm, handleCheckOutOperationCallback, handleCheckInOperationCallback, showCheckoutInformationFormCallback, viewHistoryCallback, copyCheckoutPathToClipboardOperationCallback, openWGsCopyMoveForm, openCommentFormCallback, openEditPdf, openAddDocumentForm, passToArchiveCallback, archiveMasterDocuments, archiveDetailDocuments, hasMasterRelation, hasDetailRelation, canArchiveMasterRelation, canArchiveDetailRelation, pairManyToManyDocuments, hasManyToManyRelation, pinnedItemIds, onTogglePin) => {
     const isPdfEditorLicensed = SDK_Globals?.license?.dcmtArchiveLicenses?.[0]?.siX_60007?.status === LicenseModuleStatus.Licensed;
+    const addPinIconToItems = (items) => {
+        if (isMobile || !onTogglePin)
+            return items;
+        return items.map(item => {
+            const newItem = { ...item };
+            if (item.id && item.onClick && !item.submenu) {
+                newItem.rightIconProps = {
+                    icon: _jsx(IconPin, {}),
+                    activeColor: 'red',
+                    inactiveColor: 'black',
+                    isActive: pinnedItemIds?.includes(item.id) ?? false,
+                    onClick: () => onTogglePin(item.id),
+                };
+            }
+            if (item.submenu && item.submenu.length > 0) {
+                newItem.submenu = addPinIconToItems(item.submenu);
+            }
+            return newItem;
+        });
+    };
     let pdfEditorAvailable = false;
     if (dtd && dtd.widgets && dtd.widgets.length > 0) {
         pdfEditorAvailable = isPdfEditorEnabled(dtd.widgets);
@@ -744,7 +764,7 @@ export const getCommandsMenuItems = (isMobile, dtd, allUsers, selectedItems, foc
         ];
     };
     if (context === SearchResultContext.ARCHIVED_WORKGROUP) {
-        return getArchivedWorkgroupMenuItems();
+        return addPinIconToItems(getArchivedWorkgroupMenuItems());
     }
-    return getDefaultMenuItems();
+    return addPinIconToItems(getDefaultMenuItems());
 };

package/lib/components/features/search/TMViewHistoryDcmt.js

@@ -187,55 +187,50 @@ const TMViewHistoryDcmt = (props) => {
         const tooltipContent = (_jsxs("div", { style: { textAlign: 'left' }, children: [_jsxs("div", { children: [_jsx("span", { style: { fontWeight: 'bold' }, children: "ID:" }), " ", data.id ?? '-'] }), _jsxs("div", { children: [_jsx("span", { style: { fontWeight: 'bold' }, children: "DID:" }), " ", data.DID ?? '-'] }), _jsxs("div", { children: [_jsx("span", { style: { fontWeight: 'bold' }, children: "TID:" }), " ", data.TID ?? '-'] }), _jsx("hr", {}), _jsxs("div", { children: [_jsxs("span", { style: { fontWeight: 'bold' }, children: [SDKUI_Localizator.Author, ":"] }), " ", data.UpdaterDisplayName ?? '-'] }), _jsxs("div", { children: [_jsxs("span", { style: { fontWeight: 'bold' }, children: [SDKUI_Localizator.Version, ":"] }), " ", data.Version] }), _jsxs("div", { children: [_jsxs("span", { style: { fontWeight: 'bold' }, children: [SDKUI_Localizator.Size, ":"] }), " ", formatBytes(Number(data.FileSize ?? 0))] }), _jsx("hr", {}), _jsxs("div", { children: [_jsxs("span", { style: { fontWeight: 'bold' }, children: [SDKUI_Localizator.CreationTime, ":"] }), " ", Globalization.getDateTimeDisplayValue(data.CreationTime)] }), _jsxs("div", { children: [_jsxs("span", { style: { fontWeight: 'bold' }, children: [SDKUI_Localizator.LastUpdateTime, ":"] }), " ", Globalization.getDateTimeDisplayValue(data.LastUpdateTime)] })] }));
         return _jsx("div", { style: { display: 'flex', justifyContent: 'center', alignItems: 'center' }, children: _jsx(TMDcmtIcon, { tid: Number(data.TID), did: Number(data.DID), fileExtension: data.FileExt, downloadMode: 'openInNewWindow', tooltipContent: tooltipContent }) });
     }, []);
-    const onContextMenuPreparing = (e) => {
-        if (e === undefined)
-            return;
-        if (e.target === 'content') {
-            e.items = e.items || [];
-            e.items = [
-                {
-                    icon: "datafield",
-                    text: SDKUI_Localizator.OpenForm,
-                    disabled: focusedRowKey === undefined,
-                    onClick: () => setShowDcmtForm(true),
-                },
-                {
-                    icon: "download",
-                    text: 'Download',
-                    disabled: focusedRowKey === undefined,
-                    onClick: () => downloadFilesCallback(),
-                },
-                {
-                    icon: "trash",
-                    text: SDKUI_Localizator.Delete,
-                    disabled: focusedRowKey === undefined,
-                    onClick: deleteFilesCallback,
-                    beginGroup: true
-                },
-                {
-                    icon: showSearch ? "eyeclose" : "eyeopen",
-                    onClick: () => setShowSearch(prevShowSearch => !prevShowSearch),
-                    text: showSearch ? SDKUI_Localizator.HideSearch : SDKUI_Localizator.ShowSearch,
-                    visible: true,
-                    disabled: false,
-                    beginGroup: true
-                },
-                {
-                    icon: showId ? 'eyeclose' : 'eyeopen',
-                    onClick: () => setShowId(prevShowId => !prevShowId),
-                    text: showId ? SDKUI_Localizator.ID_Hide : SDKUI_Localizator.ID_Show,
-                    visible: true,
-                    disabled: false,
-                },
-                {
-                    icon: "refresh",
-                    text: SDKUI_Localizator.Refresh,
-                    disabled: false,
-                    onClick: loadData,
-                },
-            ];
-        }
-    };
+    const customContextMenuItems = useMemo(() => {
+        return [
+            {
+                icon: _jsx("span", { className: "dx-icon-datafield" }),
+                name: SDKUI_Localizator.OpenForm,
+                disabled: focusedRowKey === undefined,
+                onClick: () => setShowDcmtForm(true),
+            },
+            {
+                icon: _jsx("span", { className: "dx-icon-download" }),
+                name: 'Download',
+                disabled: focusedRowKey === undefined,
+                onClick: () => downloadFilesCallback(),
+            },
+            {
+                icon: _jsx("span", { className: "dx-icon-trash" }),
+                name: SDKUI_Localizator.Delete,
+                disabled: focusedRowKey === undefined,
+                onClick: deleteFilesCallback,
+                beginGroup: true
+            },
+            {
+                icon: _jsx("span", { className: showSearch ? "dx-icon-eyeclose" : "dx-icon-eyeopen" }),
+                onClick: () => setShowSearch(prevShowSearch => !prevShowSearch),
+                name: showSearch ? SDKUI_Localizator.HideSearch : SDKUI_Localizator.ShowSearch,
+                visible: true,
+                disabled: false,
+                beginGroup: true
+            },
+            {
+                icon: _jsx("span", { className: showId ? "dx-icon-eyeclose" : "dx-icon-eyeopen" }),
+                onClick: () => setShowId(prevShowId => !prevShowId),
+                name: showId ? SDKUI_Localizator.ID_Hide : SDKUI_Localizator.ID_Show,
+                visible: true,
+                disabled: false,
+            },
+            {
+                icon: _jsx("span", { className: "dx-icon-refresh" }),
+                name: SDKUI_Localizator.Refresh,
+                disabled: false,
+                onClick: async () => await loadData(),
+            },
+        ];
+    }, [focusedRowKey, showSearch, showId]);
     // Handler for double-click cell event
     const onCellDblClick = useCallback((e) => {
         if (e.column.dataField === "FileExt")
@@ -279,7 +274,7 @@ const TMViewHistoryDcmt = (props) => {
             { dataField: "LastUpdateTimeDisplay", caption: SDKUI_Localizator.LastUpdateTime },
         ]);
     }, [showId]);
-    return _jsx(TMModal, { title: `${SDKUI_Localizator.SearchResult} \u2014 ${SDKUI_Localizator.History + ": " + (fromDTD.nameLoc ?? SDKUI_Localizator.Document) + " (DID:" + inputDcmt.DID})`, width: calcResponsiveSizes(deviceType, '700px', '700px', '95%'), height: calcResponsiveSizes(deviceType, '80%', '80%', '95%'), onClose: onClose, children: _jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: _jsxs(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showLocalWaitPanel, showWaitPanelPrimary: showLocalPrimary, waitPanelTitle: waitLocalPanelTitle, waitPanelTextPrimary: waitLocalPanelTextPrimary, waitPanelValuePrimary: waitLocalPanelValuePrimary, waitPanelMaxValuePrimary: waitLocalPanelMaxValuePrimary, isCancelable: true, abortController: abortLocalController, children: [_jsx(TMDataGrid, { dataSource: dcmtHistory, dataColumns: dataColumns, focusedRowKey: focusedRowKey, selection: selection, onContextMenuPreparing: onContextMenuPreparing, onFocusedRowChanged: onFocusedRowChanged, onCellDblClick: onCellDblClick, noDataText: SDKUI_Localizator.NoDataToDisplay, showSearchPanel: showSearch }), (showDcmtForm && selectedDcmt !== undefined) &&
+    return _jsx(TMModal, { title: `${SDKUI_Localizator.SearchResult} \u2014 ${SDKUI_Localizator.History + ": " + (fromDTD.nameLoc ?? SDKUI_Localizator.Document) + " (DID:" + inputDcmt.DID})`, width: calcResponsiveSizes(deviceType, '700px', '700px', '95%'), height: calcResponsiveSizes(deviceType, '80%', '80%', '95%'), onClose: onClose, children: _jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: _jsxs(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showLocalWaitPanel, showWaitPanelPrimary: showLocalPrimary, waitPanelTitle: waitLocalPanelTitle, waitPanelTextPrimary: waitLocalPanelTextPrimary, waitPanelValuePrimary: waitLocalPanelValuePrimary, waitPanelMaxValuePrimary: waitLocalPanelMaxValuePrimary, isCancelable: true, abortController: abortLocalController, children: [_jsx(TMDataGrid, { dataSource: dcmtHistory, dataColumns: dataColumns, focusedRowKey: focusedRowKey, selection: selection, customContextMenuItems: customContextMenuItems, onFocusedRowChanged: onFocusedRowChanged, onCellDblClick: onCellDblClick, noDataText: SDKUI_Localizator.NoDataToDisplay, showSearchPanel: showSearch }), (showDcmtForm && selectedDcmt !== undefined) &&
                         _jsx(TMDcmtForm, { TID: Number(selectedDcmt.TID), DID: Number(selectedDcmt.DID), formMode: FormModes.ReadOnly, isModal: true, widthModal: "95%", heightModal: "95%", titleModal: fromDTD.name ?? SDKUI_Localizator.SearchResult, allowNavigation: dcmtHistory.length > 0, itemIndex: selectedIndex + 1, count: dcmtHistory.length, onClose: () => { setShowDcmtForm(false); }, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, moreInfoTasks: getMoreInfoTasksForDocument(allTasks ?? [], Number(selectedDcmt.TID), Number(selectedDcmt.DID)) })] }) }) });
 };
 export default TMViewHistoryDcmt;

package/lib/components/features/tasks/TMTaskForm.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useEffect, useRef, useState } from 'react';
+import { useEffect, useMemo, useRef, useState } from 'react';
 import { ObjectClasses, TaskDescriptor, Priorities, PdGs, SDK_Globals, UserListCacheService, SDK_Localizator, Task_States } from '@topconsultnpm/sdk-ts';
 import { areDifferentIDs, formatDate, getOriginLabel, getPriorityLocalizatorValue, getPriorityLocalizatorValues, getStatusLocalizatorValues, gotoPDGExtendedLabel, taskValidatorAsync } from './TMTasksUtils';
 import ScrollView from 'devextreme-react/scroll-view';
@@ -21,6 +21,7 @@ import TMDcmtForm from '../documents/TMDcmtForm';
 import styled from 'styled-components';
 import { TMColors } from '../../../utils/theme';
 import { renderContextBlock } from './TMTasksUtilsView';
+import { DeviceType, useDeviceType } from '../../base/TMDeviceProvider';
 const ResponseCommentWrapper = styled.div `
   position: relative;
   width: 100%;
@@ -105,6 +106,10 @@ const TMTaskForm = (props) => {
     };
     const { formData, setFormData, formDataOrig, validationItems, exception, saveDataAsync } = useSaveForm(formMode, id, sfo, validator, onSaved, onStatusChanged, customizeFormData);
     const containerRef = useRef(null);
+    // Get the current device type (e.g., mobile, tablet, desktop) using a custom hook.
+    const deviceType = useDeviceType();
+    // This avoids unnecessary re-renders by only recalculating when deviceType changes.
+    let isMobileDevice = useMemo(() => { return deviceType === DeviceType.MOBILE; }, [deviceType]);
     const [isMobile, setIsMobile] = useState(false);
     const [showDcmtForm, setShowDcmtForm] = useState(false);
     const mobileBreakpoint = 768;
@@ -374,29 +379,55 @@ const TMTaskForm = (props) => {
                                                 width: '100%',
                                                 gap: 16,
                                                 padding: '8px 0'
-                                            }, children: children })), children: _jsx("div", { style: { width: isMobile ? '100%' : '50%' }, children: _jsx("div", { style: {
-                                                    display: 'flex',
-                                                    alignItems: 'center',
-                                                    marginTop: 12
-                                                }, children: _jsx(TMTooltip, { content: formData.pdG !== PdGs.None ? gotoPDGExtendedLabel(true, formData.pdG, formData.iD1Name) : '', children: _jsxs("span", { onClick: () => formData.pdG !== PdGs.None ? gotoPDGExtendedLabelClickCallback() : null, style: {
-                                                            display: 'inline-flex',
-                                                            alignItems: 'center',
-                                                            lineHeight: 1,
-                                                            padding: '6px 10px',
-                                                            borderRadius: 8,
-                                                            backgroundColor: formData.pdG !== PdGs.None ? '#f5f5f7' : 'transparent',
-                                                            color: formData.pdG !== PdGs.None ? '#2559A5' : '#444',
-                                                            cursor: formData.pdG !== PdGs.None ? 'pointer' : 'default',
-                                                            fontWeight: 600,
-                                                            transition: 'all 0.25s ease',
-                                                            gap: 6
-                                                        }, onMouseEnter: e => {
-                                                            if (formData.pdG !== PdGs.None)
-                                                                e.currentTarget.style.backgroundColor = '#ebebef';
-                                                        }, onMouseLeave: e => {
-                                                            if (formData.pdG !== PdGs.None)
-                                                                e.currentTarget.style.backgroundColor = '#f5f5f7';
-                                                        }, children: [_jsx("span", { style: { display: 'flex', alignItems: 'center' }, children: getPdgsIconMap().get(formData.pdG) }), _jsx("span", { children: getOriginLabel(formData.pdG, formData.iD1Name) })] }) }) }) }) })), _jsx(TMConditionalWrapper, { condition: !isMobile, wrapper: children => _jsx("div", { style: { display: 'flex', flexDirection: 'row', width: '100%', gap: 10 }, children: children }), children: _jsx("div", { style: { width: isMobile ? '100%' : '50%' }, children: _jsx(TMTextBox, { label: SDKUI_Localizator.Name, value: formData?.name ?? '', readOnly: fieldsReadOnly.name, autoFocus: true, maxLength: 100, isModifiedWhen: formData?.name !== formDataOrig?.name, onValueChanged: (e) => { setFormData({ ...formData ?? {}, name: e.target.value }); }, validationItems: validationItems?.filter(o => o.PropertyName === SDKUI_Localizator.Name) }) }) }), _jsx("div", { style: { width: '100%' }, children: _jsx(TMTextArea, { label: SDKUI_Localizator.Description, value: formData?.description ?? '', maxLength: 200, readOnly: fieldsReadOnly.description, isModifiedWhen: formData?.description !== formDataOrig?.description, onValueChanged: (e) => { setFormData({ ...formData ?? {}, description: e.target.value }); }, validationItems: validationItems?.filter(o => o.PropertyName === SDKUI_Localizator.Description), resize: false }) }), _jsx(TMConditionalWrapper, { condition: !isMobile, wrapper: children => _jsx("div", { style: { display: 'flex', flexDirection: 'row', width: '100%', gap: 10 }, children: children }), children: (formMode === FormModes.Create || !areDifferentIDs(formDataOrig?.fromID, SDK_Globals.tmSession?.SessionDescr?.userID)) ?
+                                            }, children: children })), children: _jsx("div", { style: {
+                                                width: "100%",
+                                                display: 'flex',
+                                                alignItems: 'center',
+                                                justifyContent: 'center',
+                                                marginTop: 12
+                                            }, children: _jsxs("div", { onClick: () => formData.pdG !== PdGs.None ? gotoPDGExtendedLabelClickCallback() : null, style: {
+                                                    backgroundColor: "#C2388B",
+                                                    color: "#fff",
+                                                    padding: "10px 16px",
+                                                    borderRadius: "20px",
+                                                    display: "flex",
+                                                    alignItems: "center",
+                                                    justifyContent: "space-between",
+                                                    cursor: "pointer",
+                                                    fontWeight: 500,
+                                                    transition: "background-color 0.3s",
+                                                    minWidth: "180px",
+                                                    maxWidth: "100%",
+                                                    flexWrap: "wrap",
+                                                    gap: "8px",
+                                                }, onMouseEnter: e => {
+                                                    if (formData.pdG !== PdGs.None)
+                                                        e.currentTarget.style.backgroundColor = "#A12D78";
+                                                }, onMouseLeave: e => {
+                                                    if (formData.pdG !== PdGs.None)
+                                                        e.currentTarget.style.backgroundColor = "#C2388B";
+                                                }, children: [_jsxs("span", { style: {
+                                                            flex: 1,
+                                                            textAlign: "center",
+                                                            gap: "6px",
+                                                            display: "flex",
+                                                            justifyContent: "center",
+                                                            alignItems: "center",
+                                                        }, children: [formData.pdG === PdGs.WG && _jsx("span", { children: SDKUI_Localizator.GoToWorkgroup }), formData.pdG === PdGs.CF && _jsx("span", { children: SDKUI_Localizator.GoToDossier }), formData.pdG === PdGs.DT && _jsx("span", { children: SDKUI_Localizator.GoToDocument }), (() => {
+                                                                const originLabel = getOriginLabel(formData.pdG, formData.iD1Name);
+                                                                if (!originLabel)
+                                                                    return null;
+                                                                const maxLength = isMobileDevice ? 10 : 25;
+                                                                const displayText = originLabel.length > maxLength
+                                                                    ? originLabel.slice(0, maxLength) + "..."
+                                                                    : originLabel;
+                                                                return _jsxs("span", { children: ["\u201C", displayText, "\u201D"] });
+                                                            })()] }), _jsx(TMTooltip, { content: _jsxs("div", { style: { textAlign: "left" }, children: [formData.pdG && (_jsxs(_Fragment, { children: [_jsxs("div", { style: {
+                                                                                display: "flex",
+                                                                                alignItems: "center",
+                                                                                gap: "6px",
+                                                                                fontWeight: 600,
+                                                                            }, children: [_jsx("span", { style: { display: "flex", alignItems: "center" }, children: getPdgsIconMap().get(formData.pdG) }), _jsx("span", { children: formData.pdG === PdGs.WG ? SDKUI_Localizator.WorkGroup : formData.pdG === PdGs.CF ? SDKUI_Localizator.Dossier : formData.pdG === PdGs.DT ? SDKUI_Localizator.Document : "" })] }), _jsx("hr", { style: { margin: "4px 0 8px 0" } })] })), formData.iD1 != null && formData.iD1 !== 0 && (_jsxs("div", { children: [_jsx("b", { children: "ID1" }), ": ", formData.iD1.toString()] })), formData.iD1Name && (_jsxs("div", { children: [_jsx("b", { children: "ID1NAME" }), ": ", formData.iD1Name.toString()] })), formData.iD2 != null && formData.iD2 !== 0 && (_jsxs("div", { children: [_jsx("b", { children: "ID2" }), ": ", formData.iD2.toString()] }))] }), children: _jsx("i", { className: "dx-icon-info", style: { fontSize: "1.3rem", flexShrink: 0 } }) })] }) }) })), _jsx(TMConditionalWrapper, { condition: !isMobile, wrapper: children => _jsx("div", { style: { display: 'flex', flexDirection: 'row', width: '100%', gap: 10 }, children: children }), children: _jsx("div", { style: { width: isMobile ? '100%' : '50%' }, children: _jsx(TMTextBox, { label: SDKUI_Localizator.Name, value: formData?.name ?? '', readOnly: fieldsReadOnly.name, autoFocus: true, maxLength: 100, isModifiedWhen: formData?.name !== formDataOrig?.name, onValueChanged: (e) => { setFormData({ ...formData ?? {}, name: e.target.value }); }, validationItems: validationItems?.filter(o => o.PropertyName === SDKUI_Localizator.Name) }) }) }), _jsx("div", { style: { width: '100%' }, children: _jsx(TMTextArea, { label: SDKUI_Localizator.Description, value: formData?.description ?? '', maxLength: 200, readOnly: fieldsReadOnly.description, isModifiedWhen: formData?.description !== formDataOrig?.description, onValueChanged: (e) => { setFormData({ ...formData ?? {}, description: e.target.value }); }, validationItems: validationItems?.filter(o => o.PropertyName === SDKUI_Localizator.Description), resize: false }) }), _jsx(TMConditionalWrapper, { condition: !isMobile, wrapper: children => _jsx("div", { style: { display: 'flex', flexDirection: 'row', width: '100%', gap: 10 }, children: children }), children: (formMode === FormModes.Create || !areDifferentIDs(formDataOrig?.fromID, SDK_Globals.tmSession?.SessionDescr?.userID)) ?
                                             _jsx("div", { id: "assignedToAnotherUserField", style: { width: isMobile ? '100%' : '50%' }, children: _jsx(TMUserChooser, { dataSource: usersList ?? undefined, allowShowAllUsers: !!taskContext?.dossier, allowMultipleSelection: false, label: SDKUI_Localizator.AssignedTo_Female, readOnly: fieldsReadOnly.assignedTO, values: formData?.toID ? [formData?.toID] : [], isModifiedWhen: formData?.toID !== formDataOrig?.toID, validationItems: validationItems?.filter(o => o.PropertyName === SDKUI_Localizator.AssignedTo_Female), onValueChanged: (newValue) => {
                                                         if (newValue === undefined)
                                                             return;