@topconsultnpm/sdkui-react 6.20.0-dev1.9 → 6.20.0-dev1.90

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

@@ -1,15 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import TMDcmtPreview from './TMDcmtPreview';
-import { AccessLevels, ArchiveConstraints, ArchiveEngineByID, DcmtTypeListCacheService, LayoutCacheService, LayoutModes, MetadataDataTypes, ObjectClasses, ResultTypes, SDK_Globals, SDK_Localizator, SystemMIDsAsNumber, SystemTIDs, Task_States, TemplateTIDs, TID_DID, UpdateEngineByID, ValidationItem, WorkflowCacheService, WorkItemMetadataNames } from '@topconsultnpm/sdk-ts';
-import { ContextMenu } from 'devextreme-react';
+import { AccessLevels, ArchiveConstraints, ArchiveEngineByID, DcmtTypeListCacheService, LayoutCacheService, LayoutModes, MetadataDataTypes, ObjectClasses, ResultTypes, SDK_Globals, SDK_Localizator, SystemMIDsAsNumber, SystemTIDs, Task_States, TID_DID, UpdateEngineByID, UserListCacheService, ValidationItem, WorkflowCacheService, WorkItemMetadataNames } from '@topconsultnpm/sdk-ts';
 import { WorkFlowApproveRejectPopUp, WorkFlowMoreInfoPopUp, WorkFlowOperationButtons, WorkFlowReAssignPopUp } from '../workflow/TMWorkflowPopup';
 import { DownloadTypes, FormModes, DcmtOperationTypes } from '../../../ts';
 import { DeviceType, useDeviceType } from '../../base/TMDeviceProvider';
 import { useDcmtOperations } from '../../../hooks/useDcmtOperations';
 import { useRelatedDocuments } from '../../../hooks/useRelatedDocuments';
 import { getWorkItemSetIDAsync, handleArchiveVisibility, searchResultToMetadataValues } from '../../../helper/queryHelper';
-import { genUniqueId, IconShow, SDKUI_Localizator, updateMruTids, IconBoard, IconDcmtTypeSys, IconDetailDcmts, svgToString, IconDownload, calcIsModified, IconMenuVertical, Globalization, getListMaxItems, getSystemMetadata, IconBoxArchiveIn, IconClear, IconUndo, SDKUI_Globals, IconPreview, isTaskMoreInfo, IconWorkflow, IconSearch, deepCompare, IconCheck, IconActivity, TMImageLibrary, IconStar, IconRelation, IconInfo, IconArchiveDoc, IconDelete, IconPair, IconUnpair, IconArchiveMaster, IconArchiveDetail } from '../../../helper';
+import { genUniqueId, IconShow, SDKUI_Localizator, updateMruTids, IconBoard, IconDcmtTypeSys, IconDetailDcmts, IconDownload, calcIsModified, IconMenuVertical, Globalization, getListMaxItems, getSystemMetadata, IconBoxArchiveIn, IconClear, IconUndo, SDKUI_Globals, IconPreview, isTaskMoreInfo, IconWorkflow, IconSearch, deepCompare, IconCheck, IconActivity, TMImageLibrary, IconStar, IconRelation, IconInfo, IconArchiveDoc, IconDelete, IconPair, IconUnpair, IconArchiveMaster, IconArchiveDetail, getExceptionMessage, isApprovalWorkflowView, getDcmtCicoStatus, IconFileDots, IconCustom, buildWorkItemsFromWFCtrl } from '../../../helper';
 import { hasDetailRelations, hasMasterRelations, isXMLFileExt } from '../../../helper/dcmtsHelper';
 import { Gutters, TMColors } from '../../../utils/theme';
 import { StyledFormButtonsContainer, StyledLoadingContainer, StyledModalContainer, StyledReferenceButton, StyledSpinner, StyledToolbarCardContainer } from '../../base/Styled';
@@ -41,10 +40,31 @@ import TMDcmtTasks from './TMDcmtTasks';
 import TMToppyMessage from '../../../helper/TMToppyMessage';
 import { getTaskAssignedToMe } from '../tasks/TMTasksUtils';
 import TMCustomButton from '../../base/TMCustomButton';
-import ToppyDraggableHelpCenter from '../assistant/ToppyDraggableHelpCenter';
+import { useCheckInOutOperations } from '../../../hooks/useCheckInOutOperations';
+import TMViewHistoryDcmt from '../search/TMViewHistoryDcmt';
+import TMDcmtCheckoutInfoForm from '../search/TMDcmtCheckoutInfoForm';
+import styled from 'styled-components';
+import { ContextMenu } from '../../NewComponents/ContextMenu';
+import TMToppyDraggableHelpCenter from '../assistant/TMToppyDraggableHelpCenter';
+//#region Interfaces, Types and Enums
+/**
+ * Definisce il contesto da cui è stato invocato il TMDcmtForm.
+ * Permette di gestire logiche diverse in base alla provenienza.
+ */
+export var InvocationContext;
+(function (InvocationContext) {
+    /** Invocazione standard */
+    InvocationContext["Default"] = "default";
+    /** Invocato dalla pagina Todo/Task */
+    InvocationContext["Todo"] = "todo";
+    /** Invocato dalla pagina WorkflowCtrl */
+    InvocationContext["WorkflowCtrl"] = "workflowCtrl";
+    // Aggiungi qui altri contesti futuri secondo necessità
+})(InvocationContext || (InvocationContext = {}));
 let abortControllerLocal = new AbortController();
 //#endregion
-const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, showHeader = true, onSaveRecents, layoutMode = LayoutModes.Update, showBackButton = true, onClose, onSavedAsyncCallback, TID, DID, formMode = FormModes.Update, canNext, canPrev, count, itemIndex, onNext, onPrev, allowNavigation = true, allowRelations = true, isClosable = false, isExpertMode = SDKUI_Globals.userSettings.advancedSettings.expertMode === 1, showDcmtFormSidebar = true, invokedByTodo = false, titleModal, isModal = false, widthModal = "100%", heightModal = "100%", groupId, onWFOperationCompleted, onTaskCompleted, onTaskCreateRequest, inputFile = null, taskFormDialogComponent, taskMoreInfo, connectorFileSave = undefined, inputMids = [], openS4TViewer = false, onOpenS4TViewerRequest, s4TViewerDialogComponent, enableDragDropOverlay = false, passToSearch, isSharedDcmt = false, sharedSourceTID, sharedSourceDID, allowButtonsRefs = false, onReferenceClick, }) => {
+const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, showHeader = true, onSaveRecents, layoutMode = LayoutModes.Update, showBackButton = true, onClose, onSavedAsyncCallback, TID, DID, formMode = FormModes.Update, canNext, canPrev, count, itemIndex, onNext, onPrev, allowNavigation = true, allowRelations = true, isClosable = false, isExpertMode = SDKUI_Globals.userSettings.advancedSettings.expertMode === 1, showDcmtFormSidebar = true, invocationContext = InvocationContext.Default, titleModal, isModal = false, widthModal = "100%", heightModal = "100%", groupId, onWFOperationCompleted, onTaskCompleted, onTaskCreateRequest, inputFile = null, taskFormDialogComponent, taskMoreInfo, connectorFileSave = undefined, inputMids = [], openS4TViewer = false, onOpenS4TViewerRequest, s4TViewerDialogComponent, enableDragDropOverlay = false, passToSearch, isSharedDcmt = false, sharedSourceTID, sharedSourceDID, allowButtonsRefs = false, onReferenceClick, }) => {
+    const { showHistory, showHistoryCallback, hideHistoryCallback, showCheckoutInformationForm, commentFormState, hideCommentFormCallback, showCheckoutInformationFormCallback, hideCheckoutInformationFormCallback, copyCheckoutPathToClipboardCallback, handleCheckOutCallback, handleCheckInCallback, refreshPreviewTrigger, showCicoWaitPanel, cicoWaitPanelTitle, showCicoPrimaryProgress, cicoPrimaryProgressText, cicoPrimaryProgressValue, cicoPrimaryProgressMax, } = useCheckInOutOperations();
     const [id, setID] = useState('');
     const [showWaitPanelLocal, setShowWaitPanelLocal] = useState(false);
     const [waitPanelTitleLocal, setWaitPanelTitleLocal] = useState('');
@@ -68,6 +88,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
     const [layout, setLayout] = useState();
     const [customButtonsLayout, setCustomButtonsLayout] = useState();
     const [customButton, setCustomButton] = useState();
+    const [allUsers, setAllUsers] = useState([]);
     const appliedInputMidsRef = useRef(null);
     // Refs per evitare stale closure nei callback
     // I useCallback catturano i valori delle dipendenze al momento della creazione.
@@ -91,6 +112,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
     const [fetchError, setFetchError] = useState(false);
     const [isWFDataLoading, setIsWFDataLoading] = useState(false);
     const [workItems, setWorkItems] = useState([]);
+    const [workItemsForDiagram, setWorkItemsForDiagram] = useState([]);
     const [workflows, setWorkflows] = useState([]);
     const [showCommentForm, setShowCommentForm] = useState(false);
     const [isInitialLoading, setIsInitialLoading] = useState(true);
@@ -98,16 +120,24 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
     const [dcmtReferences, setDcmtReferences] = useState(undefined);
     // Stato per triggerare il refresh del blog dall'esterno
     const [refreshBlogTrigger, setRefreshBlogTrigger] = useState(0);
+    const [wfError, setWfError] = useState(null);
     const triggerBlogRefresh = useCallback(async () => {
         setRefreshBlogTrigger(prev => prev + 1);
     }, []);
+    useEffect(() => {
+        const fetchAllUsers = async () => {
+            const users = await UserListCacheService.GetAllAsync();
+            setAllUsers(users ?? []);
+        };
+        fetchAllUsers();
+    }, []);
     useEffect(() => {
         if (!allowButtonsRefs)
             setDcmtReferences(undefined);
     }, [allowButtonsRefs]);
     const { openConfirmAttachmentsDialog, ConfirmAttachmentsDialog } = useInputAttachmentsDialog();
     const { abortController, showWaitPanel, waitPanelTitle, showPrimary, waitPanelTextPrimary, waitPanelValuePrimary, waitPanelMaxValuePrimary, showSecondary, waitPanelTextSecondary, waitPanelValueSecondary, waitPanelMaxValueSecondary, downloadDcmtsAsync, runOperationAsync } = useDcmtOperations();
-    const { workflowApproveData } = useWorkflowApprove();
+    const { workflowApproveData, getWorkItemsByDID } = useWorkflowApprove();
     const currentSearchResults = useMemo(() => {
         if (!formData || formData.length === 0 || !TID || !DID)
             return [];
@@ -124,7 +154,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
             selectMIDs: selectMIDs,
             dtdResult: {
                 rows: [rowValues],
-                columns: selectMIDs.map(mid => ({ name: `MID_${mid}` }))
+                columns: selectMIDs.map(mid => ({ name: `MID_${mid}`, }))
             },
             dcmtsFound: 1,
             dcmtsReturned: 1
@@ -410,74 +440,175 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
     const workItemSetIDValue = useMemo(() => formData.find(o => o.md?.name === WorkItemMetadataNames.WI_SetID)?.value, [formData]);
     // Valore derivato: true se formData ha elementi validi
     const hasFormData = useMemo(() => formData.length > 0 && formData.some(md => md.mid && md.mid > 99), [formData]);
+    const handleCheckOutOperationCallback = async (checkout) => {
+        if (!currentDcmt)
+            return;
+        await handleCheckOutCallback({ TID: currentDcmt.tid, DID: currentDcmt.did, FILEEXT: currentDcmt.fileExt }, checkout, fromDTD?.name ?? SDKUI_Localizator.SearchResult, downloadDcmtsAsync, updateCurrentDcmt);
+    };
+    const handleCheckInOperationCallback = async () => {
+        if (!currentDcmt)
+            return;
+        await handleCheckInCallback({ TID: currentDcmt.tid, DID: currentDcmt.did, FILEEXT: currentDcmt.fileExt, fileName: fromDTD?.name ?? SDKUI_Localizator.SearchResult }, updateCurrentDcmt, undefined);
+    };
+    const copyCheckoutPathToClipboardOperationCallback = () => {
+        if (!currentDcmt)
+            return;
+        copyCheckoutPathToClipboardCallback({ TID: currentDcmt.tid, DID: currentDcmt.did, FILEEXT: currentDcmt.fileExt }, fromDTD?.name ?? SDKUI_Localizator.SearchResult);
+    };
+    // useEffect per il caricamento dei dati del workflow
     useEffect(() => {
+        // Funzione helper per caricare le informazioni del workflow
+        const loadWorkflowInfo = async (tid) => {
+            await WorkflowCacheService.GetWFInfoAsync(tid)
+                .then((result) => {
+                if (result) {
+                    setWorkflows([result]);
+                    setWfError(null);
+                }
+                else {
+                    setWorkflows([]);
+                    setWfError("Workflow info not found");
+                }
+            })
+                .catch(error => {
+                setWorkflows([]);
+                console.log("Error fetching workflow info:", error);
+                setWfError(getExceptionMessage(error));
+            });
+        };
         const loadAllWfData = async () => {
-            if (layoutMode !== LayoutModes.Update || !DID || fromDTD?.templateTID !== TemplateTIDs.WF_WIApprView) {
+            // FASE 1: Validazione prerequisiti
+            if (layoutMode !== LayoutModes.Update || !DID) {
                 setWorkItems([]);
                 setWorkflows([]);
                 return;
             }
             setIsWFDataLoading(true);
             try {
-                // 1. item da processare in modo sincrono
-                const itemsToProcess = [];
-                for (const workflow of workflowApproveData) {
-                    for (const dataRow of workflow.dtdResult?.rows ?? []) {
-                        const did = Number(dataRow?.[1]);
-                        if (did === Number(DID)) {
-                            const tid = Number(dataRow?.[0]);
-                            itemsToProcess.push({ tid, did });
-                        }
-                    }
-                }
+                // FASE 2: Raccolta work items: array di tutti i possibili work items che matchano il DID corrente
+                const itemsToProcess = getWorkItemsByDID(Number(DID));
+                // Se non ci sono work items per questo DID, resetta e esci
                 if (itemsToProcess.length === 0) {
                     setWorkItems([]);
                     setWorkflows([]);
                     setIsWFDataLoading(false);
                     return;
                 }
-                // promises per i setID in modo condizionale
-                let setIDPromises;
-                if (workItemSetIDValue !== undefined) {
-                    // Se abbiamo il setID dal form, non facciamo chiamate di rete.
-                    setIDPromises = itemsToProcess.map(() => Promise.resolve(workItemSetIDValue));
+                // FASE 3: Ricerca work item specifico
+                // Cerca prima un match esatto con TID e DID correnti
+                const foundItem = itemsToProcess.find(item => item.tid === Number(TID) && item.did === Number(DID));
+                if (foundItem) {
+                    // SCENARIO A: Match esatto trovato (TID e DID corrispondono)
+                    // Il documento corrente è esattamente il work item nel workflow
+                    let setID = undefined;
+                    // Prova a usare il setID già presente nei metadati (più veloce)
+                    if (workItemSetIDValue !== undefined) {
+                        setID = workItemSetIDValue;
+                    }
+                    else {
+                        // Altrimenti caricalo dal server
+                        setID = await getWorkItemSetIDAsync(foundItem.tid, foundItem.did);
+                    }
+                    // Imposta un singolo work item con il setID caricato
+                    setWorkItems([{
+                            wid: `${foundItem.tid}_${foundItem.did}`,
+                            tid: foundItem.tid,
+                            did: foundItem.did,
+                            setID: setID,
+                            details: []
+                        }]);
+                    // Carica le informazioni complete del workflow
+                    await loadWorkflowInfo(foundItem.tid);
                 }
                 else {
-                    // Altrimenti, procediamo con le chiamate di rete come prima.
-                    setIDPromises = itemsToProcess.map(item => getWorkItemSetIDAsync(item.tid, item.did));
+                    // SCENARIO B: Nessun match esatto, cerca solo per DID
+                    const itemsByDID = itemsToProcess.filter(item => item.did === Number(DID));
+                    if (itemsByDID.length === 1) {
+                        // SCENARIO B.1: Un solo item trovato per DID
+                        // Situazione sicura: sappiamo esattamente quale work item usare
+                        const singleItem = itemsByDID[0];
+                        let setID;
+                        // Carica il setID (da cache o da server)
+                        if (workItemSetIDValue !== undefined) {
+                            setID = workItemSetIDValue;
+                        }
+                        else {
+                            setID = await getWorkItemSetIDAsync(singleItem.tid, singleItem.did);
+                        }
+                        setWorkItems([{
+                                wid: `${singleItem.tid}_${singleItem.did}`,
+                                tid: singleItem.tid,
+                                did: singleItem.did,
+                                setID: setID,
+                                details: []
+                            }]);
+                        // Carica le informazioni del workflow
+                        await loadWorkflowInfo(singleItem.tid);
+                    }
+                    else if (itemsByDID.length > 1) {
+                        // SCENARIO B.2: Più item trovati per lo stesso DID
+                        // Ambiguità: lo stesso documento appare in più workflow diversi
+                        const finalWorkItems = itemsByDID.map((item, index) => ({
+                            wid: `${item.tid}_${item.did}_${index}`,
+                            tid: item.tid,
+                            did: item.did,
+                            setID: undefined,
+                            details: []
+                        }));
+                        setWorkItems(finalWorkItems);
+                        setWorkflows([]); // Non carichiamo il workflow in caso di ambiguità
+                    }
                 }
-                // Crea un array di Promise per tutte le chiamate a GetWFInfoAsync
-                const workflowInfoPromises = itemsToProcess.map(item => WorkflowCacheService.GetWFInfoAsync(item.tid));
-                // Esegui tutte le chiamate in parallelo e attendi i risultati
-                const setIDResults = await Promise.all(setIDPromises);
-                const workflowInfoResults = await Promise.all(workflowInfoPromises);
-                // Combina i risultati
-                const finalWorkItems = itemsToProcess.map((item, index) => ({
-                    ...item,
-                    setID: setIDResults[index],
-                }));
-                const validWorkflows = workflowInfoResults.filter(Boolean);
-                // Aggiorna lo stato una sola volta con i dati finali
-                setWorkItems(finalWorkItems);
-                setWorkflows(validWorkflows);
             }
             catch (error) {
+                // FASE 4: Gestione errori
                 TMExceptionBoxManager.show({ exception: error });
                 setWorkItems([]);
                 setWorkflows([]);
             }
             finally {
+                // Garantisce sempre il reset del flag di loading
                 setIsWFDataLoading(false);
             }
         };
-        // Usa hasFormData invece di formDataRef.current
         if (!hasFormData || !fromDTD?.id) {
-            // console.log("formData is empty or fromDTD not loaded, skipping loadAllWfData");
             return;
         }
         if (workItemSetIDValue !== undefined || workflowApproveData.length > 0)
             loadAllWfData();
-    }, [hasFormData, workItemSetIDValue, workflowApproveData, DID, layoutMode, fromDTD?.templateTID, fromDTD?.id]);
+    }, [hasFormData, workItemSetIDValue, workflowApproveData, getWorkItemsByDID, TID, DID, layoutMode, fromDTD?.templateTID, fromDTD?.id]);
+    // useEffect per costruire workItemsForDiagram quando l'utente è autorizzato a vedere il diagramma
+    useEffect(() => {
+        const buildWorkItemsForDiagram = async () => {
+            // Verifica se l'utente è autorizzato (ha accesso al diagramma)
+            const isAuthorized = !!workflows?.[0]?.diagram;
+            if (!isAuthorized || workItems.length === 0) {
+                setWorkItemsForDiagram([]);
+                return;
+            }
+            try {
+                // Estrai i dati necessari dal primo workItem
+                const firstWorkItem = workItems[0];
+                // Costruisci WFInstanceDescriptor dai dati disponibili
+                const wfInstance = {
+                    wfid: workflows[0].id,
+                    tid: TID,
+                    did: DID,
+                    instanceId: "", // Puoi adattare questo se hai un instanceId specifico,
+                    rowIndex: 0,
+                    values: []
+                };
+                // Chiama buildWorkItemsFromWFCtrl per ottenere i workItems completi
+                const detailedWorkItems = await buildWorkItemsFromWFCtrl(wfInstance);
+                setWorkItemsForDiagram(detailedWorkItems);
+            }
+            catch (error) {
+                console.error('Errore durante la costruzione dei work items per il diagramma:', error);
+                setWorkItemsForDiagram([]);
+            }
+        };
+        buildWorkItemsForDiagram();
+    }, [workflows, workItems]);
     const getSelectionDcmtInfo = useCallback(() => {
         let dcmts = [];
         dcmts.push({ TID: TID ?? 0, DID: DID ?? 0 });
@@ -503,12 +634,17 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
     const isSysMetadataDisabled = useMemo(() => layoutMode !== LayoutModes.Update, [layoutMode]);
     const isDetailsDisabled = useMemo(() => layoutMode !== LayoutModes.Update || !DID, [layoutMode, DID]);
     const isMasterDisabled = useMemo(() => layoutMode !== LayoutModes.Update || !DID, [layoutMode, DID]);
-    const isWFDisabled = useMemo(() => layoutMode !== LayoutModes.Update || fetchError || workItems.length <= 0, [layoutMode, fetchError, workItems.length]);
+    const isWFDisabled = useMemo(() => layoutMode !== LayoutModes.Update || fetchError || (workItems.length <= 0 && workItemsForDiagram.length <= 0), [layoutMode, fetchError, workItems.length, workItemsForDiagram.length]);
     const showToppyForApprove = useMemo(() => layoutMode === LayoutModes.Update && !fetchError && workItems.length > 0 && !isOpenDetails && !isOpenMaster, [layoutMode, fetchError, workItems.length, isOpenDetails, isOpenMaster]);
     const showToppyForCompleteMoreInfo = useMemo(() => layoutMode === LayoutModes.Update && !!isTaskMoreInfo(taskMoreInfo?.name) && taskMoreInfo?.state !== Task_States.Completed, [layoutMode, taskMoreInfo?.name, taskMoreInfo?.state]);
     const showToppyForReferences = useMemo(() => allowButtonsRefs && layoutMode === LayoutModes.Update && !!(dcmtReferences && dcmtReferences.length > 0) && !isOpenDetails && !isOpenMaster, [allowButtonsRefs, layoutMode, dcmtReferences, isOpenDetails, isOpenMaster]);
+    const isToppyVisible = useMemo(() => Boolean((showToppyForApprove || showToppyForCompleteMoreInfo || showToppyForReferences) && !openS4TViewer), [showToppyForApprove, showToppyForCompleteMoreInfo, showToppyForReferences, openS4TViewer]);
     const isMobile = useMemo(() => deviceType === DeviceType.MOBILE, [deviceType]);
-    const isApprView = useMemo(() => fromDTD?.templateTID === TemplateTIDs.WF_WIApprView, [fromDTD?.templateTID]);
+    const isApprView = useMemo(() => {
+        if (!fromDTD)
+            return false;
+        return isApprovalWorkflowView(fromDTD);
+    }, [fromDTD?.id]);
     const workitemSetID = useMemo(() => workItems.find(o => o.did === Number(DID))?.setID || formData.find(o => o.md?.name === WorkItemMetadataNames.WI_SetID)?.value, [workItems, DID, formData]);
     const approvalVID = useMemo(() => workItems.length > 0 ? Number(workItems[0].tid) : -1, [workItems]);
     //here
@@ -516,23 +652,20 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
         const items = [];
         const operationsItems = [];
         operationsItems.push({
-            icon: svgToString(_jsx(IconDownload, {})),
-            operationType: 'singleRow',
+            icon: _jsx(IconDownload, {}),
             disabled: fromDTD?.perm?.canRetrieveFile !== AccessLevels.Yes,
-            text: SDKUI_Localizator.DownloadFile,
+            name: SDKUI_Localizator.DownloadFile,
             onClick: async () => await downloadDcmtsAsync(getDcmts(), DownloadTypes.Dcmt, "download", undefined, undefined, true)
         }, {
-            icon: svgToString(_jsx(IconDownload, {})),
-            operationType: 'singleRow',
+            icon: _jsx(IconDownload, {}),
             disabled: !isXMLFileExt(currentDcmt?.fileExt),
-            text: SDKUI_Localizator.DownloadXMLAttachments,
+            name: SDKUI_Localizator.DownloadXMLAttachments,
             onClick: async () => await downloadDcmtsAsync(getDcmts(), DownloadTypes.Attachment, "download", undefined, openConfirmAttachmentsDialog, true)
         });
         if (layoutMode === LayoutModes.Update && DID) {
             operationsItems.push({
-                icon: svgToString(_jsx(IconStar, {})),
-                text: SDKUI_Localizator.AddTo + ' ' + SDKUI_Localizator.Favorites,
-                operationType: 'singleRow',
+                icon: _jsx(IconStar, {}),
+                name: SDKUI_Localizator.AddTo + ' ' + SDKUI_Localizator.Favorites,
                 disabled: false,
                 onClick: async () => {
                     await runOperationAsync(getDcmts(), DcmtOperationTypes.AddToFavs);
@@ -541,17 +674,17 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
         }
         if (onTaskCreateRequest && layoutMode === LayoutModes.Update && DID) {
             operationsItems.push({
-                icon: svgToString(_jsx(IconActivity, {})),
-                text: SDKUI_Localizator.CreateContextualTask,
-                operationType: 'singleRow',
+                icon: _jsx(IconActivity, {}),
+                name: SDKUI_Localizator.CreateContextualTask,
                 disabled: false,
                 onClick: () => {
                     const dcmt = getDcmts()[0];
+                    const name = `${fromDTD?.name ?? '-'} (DID: ${dcmt.DID})`;
                     const taskContext = {
                         document: {
                             tid: dcmt.TID,
                             did: dcmt.DID,
-                            name: fromDTD?.description || ''
+                            name: name
                         }
                     };
                     onTaskCreateRequest(taskContext);
@@ -560,76 +693,106 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
         }
         if (operationsItems.length > 0) {
             items.push({
-                icon: svgToString(_jsx(IconCheck, {})),
-                text: SDKUI_Localizator.DocumentOperations,
-                items: operationsItems
+                icon: _jsx(IconCheck, {}),
+                name: SDKUI_Localizator.DocumentOperations,
+                submenu: operationsItems
+            });
+        }
+        if (fromDTD?.id !== SystemTIDs.Drafts) {
+            // Check in/Check out menu
+            const { cicoEnabled, checkoutStatus } = getDcmtCicoStatus(formData, allUsers, fromDTD);
+            items.push({
+                icon: _jsx(IconFileDots, {}),
+                name: "Check in/Check out",
+                disabled: false,
+                submenu: [
+                    {
+                        name: 'Check out',
+                        disabled: !cicoEnabled || checkoutStatus.isCheckedOut,
+                        onClick: () => handleCheckOutOperationCallback(true),
+                    },
+                    {
+                        name: 'Check in',
+                        onClick: () => handleCheckInOperationCallback(),
+                        disabled: !cicoEnabled || !checkoutStatus.isCheckedOut || checkoutStatus.mode === 'lockMode'
+                    },
+                    {
+                        name: SDKUI_Localizator.CancelCheckOut,
+                        disabled: !cicoEnabled || !checkoutStatus.isCheckedOut || checkoutStatus.mode === 'lockMode',
+                        onClick: () => handleCheckOutOperationCallback(false),
+                    },
+                    {
+                        name: SDKUI_Localizator.CheckoutInfo,
+                        onClick: showCheckoutInformationFormCallback,
+                        disabled: !checkoutStatus.isCheckedOut
+                    },
+                    {
+                        name: SDKUI_Localizator.CopyCheckoutPath,
+                        onClick: copyCheckoutPathToClipboardOperationCallback,
+                        disabled: !checkoutStatus.isCheckedOut
+                    },
+                    {
+                        name: SDKUI_Localizator.History,
+                        disabled: !cicoEnabled,
+                        onClick: showHistoryCallback,
+                    },
+                ]
             });
         }
         if (allowRelations && layoutMode === LayoutModes.Update && DID) {
             const relationsItems = [
                 {
-                    icon: svgToString(_jsx(IconPair, {})),
-                    text: SDKUI_Localizator.MatchManyDocumentsManyToMany,
-                    operationType: 'singleRow',
+                    icon: _jsx(IconPair, {}),
+                    name: SDKUI_Localizator.MatchManyDocumentsManyToMany,
                     disabled: !hasManyToManyRelation,
                     onClick: async () => await pairManyToMany?.(true)
                 },
                 {
-                    icon: svgToString(_jsx(IconUnpair, {})),
-                    text: SDKUI_Localizator.UnmatchManyDocumentsManyToMany,
-                    operationType: 'singleRow',
+                    icon: _jsx(IconUnpair, {}),
+                    name: SDKUI_Localizator.UnmatchManyDocumentsManyToMany,
                     disabled: !hasManyToManyRelation,
                     onClick: async () => await pairManyToMany?.(false)
                 },
                 {
-                    icon: svgToString(_jsx(IconArchiveMaster, {})),
-                    text: SDKUI_Localizator.ArchiveMasterDocument,
-                    operationType: 'singleRow',
-                    beginGroup: true,
+                    icon: _jsx(IconArchiveMaster, {}),
+                    name: SDKUI_Localizator.ArchiveMasterDocument,
                     disabled: canArchiveMasterRelation !== true,
                     onClick: async () => { if (TID)
                         await archiveMasterDocuments?.(TID); }
                 },
                 {
-                    icon: svgToString(_jsx(IconArchiveDetail, {})),
-                    text: SDKUI_Localizator.ArchiveDetailDocument,
-                    operationType: 'singleRow',
+                    icon: _jsx(IconArchiveDetail, {}),
+                    name: SDKUI_Localizator.ArchiveDetailDocument,
                     disabled: canArchiveDetailRelation !== true,
                     onClick: async () => { if (TID)
                         await archiveDetailDocuments?.(TID); }
                 },
                 {
-                    icon: svgToString(_jsx(IconDetailDcmts, { transform: 'scale(-1, 1)' })),
-                    text: SDKUI_Localizator.DcmtsMaster,
-                    operationType: 'singleRow',
-                    visible: true,
-                    beginGroup: true,
+                    icon: _jsx(IconDetailDcmts, { transform: 'scale(-1, 1)' }),
+                    name: SDKUI_Localizator.DcmtsMaster,
                     disabled: !currentTIDHasMasterRelations || isMasterDisabled,
                     onClick: () => { if (!isMasterDisabled)
                         setIsOpenMaster(!isOpenMaster); }
                 },
                 {
-                    icon: svgToString(_jsx(IconDetailDcmts, {})),
-                    text: SDKUI_Localizator.DcmtsDetail,
-                    operationType: 'singleRow',
+                    icon: _jsx(IconDetailDcmts, {}),
+                    name: SDKUI_Localizator.DcmtsDetail,
                     disabled: !currentTIDHasDetailRelations || isDetailsDisabled,
-                    visible: true,
                     onClick: () => { if (!isDetailsDisabled)
                         setIsOpenDetails(!isOpenDetails); }
                 }
             ];
             items.push({
-                icon: svgToString(_jsx(IconRelation, {})),
-                text: SDKUI_Localizator.Relations,
-                items: relationsItems
+                icon: _jsx(IconRelation, {}),
+                name: SDKUI_Localizator.Relations,
+                submenu: relationsItems
             });
         }
         if (layoutMode === LayoutModes.Update && DID) {
             const fullTextItems = [
                 {
-                    icon: svgToString(_jsx(IconInfo, {})),
-                    text: SDKUI_Localizator.IndexingInformation,
-                    operationType: 'singleRow',
+                    icon: _jsx(IconInfo, {}),
+                    name: SDKUI_Localizator.IndexingInformation,
                     disabled: false,
                     onClick: async () => {
                         try {
@@ -647,18 +810,16 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
                     }
                 },
                 {
-                    icon: svgToString(_jsx(IconArchiveDoc, {})),
-                    text: SDKUI_Localizator.IndexOrReindex,
-                    operationType: 'singleRow',
+                    icon: _jsx(IconArchiveDoc, {}),
+                    name: SDKUI_Localizator.IndexOrReindex,
                     disabled: false,
                     onClick: async () => {
                         await runOperationAsync(getDcmts(), DcmtOperationTypes.FreeSearchReindex);
                     }
                 },
                 {
-                    icon: svgToString(_jsx(IconDelete, {})),
-                    text: SDKUI_Localizator.IndexingDelete,
-                    operationType: 'singleRow',
+                    icon: _jsx(IconDelete, {}),
+                    name: SDKUI_Localizator.IndexingDelete,
                     disabled: false,
                     onClick: async () => {
                         await runOperationAsync(getDcmts(), DcmtOperationTypes.FreeSearchPurge);
@@ -666,9 +827,9 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
                 }
             ];
             items.push({
-                icon: svgToString(_jsx(IconSearch, {})),
-                text: SDKUI_Localizator.FullTextSearch,
-                items: fullTextItems
+                icon: _jsx(IconSearch, {}),
+                name: SDKUI_Localizator.FullTextSearch,
+                submenu: fullTextItems
             });
         }
         // Aggiungi submenu "Bottoni personalizzati" se esistono customButtons
@@ -676,18 +837,19 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
             const customButtonsItems = customButtonsLayout.customButtons
                 .filter((customButton) => customButton.isForUpdate && customButton.isForUpdate > 0)
                 .map((customButton) => ({
-                icon: svgToString(TMImageLibrary({ imageID: customButton.glyphID, showPath: true })),
-                text: customButton.title || 'Bottone personalizzato',
+                icon: TMImageLibrary({ imageID: customButton.glyphID }),
+                name: customButton.title || 'Bottone personalizzato',
                 onClick: () => setCustomButton(customButton)
             }));
-            items.push({
-                icon: svgToString(_jsx(IconCheck, {})),
-                text: SDKUI_Localizator.CustomButtons,
-                items: customButtonsItems
+            customButtonsItems && customButtonsItems.length > 0 && items.push({
+                icon: _jsx(IconCustom, {}),
+                name: SDKUI_Localizator.CustomButtons,
+                submenu: customButtonsItems
             });
         }
         return items;
     }, [
+        fromDTD?.id,
         fromDTD?.perm?.canRetrieveFile,
         fromDTD?.description,
         currentDcmt?.fileExt,
@@ -713,8 +875,9 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
         openConfirmAttachmentsDialog
     ]);
     const isModified = useMemo(() => calcIsModified(formData, formDataOrig), [formData, formDataOrig]);
-    const formToolbar = useMemo(() => _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '10px' }, children: [allowNavigation && canPrev != undefined && _jsx("p", { style: { textAlign: 'center', padding: '1px 4px', display: 'flex' }, children: `${itemIndex}/${count}` }), allowNavigation && canPrev != undefined && _jsx(TMSaveFormButtonPrevious, { btnStyle: 'icon', iconColor: 'white', isModified: isModified, formMode: formMode, canPrev: canPrev, onPrev: onPrev }), allowNavigation && canNext != undefined && _jsx(TMSaveFormButtonNext, { btnStyle: 'icon', iconColor: 'white', isModified: isModified, formMode: formMode, canNext: canNext, onNext: onNext }), layoutMode === LayoutModes.Update && _jsx(IconMenuVertical, { id: `commands-detail-${id}`, color: 'white', cursor: 'pointer' }), layoutMode === LayoutModes.Update && _jsx(ContextMenu, { showEvent: 'click', dataSource: commandsMenuItems, target: `#commands-detail-${id}` }), layoutMode === LayoutModes.Ark &&
-                _jsx(TMTooltip, { content: SDKUI_Localizator.PassToSearch, position: 'bottom', children: _jsx(IconSearch, { style: { cursor: 'pointer' }, onClick: handlePassToSearch }) })] }), [allowNavigation, canPrev, canNext, itemIndex, count, isModified, formMode, onPrev, onNext, layoutMode, id, commandsMenuItems, handlePassToSearch]);
+    const formToolbar = useMemo(() => _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '10px' }, children: [allowNavigation && canPrev != undefined && _jsx("p", { style: { textAlign: 'center', padding: '1px 4px', display: 'flex' }, children: `${itemIndex}/${count}` }), allowNavigation && canPrev != undefined && _jsx(TMSaveFormButtonPrevious, { btnStyle: 'icon', iconColor: 'white', isModified: isModified, formMode: formMode, canPrev: canPrev, onPrev: onPrev }), allowNavigation && canNext != undefined && _jsx(TMSaveFormButtonNext, { btnStyle: 'icon', iconColor: 'white', isModified: isModified, formMode: formMode, canNext: canNext, onNext: onNext }), layoutMode === LayoutModes.Update &&
+                _jsx(ContextMenu, { items: commandsMenuItems, trigger: "left", children: _jsx(IconMenuVertical, { color: 'white', cursor: 'pointer' }) }), layoutMode === LayoutModes.Ark &&
+                _jsx(TMTooltip, { content: SDKUI_Localizator.PassToSearch, position: 'bottom', children: _jsx(IconSearch, { style: { cursor: 'pointer' }, onClick: handlePassToSearch }) })] }), [allowNavigation, canPrev, canNext, itemIndex, count, isModified, formMode, onPrev, onNext, layoutMode, commandsMenuItems, handlePassToSearch]);
     const handleUndo = useCallback(() => {
         setFormData(structuredClone(formDataOrig));
     }, [formDataOrig]);
@@ -730,6 +893,60 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
             },
         });
     }, [isModal, id, layoutMode]);
+    // Funzione helper per ottenere e aggiornare i metadati con gestione errori centralizzata
+    const refreshMetadataAsync = useCallback(async () => {
+        let metadataResult = undefined;
+        let hasGetMetadataError = false;
+        try {
+            metadataResult = await SDK_Globals.tmSession?.NewSearchEngine().GetMetadataAsync(TID, DID, true);
+        }
+        catch (metadataError) {
+            hasGetMetadataError = true;
+            // Estrai ErrorCode dal campo detail se disponibile
+            let errorCode = undefined;
+            if (metadataError?.isApiException && metadataError?.response?.detail) {
+                try {
+                    const detailObj = JSON.parse(metadataError.response.detail);
+                    errorCode = detailObj?.ErrorCode;
+                }
+                catch (parseError) {
+                    console.log("Impossibile parsare il detail dell'eccezione:", parseError);
+                }
+            }
+            // Se ErrorCode è -5, mostra messaggio personalizzato, altrimenti mostra l'eccezione originale
+            if (errorCode === -5) {
+                TMMessageBoxManager.show({
+                    message: SDKUI_Localizator.DcmtOutOfView,
+                    buttons: [ButtonNames.OK],
+                });
+            }
+            else {
+                TMExceptionBoxManager.show({ exception: metadataError });
+            }
+            // Usa null per indicare al callback che c'è stato un errore e non deve ritentare
+            metadataResult = null;
+        }
+        // Aggiorna i metadati locali solo se non ci sono stati errori
+        if (!hasGetMetadataError && metadataResult && metadataResult !== null) {
+            await setMetadataList(fromDTDRef.current?.metadata ?? [], metadataResult);
+        }
+        return { success: !hasGetMetadataError, result: metadataResult };
+    }, [TID, DID, setMetadataList]);
+    const updateCurrentDcmt = useCallback(async () => {
+        try {
+            TMSpinner.show({ description: 'Aggiornamento in corso...' });
+            const { success, result: metadataResult } = await refreshMetadataAsync();
+            if (!success)
+                onClose?.();
+            await onSavedAsyncCallback?.(TID, DID, metadataResult === null ? null : metadataResult);
+        }
+        catch (e) {
+            TMExceptionBoxManager.show({ exception: e });
+        }
+        finally {
+            TMSpinner.hide();
+        }
+    }, [refreshMetadataAsync, onClose]);
     const handleSave = useCallback(async () => {
         const ue = new UpdateEngineByID(SDK_Globals.tmSession);
         ue.DID = DID;
@@ -766,55 +983,20 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
             const savedFormData = structuredClone(formDataRef.current);
             setFormDataOrig(savedFormData);
             formDataOrigRef.current = savedFormData;
-            // Tenta di ottenere i metadati aggiornati
-            let metadataResult = undefined;
-            let hasGetMetadataError = false;
-            try {
-                metadataResult = await SDK_Globals.tmSession?.NewSearchEngine().GetMetadataAsync(TID, DID, true);
-            }
-            catch (metadataError) {
-                hasGetMetadataError = true;
-                // Estrai ErrorCode dal campo detail se disponibile
-                let errorCode = undefined;
-                if (metadataError?.isApiException && metadataError?.response?.detail) {
-                    try {
-                        const detailObj = JSON.parse(metadataError.response.detail);
-                        errorCode = detailObj?.ErrorCode;
-                    }
-                    catch (parseError) {
-                        console.log("Impossibile parsare il detail dell'eccezione:", parseError);
-                    }
-                }
-                // Se ErrorCode è -5, mostra messaggio personalizzato, altrimenti mostra l'eccezione originale
-                if (errorCode === -5) {
-                    TMMessageBoxManager.show({
-                        message: SDKUI_Localizator.DcmtOutOfView,
-                        buttons: [ButtonNames.OK],
-                    });
-                }
-                else {
-                    TMExceptionBoxManager.show({ exception: metadataError });
-                }
-                // Usa null per indicare al callback che c'è stato un errore e non deve ritentare
-                metadataResult = null;
-            }
+            // Usa la funzione helper per ottenere i metadati aggiornati
+            const { success, result: metadataResult } = await refreshMetadataAsync();
             // Esegui sempre il callback:
             // - Se metadataResult è un oggetto: refresh normale
             // - Se metadataResult è null: GetMetadataAsync fallito, rimuove il documento dalla griglia senza ritentare
             // - Se metadataResult è undefined: nessun parametro passato, il callback può decidere cosa fare
             await onSavedAsyncCallback?.(TID, DID, metadataResult === null ? null : metadataResult);
             // Mostra messaggio di successo solo se non ci sono stati errori critici
-            if (!hasGetMetadataError) {
-                if (metadataResult && metadataResult !== null) {
-                    // Usa fromDTDRef.current invece di fromDTD per evitare stale closure.
-                    // fromDTD potrebbe essere undefined/vuoto nel callback se lo stato è cambiato,
-                    // mentre fromDTDRef.current contiene sempre il valore corrente sincronizzato tramite useEffect.
-                    await setMetadataList(fromDTDRef.current?.metadata ?? [], metadataResult);
-                }
+            if (success) {
                 ShowAlert({ mode: 'success', title: 'Form di documento', message: 'Le modifiche sono state salvate con successo', duration: 3000 });
             }
-            else
+            else {
                 onClose?.();
+            }
         }
         catch (e) {
             TMExceptionBoxManager.show({ exception: e });
@@ -822,7 +1004,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
         finally {
             TMSpinner.hide();
         }
-    }, [DID, TID, getSpecificChangedKeysWithValues, onSavedAsyncCallback, onClose, setMetadataList]);
+    }, [DID, TID, getSpecificChangedKeysWithValues, refreshMetadataAsync, onSavedAsyncCallback, onClose]);
     const handleArchiveCompleted = useCallback(async () => {
         let firstBlock = true;
         let maxFileSize = 0;
@@ -1011,28 +1193,34 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
             await triggerBlogRefresh();
         }
     }, [TID, DID, triggerBlogRefresh]);
+    const checkoutBadge = useMemo(() => {
+        const { cicoEnabled, checkoutStatus } = getDcmtCicoStatus(formData, allUsers, fromDTD);
+        if (!cicoEnabled || !checkoutStatus.isCheckedOut)
+            return null;
+        return (_jsx(Ribbon, { "$isMobile": isMobile, children: _jsx(TMTooltip, { content: checkoutStatus.editLockTooltipText, position: "right", children: _jsx("span", { children: checkoutStatus.mode === 'editMode' ? SDKUI_Localizator.CheckOut : 'Locked' }) }) }));
+    }, [formData, fromDTD, isMobile]);
     const tmDcmtForm = useMemo(() => {
-        return _jsx(_Fragment, { children: metadataValuesSource.length > 0 &&
-                _jsxs(StyledToolbarCardContainer, { children: [_jsx(TMMetadataValues, { TID: TID, metadataValues: metadataValuesSource, metadataValuesOrig: metadataValuesSourceOrig, isExpertMode: isExpertMode, isOpenDistinctValues: isOpenDistinctValues, openChooserBySingleClick: !isOpenDistinctValues, selectedMID: focusedMetadataValue?.mid, isReadOnly: formMode === FormModes.ReadOnly, layoutMode: layoutMode, deviceType: deviceType, validationItems: validationItems, inputMids: inputMids, layout: layout, onFocusedItemChanged: (item) => { (item?.mid !== focusedMetadataValue?.mid) && setFocusedMetadataValue(item); }, onValueChanged: (newItems) => {
-                                setFormData((prevItems) => prevItems.map((item) => {
-                                    const newItem = newItems.find((newItem) => newItem.tid === item.tid && newItem.mid === item.mid);
-                                    return newItem ? { ...item, ...newItem } : item;
-                                }));
-                            }, onAdvancedMenuClick: (e) => {
-                                switch (e.button) {
-                                    case AdvancedMenuButtons.DistinctValues:
-                                        setIsOpenDistinctValues(!isOpenDistinctValues);
-                                        break;
-                                    case AdvancedMenuButtons.FormulaEditor:
-                                        setIsOpenFormulaEditor(!isOpenFormulaEditor);
-                                        break;
-                                }
-                            } }), _jsxs(StyledFormButtonsContainer, { children: [_jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: 10 }, children: _jsx("div", { style: { display: 'flex', justifyContent: 'center', alignItems: 'center', gap: '8px' }, children: layoutMode === LayoutModes.Update ? _jsxs(_Fragment, { children: [_jsx(TMSaveFormButtonSave, { showTooltip: false, btnStyle: 'advanced', advancedColor: '#f09c0a', isModified: isModified, formMode: formMode, errorsCount: validationItems.filter(o => o.ResultType == ResultTypes.ERROR).length, onSaveAsync: handleConfirmAction }), _jsx(TMSaveFormButtonUndo, { btnStyle: 'toolbar', showTooltip: true, color: 'primary', isModified: isModified, formMode: formMode, onUndo: handleUndo })] }) :
-                                            _jsxs(_Fragment, { children: [_jsx(TMButton, { disabled: archiveBtnDisabled, btnStyle: 'advanced', icon: _jsx(IconBoxArchiveIn, {}), width: 'auto', showTooltip: false, caption: SDKUI_Localizator.Archive, advancedColor: TMColors.success, onClick: handleConfirmAction }), _jsx(TMButton, { disabled: !clearFormBtnDisabled, btnStyle: 'advanced', icon: _jsx(IconClear, {}), width: 'auto', showTooltip: false, caption: SDKUI_Localizator.Clear, advancedColor: TMColors.tertiary, onClick: handleClearForm }), DID && _jsx(TMButton, { disabled: undoBtnDisabled, btnStyle: 'advanced', icon: _jsx(IconUndo, {}), width: '150px', showTooltip: false, caption: SDKUI_Localizator.Undo, advancedColor: TMColors.tertiary, onClick: handleUndo })] }) }) }), customButton && _jsx(TMCustomButton, { button: customButton, formData: formData, selectedItems: [], onClose: () => setCustomButton(undefined) }), totalItems > listMaxItems &&
-                                    !isApprView &&
-                                    TID !== SystemTIDs.Drafts &&
-                                    !shouldShowAll &&
-                                    _jsx(TMShowAllOrMaxItemsButton, { showAll: showAll, dataSourceLength: totalItems, onClick: () => { setShowAll(!showAll); } })] }), _jsx(ConfirmAttachmentsDialog, {})] }) });
+        return _jsxs(_Fragment, { children: [checkoutBadge && _jsx("div", { style: { padding: '10px', display: 'flex', justifyContent: 'center' }, children: checkoutBadge }), metadataValuesSource.length > 0 &&
+                    _jsxs(StyledToolbarCardContainer, { children: [_jsx(TMMetadataValues, { TID: TID, metadataValues: metadataValuesSource, metadataValuesOrig: metadataValuesSourceOrig, isExpertMode: isExpertMode, isOpenDistinctValues: isOpenDistinctValues, openChooserBySingleClick: !isOpenDistinctValues, selectedMID: focusedMetadataValue?.mid, isReadOnly: formMode === FormModes.ReadOnly, layoutMode: layoutMode, deviceType: deviceType, validationItems: validationItems, inputMids: inputMids, layout: layout, onFocusedItemChanged: (item) => { (item?.mid !== focusedMetadataValue?.mid) && setFocusedMetadataValue(item); }, onValueChanged: (newItems) => {
+                                    setFormData((prevItems) => prevItems.map((item) => {
+                                        const newItem = newItems.find((newItem) => newItem.tid === item.tid && newItem.mid === item.mid);
+                                        return newItem ? { ...item, ...newItem } : item;
+                                    }));
+                                }, onAdvancedMenuClick: (e) => {
+                                    switch (e.button) {
+                                        case AdvancedMenuButtons.DistinctValues:
+                                            setIsOpenDistinctValues(!isOpenDistinctValues);
+                                            break;
+                                        case AdvancedMenuButtons.FormulaEditor:
+                                            setIsOpenFormulaEditor(!isOpenFormulaEditor);
+                                            break;
+                                    }
+                                } }), _jsxs(StyledFormButtonsContainer, { children: [_jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: 10 }, children: _jsx("div", { style: { display: 'flex', justifyContent: 'center', alignItems: 'center', gap: '8px' }, children: layoutMode === LayoutModes.Update ? _jsxs(_Fragment, { children: [_jsx(TMSaveFormButtonSave, { showTooltip: false, btnStyle: 'advanced', advancedColor: '#f09c0a', isModified: isModified, formMode: formMode, errorsCount: validationItems.filter(o => o.ResultType == ResultTypes.ERROR).length, onSaveAsync: handleConfirmAction }), _jsx(TMSaveFormButtonUndo, { btnStyle: 'toolbar', showTooltip: true, color: 'primary', isModified: isModified, formMode: formMode, onUndo: handleUndo })] }) :
+                                                _jsxs(_Fragment, { children: [_jsx(TMButton, { disabled: archiveBtnDisabled, btnStyle: 'advanced', icon: _jsx(IconBoxArchiveIn, {}), width: 'auto', showTooltip: false, caption: SDKUI_Localizator.Archive, advancedColor: TMColors.success, onClick: handleConfirmAction }), _jsx(TMButton, { disabled: !clearFormBtnDisabled, btnStyle: 'advanced', icon: _jsx(IconClear, {}), width: 'auto', showTooltip: false, caption: SDKUI_Localizator.Clear, advancedColor: TMColors.tertiary, onClick: handleClearForm }), DID && _jsx(TMButton, { disabled: undoBtnDisabled, btnStyle: 'advanced', icon: _jsx(IconUndo, {}), width: '150px', showTooltip: false, caption: SDKUI_Localizator.Undo, advancedColor: TMColors.tertiary, onClick: handleUndo })] }) }) }), customButton && _jsx(TMCustomButton, { button: customButton, formData: formData, selectedItems: [], onClose: () => setCustomButton(undefined) }), totalItems > listMaxItems &&
+                                        !isApprView &&
+                                        TID !== SystemTIDs.Drafts &&
+                                        !shouldShowAll &&
+                                        _jsx(TMShowAllOrMaxItemsButton, { showAll: showAll, dataSourceLength: totalItems, onClick: () => { setShowAll(!showAll); } })] }), _jsx(ConfirmAttachmentsDialog, {})] })] });
     }, [
         TID,
         DID,
@@ -1060,11 +1248,11 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
         handleUndo,
         handleClearForm
     ]);
-    const tmBlog = useMemo(() => _jsx(TMDcmtBlog, { tid: TID, did: DID, allTasks: allTasks, fetchBlogDataTrigger: refreshBlogTrigger, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), [TID, DID, allTasks, refreshBlogTrigger]);
+    const tmBlog = useMemo(() => _jsx(TMDcmtBlog, { tid: TID, did: DID, allTasks: allTasks, fetchBlogDataTrigger: refreshBlogTrigger, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), [TID, DID, allTasks, refreshBlogTrigger, handleNavigateToWGs, handleNavigateToDossiers]);
     const tmSysMetadata = useMemo(() => _jsx(TMMetadataValues, { layoutMode: layoutMode, openChooserBySingleClick: !isOpenDistinctValues, TID: TID, isReadOnly: true, deviceType: deviceType, metadataValues: formData.filter(o => (o.mid != undefined && o.mid <= 100)), metadataValuesOrig: formData.filter(o => (o.mid != undefined && o.mid <= 100)), validationItems: [], inputMids: inputMids }), [TID, layoutMode, formData, deviceType, inputMids]);
     const tmDcmtPreview = useMemo(() => _jsx(TMDcmtPreviewWrapper, { currentDcmt: currentDcmt, dcmtFile: dcmtFile ?? inputFile, deviceType: deviceType, fromDTD: fromDTD, layoutMode: layoutMode, onFileUpload: (file) => {
             setDcmtFile(file);
-        }, enableDragDropOverlay: enableDragDropOverlay }), [currentDcmt, dcmtFile, deviceType, fromDTD, layoutMode, inputFile, enableDragDropOverlay, setDcmtFile]);
+        }, enableDragDropOverlay: enableDragDropOverlay }, refreshPreviewTrigger), [currentDcmt, dcmtFile, deviceType, fromDTD, layoutMode, inputFile, enableDragDropOverlay, setDcmtFile]);
     const tmWF = useMemo(() => {
         if (isWFDataLoading) {
             return (_jsx("div", { style: {
@@ -1079,7 +1267,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
         const isAuthorized = !!workflows?.[0]?.diagram;
         return (_jsxs("div", { style: { position: 'relative', width: '100%', height: '100%', display: 'flex', flexDirection: 'column', gap: 3 }, children: [workItems.length > 0
                     ? (isAuthorized
-                        ? _jsx(WFDiagram, { xmlDiagramString: workflows?.[0]?.diagram || '', allowEdit: false, currentSetID: workitemSetID })
+                        ? _jsx(WFDiagram, { xmlDiagramString: workflows?.[0]?.diagram || '', allowEdit: false, currentSetID: workitemSetID, defaultAutoZoom: true, workitems: workItemsForDiagram })
                         : _jsx("div", { style: {
                                 position: 'absolute',
                                 top: '50%',
@@ -1088,7 +1276,27 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
                                 fontSize: '1.1rem',
                                 color: TMColors.primaryColor,
                                 textAlign: 'center',
-                            }, children: SDKUI_Localizator.WorkflowDiagramNotAuthorized }))
+                                display: 'flex',
+                                flexDirection: 'column',
+                                alignItems: 'center',
+                                gap: '12px',
+                            }, children: _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '8px' }, children: [_jsx("span", { children: SDKUI_Localizator.WorkflowDiagramNotAuthorized }), wfError && (_jsx(TMTooltip, { content: 'Visualizza errore', children: _jsx("i", { className: "dx-icon-info", style: { fontSize: 20, cursor: 'pointer', color: '#dc3545' }, onClick: () => {
+                                                TMMessageBoxManager.show({
+                                                    title: 'Dettagli Errore Workflow',
+                                                    initialWidth: !isMobile ? '700px' : undefined,
+                                                    message: (_jsx("pre", { style: {
+                                                            whiteSpace: 'pre-wrap',
+                                                            background: '#f5f5f5',
+                                                            padding: '12px',
+                                                            borderRadius: '6px',
+                                                            userSelect: 'text',
+                                                            cursor: 'text',
+                                                        }, children: wfError })),
+                                                    resizable: true,
+                                                    showToppy: false,
+                                                    buttons: [ButtonNames.OK],
+                                                });
+                                            } }) }))] }) }))
                     : _jsx("div", { style: {
                             position: 'absolute',
                             top: '50%',
@@ -1103,7 +1311,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
                             backgroundColor: 'khaki',
                             borderRadius: 8
                         }, children: SDKUI_Localizator.WorkItemTechnicalNote_SetID })] }));
-    }, [workflows, formData, workitemSetID, workItems, isWFDataLoading]);
+    }, [workflows, formData, workitemSetID, workItems, workItemsForDiagram, isWFDataLoading, wfError, isMobile]);
     const tmDcmtTasks = useMemo(() => {
         const isReady = TID && DID && getAllTasks && deleteTaskByIdsCallback && addTaskCallback && editTaskCallback;
         if (!isReady) {
@@ -1228,7 +1436,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
     // Checks if there's a saved panel layout for the current context (ToDo or general)
     const hasSavedLayout = () => {
         const { setting } = getCurrentDcmtFormSetting();
-        if (invokedByTodo) {
+        if (invocationContext === InvocationContext.Todo) {
             // If invoked by ToDo, check for existence of layoutToDo and that it has keys
             return setting.layoutToDo !== undefined && Object.keys(setting.layoutToDo).length > 0;
         }
@@ -1247,8 +1455,8 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
         // Prepare the new setting object with updated layout depending on context
         const newSetting = {
             TID: normalizedTID,
-            layout: invokedByTodo ? (existingSetting.layout ?? {}) : state,
-            layoutToDo: invokedByTodo ? state : (existingSetting.layoutToDo ?? {}),
+            layout: invocationContext === InvocationContext.Todo ? (existingSetting.layout ?? {}) : state,
+            layoutToDo: invocationContext === InvocationContext.Todo ? state : (existingSetting.layoutToDo ?? {}),
         };
         // Replace existing setting if found, otherwise push a new one
         if (idx >= 0) {
@@ -1267,7 +1475,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
             return undefined;
         const settings = getCurrentDcmtFormSetting()?.setting;
         // Return the appropriate layout based on context
-        return invokedByTodo ? settings?.layoutToDo : settings?.layout;
+        return invocationContext === InvocationContext.Todo ? settings?.layoutToDo : settings?.layout;
     };
     const handleCompleteMoreInfo = useCallback(async () => {
         try {
@@ -1329,26 +1537,26 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
                 height: '100%',
                 position: 'relative',
                 overflow: 'hidden'
-            }, children: [_jsxs("div", { style: { width: '100%', height: '100%', display: isOpenDetails || isOpenMaster ? 'none' : 'flex' }, children: [isNavigating && _jsx(Spinner, { description: SDKUI_Localizator.Loading, flat: false }), (fromDTD) && _jsxs(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: useWaitPanelLocalState ? showWaitPanelLocal : showWaitPanel, showWaitPanelPrimary: useWaitPanelLocalState ? showPrimaryLocal : showPrimary, showWaitPanelSecondary: useWaitPanelLocalState ? showSecondaryLocal : showSecondary, waitPanelTitle: useWaitPanelLocalState ? waitPanelTitleLocal : waitPanelTitle, waitPanelTextPrimary: useWaitPanelLocalState ? waitPanelTextPrimaryLocal : waitPanelTextPrimary, waitPanelValuePrimary: useWaitPanelLocalState ? waitPanelValuePrimaryLocal : waitPanelValuePrimary, waitPanelMaxValuePrimary: useWaitPanelLocalState ? waitPanelMaxValuePrimaryLocal : waitPanelMaxValuePrimary, waitPanelTextSecondary: useWaitPanelLocalState ? waitPanelTextSecondaryLocal : waitPanelTextSecondary, waitPanelValueSecondary: useWaitPanelLocalState ? waitPanelValueSecondaryLocal : waitPanelValueSecondary, waitPanelMaxValueSecondary: useWaitPanelLocalState ? waitPanelMaxValueSecondaryLocal : waitPanelMaxValueSecondary, isCancelable: useWaitPanelLocalState ? dcmtFile ? dcmtFile.size >= 1000000 : false : true, abortController: useWaitPanelLocalState ? abortControllerLocal : abortController, children: [(groupId && groupId.length > 0)
-                                    ? _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", parentId: groupId, showToolbar: showDcmtFormSidebar })
-                                    : _jsxs(TMPanelManagerWithPersistenceProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: defaultPanelDimensions, initialDimensions: defaultPanelDimensions, initialMobilePanelId: 'tmDcmtForm', isPersistenceEnabled: !isMobile ? hasSavedLayout() : false, persistPanelStates: !isMobile ? (state) => persistPanelStates(state) : undefined, persistedPanelStates: getPersistedPanelStates(), children: [_jsx(WfButtonStateHandler, { isWFDisabled: isWFDisabled }), _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", parentId: groupId, showToolbar: showDcmtFormSidebar })] }), isOpenDistinctValues &&
-                                    _jsx(TMDistinctValues, { tid: TID, mid: focusedMetadataValue?.mid, isModal: true, showHeader: false, layoutMode: layoutMode, onSelectionChanged: (e) => {
-                                            if (!e)
-                                                return;
-                                            setFormData((prevItems) => prevItems.map((item) => item.tid == e.tid && item.mid === e.mid ? { ...item, value: e.newValue } : item));
-                                        } }), isOpenFormulaEditor &&
-                                    _jsx(TMFormulaEditor, { isModal: true, formMode: FormModes.Update, inputData: getFormula(), showBack: false, onClose: () => setIsOpenFormulaEditor(false), onApplied: (newFormula) => {
-                                            setFormData((prevItems) => prevItems.map((item) => item.tid == newFormula.tid && item.mid === newFormula.mid ? { ...item, value: FormulaHelper.addFormulaTag(newFormula.expression), isSelected: true, isEditable: true } : item));
-                                            setFocusedMetadataValue(prevState => ({
-                                                ...prevState,
-                                                isSelected: true,
-                                                isEditable: true,
-                                                value: FormulaHelper.addFormulaTag(newFormula.expression)
-                                            }));
-                                        } }), showApprovePopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, isReject: 0, onClose: () => setShowApprovePopup(false) }), showRejectPopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, isReject: 1, onClose: () => setShowRejectPopup(false) }), showReAssignPopup && _jsx(WorkFlowReAssignPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, onClose: () => setShowReAssignPopup(false) }), showMoreInfoPopup && _jsx(WorkFlowMoreInfoPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, onClose: () => setShowMoreInfoPopup(false) }), (isModal && onClose) && _jsx("div", { id: "TMDcmtFormShowConfirmForClose-" + id })] }), _jsx(ToppyDraggableHelpCenter, { initialIsCollapsed: false, deviceType: deviceType, isVisible: (showToppyForApprove || showToppyForCompleteMoreInfo || showToppyForReferences) && !openS4TViewer, content: _jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: '10px' }, children: [showToppyForApprove && (workItems.length === 1 ?
+            }, children: [_jsxs("div", { style: { width: '100%', height: '100%', display: isOpenDetails || isOpenMaster ? 'none' : 'flex' }, children: [isNavigating && _jsx(Spinner, { description: SDKUI_Localizator.Loading, flat: false }), (fromDTD) && _jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: useWaitPanelLocalState ? showWaitPanelLocal : showWaitPanel, showWaitPanelPrimary: useWaitPanelLocalState ? showPrimaryLocal : showPrimary, showWaitPanelSecondary: useWaitPanelLocalState ? showSecondaryLocal : showSecondary, waitPanelTitle: useWaitPanelLocalState ? waitPanelTitleLocal : waitPanelTitle, waitPanelTextPrimary: useWaitPanelLocalState ? waitPanelTextPrimaryLocal : waitPanelTextPrimary, waitPanelValuePrimary: useWaitPanelLocalState ? waitPanelValuePrimaryLocal : waitPanelValuePrimary, waitPanelMaxValuePrimary: useWaitPanelLocalState ? waitPanelMaxValuePrimaryLocal : waitPanelMaxValuePrimary, waitPanelTextSecondary: useWaitPanelLocalState ? waitPanelTextSecondaryLocal : waitPanelTextSecondary, waitPanelValueSecondary: useWaitPanelLocalState ? waitPanelValueSecondaryLocal : waitPanelValueSecondary, waitPanelMaxValueSecondary: useWaitPanelLocalState ? waitPanelMaxValueSecondaryLocal : waitPanelMaxValueSecondary, isCancelable: useWaitPanelLocalState ? dcmtFile ? dcmtFile.size >= 1000000 : false : true, abortController: useWaitPanelLocalState ? abortControllerLocal : abortController, children: _jsxs(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showCicoWaitPanel, showWaitPanelPrimary: showCicoPrimaryProgress, waitPanelTitle: cicoWaitPanelTitle, waitPanelTextPrimary: cicoPrimaryProgressText, waitPanelValuePrimary: cicoPrimaryProgressValue, waitPanelMaxValuePrimary: cicoPrimaryProgressMax, isCancelable: true, abortController: abortControllerLocal, children: [(groupId && groupId.length > 0)
+                                        ? _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", parentId: groupId, showToolbar: showDcmtFormSidebar })
+                                        : _jsxs(TMPanelManagerWithPersistenceProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: defaultPanelDimensions, initialDimensions: defaultPanelDimensions, initialMobilePanelId: 'tmDcmtForm', isPersistenceEnabled: !isMobile ? hasSavedLayout() : false, persistPanelStates: !isMobile ? (state) => persistPanelStates(state) : undefined, persistedPanelStates: getPersistedPanelStates(), children: [_jsx(WfButtonStateHandler, { isWFDisabled: isWFDisabled }), _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", parentId: groupId, showToolbar: showDcmtFormSidebar })] }), isOpenDistinctValues &&
+                                        _jsx(TMDistinctValues, { tid: TID, mid: focusedMetadataValue?.mid, isModal: true, showHeader: false, layoutMode: layoutMode, onSelectionChanged: (e) => {
+                                                if (!e)
+                                                    return;
+                                                setFormData((prevItems) => prevItems.map((item) => item.tid == e.tid && item.mid === e.mid ? { ...item, value: e.newValue } : item));
+                                            } }), isOpenFormulaEditor &&
+                                        _jsx(TMFormulaEditor, { isModal: true, formMode: FormModes.Update, inputData: getFormula(), showBack: false, onClose: () => setIsOpenFormulaEditor(false), onApplied: (newFormula) => {
+                                                setFormData((prevItems) => prevItems.map((item) => item.tid == newFormula.tid && item.mid === newFormula.mid ? { ...item, value: FormulaHelper.addFormulaTag(newFormula.expression), isSelected: true, isEditable: true } : item));
+                                                setFocusedMetadataValue(prevState => ({
+                                                    ...prevState,
+                                                    isSelected: true,
+                                                    isEditable: true,
+                                                    value: FormulaHelper.addFormulaTag(newFormula.expression)
+                                                }));
+                                            } }), showApprovePopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, isReject: 0, onClose: () => setShowApprovePopup(false) }), showRejectPopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, isReject: 1, onClose: () => setShowRejectPopup(false) }), showReAssignPopup && _jsx(WorkFlowReAssignPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, onClose: () => setShowReAssignPopup(false) }), showMoreInfoPopup && _jsx(WorkFlowMoreInfoPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, onClose: () => setShowMoreInfoPopup(false) }), (isModal && onClose) && _jsx("div", { id: "TMDcmtFormShowConfirmForClose-" + id })] }) }), _jsx(TMToppyDraggableHelpCenter, { isVisible: isToppyVisible, content: _jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: '10px' }, children: [showToppyForApprove && (workItems.length === 1 ?
                                         _jsx(WorkFlowOperationButtons, { deviceType: deviceType, onApprove: () => setShowApprovePopup(true), onSignApprove: handleSignApprove, onReject: () => setShowRejectPopup(true), onReAssign: () => setShowReAssignPopup(true), onMoreInfo: () => setShowMoreInfoPopup(true), dtd: fromDTD })
                                         :
-                                            _jsxs("div", { style: { padding: 10, color: 'white', maxWidth: '180px', borderRadius: 10, background: '#1B1464 0% 0% no-repeat padding-box', border: '1px solid #FFFFFF' }, children: [`Devi approvare ${workItems.length} workitem(s) per questo documento.`, `Vai alla sezione di approvazione.`] })), showToppyForCompleteMoreInfo && (_jsxs(_Fragment, { children: [_jsx("div", { style: { padding: 10, color: 'white', maxWidth: '180px', borderRadius: 10, background: '#1B1464 0% 0% no-repeat padding-box', border: '1px solid #FFFFFF' }, children: `${SDKUI_Localizator.MoreInfoCompleteRequestSentBy} ${taskMoreInfo?.fromName}!` }), _jsx(TMButton, { caption: SDKUI_Localizator.CommentAndComplete, color: 'success', showTooltip: false, onClick: () => {
+                                            _jsxs("div", { style: { padding: 10, color: 'white', maxWidth: '180px', borderRadius: 10, background: '#1B1464 0% 0% no-repeat padding-box', border: '1px solid #FFFFFF' }, children: [`Questo documento è associato a ${workItems.length} workitem.`, _jsx("br", {}), `Per approvare, vai alla pagina "Approvazione workflow".`] })), showToppyForCompleteMoreInfo && (_jsxs(_Fragment, { children: [_jsx("div", { style: { padding: 10, color: 'white', maxWidth: '180px', borderRadius: 10, background: '#1B1464 0% 0% no-repeat padding-box', border: '1px solid #FFFFFF' }, children: `${SDKUI_Localizator.MoreInfoCompleteRequestSentBy} ${taskMoreInfo?.fromName}!` }), _jsx(TMButton, { caption: SDKUI_Localizator.CommentAndComplete, color: 'success', showTooltip: false, onClick: () => {
                                                     setShowCommentForm(true);
                                                 } })] })), (showToppyForReferences && (dcmtReferences && dcmtReferences.length > 0)) && dcmtReferences
                                         .filter(ref => ref.objClass === ObjectClasses.Dossier || ref.objClass === ObjectClasses.WorkingGroup) // keep only known objClass types
@@ -1399,7 +1607,8 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
                     finally {
                         TMSpinner.hide();
                     }
-                }, onClose: () => setShowManyToManyChooser(false), manageUseLocalizedName: false })), 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: () => {
+                }, onClose: () => setShowManyToManyChooser(false), manageUseLocalizedName: false })), (showHistory && fromDTD && currentDcmt) && _jsx(TMViewHistoryDcmt, { fromDTD: fromDTD, deviceType: deviceType, inputDcmt: { TID: currentDcmt.tid, DID: currentDcmt.did }, onClose: hideHistoryCallback, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), (showCheckoutInformationForm && fromDTD && currentDcmt) &&
+                _jsx(TMDcmtCheckoutInfoForm, { dtdName: fromDTD.name ?? SDKUI_Localizator.SearchResult, selectedDcmtOrFocused: { TID: currentDcmt.tid, DID: currentDcmt.did, FILEEXT: currentDcmt.fileExt }, onClose: hideCheckoutInformationFormCallback }), (commentFormState.show && currentDcmt) && _jsx(TMBlogCommentForm, { context: { engine: 'SearchEngine', object: { tid: currentDcmt.tid, did: currentDcmt.did } }, onClose: hideCommentFormCallback, refreshCallback: triggerBlogRefresh, participants: [], showAttachmentsSection: false, allArchivedDocumentsFileItems: [], isCommentRequired: commentFormState.isRequired, removeAndEditAttachment: commentFormState.removeAndEditAttachment }), 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);
@@ -1410,7 +1619,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
                     setArchiveRelatedDcmtFormTID(undefined);
                     setArchiveRelatedDcmtFormMids([]);
                     await fetchData();
-                }, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers })), showPairDcmtsModal && (_jsx(TMModal, { title: (isPairingManyToMany ? "Abbina" : "Disabbina") + " documenti", onClose: () => setShowPairDcmtsModal(false), width: isMobile ? '90%' : '50%', height: isMobile ? '90%' : '70%', children: _jsx(TMSearchResult, { searchResults: pairedSearchResults, onRefreshSearchAsync: async () => await fetchData(), onTaskCreateRequest: onTaskCreateRequest, allowFloatingBar: false, floatingActionConfig: pairFloatingActionConfig, showBackButton: false, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }) }))] }));
+                }, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, onReferenceClick: handleNavigateToReference })), showPairDcmtsModal && (_jsx(TMModal, { title: (isPairingManyToMany ? "Abbina" : "Disabbina") + " documenti", onClose: () => setShowPairDcmtsModal(false), width: isMobile ? '90%' : '50%', height: isMobile ? '90%' : '70%', children: _jsx(TMSearchResult, { searchResults: pairedSearchResults, onRefreshSearchAsync: async () => await fetchData(), onTaskCreateRequest: onTaskCreateRequest, allowFloatingBar: false, floatingActionConfig: pairFloatingActionConfig, showBackButton: false, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }) }))] }));
 };
 export default TMDcmtForm;
 /**
@@ -1433,8 +1642,11 @@ const applyMetadataFilter = (data, showAll, listMaxItems, TID) => {
         o.mid === SystemMIDsAsNumber.FileSize ||
         o.mid === SystemMIDsAsNumber.LastUpdateTime ||
         o.mid === SystemMIDsAsNumber.CreationTime;
+    const chronologySystemFilter = (o) => baseFilter(o) ||
+        o.mid === SystemMIDsAsNumber.FileExt ||
+        o.mid === SystemMIDsAsNumber.FileSize;
     // Select the appropriate filter based on document type
-    const currentFilter = TID === SystemTIDs.Drafts ? draftFilter : baseFilter;
+    const currentFilter = TID === SystemTIDs.Drafts ? draftFilter : TID === SystemTIDs.Chronology ? chronologySystemFilter : baseFilter;
     // Apply filter once
     const filteredData = data.filter(currentFilter);
     // Return all filtered data or slice to max items
@@ -1488,3 +1700,35 @@ const TMDcmtPreviewWrapper = ({ currentDcmt, layoutMode, fromDTD, dcmtFile, devi
         _jsx(TMDcmtPreview, { isVisible: isVisible, onClosePanel: (!isMobile && countVisibleLeafPanels() > 1) ? () => setPanelVisibilityById('tmDcmtPreview', false) : undefined, allowMaximize: !isMobile && countVisibleLeafPanels() > 1, onMaximizePanel: (!isMobile && countVisibleLeafPanels() > 1) ? () => toggleMaximize("tmDcmtPreview") : undefined, dcmtData: currentDcmt, isResizingActive: isResizingActive }) :
         _jsx(TMFileUploader, { onFileUpload: onFileUpload, onClose: (!isMobile && countVisibleLeafPanels() > 1) ? () => setPanelVisibilityById('tmDcmtPreview', false) : undefined, isRequired: fromDTD?.archiveConstraint === ArchiveConstraints.ContentCompulsory && dcmtFile === null, defaultBlob: dcmtFile, deviceType: deviceType, isResizingActive: isResizingActive, enableDragDropOverlay: panelVisibility['tmDcmtPreview'] && enableDragDropOverlay }));
 };
+const Ribbon = styled.div `
+    font-size: 0.85rem;
+    font-weight: 600;
+    color: #fff;
+    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
+    --f: .4em; /* control the folded part */
+    position: absolute;
+    top: 2px;
+    left: 2px;
+    z-index: 1200;
+    line-height: 1.6;
+    padding-inline: 0.8lh;
+    padding-bottom: var(--f);
+    border-image: conic-gradient(#0008 0 0) 51%/var(--f);
+    clip-path: polygon(100% calc(100% - var(--f)),100% 100%,calc(100% - var(--f)) calc(100% - var(--f)),var(--f) calc(100% - var(--f)), 0 100%,0 calc(100% - var(--f)),999px calc(100% - var(--f) - 999px),calc(100% - 999px) calc(100% - var(--f) - 999px));
+    transform: translate(calc((cos(45deg) - 1)*100%), -100%) rotate(-45deg);
+    transform-origin: 100% 100%;
+    background-color: rgba(217, 148, 13, 0.92);
+    display: inline-block;
+    padding-top: 0.1em;
+    white-space: nowrap;
+    transition: ${props => props.$isMobile ? 'none' : 'all 0.3s ease'};
+    cursor: 'default';
+    
+    ${props => !props.$isMobile && `
+        &:hover {
+            background-color: #d9940d;
+            font-size: 1.1rem;
+            transform: translate(calc((cos(45deg) - 1)*100%), -100%) rotate(-45deg) scale(1.05);
+        }
+    `}
+`;