@evergis/react 4.0.0 → 4.0.2

package/dist/components/Dashboard/hooks/useDashboardHeader.d.ts

@@ -4,7 +4,6 @@ export declare const useDashboardHeader: () => {
     icon: string | import("react/jsx-runtime").JSX.Element;
     title: import('react').ReactNode;
     tooltip: import("react/jsx-runtime").JSX.Element;
-    description: import('react').ReactNode;
     themeName: import('../../..').ThemeName;
-    renderElement: import('..').RenderElementFunction;
+    onClickLogo: () => void;
 };

package/dist/components/Dashboard/hooks/useDataSources.d.ts

@@ -8,7 +8,7 @@ export declare const useDataSources: ({ type: widgetType, config, attributes, fi
     layerParams?: Record<string, string>;
     eqlParameters?: QueryLayerServiceConfigurationDc["eqlParameters"];
 }) => {
-    getDataSourcePromises: ({ ds, query, parameters, layerName, limit, condition, url, resourceId }: ConfigDataSource, newFilters?: SelectedFilters, offset?: number) => Promise<EqlDataSource | PagedFeaturesListDc>;
+    getDataSourcePromises: ({ ds, query, parameters, layerName, limit, condition, url, resourceId, fileName, methodName }: ConfigDataSource, newFilters?: SelectedFilters, offset?: number) => Promise<EqlDataSource | PagedFeaturesListDc>;
     getUpdatingDataSources: () => ConfigDataSource[];
     getUpdatedDataSources: (responses: DataSourcePromise[], currentDataSources: ConfigDataSource[], otherDataSources: FetchedDataSource[]) => any;
     zoomToLayersExtent: (layers: Array<{

package/dist/components/Dashboard/types.d.ts

@@ -150,6 +150,7 @@ export interface ConfigOptions {
     baseMapSettings?: Record<string, BaseMapSettings>;
     expandedLayers?: boolean;
     modalId?: string;
+    url?: string;
 }
 export interface ConfigDataSource {
     name: string;
@@ -162,6 +163,8 @@ export interface ConfigDataSource {
     query?: string;
     parameters?: EqlRequestDc["parameters"];
     resourceId?: string;
+    fileName?: string;
+    methodName?: string;
     url?: string;
     type?: string;
     autoSyncLayer?: boolean;

package/dist/index.js

@@ -3955,8 +3955,13 @@ const useFetchWithAuth = (url, transform, cleanup) => {
         });
     }, [url]);
     React.useEffect(() => {
-        fetchData();
-    }, [fetchData]);
+        if (url) {
+            fetchData();
+        }
+        else {
+            setData(null);
+        }
+    }, [url]);
     React.useEffect(() => () => {
         if (data !== null)
             cleanupRef.current?.(data);
@@ -7779,10 +7784,9 @@ const PageTitleContainer = styled(uilibGl.Flex) `
 `;
 
 const DashboardDefaultHeader = React.memo(() => {
-    const { title, pageId, image, icon, tooltip, themeName } = useDashboardHeader();
+    const { title, pageId, image, icon, tooltip, themeName, onClickLogo } = useDashboardHeader();
     const { toggleLayersVisibility, components: { ProjectPanelMenu, ProjectPagesMenu }, } = useWidgetContext();
-    const backgroundImage = useFetchImageWithAuth(image ? getResourceUrl(image) : null);
-    return (jsxRuntime.jsxs(DefaultHeaderContainer, { image: backgroundImage ?? undefined, isDark: themeName === exports.ThemeName.Dark, children: [!pageId && jsxRuntime.jsx(uilibGl.LinearProgress, {}), jsxRuntime.jsxs(uilibGl.Flex, { column: true, gap: "1rem", children: [jsxRuntime.jsx(uilibGl.FlexSpan, { children: jsxRuntime.jsxs(TopContainer, { children: [jsxRuntime.jsx(LogoContainer, { children: icon }), jsxRuntime.jsx(TopContainerButtons, { children: jsxRuntime.jsx(ProjectPanelMenu, {}) })] }) }), jsxRuntime.jsx(uilibGl.FlexSpan, { children: jsxRuntime.jsx(uilibGl.Flex, { column: true, gap: "0.25rem", children: jsxRuntime.jsx(uilibGl.FlexSpan, { children: jsxRuntime.jsxs(uilibGl.Flex, { alignItems: "center", children: [jsxRuntime.jsxs(PageTitleContainer, { children: [jsxRuntime.jsx(uilibGl.Tooltip, { arrow: true, content: tooltip, children: ref => (jsxRuntime.jsx(PageTitle, { ref: ref, onClick: toggleLayersVisibility, children: title })) }), jsxRuntime.jsx(ProjectPagesMenu, {})] }), jsxRuntime.jsx(uilibGl.FlexSpan, { children: jsxRuntime.jsx(Pagination, {}) })] }) }) }) })] })] }));
+    return (jsxRuntime.jsxs(DefaultHeaderContainer, { image: image, isDark: themeName === exports.ThemeName.Dark, children: [!pageId && jsxRuntime.jsx(uilibGl.LinearProgress, {}), jsxRuntime.jsxs(uilibGl.Flex, { column: true, gap: "1rem", children: [jsxRuntime.jsx(uilibGl.FlexSpan, { children: jsxRuntime.jsxs(TopContainer, { children: [jsxRuntime.jsx(LogoContainer, { onClick: onClickLogo, children: icon }), jsxRuntime.jsx(TopContainerButtons, { children: jsxRuntime.jsx(ProjectPanelMenu, {}) })] }) }), jsxRuntime.jsx(uilibGl.FlexSpan, { children: jsxRuntime.jsx(uilibGl.Flex, { column: true, gap: "0.25rem", children: jsxRuntime.jsx(uilibGl.FlexSpan, { children: jsxRuntime.jsxs(uilibGl.Flex, { alignItems: "center", children: [jsxRuntime.jsxs(PageTitleContainer, { children: [jsxRuntime.jsx(uilibGl.Tooltip, { arrow: true, content: tooltip, children: ref => (jsxRuntime.jsx(PageTitle, { ref: ref, onClick: toggleLayersVisibility, children: title })) }), jsxRuntime.jsx(ProjectPagesMenu, {})] }), jsxRuntime.jsx(uilibGl.FlexSpan, { children: jsxRuntime.jsx(Pagination, {}) })] }) }) }) })] })] }));
 });
 
 const HeaderFrontView = styled(uilibGl.Flex) `
@@ -8518,8 +8522,10 @@ const ElementIcon = React.memo(({ type, elementConfig }) => {
     const { attributes } = useWidgetContext(type);
     const { value, attributeName, options, style } = elementConfig || {};
     const { fontSize, fontColor } = options || {};
-    const iconValue = React.useMemo(() => (attributeName ? attributes?.find(item => item.name === attributeName)?.value : value), [attributeName, attributes, value]);
-    return jsxRuntime.jsx(StyledIcon, { kind: iconValue, fontSize: fontSize, fontColor: fontColor, style: style });
+    const iconValue = React.useMemo(() => attributeName
+        ? attributes?.find(item => item.name === attributeName)?.value
+        : value, [attributeName, attributes, value]);
+    return (jsxRuntime.jsx(StyledIcon, { kind: iconValue, fontSize: fontSize, fontColor: fontColor, style: style }));
 });
 
 const ElementImage = React.memo(({ type, elementConfig }) => {
@@ -9108,10 +9114,10 @@ const ElementUploader = React.memo(({ elementConfig, type }) => {
     const [files, setFiles] = React.useState([]);
     const refInput = React.useRef();
     const { id, style, options } = elementConfig || {};
-    const { fileExtensions = DEFAULT_FILE_EXTENSIONS, multiSelect, parentResourceId, icon, title, filterName } = options || {};
+    const { fileExtensions = DEFAULT_FILE_EXTENSIONS, multiSelect, parentResourceId, icon, title, filterName, } = options || {};
     const onUpload = React.useCallback(async (input) => {
-        const files = Array.isArray(input) ? input : [input];
-        const response = await Promise.all(files.map(file => {
+        const newFiles = Array.isArray(input) ? input : [input];
+        const response = await Promise.all(newFiles.map(file => {
             return api.file.upload(file, true, parentResourceId || "", file.name);
         }));
         const uploadedFiles = response.map(item => ({
@@ -9119,28 +9125,29 @@ const ElementUploader = React.memo(({ elementConfig, type }) => {
             id: item.resourceId,
             done: true,
         }));
-        setFiles(currentFiles => ([...uploadedFiles, ...currentFiles]));
-    }, [parentResourceId]);
-    const onDelete = React.useCallback(async (id) => {
-        const index = files.findIndex(file => file.id === id);
+        setFiles(currentFiles => [...uploadedFiles, ...currentFiles]);
+    }, [api.file, parentResourceId]);
+    const onDelete = React.useCallback(async (deleteId) => {
+        const index = files.findIndex(file => file.id === deleteId);
         if (index === -1)
             return;
         const resourceId = files[index].id;
         await api.file.deleteResource({ resourceId });
-        setFiles(currentFiles => currentFiles.filter(({ id }) => id !== resourceId));
-    }, [files]);
+        setFiles(currentFiles => currentFiles.filter(file => file.id !== resourceId));
+    }, [api.file, files]);
     const renderTitle = React.useMemo(() => {
         if (files.length)
             return null;
-        return (jsxRuntime.jsxs(UploaderTitle, { children: [jsxRuntime.jsx(uilibGl.Icon, { kind: icon || "upload" }), jsxRuntime.jsx("div", { children: title ?? t("uploadTitle", {
-                        ns: "dashboard",
-                        defaultValue: "Перетащите файл сюда или нажмите, чтобы выбрать",
-                    }) })] }));
+        return (jsxRuntime.jsxs(UploaderTitle, { children: [jsxRuntime.jsx(uilibGl.Icon, { kind: icon || "upload" }), jsxRuntime.jsx("div", { children: title ??
+                        t("uploadTitle", {
+                            ns: "dashboard",
+                            defaultValue: "Перетащите файл сюда или нажмите, чтобы выбрать",
+                        }) })] }));
     }, [icon, t, title, files.length]);
     React.useEffect(() => {
         if (!filterName)
             return;
-        changeFilters({ [filterName]: { value: files.map(({ id }) => id) } });
+        changeFilters({ [filterName]: { value: files.map(file => file.id) } });
     }, [files]);
     return (jsxRuntime.jsx(UploaderContainer, { id: id, style: style, children: jsxRuntime.jsx("div", { children: jsxRuntime.jsx(uilibGl.Uploader, { currentRef: refInput, title: renderTitle, accept: fileExtensions, width: "100%", fileItems: files, isMultiple: multiSelect, onUpload: onUpload, onDelete: onDelete }) }) }));
 });
@@ -10582,7 +10589,7 @@ const useChartData = ({ element, type }) => {
                 const dataSource = configDataSources.find(({ name }) => name === dataSourceName);
                 const layerInfo = layerInfos?.find(item => item?.name === dataSource?.layerName);
                 const featureDataSource = getDataSource(dataSourceName, dataSources);
-                const hasLayerInfo = !!layerInfo || !!featureDataSource?.attributeDefinition;
+                const hasLayerInfo = !!layerInfo || !!featureDataSource?.attributeDefinition || !!featureDataSource?.features?.length;
                 return {
                     items: hasLayerInfo
                         ? getDataFromRelatedFeatures({
@@ -10634,7 +10641,7 @@ const useChartData = ({ element, type }) => {
 };
 
 const useHeaderRender = (elementConfig, type = exports.WidgetType.Dashboard) => {
-    const { layerInfo, attributes, expandedContainers, selectedTabId, setSelectedTabId } = useWidgetContext(type);
+    const { layerInfo, attributes, expandedContainers, selectedTabId, setSelectedTabId, } = useWidgetContext(type);
     const { config } = useWidgetConfig(type);
     const { pageIndex } = useWidgetPage(type);
     return React.useMemo(() => getRenderElement({
@@ -10646,7 +10653,16 @@ const useHeaderRender = (elementConfig, type = exports.WidgetType.Dashboard) =>
         selectedTabId,
         setSelectedTabId,
         pageIndex,
-    }), [config, elementConfig, attributes, layerInfo, expandedContainers, selectedTabId, setSelectedTabId, pageIndex]);
+    }), [
+        config,
+        elementConfig,
+        attributes,
+        layerInfo,
+        expandedContainers,
+        selectedTabId,
+        setSelectedTabId,
+        pageIndex,
+    ]);
 };
 
 const useDashboardHeader = () => {
@@ -10655,21 +10671,30 @@ const useDashboardHeader = () => {
     const { currentPage } = useWidgetPage();
     const { alias, name } = projectInfo || {};
     const { id: pageId, header } = currentPage || {};
+    const { children, options } = header || {};
+    const { url } = options || {};
     const renderElement = useHeaderRender(header);
-    const image = React.useMemo(() => (header?.children?.some(({ id }) => id === "image") ? renderElement({ id: "image", wrap: false }) : null), [header?.children, renderElement]);
-    const icon = React.useMemo(() => header?.children?.some(({ id }) => id === "icon") ? (renderElement({ id: "icon", wrap: false })) : (jsxRuntime.jsx(uilibGl.Icon, { kind: "logo", style: { width: "2rem", height: "2rem" } })), [header?.children, renderElement]);
-    const title = React.useMemo(() => header?.children?.some(({ id }) => id === "title") ? renderElement({ id: "title" }) : currentPage?.options?.title, [header?.children, renderElement, currentPage?.options?.title]);
+    const image = React.useMemo(() => children?.some(({ id }) => id === "image")
+        ? renderElement({ id: "image", wrap: false })
+        : null, [children, renderElement]);
+    const icon = React.useMemo(() => children?.some(({ id }) => id === "icon") ? (renderElement({ id: "icon", wrap: false })) : (jsxRuntime.jsx(uilibGl.Icon, { kind: "logo", style: { width: "2rem", height: "2rem" } })), [children, renderElement]);
+    const title = React.useMemo(() => children?.some(({ id }) => id === "title")
+        ? renderElement({ id: "title" })
+        : currentPage?.options?.title, [children, renderElement, currentPage?.options?.title]);
     const tooltip = React.useMemo(() => (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("span", { children: alias || name }), jsxRuntime.jsx("span", { style: { opacity: 0.54, marginLeft: "0.5rem" }, children: title })] })), [alias, name, title]);
-    const description = React.useMemo(() => (header?.children?.some(({ id }) => id === "description") ? renderElement({ id: "description" }) : ""), [header?.children, renderElement]);
+    const onClickLogo = React.useCallback(() => {
+        if (!url)
+            return;
+        window.open(url);
+    }, [url]);
     return {
         pageId,
         image,
         icon,
         title,
         tooltip,
-        description,
         themeName,
-        renderElement,
+        onClickLogo,
     };
 };
 
@@ -10678,7 +10703,7 @@ const useDataSources = ({ type: widgetType, config, attributes, filters, layerPa
     const { dataSources } = useWidgetContext(widgetType);
     const { filters: configFilters, dataSources: configDataSources } = config || {};
     const prevFilters = React.useRef({});
-    const getDataSourcePromises = React.useCallback(async ({ ds, query, parameters, layerName, limit, condition, url, resourceId }, newFilters, offset = 0) => {
+    const getDataSourcePromises = React.useCallback(async ({ ds, query, parameters, layerName, limit, condition, url, resourceId, fileName, methodName }, newFilters, offset = 0) => {
         const selectedFilters = {
             ...(filters || {}),
             ...(newFilters || {}),
@@ -10691,12 +10716,14 @@ const useDataSources = ({ type: widgetType, config, attributes, filters, layerPa
                     method: "get",
                     resourceId,
                     parameters,
+                    ...(fileName && { fileName }),
+                    ...(methodName && { methodName }),
                 }
             });
-            return {
-                items: response.result.items,
-                attributeDefinition: null,
-            };
+            if (response.error) {
+                throw new Error(response.error.message);
+            }
+            return response.result;
         }
         const newParams = applyQueryFilters({
             parameters,
@@ -10776,10 +10803,12 @@ const useDataSources = ({ type: widgetType, config, attributes, filters, layerPa
         const newDataSources = JSON.parse(JSON.stringify([...currentDataSources, ...otherDataSources]));
         responses.forEach((response, index) => {
             const isQueryDataSource = !lodash.isNil(currentDataSources[index].query) ||
-                !!currentDataSources[index].url ||
-                !!currentDataSources[index].resourceId;
+                !!currentDataSources[index].url;
+            const isPythonDataSource = !!currentDataSources[index].resourceId;
             newDataSources[index].layerName = currentDataSources[index].layerName;
-            const items = response.status === "rejected" ? null : response.value?.features || response.items;
+            const items = response.status === "rejected"
+                ? null
+                : response.value?.features || response.value?.items;
             newDataSources[index].features =
                 response.status === "rejected"
                     ? null
@@ -10787,10 +10816,11 @@ const useDataSources = ({ type: widgetType, config, attributes, filters, layerPa
                         ? items?.map((item, itemIndex) => ({
                             id: itemIndex + 1,
                             attributes: item.attributes,
+                            properties: item.properties || item.attributes,
                         }))
                         : items;
             newDataSources[index].attributeDefinition =
-                response.status === "rejected" || !isQueryDataSource
+                response.status === "rejected" || (!isQueryDataSource && !isPythonDataSource)
                     ? null
                     : response.value.attributeDefinition;
         });