@topconsultnpm/sdkui-react 6.22.0-dev2.47 → 6.22.0-dev2.49

package/lib/components/base/TMPanel.d.ts

@@ -18,6 +18,10 @@ export interface ITMPanelProps {
     isVisible?: boolean;
     panelID?: string;
     isActive?: boolean;
+    /** Se fornita, in testata compare il bottone di ricarica: finché la Promise è pendente il pannello mostra il loader */
+    onRefresh?: () => void | Promise<void>;
+    /** Mostra il loader sul contenuto anche per caricamenti non avviati dal bottone di ricarica */
+    isRefreshing?: boolean;
     onActivate?: (panelID: string) => void;
     onActiveChanged?: (isActive: boolean) => void;
     onBack?: () => void;

package/lib/components/base/TMPanel.js

@@ -1,100 +1,102 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useRef, useState, forwardRef, useImperativeHandle } from 'react';
 import styled, { css, keyframes } from 'styled-components';
-import { getAppModuleGradient, IconArrowLeft, IconClearButton, IconWindowMaximize, IconWindowMinimize, isPositiveNumber, SDKUI_Localizator } from '../../helper';
+import { getAppModuleGradient, IconArrowLeft, IconClearButton, IconRefresh, IconWindowMaximize, IconWindowMinimize, isPositiveNumber, SDKUI_Localizator } from '../../helper';
 import TMButton from './TMButton';
-import { Gutters } from '../../utils/theme';
-const StyledBackButton = styled.button `
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    gap: 4px;
-    padding: 4px 10px;
-    border: 1px solid ${({ $isActive }) => $isActive ? 'rgba(37, 89, 165, 0.3)' : 'rgba(255, 255, 255, 0.4)'};
-    border-radius: 6px;
-    cursor: pointer;
-    font-weight: 500;
-    font-size: 0.85rem;
-    flex-shrink: 0;
-    transition: all 0.15s ease;
-    background-color: ${({ $isActive }) => $isActive ? '#FFFFFF' : '#2559A5'};
-    box-shadow: none;
-    
-    &&, && * {
-        color: ${({ $isActive }) => $isActive ? '#2559A5' : '#FFFFFF'} !important;
-    }
-    
-    svg {
-        font-size: 14px;
-    }
+import { LoadIndicator } from 'devextreme-react/load-indicator';
+import { TMExceptionBoxManager } from './TMPopUp';
+import { Gutters, TMColors } from '../../utils/theme';
+const StyledBackButton = styled.button `
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
+    padding: 4px 10px;
+    border: 1px solid ${({ $isActive }) => $isActive ? 'rgba(37, 89, 165, 0.3)' : 'rgba(255, 255, 255, 0.4)'};
+    border-radius: 6px;
+    cursor: pointer;
+    font-weight: 500;
+    font-size: 0.85rem;
+    flex-shrink: 0;
+    transition: all 0.15s ease;
+    background-color: ${({ $isActive }) => $isActive ? '#FFFFFF' : '#2559A5'};
+    box-shadow: none;
+    
+    &&, && * {
+        color: ${({ $isActive }) => $isActive ? '#2559A5' : '#FFFFFF'} !important;
+    }
+    
+    svg {
+        font-size: 14px;
+    }
 `;
 import { AppModules, SDK_Globals } from '@topconsultnpm/sdk-ts';
 import { DeviceType, useDeviceType } from './TMDeviceProvider';
-const StyledPanelContainer = styled.div `
-    width: 100%;
-    height: 100%;
-    font-size: 1rem;
-    box-shadow: 3px 3px 5px #D3D3D3BF;
-    border-radius: 10px;
-    opacity: 1;
-    background: #FFFFFF;
-    min-height: 0; 
-    overflow: hidden;
-    position: ${({ $isMaximized }) => $isMaximized ? 'fixed' : 'relative'};
-    top: ${({ $isMaximized }) => $isMaximized ? '50px' : 'auto'};
-    left: ${({ $isMaximized }) => $isMaximized ? '50px' : 'auto'};
-    width: ${({ $isMaximized }) => $isMaximized ? `calc(100vw - 50px - (${Gutters.getGutters()}px * 2))` : '100%'};
-    height: ${({ $isMaximized }) => $isMaximized ? `calc(100vh - 50px - (${Gutters.getGutters()}px * 2))` : '100%'};
-    z-index: ${({ $isMaximized }) => $isMaximized ? 2000 : 'auto'};
-    margin: ${({ $isMaximized }) => $isMaximized ? `${Gutters.getGutters()}px` : '0'};
-    outline: none;
-    /* transition: all 0.2s; */
+const StyledPanelContainer = styled.div `
+    width: 100%;
+    height: 100%;
+    font-size: 1rem;
+    box-shadow: 3px 3px 5px #D3D3D3BF;
+    border-radius: 10px;
+    opacity: 1;
+    background: #FFFFFF;
+    min-height: 0; 
+    overflow: hidden;
+    position: ${({ $isMaximized }) => $isMaximized ? 'fixed' : 'relative'};
+    top: ${({ $isMaximized }) => $isMaximized ? '50px' : 'auto'};
+    left: ${({ $isMaximized }) => $isMaximized ? '50px' : 'auto'};
+    width: ${({ $isMaximized }) => $isMaximized ? `calc(100vw - 50px - (${Gutters.getGutters()}px * 2))` : '100%'};
+    height: ${({ $isMaximized }) => $isMaximized ? `calc(100vh - 50px - (${Gutters.getGutters()}px * 2))` : '100%'};
+    z-index: ${({ $isMaximized }) => $isMaximized ? 2000 : 'auto'};
+    margin: ${({ $isMaximized }) => $isMaximized ? `${Gutters.getGutters()}px` : '0'};
+    outline: none;
+    /* transition: all 0.2s; */
 `;
-const StyledPanelHeader = styled.div `
-    width:100% ;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-start;
-    padding: 4px 10px;
+const StyledPanelHeader = styled.div `
+    width:100% ;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: flex-start;
+    padding: 4px 10px;
     background: ${({ $isActive, $backgroundColor, $activeGradient }) => $isActive
     ? ($activeGradient ??
         'linear-gradient(270deg, #46B5A2 16%, #3BAABC 34%, #3BAABC 34%, #3681AD 54%, #3368A5 72%, #2F549D 88%, #304F99 100%)')
-    : ($backgroundColor ?? '#F4F4F4')};
-    box-shadow: 3px 3px 5px #D3D3D3BF;
-    color: ${({ $isActive, $color }) => $isActive ? '#FFFFFF' : ($color ?? '#2559A5')};
-    border-top-right-radius: 10px;
-    border-top-left-radius: 10px;
-    height: 40px;
-    font-weight: 600;
-    outline: none;
-    &:focus {
-        outline: none;
-    }
-    // Ensure all children inherit the header color
-    &,
-    * {
-        color: ${({ $isActive, $color }) => $isActive ? '#FFFFFF' : ($color ?? '#2559A5')} !important;
-    }
+    : ($backgroundColor ?? '#F4F4F4')};
+    box-shadow: 3px 3px 5px #D3D3D3BF;
+    color: ${({ $isActive, $color }) => $isActive ? '#FFFFFF' : ($color ?? '#2559A5')};
+    border-top-right-radius: 10px;
+    border-top-left-radius: 10px;
+    height: 40px;
+    font-weight: 600;
+    outline: none;
+    &:focus {
+        outline: none;
+    }
+    // Ensure all children inherit the header color
+    &,
+    * {
+        color: ${({ $isActive, $color }) => $isActive ? '#FFFFFF' : ($color ?? '#2559A5')} !important;
+    }
 `;
-const StyledPanelContent = styled.div `
-    width: 100%;
-    height: ${props => props.$height};
-    min-height: 0; 
-    overflow: hidden;
-    border-bottom-right-radius: 10px;
-    border-bottom-left-radius: 10px;
-    padding: ${props => props.$padding};
-    display: flex;
-    justify-content: space-between;
-    position: relative;
-    user-select: none;
-    -webkit-touch-callout: none;
-  -webkit-user-select: none;
-    outline: none;
-    &:focus {
-        outline: none;
-    }
+const StyledPanelContent = styled.div `
+    width: 100%;
+    height: ${props => props.$height};
+    min-height: 0; 
+    overflow: hidden;
+    border-bottom-right-radius: 10px;
+    border-bottom-left-radius: 10px;
+    padding: ${props => props.$padding};
+    display: flex;
+    justify-content: space-between;
+    position: relative;
+    user-select: none;
+    -webkit-touch-callout: none;
+  -webkit-user-select: none;
+    outline: none;
+    &:focus {
+        outline: none;
+    }
 `;
 // Allineata al TABLET_BREAKPOINT (768) di TMDeviceProvider
 const MOBILE_MEDIA_QUERY = '(max-width: 767.98px)';
@@ -103,69 +105,102 @@ const MOBILE_MEDIA_QUERY = '(max-width: 767.98px)';
 // la track (larga quanto il viewport) va a +100% della PROPRIA larghezza, il testo a -100%
 // della SUA. Le due animazioni hanno stessa durata ed easing, quindi lo scostamento netto
 // in ogni istante è esattamente e(t) * (viewport - testo).
-const panelTitleTrackMarquee = keyframes `
-    0%, 15% { transform: translateX(0); }
-    45%, 55% { transform: translateX(100%); }
-    85%, 100% { transform: translateX(0); }
+const panelTitleTrackMarquee = keyframes `
+    0%, 15% { transform: translateX(0); }
+    45%, 55% { transform: translateX(100%); }
+    85%, 100% { transform: translateX(0); }
 `;
-const panelTitleTextMarquee = keyframes `
-    0%, 15% { transform: translateX(0); }
-    45%, 55% { transform: translateX(-100%); }
-    85%, 100% { transform: translateX(0); }
+const panelTitleTextMarquee = keyframes `
+    0%, 15% { transform: translateX(0); }
+    45%, 55% { transform: translateX(-100%); }
+    85%, 100% { transform: translateX(0); }
 `;
 // Ritaglia il testo in eccesso: è l'unico box con overflow hidden, la track ci scorre dentro
-const StyledPanelTitleViewport = styled.div `
-    flex: 1;
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    min-width: 0;
-    overflow: hidden;
-    padding: 0 8px;
+const StyledPanelTitleViewport = styled.div `
+    flex: 1;
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+    min-width: 0;
+    overflow: hidden;
+    padding: 0 8px;
 `;
 // Larga quanto il viewport: è il metro con cui il -100% del testo viene compensato.
-const StyledPanelTitleTrack = styled.div `
-    flex: 1;
-    min-width: 0;
-    display: flex;
-    align-items: center;
-
-    ${({ $marquee }) => $marquee && css `
-        @media ${MOBILE_MEDIA_QUERY} {
-            animation: ${panelTitleTrackMarquee} 10s ease-in-out infinite;
-
-            @media (prefers-reduced-motion: reduce) {
-                animation: none;
-            }
-        }
-    `}
+const StyledPanelTitleTrack = styled.div `
+    flex: 1;
+    min-width: 0;
+    display: flex;
+    align-items: center;
+
+    ${({ $marquee }) => $marquee && css `
+        @media ${MOBILE_MEDIA_QUERY} {
+            animation: ${panelTitleTrackMarquee} 10s ease-in-out infinite;
+
+            @media (prefers-reduced-motion: reduce) {
+                animation: none;
+            }
+        }
+    `}
 `;
 // Senza $marquee resta il troncamento con i puntini di sempre
-const StyledPanelTitle = styled.div `
-    margin: 0;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-
-    ${({ $marquee }) => $marquee && css `
-        @media ${MOBILE_MEDIA_QUERY} {
-            flex: 0 0 auto;
-            width: max-content;
-            min-width: 100%;
-            max-width: none;
-            overflow: visible;
-            text-overflow: clip;
-            animation: ${panelTitleTextMarquee} 10s ease-in-out infinite;
-
-            @media (prefers-reduced-motion: reduce) {
-                animation: none;
-                width: auto;
-                min-width: 0;
-                overflow: hidden;
-                text-overflow: ellipsis;
-            }
-        }
-    `}
+const StyledPanelTitle = styled.div `
+    margin: 0;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+
+    ${({ $marquee }) => $marquee && css `
+        @media ${MOBILE_MEDIA_QUERY} {
+            flex: 0 0 auto;
+            width: max-content;
+            min-width: 100%;
+            max-width: none;
+            overflow: visible;
+            text-overflow: clip;
+            animation: ${panelTitleTextMarquee} 10s ease-in-out infinite;
+
+            @media (prefers-reduced-motion: reduce) {
+                animation: none;
+                width: auto;
+                min-width: 0;
+                overflow: hidden;
+                text-overflow: ellipsis;
+            }
+        }
+    `}
+`;
+const refreshSpin = keyframes `
+    from { transform: rotate(0deg); }
+    to { transform: rotate(360deg); }
+`;
+// Fa girare l'icona per tutta la durata del ricaricamento
+const StyledRefreshIcon = styled.span `
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    ${({ $isSpinning }) => $isSpinning && css `
+        animation: ${refreshSpin} 1s linear infinite;
+
+        @media (prefers-reduced-motion: reduce) {
+            animation: none;
+        }
+    `}
+`;
+// Copre il solo contenuto del pannello (StyledPanelContent è position: relative con overflow hidden)
+const StyledPanelLoaderOverlay = styled.div `
+    position: absolute;
+    inset: 0;
+    z-index: 10;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 10px;
+    background: rgba(255, 255, 255, 0.65);
+    border-bottom-right-radius: 10px;
+    border-bottom-left-radius: 10px;
+    color: ${TMColors.primaryColor};
 `;
 /**
  * TMPanel - Pannello con supporto Controlled/Uncontrolled
@@ -175,8 +210,26 @@ const StyledPanelTitle = styled.div `
  *   - Se passata → Controlled: il parent gestisce lo stato tramite onActivate
  */
 const TMPanel = forwardRef(({ allowMaximize = true, color, backgroundColor, backgroundColorContainer, children, showHeader = true, title, enableTitleMarquee = false, totalItems, displayedItemsCount, toolbar, padding = '5px', isVisible = true, panelID = 'tmpanel', isActive, // Questa prop determinerà la modalità
-onActivate, onBack, onClose, onHeaderDoubleClick, onMaximize, onActiveChanged }, ref) => {
+onRefresh, isRefreshing, onActivate, onBack, onClose, onHeaderDoubleClick, onMaximize, onActiveChanged }, ref) => {
     const [isMaximized, setIsMaximized] = useState(false);
+    const [isRefreshingInternal, setIsRefreshingInternal] = useState(false);
+    // Il loader compare sia per il refresh dalla testata sia per i caricamenti segnalati dal contenuto
+    const isBusy = isRefreshing || isRefreshingInternal;
+    const handleRefresh = useCallback(async () => {
+        if (isRefreshingInternal)
+            return;
+        setIsRefreshingInternal(true);
+        // Il finally garantisce che loader e rotellina si fermino anche se il ricaricamento fallisce
+        try {
+            await onRefresh?.();
+        }
+        catch (ex) {
+            TMExceptionBoxManager.show({ exception: ex });
+        }
+        finally {
+            setIsRefreshingInternal(false);
+        }
+    }, [isRefreshingInternal, onRefresh]);
     // Detect device type (e.g., mobile or desktop)
     const deviceType = useDeviceType();
     const isMobile = deviceType === DeviceType.MOBILE;
@@ -270,8 +323,9 @@ onActivate, onBack, onClose, onHeaderDoubleClick, onMaximize, onActiveChanged },
                                     alignItems: 'center',
                                     gap: '5px',
                                     flexShrink: 0
-                                }, children: [toolbar, allowMaximize && _jsx(TMButton, { color: 'primaryOutline', caption: isMaximized ? SDKUI_Localizator.Minimize : SDKUI_Localizator.Maximize, icon: isMaximized
+                                }, children: [toolbar, onRefresh && _jsx(TMButton, { color: 'primaryOutline', caption: SDKUI_Localizator.Refresh, disabled: isBusy, icon: _jsx(StyledRefreshIcon, { "$isSpinning": isBusy, children: _jsx(IconRefresh, {}) }), btnStyle: 'icon', onClick: handleRefresh }), allowMaximize && _jsx(TMButton, { color: 'primaryOutline', caption: isMaximized ? SDKUI_Localizator.Minimize : SDKUI_Localizator.Maximize, icon: isMaximized
                                             ? _jsx(IconWindowMinimize, { fontSize: 16 })
-                                            : _jsx(IconWindowMaximize, { fontSize: 16 }), btnStyle: 'icon', onClick: handleMaximize }), onClose && _jsx(TMButton, { color: 'primaryOutline', caption: SDKUI_Localizator.Close, icon: _jsx(IconClearButton, {}), btnStyle: 'icon', onClick: () => { setIsMaximized(false); onClose?.(); } })] })] }) }), _jsx(StyledPanelContent, { "$height": showHeader ? "calc(100% - 40px)" : "100%", "$padding": padding, "$backgroundColor": backgroundColorContainer ?? `#FFFFFF`, children: children })] }));
+                                            : _jsx(IconWindowMaximize, { fontSize: 16 }), btnStyle: 'icon', onClick: handleMaximize }), onClose && _jsx(TMButton, { color: 'primaryOutline', caption: SDKUI_Localizator.Close, icon: _jsx(IconClearButton, {}), btnStyle: 'icon', onClick: () => { setIsMaximized(false); onClose?.(); } })] })] }) }), _jsxs(StyledPanelContent, { "$height": showHeader ? "calc(100% - 40px)" : "100%", "$padding": padding, "$backgroundColor": backgroundColorContainer ?? `#FFFFFF`, children: [children, isBusy &&
+                        _jsxs(StyledPanelLoaderOverlay, { children: [_jsx(LoadIndicator, { height: 40, width: 40 }), _jsx("div", { children: SDKUI_Localizator.Loading })] })] })] }));
 });
 export default TMPanel;

package/lib/components/features/archive/TMArchive.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useEffect, useMemo, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import Logo from '../../../assets/Toppy-generico.png';
 import { ArchiveConstraints, DcmtTypeListCacheService, LayoutModes, SDK_Localizator } from '@topconsultnpm/sdk-ts';
 import { IconTree, SDKUI_Globals, SDKUI_Localizator, IconRecentlyViewed, IconPreview, IconShow, IconBoard, IconDcmtTypeSys, removeMruTid, getMoreInfoTasksForDocument } from '../../../helper';
@@ -56,6 +56,13 @@ const TMArchive = ({ onDcmtTypeSelect = undefined, inputTID, inputFile = null, c
         previousTIDRef.current = currentTID;
     }, [currentTID, onDcmtTypeSelect, isSharedArchive]);
     const isMobile = deviceType === DeviceType.MOBILE;
+    // Scorciatoie: rilegge dal server l'elenco dei tipi documento, così le scorciatoie riflettono
+    // quelli aggiunti o rimossi. La nuova identità di mruTIDs fa ricaricare i descrittori a TMRecentsManager.
+    const refreshRecentsAsync = useCallback(async () => {
+        DcmtTypeListCacheService.RemoveAllWithoutMetadata();
+        await DcmtTypeListCacheService.GetAllWithoutMetadataAsync();
+        setMruTIDs([...SDKUI_Globals.userSettings.archivingSettings.mruTIDs]);
+    }, []);
     const tmTreeSelectorElement = useMemo(() => _jsx(TMTreeSelectorWrapper, { isMobile: isMobile, isSharedArchive: isSharedArchive, onSelectedTIDChanged: (tid) => {
             setCurrentTID(tid);
             if (tid && mruTIDs.includes(tid))
@@ -108,7 +115,14 @@ const TMArchive = ({ onDcmtTypeSelect = undefined, inputTID, inputFile = null, c
         {
             id: 'tmRecentsManager',
             name: SDKUI_Localizator.Shortcuts,
-            contentOptions: { component: tmRecentsManagerElement, panelContainer: { title: SDKUI_Localizator.Shortcuts, totalItems: mruTIDs.length } },
+            contentOptions: {
+                component: tmRecentsManagerElement,
+                panelContainer: {
+                    title: SDKUI_Localizator.Shortcuts,
+                    totalItems: mruTIDs.length,
+                    onRefresh: refreshRecentsAsync
+                }
+            },
             toolbarOptions: { icon: _jsx(IconRecentlyViewed, { fontSize: 24 }), visible: true, orderNumber: 2, isActive: allInitialPanelVisibility['tmRecentsManager'] }
         },
         {
@@ -139,7 +153,7 @@ const TMArchive = ({ onDcmtTypeSelect = undefined, inputTID, inputFile = null, c
                 }
             ]
         },
-    ], [tmTreeSelectorElement, tmRecentsManagerElement, tmFormElement, currentTID, mruTIDs, isSharedArchive]);
+    ], [tmTreeSelectorElement, tmRecentsManagerElement, tmFormElement, currentTID, mruTIDs, isSharedArchive, refreshRecentsAsync]);
     return (_jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'tmRecentsManager', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }));
 };
 export default TMArchive;

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

@@ -863,6 +863,43 @@ const TMDcmtForm = ({ TID, DID, groupId, layoutMode = LayoutModes.Update, formMo
     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: operationItems, trigger: "left", children: _jsx(IconMenuVertical, { color: 'white', cursor: 'pointer' }) }), layoutMode === LayoutModes.Ark && !archiveList.enabled &&
                 _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, operationItems, handlePassToSearch, archiveList.enabled]);
+    // Ricarica del pannello metadati: invalida le cache del tipo documento e del layout, così la
+    // definizione dei metadati e la disposizione del form vengono rilette dal server, poi ricostruisce il form
+    const reloadFormMetadataAsync = useCallback(async () => {
+        if (!TID)
+            return;
+        // refreshCache invalida la voce in cache e rilegge il tipo documento con i metadati:
+        // la GetWithNotGrantedAsync della load successiva trova quella appena aggiornata
+        await DcmtTypeListCacheService.GetAsync(TID, true, undefined, false, true);
+        LayoutCacheService.Remove(TID, layoutMode);
+        if (layoutMode === LayoutModes.Update)
+            LayoutCacheService.Remove(TID, LayoutModes.None);
+        await loadDocumentFormDataAsync();
+    }, [TID, layoutMode, loadDocumentFormDataAsync]);
+    // Il ricaricamento ricostruisce il form: con valori inseriti e non salvati chiede prima conferma.
+    // In archiviazione la ricostruzione sgancia anche il file, quindi va confermata pure in quel caso.
+    const handleRefreshFormMetadataAsync = useCallback(async () => {
+        const hasPendingChanges = isModified || (layoutMode === LayoutModes.Ark && !!dcmtFile);
+        if (!hasPendingChanges) {
+            await reloadFormMetadataAsync();
+            return;
+        }
+        const isConfirmed = await new Promise(resolve => {
+            let isAnswered = false;
+            TMMessageBoxManager.show({
+                parentId: isModal ? "TMDcmtFormShowConfirmForClose-" + id : undefined,
+                title: SDKUI_Localizator.Refresh,
+                message: SDKUI_Localizator.ConfirmOnCancel,
+                buttons: [ButtonNames.YES, ButtonNames.NO],
+                onButtonClick: (e) => { isAnswered = true; resolve(e === ButtonNames.YES); },
+                // Chiusura dalla X: senza questa la Promise non si risolverebbe e il loader resterebbe acceso
+                onClose: () => { if (!isAnswered)
+                    resolve(false); }
+            });
+        });
+        if (isConfirmed)
+            await reloadFormMetadataAsync();
+    }, [isModified, layoutMode, dcmtFile, isModal, id, reloadFormMetadataAsync]);
     const handleUndo = useCallback(() => {
         setFormData(structuredClone(formDataOrig));
     }, [formDataOrig]);
@@ -1347,6 +1384,7 @@ const TMDcmtForm = ({ TID, DID, groupId, layoutMode = LayoutModes.Update, formMo
                         allowMaximize: !isMobile,
                         onBack: getOnBackHandler(true),
                         onClose: isClosable ? () => { } : undefined,
+                        onRefresh: handleRefreshFormMetadataAsync,
                         toolbar: allowNavigation ? formToolbar : _jsx(_Fragment, {})
                     },
                 },
@@ -1436,7 +1474,7 @@ const TMDcmtForm = ({ TID, DID, groupId, layoutMode = LayoutModes.Update, formMo
             },
         ];
         return panels;
-    }, [fromDTD, showBackButton, tmDcmtForm, tmBlog, tmSysMetadata, tmDcmtPreview, tmWF, tmDcmtTasks, isPreviewDisabled, isSysMetadataDisabled, isBoardDisabled, isWFDisabled, inputFile, isClosable, allTasks, DID, TID, isReadOnlyOriginCallback, metadataDcmtOrigin?.fromTID]);
+    }, [fromDTD, showBackButton, tmDcmtForm, tmBlog, tmSysMetadata, tmDcmtPreview, tmWF, tmDcmtTasks, isPreviewDisabled, isSysMetadataDisabled, isBoardDisabled, isWFDisabled, inputFile, isClosable, allTasks, DID, TID, isReadOnlyOriginCallback, metadataDcmtOrigin?.fromTID, handleRefreshFormMetadataAsync]);
     // Retrieves the current document form setting based on the normalized TID
     const getCurrentDcmtFormSetting = () => {
         const settings = SDKUI_Globals.userSettings.dcmtFormSettings;

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

@@ -5,7 +5,7 @@ import TMSavedQuerySelector from './TMSavedQuerySelector';
 import TMTreeSelector from './TMTreeSelector';
 import { TabPanel, Item } from 'devextreme-react/tab-panel';
 import TMSearchQueryPanel, { refreshLastSearch } from './TMSearchQueryPanel';
-import { getSysAllDcmtsSQD, IconFilter, IconRecentlyViewed, IconSavedQuery, IconTree, mergeSearchResultsAppend, removeMruTid, SDKUI_Globals, SDKUI_Localizator, updateMruTids } from '../../../helper';
+import { getSysAllDcmtsSQD, SYS_ALL_DCMTS_SQD_ID, IconFilter, IconRecentlyViewed, IconSavedQuery, IconTree, mergeSearchResultsAppend, removeMruTid, SDKUI_Globals, SDKUI_Localizator, updateMruTids } from '../../../helper';
 import TMSearchResult from './TMSearchResult';
 import TMRecentsManager from '../../grids/TMRecentsManager';
 import { SearchResultContext } from '../../../ts';
@@ -152,6 +152,42 @@ const TMSearch = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTask
         if (sqdToBeSet)
             await setSqdAsync?.(sqdToBeSet);
     }, []);
+    // --- REFRESH DEI PANNELLI ---
+    // Scorciatoie: rilegge dal server l'elenco dei tipi documento, così le scorciatoie riflettono
+    // quelli aggiunti o rimossi. La nuova identità di mruTIDs fa ricaricare i descrittori a TMRecentsManager.
+    const refreshRecentsAsync = useCallback(async () => {
+        DcmtTypeListCacheService.RemoveAllWithoutMetadata();
+        await DcmtTypeListCacheService.GetAllWithoutMetadataAsync();
+        setMruTIDs([...SDKUI_Globals.userSettings.searchSettings.mruTIDs]);
+    }, []);
+    // Ricerche rapide: invalida la cache delle saved query e ricarica l'elenco del tipo documento corrente
+    const refreshSavedQueriesAsync = useCallback(async () => {
+        // loadDataSQDsAsync riporta la selezione sulla prima tab: il refresh non deve spostare quella scelta dall'utente
+        const sqdMode = currentSQDMode;
+        await loadDataSQDsAsync(true, fromDTD?.id ?? currentTID);
+        setCurrentSQDMode(sqdMode);
+    }, [fromDTD?.id, currentTID, currentSQDMode]);
+    // Pannello dei metadati: rilegge dal server i metadati del tipo documento e la definizione della
+    // ricerca rapida corrente, con cui il pannello ricostruisce i filtri (i valori digitati vengono persi)
+    const refreshSearchQueryPanelAsync = useCallback(async () => {
+        const tid = fromDTD?.id ?? currentTID;
+        if (!tid)
+            return;
+        const dtd = await DcmtTypeListCacheService.GetAsync(tid, true, undefined, false, true);
+        setFromDTD(dtd);
+        // Passare da undefined forza la ricostruzione dei filtri anche quando la query selezionata non cambia
+        const sqdToRestore = currentSQD;
+        SavedQueryCacheService.Remove();
+        await setSQDAsync(undefined);
+        // La ricerca di sistema non è in cache: va ricostruita, così recepisce i metadati appena riletti
+        await setSQDAsync(sqdToRestore?.id === SYS_ALL_DCMTS_SQD_ID ? await getSysAllDcmtsSQD(tid, false) : sqdToRestore);
+        // mruTIDs è tra le dipendenze perché setSQDAsync lo legge
+    }, [fromDTD?.id, currentTID, currentSQD, mruTIDs]);
+    // Prima di ogni ricerca il pannello rilegge i metadati del tipo documento: si recepisce il descrittore
+    // aggiornato, così anche il resto della vista (titoli, badge, form dei metadati) lavora sulla lista corrente
+    const handleDcmtTypeReloaded = useCallback((dtd) => {
+        setFromDTD(dtd);
+    }, []);
     const onRefreshSearchAsyncDatagrid = async () => {
         try {
             if (lastQdSearched) {
@@ -208,10 +244,10 @@ const TMSearch = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTask
             SDKUI_Globals.userSettings.searchSettings.mruTIDs = newMruTIDS;
             setMruTIDs(newMruTIDS);
         } }), [mruTIDs, currentMruTID, deviceType]);
-    const tmSearchQueryPanelElement = useMemo(() => _jsx(TMSearchQueryPanelWrapper, { isSearchViewOnScreen: currentSearchView === TMSearchViews.Search, passToArchiveCallback: passToArchiveCallback, isExpertMode: isExpertMode, showBackToResultButton: searchResult.length > 0, fromDTD: fromDTD, SQD: currentSQD, inputMids: inputMids, maxDcmtsToBeReturned: maxDcmtsToBeReturned, onBackToResult: () => { setCurrentSearchView(TMSearchViews.Result); }, onSearchCompleted: handleSearchCompleted, onSqdSaved: async (newSqd) => {
+    const tmSearchQueryPanelElement = useMemo(() => _jsx(TMSearchQueryPanelWrapper, { isSearchViewOnScreen: currentSearchView === TMSearchViews.Search, passToArchiveCallback: passToArchiveCallback, isExpertMode: isExpertMode, showBackToResultButton: searchResult.length > 0, fromDTD: fromDTD, SQD: currentSQD, inputMids: inputMids, maxDcmtsToBeReturned: maxDcmtsToBeReturned, onBackToResult: () => { setCurrentSearchView(TMSearchViews.Result); }, onSearchCompleted: handleSearchCompleted, onRefreshRequested: refreshSearchQueryPanelAsync, onDcmtTypeReloaded: handleDcmtTypeReloaded, onSqdSaved: async (newSqd) => {
             await loadDataSQDsAsync(true, newSqd.masterTID);
             await setSQDAsync(newSqd);
-        } }), [fromDTD, showSearchResults, setShowSearchResults, currentSQD, currentSearchView, isExpertMode, mruTIDs, searchResult, passToArchiveCallback, inputMids, maxDcmtsToBeReturned, handleSearchCompleted]);
+        } }), [fromDTD, showSearchResults, setShowSearchResults, currentSQD, currentSearchView, isExpertMode, mruTIDs, searchResult, passToArchiveCallback, inputMids, maxDcmtsToBeReturned, handleSearchCompleted, refreshSearchQueryPanelAsync, handleDcmtTypeReloaded]);
     const tmSavedQuerySelectorElement = useMemo(() => _jsxs(TabPanel, { width: "100%", height: "100%", showNavButtons: true, repaintChangesOnly: true, selectedIndex: currentSQDMode, onSelectedIndexChange: (index) => setCurrentSQDMode(index), children: [(currentTID || currentSQD) ? _jsx(Item, { title: fromDTD?.nameLoc, children: _jsx(TMSavedQuerySelectorWrapper, { allowShowSearch: false, items: filteredByTIDSQDs, selectedId: currentSQD?.id, onRefreshData: () => { loadDataSQDsAsync(true); }, onItemClick: (sqd) => {
                         onSQDItemClick(sqd, setSQDAsync);
                     }, onDeleted: (sqd) => onSQDDeleted(sqd, sqd.id == currentSQD?.id ? filteredByTIDSQDs.find(o => o.id == 1) : currentSQD, setSQDAsync), refreshFavoriteSavedQueries: refreshFavoriteSavedQueries }) }) : _jsx(_Fragment, {}), _jsx(Item, { title: SDKUI_Localizator.AllFemale, children: _jsx(TMSavedQuerySelectorWrapper, { allowShowSearch: true, items: allSQDs, manageDefault: false, onItemClick: (sqd) => {
@@ -263,7 +299,14 @@ const TMSearch = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTask
         {
             id: 'TMRecentsManager',
             name: SDKUI_Localizator.Shortcuts,
-            contentOptions: { component: tmRecentsManagerElement, panelContainer: { title: SDKUI_Localizator.Shortcuts, totalItems: mruTIDs.length } },
+            contentOptions: {
+                component: tmRecentsManagerElement,
+                panelContainer: {
+                    title: SDKUI_Localizator.Shortcuts,
+                    totalItems: mruTIDs.length,
+                    onRefresh: refreshRecentsAsync
+                }
+            },
             toolbarOptions: { icon: _jsx(IconRecentlyViewed, { fontSize: 24 }), visible: true, orderNumber: 2, isActive: allInitialPanelVisibility['TMRecentsManager'] }
         },
         {
@@ -275,10 +318,16 @@ const TMSearch = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTask
         {
             id: 'TMSavedQuerySelector',
             name: SDK_Localizator.SavedQueries,
-            contentOptions: { component: tmSavedQuerySelectorElement, panelContainer: { title: SDK_Localizator.SavedQueries } },
+            contentOptions: {
+                component: tmSavedQuerySelectorElement,
+                panelContainer: {
+                    title: SDK_Localizator.SavedQueries,
+                    onRefresh: refreshSavedQueriesAsync
+                }
+            },
             toolbarOptions: { icon: _jsx(IconSavedQuery, { fontSize: 24 }), visible: true, orderNumber: 4, isActive: allInitialPanelVisibility['TMSavedQuerySelector'] }
         }
-    ], [tmTreeSelectorElement, showSearchResults, tmRecentsManagerElement, tmSearchQueryPanelElement, tmSavedQuerySelectorElement, fromDTD, mruTIDs]);
+    ], [tmTreeSelectorElement, showSearchResults, tmRecentsManagerElement, tmSearchQueryPanelElement, tmSavedQuerySelectorElement, fromDTD, mruTIDs, refreshRecentsAsync, refreshSavedQueriesAsync]);
     return (_jsxs(_Fragment, { children: [showSearchResults ? _jsx(StyledMultiViewPanel, { "$isVisible": currentSearchView === TMSearchViews.Search, children: _jsx(TMPanelManagerWithPersistenceProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'TMRecentsManager', isPersistenceEnabled: !isMobile ? hasSavedLayout() : false, persistPanelStates: !isMobile ? (state) => persistPanelStates(state) : undefined, persistedPanelStates: getPersistedPanelStates(), children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true, minPanelSizePx: !isMobile ? 250 : 150 }) }) }) : tmSearchQueryPanelElement, showSearchResults && _jsx(TMSearchResult, { isVisible: isVisible && currentSearchView === TMSearchViews.Result, context: SearchResultContext.METADATA_SEARCH, searchResults: searchResult, floatingActionConfig: floatingActionConfig, onRefreshAfterAddDcmtToFavs: onRefreshAfterAddDcmtToFavs, openInOffice: openInOffice, onRefreshSearchAsyncDatagrid: onRefreshSearchAsyncDatagrid, onClose: () => { onlyShowSearchQueryPanel ? setShowSearchResults(false) : setCurrentSearchView(TMSearchViews.Search); }, onFileOpened: onFileOpened, onTaskCreateRequest: onTaskCreateRequest, openWGsCopyMoveForm: openWGsCopyMoveForm, editPdfForm: editPdfForm, onOpenPdfEditorRequest: onOpenPdfEditorRequest, openS4TViewer: openS4TViewer, onOpenS4TViewerRequest: onOpenS4TViewerRequest, openFileUploaderPdfEditor: openFileUploaderPdfEditor, passToArchiveCallback: passToArchiveCallback, onSelectedTIDChanged: onCurrentTIDChangedCallback, showTodoDcmtForm: showTodoDcmtForm, showToppyDraggableHelpCenter: showToppyDraggableHelpCenter, toppyHelpCenterUsePortal: toppyHelpCenterUsePortal, onReferenceClick: onReferenceClick, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, inputDID: inputDID, formAutoOpen: formAutoOpen, fetchRemoteCertificates: fetchRemoteCertificates, graphometricManager: graphometricManager })] }));
 };
 export default TMSearch;
@@ -298,11 +347,11 @@ const TMRecentsManagerWrapper = ({ mruTIDs, currentMruTID, deviceType, onSelecte
             onDeletedTID?.(tid);
         } }));
 };
-const TMSearchQueryPanelWrapper = ({ isSearchViewOnScreen, fromDTD, SQD, isExpertMode, showBackToResultButton, onSearchCompleted, onSqdSaved, onBackToResult, passToArchiveCallback, inputMids, maxDcmtsToBeReturned }) => {
+const TMSearchQueryPanelWrapper = ({ isSearchViewOnScreen, fromDTD, SQD, isExpertMode, showBackToResultButton, onSearchCompleted, onSqdSaved, onBackToResult, passToArchiveCallback, inputMids, maxDcmtsToBeReturned, onRefreshRequested, onDcmtTypeReloaded }) => {
     const { setPanelVisibilityById, toggleMaximize, countVisibleLeafPanels } = useTMPanelManagerContext();
     const deviceType = useDeviceType();
     const isMobile = deviceType === DeviceType.MOBILE;
-    return (_jsx(TMSearchQueryPanel, { isSearchViewOnScreen: isSearchViewOnScreen, onClosePanel: (!isMobile && countVisibleLeafPanels() > 1) ? () => setPanelVisibilityById('TMSearchQueryPanel', false) : undefined, allowMaximize: !isMobile && countVisibleLeafPanels() > 1, onMaximizePanel: (!isMobile && countVisibleLeafPanels() > 1) ? () => toggleMaximize("TMSearchQueryPanel") : undefined, isExpertMode: isExpertMode, fromDTD: fromDTD, SQD: SQD, inputMids: inputMids, onSearchCompleted: onSearchCompleted, onSqdSaved: onSqdSaved, showBackToResultButton: showBackToResultButton, onBackToResult: onBackToResult, passToArchiveCallback: passToArchiveCallback, maxDcmtsToBeReturned: maxDcmtsToBeReturned }));
+    return (_jsx(TMSearchQueryPanel, { isSearchViewOnScreen: isSearchViewOnScreen, onClosePanel: (!isMobile && countVisibleLeafPanels() > 1) ? () => setPanelVisibilityById('TMSearchQueryPanel', false) : undefined, allowMaximize: !isMobile && countVisibleLeafPanels() > 1, onMaximizePanel: (!isMobile && countVisibleLeafPanels() > 1) ? () => toggleMaximize("TMSearchQueryPanel") : undefined, isExpertMode: isExpertMode, fromDTD: fromDTD, SQD: SQD, inputMids: inputMids, onSearchCompleted: onSearchCompleted, onRefreshRequested: onRefreshRequested, onDcmtTypeReloaded: onDcmtTypeReloaded, onSqdSaved: onSqdSaved, showBackToResultButton: showBackToResultButton, onBackToResult: onBackToResult, passToArchiveCallback: passToArchiveCallback, maxDcmtsToBeReturned: maxDcmtsToBeReturned }));
 };
 const TMSavedQuerySelectorWrapper = ({ items, selectedId, allowShowSearch, manageDefault, onRefreshData, onItemClick, onDeleted, refreshFavoriteSavedQueries }) => {
     const { setPanelVisibilityById } = useTMPanelManagerContext();

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

@@ -22,6 +22,9 @@ interface ITMSearchQueryPanelProps {
         value: string;
     }>, tid?: number) => void;
     maxDcmtsToBeReturned?: number;
+    onRefreshRequested?: () => Promise<void>;
+    /** Notifica il tipo documento riletto dal server prima di ogni ricerca, così il chiamante allinea il proprio descrittore */
+    onDcmtTypeReloaded?: (dtd: DcmtTypeDescriptor) => void;
 }
 declare const TMSearchQueryPanel: React.FunctionComponent<ITMSearchQueryPanelProps>;
 export default TMSearchQueryPanel;