@topconsultnpm/sdkui-react-beta 6.10.51 → 6.10.52

package/lib/components/base/TMAreaManager.js

@@ -23,15 +23,30 @@ export class TMFileSystemItem {
 }
 let abortController = new AbortController();
 const TMAreaManager = (props = { selectionMode: 'multiple', isPathChooser: false }) => {
-    const [counter, setCounter] = useState(0);
-    const [areaFile, setAreaFile] = useState('');
-    const [areaFolder, setAreaFolder] = useState('');
-    const [currentRoute, setCurrentRoute] = useState('');
+    // State to store the instance of CustomFileSystemProvider. It is initialized once and used for managing file system operations.
+    const [areaProvider, setAreaProvider] = useState();
+    // LEFT PANEL = PARENT DIR | RIGHT PANEL = File Sytem Item
+    // State to maintain the selected parent dir (Support area - left panel)
     const [parentDir, setParentDir] = useState(null);
+    // State to maintain the selected parent path (Support area - left panel)
+    const [currentRoute, setCurrentRoute] = useState('');
+    // State to maintain the Area Descriptor Array (Support area - left panel)
     const [areas, setAreas] = useState([]);
+    // State to maintain the Area Descriptor Name Set (Support area - left panel)
+    const [areasRoots, setAreasRoots] = useState(new Set());
+    // State to maintain the selected area file (File System Item - right panel)
+    const [areaFile, setAreaFile] = useState('');
+    // State to maintain the selected area folder (File System Item - right panel)
+    const [areaFolder, setAreaFolder] = useState('');
+    // State to maintain the focused/clicked file system item (File System Item - right panel)
+    const [focusedFileSystemItem, setFocusedFileSystemItem] = useState(undefined);
+    // State to maintain the number of total item into selected support area
+    const [counter, setCounter] = useState(0);
+    // State to maintain the number of selected items)
     const [selectedItemsCount, setSelectedItemsCount] = useState(0);
-    const [areaProvider, setAreaProvider] = useState();
+    // State to maintain the selection mode (File System Item - right panel)
     const [selectionMode, setSelectionMode] = useState('single');
+    /* State to manage the Wait Panel */
     const [showWaitPanel, setShowWaitPanel] = useState(false);
     const [waitPanelTitle, setWaitPanelTitle] = useState('');
     const [showPrimary, setShowPrimary] = useState(false);
@@ -42,29 +57,37 @@ const TMAreaManager = (props = { selectionMode: 'multiple', isPathChooser: false
     const [waitPanelTextSecondary, setWaitPanelTextSecondary] = useState('');
     const [waitPanelValueSecondary, setWaitPanelValueSecondary] = useState(0);
     const [waitPanelMaxValueSecondary, setWaitPanelMaxValueSecondary] = useState(0);
-    const [areaRoots, setAreaRoots] = useState(new Set());
-    const [focusedFileSystemItem, setFocusedFileSystemItem] = useState(undefined);
+    // Timer ID to store reference for any scheduled operation
     let timerId = null;
+    // Prefix for area folder names
     const AreaFolderNamePrefix = "AID_";
+    // Prefix for area paths, indicating a specific file system location
     const AreaPathPrefix = "tmarea:\\\\";
+    // Arrays to store resolve functions for existing and non-existing files
     let resolvesForExistingFiles = [];
     let resolvesForNonExistingFiles = [];
+    // Promise to store the directory content for a destination folder
     let destinationDirectoryContentPromise = null;
+    // Reference to the file manager component
     const fileManagerRef = useRef(null);
+    // Cache for uploaded file IDs, mapping file paths to their corresponding IDs
     let _cacheUploadFileId = new Map();
     useEffect(() => {
+        // If areaProvider is already set, exit early to prevent reinitialization
         if (areaProvider)
             return;
+        // Initialize a new instance of CustomFileSystemProvider with necessary methods
         setAreaProvider(new CustomFileSystemProvider({
-            copyItem,
-            getItems,
-            moveItem,
-            renameItem,
-            deleteItem,
-            downloadItems,
-            uploadFileChunk,
-            createDirectory
+            copyItem, // Function to copy an item
+            getItems, // Function to retrieve items
+            moveItem, // Function to move an item
+            renameItem, // Function to rename an item
+            deleteItem, // Function to delete an item
+            downloadItems, // Function to download items
+            uploadFileChunk, // Function to upload file chunks
+            createDirectory // Function to create a directory
         }));
+        // Load localization messages for different languages
         loadMessages({
             "it": {
                 "dxFileManager-dialogDeleteItemSingleItemConfirmation": "Sei sicuro di voler eliminare {0}?",
@@ -97,10 +120,7 @@ const TMAreaManager = (props = { selectionMode: 'multiple', isPathChooser: false
                 "dxFileManager-dialogDirectoryChooserMoveButtonText": "Move"
             }
         });
-    }, []);
-    useEffect(() => {
-        setAreaRoots(new Set(areas.map(area => area.name).filter(name => name !== undefined)));
-    }, [areas]);
+    }, []); // Empty dependency array ensures this effect runs only once when the component mounts
     useEffect(() => {
         const btnNewDir = document.querySelector(".dx-filemanager-wrapper [aria-label='Nuova cartella']");
         const instanceBtnNewDir = Button.getInstance(btnNewDir);
@@ -384,38 +404,56 @@ const TMAreaManager = (props = { selectionMode: 'multiple', isPathChooser: false
             setShowWaitPanel(false);
         }
     };
+    // Asynchronous function to retrieve the items in a given directory (parentDirectory)
     const getItems = async (parentDirectory) => {
+        // Set the parent directory to the current state
         setParentDir(parentDirectory);
+        // Initialize an empty array to hold the file system items
         const fileSystem = [];
+        // Retrieve the current session or use the global session if not available
         const tms = props.tmSession ?? SDK_Globals.tmSession;
+        // Check if the parent directory is the root (empty name)
         if (parentDirectory.name === "") {
+            // Retrieve all area descriptors asynchronously
             const adlist = await tms?.NewAreaEngine().RetrieveAllAsync().catch((err) => TMExceptionBoxManager.show({ exception: err }));
-            setAreas(adlist);
+            const areasRootsName = new Set();
+            // Iterate over each area descriptor and create corresponding file system items
             for (const ad of adlist) {
+                // Localize the name of the area
                 ad.name = ad?.nameLoc;
+                if (ad.name)
+                    areasRootsName.add(ad.name);
+                // Create a new file system item for each area descriptor
                 const fsi = new TMFileSystemItem();
-                fsi.name = ad.name ?? '';
-                fsi.dataItem = ad;
-                fsi.dateModified = ad.lastUpdateTime;
-                fsi.isDirectory = true;
-                fileSystem.push(fsi);
+                fsi.name = ad.name ?? ''; // Use the localized name or an empty string if undefined
+                fsi.dataItem = ad; // Store the area descriptor as data
+                fsi.dateModified = ad.lastUpdateTime; // Store the last update time
+                fsi.isDirectory = true; // Since this represents a directory, mark it as a directory
+                fileSystem.push(fsi); // Add the file system item to the list
             }
+            // Set the areas
+            setAreas(adlist);
+            setAreasRoots(areasRootsName);
         }
         else {
+            // If the parent directory is not the root, retrieve files within the area
             const ad = parentDirectory.dataItem.dataItem;
-            const aid = ad?.id;
-            const path = parentDirectory.pathKeys.length === 1 ? "" : parentDirectory.path;
+            const aid = ad?.id; // Get the area ID
+            const path = parentDirectory.pathKeys.length === 1 ? "" : parentDirectory.path; // Determine the path
+            // Retrieve all files in the area, based on the path, asynchronously
             const files = await tms?.NewAreaEngine().RetrieveAllFilesAsync(aid, path.replace(ad.name + '/', '')).catch((err) => TMExceptionBoxManager.show({ exception: err }));
+            // Iterate over each file descriptor and create corresponding file system items
             files.forEach((file) => {
                 const fsi = new TMFileSystemItem();
-                fsi.name = file.name ?? '';
-                fsi.dataItem = ad;
-                fsi.dateModified = file.lastUpdateTime;
-                fsi.isDirectory = file.isFld == 1;
-                fsi.size = file.size;
-                fileSystem.push(fsi);
+                fsi.name = file.name ?? ''; // Set the file name, defaulting to an empty string if undefined
+                fsi.dataItem = ad; // Store the area descriptor as data
+                fsi.dateModified = file.lastUpdateTime; // Store the file's last modified time
+                fsi.isDirectory = file.isFld == 1; // Mark as a directory if the 'isFld' field is 1 (directory)
+                fsi.size = file.size; // Store the file size
+                fileSystem.push(fsi); // Add the file system item to the list
             });
         }
+        // Return the constructed list of file system items (directories or files)
         return fileSystem;
     };
     const renameItem = async (item, newName) => {
@@ -595,6 +633,6 @@ const TMAreaManager = (props = { selectionMode: 'multiple', isPathChooser: false
         }
     };
     const counters = [{ icon: _jsx(IconAll, {}), text: counter.toString(), tooltip: SDKUI_Localizator.AllItems }, { icon: _jsx(IconSelected, {}), text: selectedItemsCount.toString(), tooltip: SDKUI_Localizator.SelectedItems }];
-    return (_jsxs(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: [_jsxs(FileManager, { width: props.width, ref: fileManagerRef, height: props.height, onItemMoving: onItemCopying, onItemCopying: onItemCopying, onFileUploading: onFileUploading, fileSystemProvider: areaProvider, customizeThumbnail: customizeIcon, rootFolderName: SDK_Localizator.Areas, onSelectionChanged: onSelectionChanged, onDirectoryCreating: onDirectoryCreating, onFocusedItemChanged: onFocusedItemChanged, onSelectedFileOpened: onSelectedFileOpened, onContextMenuItemClick: onContextMenuItemClick, onItemMoved: () => setCounter(counter => counter + 1), onItemCopied: () => setCounter(counter => counter + 1), onItemDeleted: () => setCounter(counter => counter - 1), onFileUploaded: () => setCounter(counter => counter + 1), onCurrentDirectoryChanged: onCurrentDirectoryChanged, selectionMode: props.selectionMode === 'single' ? 'single' : selectionMode, children: [_jsxs(Toolbar, { children: [_jsx(Item, { name: "showNavPane", visible: true }), _jsx(Item, { name: "create", visible: true }), _jsx(Item, { name: "upload", visible: true }), _jsx(Item, { name: "separator", location: 'after' }), _jsx(Item, { name: "switchView", visible: true }), _jsx(Item, { name: "refresh", visible: true })] }), _jsx(ContextMenu, { items: ["create", "upload", "rename", "move", "copy", "delete", "refresh", "download"] }), _jsx(Permissions, { copy: focusedFileSystemItem && focusedFileSystemItem.name !== "" && !areaRoots.has(focusedFileSystemItem.name), move: focusedFileSystemItem && focusedFileSystemItem.name !== "" && !areaRoots.has(focusedFileSystemItem.name), create: focusedFileSystemItem && focusedFileSystemItem.name !== "", upload: focusedFileSystemItem && focusedFileSystemItem.name !== "", rename: focusedFileSystemItem && focusedFileSystemItem.name !== "" && !areaRoots.has(focusedFileSystemItem.name), delete: focusedFileSystemItem && focusedFileSystemItem.name !== "" && !areaRoots.has(focusedFileSystemItem.name), download: true }), _jsx(ItemView, { children: _jsxs(Details, { children: [_jsx(Column, { dataField: "thumbnail", cssClass: 'file-thumbnail' }, "thumbnail"), _jsx(Column, { dataField: "name", caption: SDKUI_Localizator.Name }, "name"), _jsx(Column, { dataField: 'size', width: '120px', alignment: 'center', dataType: 'number', caption: SDKUI_Localizator.File_Size }, "size"), _jsx(Column, { dataField: 'dateModified', width: '160px', alignment: 'center', dataType: 'datetime', caption: SDKUI_Localizator.Date_Modified }, "dateModified")] }) }), _jsx(Notifications, { showPopup: false })] }), _jsx(TMCounterBar, { items: counters })] }));
+    return (_jsxs(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: [_jsxs(FileManager, { width: props.width, ref: fileManagerRef, height: props.height, onItemMoving: onItemCopying, onItemCopying: onItemCopying, onFileUploading: onFileUploading, fileSystemProvider: areaProvider, customizeThumbnail: customizeIcon, rootFolderName: SDK_Localizator.Areas, onSelectionChanged: onSelectionChanged, onDirectoryCreating: onDirectoryCreating, onFocusedItemChanged: onFocusedItemChanged, onSelectedFileOpened: onSelectedFileOpened, onContextMenuItemClick: onContextMenuItemClick, onItemMoved: () => setCounter(counter => counter + 1), onItemCopied: () => setCounter(counter => counter + 1), onItemDeleted: () => setCounter(counter => counter - 1), onFileUploaded: () => setCounter(counter => counter + 1), onCurrentDirectoryChanged: onCurrentDirectoryChanged, selectionMode: props.selectionMode === 'single' ? 'single' : selectionMode, children: [_jsxs(Toolbar, { children: [_jsx(Item, { name: "showNavPane", visible: true }), _jsx(Item, { name: "create", visible: true }), _jsx(Item, { name: "upload", visible: true }), _jsx(Item, { name: "separator", location: 'after' }), _jsx(Item, { name: "switchView", visible: true }), _jsx(Item, { name: "refresh", visible: true })] }), _jsx(ContextMenu, { items: ["create", "upload", "rename", "move", "copy", "delete", "refresh", "download"] }), _jsx(Permissions, { copy: focusedFileSystemItem && focusedFileSystemItem.name !== "" && !areasRoots.has(focusedFileSystemItem.name), move: focusedFileSystemItem && focusedFileSystemItem.name !== "" && !areasRoots.has(focusedFileSystemItem.name), create: focusedFileSystemItem && focusedFileSystemItem.name !== "", upload: focusedFileSystemItem && focusedFileSystemItem.name !== "", rename: focusedFileSystemItem && focusedFileSystemItem.name !== "" && !areasRoots.has(focusedFileSystemItem.name), delete: focusedFileSystemItem && focusedFileSystemItem.name !== "" && !areasRoots.has(focusedFileSystemItem.name), download: true }), _jsx(ItemView, { children: _jsxs(Details, { children: [_jsx(Column, { dataField: "thumbnail", cssClass: 'file-thumbnail' }, "thumbnail"), _jsx(Column, { dataField: "name", caption: SDKUI_Localizator.Name }, "name"), _jsx(Column, { dataField: 'size', width: '120px', alignment: 'center', dataType: 'number', caption: SDKUI_Localizator.File_Size }, "size"), _jsx(Column, { dataField: 'dateModified', width: '160px', alignment: 'center', dataType: 'datetime', caption: SDKUI_Localizator.Date_Modified }, "dateModified")] }) }), _jsx(Notifications, { showPopup: false })] }), _jsx(TMCounterBar, { items: counters })] }));
 };
 export default TMAreaManager;

package/lib/helper/SDKUI_Localizator.d.ts

@@ -16,9 +16,10 @@ export declare class SDKUI_Localizator {
     static get AddDefinition(): "Definition hinzufügen" | "Add definition" | "Añadir definición" | "Ajoute la définition" | "Adicionar definição" | "Aggiungi definizione";
     static get AddOrSubstFile(): "Dateien hinzufügen/ersetzen" | "Add/substitute file" | "Añadir/sustituir archivo" | "Ajoute/Remplace le fichier" | "Adicionar / substituir arquivos" | "Aggiungi/sostituisci file";
     static get All(): "Alle" | "All" | "Todos" | "Tous" | "Tutti";
-    static get Alphabetic(): "Alphabetisch" | "Alphabetic" | "Alfabético" | "Alphabétique" | "Alfabética" | "Alfabetico";
-    static get Alls2(): "Alle" | "All" | "Todos" | "Tous" | "Tutte";
+    static get AllFilesAndFoldersInSupportArea(): "Alle Dateien und Ordner im Support-Bereich" | "All files and folders within the support area" | "Todos los archivos y carpetas dentro del área de soporte" | "Tous les fichiers et dossiers dans la zone de support" | "Todos os arquivos e pastas na área de apoio" | "Tutti i file e le cartelle all'interno dell'area di appoggio";
     static get AllItems(): "alle Artikel" | "All items" | "Todos los artículos" | "tous les articles" | "todos os artigos" | "tutti gli elementi";
+    static get Alls2(): "Alle" | "All" | "Todos" | "Tous" | "Tutte";
+    static get Alphabetic(): "Alphabetisch" | "Alphabetic" | "Alfabético" | "Alphabétique" | "Alfabética" | "Alfabetico";
     static get Applied(): string;
     static get Apply(): "Anwenden" | "Apply" | "Aplicar" | "Applique" | "Applica";
     static get ApplyAndClose(): "Anwenden und Schließen" | "Apply and close" | "Aplicar y cerrar" | "Applique et ferme" | "Aplicar e fechar" | "Applica e chiudi";

package/lib/helper/SDKUI_Localizator.js

@@ -108,14 +108,24 @@ export class SDKUI_Localizator {
             default: return "Tutti";
         }
     }
-    static get Alphabetic() {
+    static get AllFilesAndFoldersInSupportArea() {
         switch (this._cultureID) {
-            case CultureIDs.De_DE: return "Alphabetisch";
-            case CultureIDs.En_US: return "Alphabetic";
-            case CultureIDs.Es_ES: return "Alfabético";
-            case CultureIDs.Fr_FR: return "Alphabétique";
-            case CultureIDs.Pt_PT: return "Alfabética";
-            default: return "Alfabetico";
+            case CultureIDs.De_DE: return "Alle Dateien und Ordner im Support-Bereich";
+            case CultureIDs.En_US: return "All files and folders within the support area";
+            case CultureIDs.Es_ES: return "Todos los archivos y carpetas dentro del área de soporte";
+            case CultureIDs.Fr_FR: return "Tous les fichiers et dossiers dans la zone de support";
+            case CultureIDs.Pt_PT: return "Todos os arquivos e pastas na área de apoio";
+            default: return "Tutti i file e le cartelle all'interno dell'area di appoggio";
+        }
+    }
+    static get AllItems() {
+        switch (this._cultureID) {
+            case CultureIDs.De_DE: return "alle Artikel";
+            case CultureIDs.En_US: return "All items";
+            case CultureIDs.Es_ES: return "Todos los artículos";
+            case CultureIDs.Fr_FR: return "tous les articles";
+            case CultureIDs.Pt_PT: return "todos os artigos";
+            default: return "tutti gli elementi";
         }
     }
     static get Alls2() {
@@ -128,14 +138,14 @@ export class SDKUI_Localizator {
             default: return "Tutte";
         }
     }
-    static get AllItems() {
+    static get Alphabetic() {
         switch (this._cultureID) {
-            case CultureIDs.De_DE: return "alle Artikel";
-            case CultureIDs.En_US: return "All items";
-            case CultureIDs.Es_ES: return "Todos los artículos";
-            case CultureIDs.Fr_FR: return "tous les articles";
-            case CultureIDs.Pt_PT: return "todos os artigos";
-            default: return "tutti gli elementi";
+            case CultureIDs.De_DE: return "Alphabetisch";
+            case CultureIDs.En_US: return "Alphabetic";
+            case CultureIDs.Es_ES: return "Alfabético";
+            case CultureIDs.Fr_FR: return "Alphabétique";
+            case CultureIDs.Pt_PT: return "Alfabética";
+            default: return "Alfabetico";
         }
     }
     static get Applied() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@topconsultnpm/sdkui-react-beta",
-  "version": "6.10.51",
+  "version": "6.10.52",
   "description": "",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",