@evergis/react 4.0.29 → 4.0.31

package/dist/components/Dashboard/containers/TaskContainer/utils/buildFiltersFromResponse.d.ts

@@ -0,0 +1,2 @@
+import { SelectedFilters } from '../../../types';
+export declare const buildFiltersFromResponse: (responseFilters: Record<string, string> | undefined, result: Record<string, unknown> | null) => SelectedFilters | null;

package/dist/components/Dashboard/elements/ElementModal/styled.d.ts

@@ -1 +1 @@
-export declare const ModalIcon: import('styled-components').StyledComponent<"span", any, import('@evergis/uilib-gl').IIconProps, never>;
+export declare const ModalIcon: import('styled-components').StyledComponent<import('react').FC<import('@evergis/uilib-gl').IIconButtonProps>, any, {}, never>;

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

@@ -149,6 +149,7 @@ export interface ConfigOptions {
     tabId?: string;
     column?: boolean;
     relatedDataSource?: string;
+    responseFilters?: Record<string, string>;
     control?: ConfigControl;
     controls?: ConfigControl[];
     filterName?: string;

package/dist/hooks/task/usePythonTask.d.ts

@@ -17,4 +17,5 @@ export declare const usePythonTask: () => {
     executionTime: number;
     isLogDialogOpen: boolean;
     closeLog: () => void;
+    result: Record<string, unknown>;
 };

package/dist/index.js

@@ -4443,6 +4443,10 @@ const applyQueryFilters = ({ parameters: configParameters, filters: configFilter
             return result;
         }
         if (typeof configParameters[key] === "string" && configParameters[key].includes("{") && attributes?.length) {
+            const exactAttr = attributes.find(({ attributeName }) => configParameters[key] === `{${attributeName}}`);
+            if (exactAttr) {
+                return { ...result, [key]: exactAttr.value ?? "" };
+            }
             let interpolated = configParameters[key];
             attributes.forEach(({ attributeName, value: attrValue }) => {
                 interpolated = interpolated.replace(new RegExp(`\\{${attributeName}\\}`, "g"), attrValue?.toString() ?? "");
@@ -5401,6 +5405,7 @@ const usePythonTask = () => {
     const [taskId, setTaskId] = React.useState(null);
     const [subscriptionId, setSubscriptionId] = React.useState(null);
     const [isLogDialogOpen, setIsLogDialogOpen] = React.useState(false);
+    const [result, setResult] = React.useState(null);
     const logRef = React.useRef(null);
     const reset = React.useCallback(() => {
         setStatus(api.RemoteTaskStatus.Unknown);
@@ -5409,6 +5414,7 @@ const usePythonTask = () => {
         setExecutionTime(null);
         setTaskId(null);
         setSubscriptionId(null);
+        setResult(null);
     }, []);
     const runTask = React.useCallback(async ({ resourceId, parameters, script, fileName, methodName, }) => {
         reset();
@@ -5448,7 +5454,7 @@ const usePythonTask = () => {
         });
         setTaskId(newTaskId);
         setSubscriptionId(newSubscriptionId);
-        const onNotification = ({ data }) => {
+        const onNotification = async ({ data }) => {
             if (data?.taskId === newTaskId) {
                 setStatus(data.status);
                 setLog([logRef.current, data.log].filter(Boolean).join("\n"));
@@ -5464,10 +5470,14 @@ const usePythonTask = () => {
                     unsubscribeById(newSubscriptionId);
                     connection.off(SERVER_NOTIFICATION_EVENT.PythonProgressNotification, onNotification);
                 }
+                if (data.status === api.RemoteTaskStatus.Completed) {
+                    const subTasks = await api$1.remoteTaskManager.get(newTaskId);
+                    setResult(subTasks?.[0]?.results ?? null);
+                }
             }
         };
         connection.on(SERVER_NOTIFICATION_EVENT.PythonProgressNotification, onNotification);
-    }, [api$1, connection, addSubscription, unsubscribeById, reset]);
+    }, [reset, api$1.remoteTaskManager, addSubscription, connection, t, unsubscribeById]);
     const stopTask = React.useCallback(async () => {
         await api$1.remoteTaskManager.stop(taskId);
         reset();
@@ -5494,6 +5504,7 @@ const usePythonTask = () => {
         executionTime,
         isLogDialogOpen,
         closeLog,
+        result,
     };
 };
 
@@ -7464,14 +7475,35 @@ const StatusWaitingButton = ({ title, icon = "play", status, statusColors, isWai
     return (jsxRuntime.jsx(uilibGl.ThemeProvider, { theme: uilibGl.darkTheme, children: jsxRuntime.jsxs(StyledButton, { status: status, statusColors: statusColors, disabled: isDisabled, themeName: themeName, onClick: onClick, children: [renderIcon, renderTitle] }) }));
 };
 
+const buildFiltersFromResponse = (responseFilters, result) => {
+    if (!responseFilters || !result)
+        return null;
+    const properties = result?.result?.features?.[0]?.properties;
+    if (!properties)
+        return null;
+    const filters = Object.entries(responseFilters).reduce((acc, [filterName, token]) => {
+        const attrName = typeof token === "string" && token.startsWith("%") ? token.slice(1) : token;
+        const value = properties[attrName];
+        if (value === undefined)
+            return acc;
+        return { ...acc, [filterName]: { value: value } };
+    }, {});
+    return Object.keys(filters).length ? filters : null;
+};
+
 const TaskContainer = React.memo(({ type, elementConfig, renderElement }) => {
     const { t, ewktGeometry } = useGlobalContext();
-    const { dataSources, filters: selectedFilters, attributes, layerInfo } = useWidgetContext(type);
+    const { dataSources, filters: selectedFilters, attributes, layerInfo, changeFilters, } = useWidgetContext(type);
     const { dataSources: projectDataSources } = useWidgetContext(exports.WidgetType.Dashboard);
     const { currentPage } = useWidgetPage(type);
-    const { taskId, runTask, stopTask, status, openLog, loading, isLogDialogOpen, closeLog, log } = usePythonTask();
+    const { taskId, runTask, stopTask, status, openLog, loading, isLogDialogOpen, closeLog, log, result, } = usePythonTask();
     const { options } = elementConfig || {};
-    const { title, relatedResources, center, icon, statusColors } = options || {};
+    const { title, relatedResources, center, icon, statusColors, responseFilters } = options || {};
+    React.useEffect(() => {
+        const filtersToApply = buildFiltersFromResponse(responseFilters, result);
+        if (filtersToApply)
+            changeFilters(filtersToApply);
+    }, [result, responseFilters, changeFilters]);
     const onClick = React.useCallback(async () => {
         if (taskId) {
             await stopTask();
@@ -7518,6 +7550,12 @@ const EditGroupContainer = React.memo(({ type, elementConfig, renderElement }) =
     const getRenderContainerItem = useRenderContainerItem(type, renderElement);
     const { options } = elementConfig || {};
     const { controls } = options || {};
+    const filteredAttributes = React.useMemo(() => {
+        const { idAttribute } = layerInfo?.configuration?.attributesConfiguration || {};
+        if (!idAttribute)
+            return attributes;
+        return attributes.filter(({ attributeName }) => attributeName !== idAttribute);
+    }, [attributes, layerInfo?.configuration]);
     const renderContainer = React.useCallback((attributeName) => {
         const control = controls?.find(({ targetAttributeName }) => targetAttributeName === attributeName);
         const itemAttribute = attributes.find(item => item.attributeName === attributeName);
@@ -7550,7 +7588,7 @@ const EditGroupContainer = React.memo(({ type, elementConfig, renderElement }) =
         expandedContainers,
     ]);
     if (!controls?.length) {
-        return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: attributes.map(({ attributeName }) => renderContainer(attributeName)) }));
+        return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: filteredAttributes.map(({ attributeName }) => renderContainer(attributeName)) }));
     }
     return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: controls.map(({ targetAttributeName }) => renderContainer(targetAttributeName)) }));
 });
@@ -7581,6 +7619,16 @@ const useEditControl = (type, elementConfig) => {
             [attributeName]: newValue,
         });
     }, [changeControls, attributeName]);
+    React.useEffect(() => {
+        if (control?.defaultValue === undefined)
+            return;
+        if (controls[attributeName] !== undefined)
+            return;
+        const hasAttributeValue = attributes.some(({ attributeName: name, value: attrValue }) => name === attributeName && attrValue !== undefined && attrValue !== null);
+        if (hasAttributeValue)
+            return;
+        changeControls({ [attributeName]: control.defaultValue });
+    }, [attributeName, attributes, changeControls, control?.defaultValue, controls]);
     return React.useMemo(() => ({ control, value, dataSource, items, onChange }), [control, value, dataSource, items, onChange]);
 };
 
@@ -7716,7 +7764,7 @@ const DefaultHeaderContainer = styled(uilibGl.Flex) `
   position: relative;
   flex-shrink: 0;
   min-height: 8.175rem;
-  margin-bottom: -1.5rem;
+  margin-bottom: -0.75rem;
   padding: 1.5rem 1.5rem 0;
   border-top-left-radius: 0.5rem;
   border-top-right-radius: 0.5rem;
@@ -9266,19 +9314,15 @@ const ElementUploader = React.memo(({ elementConfig, type }) => {
     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 }) }) }));
 });
 
-const ModalIcon = styled(uilibGl.Icon) `
-  &&& {
-    cursor: pointer;
-
-    :after {
-      font-size: 0.75rem;
-      color: ${({ theme: { palette } }) => palette.iconDisabled};
-      transition: color ${uilibGl.transition.hover};
-    }
+const ModalIcon = styled(uilibGl.IconButton) `
+  :after {
+    font-size: 0.75rem;
+    color: ${({ theme: { palette } }) => palette.iconDisabled};
+    transition: color ${uilibGl.transition.hover};
+  }
 
-    :hover:after {
-      color: ${({ theme: { palette } }) => palette.icon};
-    }
+  :hover:after {
+    color: ${({ theme: { palette } }) => palette.icon};
   }
 `;
 
@@ -9388,7 +9432,7 @@ const ElementModal = React.memo(({ type = exports.WidgetType.Dashboard, elementC
         return null;
     const { options: modalOptions } = modalConfig;
     const { title, maxWidth, minWidth, minHeight } = modalOptions || {};
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ModalIcon, { kind: icon || "new_window", onClick: handleOpen }), jsxRuntime.jsxs(uilibGl.Dialog, { isOpen: isOpen, onCloseRequest: handleClose, modal: true, maxWidth: maxWidth, minWidth: minWidth, minHeight: minHeight, style: { paddingBottom: "2rem" }, children: [jsxRuntime.jsx(uilibGl.DialogTitle, { children: jsxRuntime.jsxs(uilibGl.Flex, { justifyContent: "space-between", alignItems: "center", children: [!!title && jsxRuntime.jsx("span", { children: title }), jsxRuntime.jsx(uilibGl.IconButton, { kind: "close", onClick: handleClose })] }) }), jsxRuntime.jsx(uilibGl.DialogContent, { children: isLoading ? (jsxRuntime.jsx(DashboardLoading, {})) : (jsxRuntime.jsx(Container, { isColumn: true, noBorders: true, children: jsxRuntime.jsx(ContainerChildren, { type: type, items: modalContent, isMain: true, renderElement: renderElement }) })) })] })] }));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ModalIcon, { kind: icon || "new_window", onClick: handleOpen, children: title }), jsxRuntime.jsxs(uilibGl.Dialog, { maxWidth: maxWidth, minWidth: minWidth, minHeight: minHeight, isOpen: isOpen, modal: true, onCloseRequest: handleClose, style: { paddingBottom: "2rem" }, children: [jsxRuntime.jsx(uilibGl.DialogTitle, { children: jsxRuntime.jsxs(uilibGl.Flex, { justifyContent: "space-between", alignItems: "center", children: [!!title && jsxRuntime.jsx("span", { children: title }), jsxRuntime.jsx(uilibGl.IconButton, { kind: "close", onClick: handleClose })] }) }), jsxRuntime.jsx(uilibGl.DialogContent, { children: isLoading ? (jsxRuntime.jsx(DashboardLoading, {})) : (jsxRuntime.jsx(Container, { isColumn: true, noBorders: true, children: jsxRuntime.jsx(ContainerChildren, { type: type, items: modalContent, isMain: true, renderElement: renderElement }) })) })] })] }));
 });
 
 const ElementLayerName = React.memo(({ type }) => {
@@ -9476,7 +9520,7 @@ function getFeatureAttributes(feature = {}, layer, dataSource) {
         const isIdAttribute = attributeName === idAttribute;
         const additionalProps = isIdAttribute
             ? {
-                value: idValue,
+                value: currentAttributes?.[attributeName] ?? idValue,
                 readOnly: true,
             }
             : {