@topconsultnpm/sdkui-react 6.21.0-dev1.30 → 6.21.0-dev1.31

package/lib/components/base/TMAreaManager.js

@@ -1,19 +1,18 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useRef, useState } from 'react';
 import FileManager, { Column, Details, ItemView, Permissions, Notifications, ContextMenu, Toolbar, Item } from 'devextreme-react/file-manager';
-import { FileDescriptor, FileFormats, FileTransferModes, SDK_Localizator, SDK_Globals } from '@topconsultnpm/sdk-ts';
+import { FileDescriptor, FileFormats, FileTransferModes, SDK_Localizator, SDK_Globals, AppModules } from '@topconsultnpm/sdk-ts';
 import CustomFileSystemProvider from 'devextreme/file_management/custom_provider';
 import FileSystemError from "devextreme/file_management/error";
 import Button from "devextreme/ui/button";
 import { alert, confirm } from "devextreme/ui/dialog";
 import { loadMessages } from 'devextreme/localization';
-import { Globalization, IconAll, IconCloud, IconFolder, IconFolderForCSS, IconSelected, SDKUI_Localizator, svgToString } from '../../helper';
+import { getFileManagerFolderColor, Globalization, IconAll, IconCloud, IconFolder, IconFolderForCSS, IconSelected, SDKUI_Localizator, svgToString } from '../../helper';
 import { TMExceptionBoxManager } from './TMPopUp';
 import ShowAlert from './TMAlert';
 import { TMLayoutWaitingContainer } from './TMWaitPanel';
 import TMCounterContainer, { CounterItemKey } from './TMCounterContainer';
 import { IconPdf, IconTxt, IconXls, IconDocx, IconImage, IconZip, IconXml, IconMp4, IconEmail, IconPpt, IconSigned, IconExe, IconHtml, IconDwg, IconDicom, IconSlddrw } from '../../assets/thumbnails';
-import { TMColors } from '../../utils/theme';
 import styled from 'styled-components';
 import { renderToStaticMarkup } from 'react-dom/server';
 export class TMFileSystemItem {
@@ -25,8 +24,10 @@ export class TMFileSystemItem {
     }
 }
 let abortController = new AbortController();
-const svgString = encodeURIComponent(renderToStaticMarkup(_jsx(IconFolderForCSS, { fill: "#9fc6e7" })));
-const svgDataUrl = `data:image/svg+xml,${svgString}`;
+const generateSvgDataUrl = (color) => {
+    const svgString = encodeURIComponent(renderToStaticMarkup(_jsx(IconFolderForCSS, { fill: color })));
+    return `data:image/svg+xml,${svgString}`;
+};
 const StyledFileManagerWrapper = styled.div `
   .dx-filemanager .dx-treeview-item .dx-icon-folder {
     display: none !important;
@@ -44,7 +45,7 @@ const StyledFileManagerWrapper = styled.div `
     width: 20px;
     height: 20px;
     transform: translateY(-50%);
-    background-image: url("${svgDataUrl}");
+    background-image: url("${props => generateSvgDataUrl(props.$folderColor)}");
     background-size: contain;
     background-repeat: no-repeat;
     display: inline-block;
@@ -647,7 +648,7 @@ const TMAreaManager = (props = { selectionMode: 'multiple', isPathChooser: false
     };
     const customizeIcon = useCallback((fileSystemItem) => {
         if (fileSystemItem.isDirectory) {
-            return svgToString(_jsx(IconFolder, { fontSize: 20, color: TMColors.iconLight }));
+            return svgToString(_jsx(IconFolder, { fontSize: 20, color: getFileManagerFolderColor(SDK_Globals.tmSession?.SessionDescr?.appModuleID ?? AppModules.SURFER) }));
         }
         else {
             const fileExtension = fileSystemItem.getFileExtension();
@@ -738,11 +739,12 @@ const TMAreaManager = (props = { selectionMode: 'multiple', isPathChooser: false
             alert(`"${e.name}" ${SDKUI_Localizator.FolderExist}`, SDKUI_Localizator.Attention);
         }
     };
-    return (_jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: _jsxs(StyledFileManagerWrapper, { style: { width: "100%", height: "100%" }, children: [_jsxs(FileManager, { width: props.width, ref: fileManagerRef, height: `calc(${props.height} - 30px)`, onItemMoving: onItemCopying, onItemCopying: onItemCopying, onFileUploading: onFileUploading, fileSystemProvider: areaProvider, customizeThumbnail: customizeIcon, rootFolderName: SDK_Localizator.Areas, onSelectionChanged: onSelectionChanged, onDirectoryCreating: onDirectoryCreating, onFocusedItemChanged: onFocusedItemChanged, onSelectedFileOpened: onSelectedFileOpened, onContextMenuItemClick: onContextMenuItemClick, 
+    const folderColor = getFileManagerFolderColor(SDK_Globals.tmSession?.SessionDescr?.appModuleID ?? AppModules.SURFER);
+    return (_jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: _jsxs(StyledFileManagerWrapper, { "$folderColor": folderColor, style: { width: "100%", height: "100%" }, children: [_jsxs(FileManager, { width: props.width, ref: fileManagerRef, height: `calc(${props.height} - 30px)`, 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"] }), "const primo = areasRoots.values().next().value;", _jsx(Permissions, { copy: focusedFileSystemItem && focusedFileSystemItem.name !== "" && getSubFolder(focusedFileSystemItem.path).length > 0, move: focusedFileSystemItem && focusedFileSystemItem.name !== "" && getSubFolder(focusedFileSystemItem.path).length > 0, create: focusedFileSystemItem && focusedFileSystemItem.name !== "", upload: focusedFileSystemItem && focusedFileSystemItem.name !== "", rename: focusedFileSystemItem && focusedFileSystemItem.name !== "" && getSubFolder(focusedFileSystemItem.path).length > 0, delete: focusedFileSystemItem && focusedFileSystemItem.name !== "" && getSubFolder(focusedFileSystemItem.path).length > 0, 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: true, showPanel: true })] }), _jsx("div", { style: { width: "100%", height: "30px", overflowY: "hidden" }, children: _jsx(TMCounterContainer, { items: counterValues }) })] }) }));
+                    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 !== "" && getSubFolder(focusedFileSystemItem.path).length > 0, move: focusedFileSystemItem && focusedFileSystemItem.name !== "" && getSubFolder(focusedFileSystemItem.path).length > 0, create: focusedFileSystemItem && focusedFileSystemItem.name !== "", upload: focusedFileSystemItem && focusedFileSystemItem.name !== "", rename: focusedFileSystemItem && focusedFileSystemItem.name !== "" && getSubFolder(focusedFileSystemItem.path).length > 0, delete: focusedFileSystemItem && focusedFileSystemItem.name !== "" && getSubFolder(focusedFileSystemItem.path).length > 0, 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: true, showPanel: true })] }), _jsx("div", { style: { width: "100%", height: "30px", overflowY: "hidden" }, children: _jsx(TMCounterContainer, { items: counterValues }) })] }) }));
 };
 export default TMAreaManager;

package/lib/helper/TMUtils.d.ts

@@ -41,6 +41,7 @@ export declare const parseSignatureConfiguration: (did: number, informationSign:
 export declare const convertSearchResultDescriptorToFileItems: (documents: Array<SearchResultDescriptor>) => Array<FileItem>;
 export declare const getAppModuleGradient: (appModuleID: AppModules) => string;
 export declare const getPanelManagerToolbarColor: (appModuleID: AppModules) => string;
+export declare const getFileManagerFolderColor: (appModuleID: AppModules) => string;
 type SearchToolbarVisibility = {
     tmSearchResult: boolean;
     tmBlog: boolean;

package/lib/helper/TMUtils.js

@@ -374,6 +374,18 @@ export const getPanelManagerToolbarColor = (appModuleID) => {
             return 'transparent linear-gradient(90deg, #CCE0F4 0%, #7EC1E7 14%, #39A6DB 28%, #1E9CD7 35%, #0075BE 78%, #005B97 99%) 0% 0% no-repeat padding-box';
     }
 };
+export const getFileManagerFolderColor = (appModuleID) => {
+    switch (appModuleID) {
+        case AppModules.SURFER:
+            return '#2559a5';
+        case AppModules.DESIGNER:
+            return '#482234';
+        case AppModules.ORCHESTRATOR:
+            return '#1d6f42';
+        default:
+            return '#2559a5';
+    }
+};
 export const getSearchToolbarVisibility = (appModuleID) => {
     switch (appModuleID) {
         case AppModules.SURFER:

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@topconsultnpm/sdkui-react",
-    "version": "6.21.0-dev1.30",
+    "version": "6.21.0-dev1.31",
     "description": "",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",