[WC-2300]: DG2: fix not exporting dynamicText (#895)

mendix · Jan 22, 2024 · b173e9c · b173e9c
2 parents ee57610 + df1e693
commit b173e9c
Show file tree

Hide file tree

Showing 5 changed files with 42 additions and 11 deletions.
diff --git a/packages/pluggableWidgets/datagrid-web/CHANGELOG.md b/packages/pluggableWidgets/datagrid-web/CHANGELOG.md
@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+### Fixed
+
+-   We fixed an issue where Dynamic text values cells would be blank in exported .xlsx
+
 ## [2.12.0] - 2024-01-16
 
 ### Added

diff --git a/packages/pluggableWidgets/datagrid-web/package.json b/packages/pluggableWidgets/datagrid-web/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@mendix/datagrid-web",
   "widgetName": "Datagrid",
-  "version": "2.12.0",
+  "version": "2.12.1",
   "description": "",
   "copyright": "© Mendix Technology BV 2023. All rights reserved.",
   "private": true,

diff --git a/packages/pluggableWidgets/datagrid-web/src/Datagrid.tsx b/packages/pluggableWidgets/datagrid-web/src/Datagrid.tsx
@@ -43,7 +43,10 @@ function Container(props: Props): ReactElement {
     const [state, actions] = useGridState(props.initParams, props.mappedColumns, props.onStateChange);
 
     const [{ items, exporting, processedRows }, { abort }] = useDG2ExportApi({
-        columns: state.visibleColumns.map(column => props.columns[column.columnNumber]),
+        columns: useMemo(
+            () => state.visibleColumns.map(column => props.columns[column.columnNumber]),
+            [state.visibleColumns, props.columns]
+        ),
         hasMoreItems: props.datasource.hasMoreItems || false,
         items: props.datasource.items,
         name: props.name,

diff --git a/packages/pluggableWidgets/datagrid-web/src/features/export.ts b/packages/pluggableWidgets/datagrid-web/src/features/export.ts
@@ -219,24 +219,45 @@ function exportColumns(columns: ColumnsType[]): Message {
     return { type: "columns", payload: exportColumns };
 }
 
-function exportData(data: ObjectItem[], columns: ColumnsType[]): Message {
+type ExportDataResult =
+    | {
+          status: "pending";
+      }
+    | {
+          status: "ready";
+          message: Message;
+      };
+
+function exportData(data: ObjectItem[], columns: ColumnsType[]): ExportDataResult {
+    let hasLoadingItem = false;
     const items = data.map(item => {
         return columns.map(column => {
             let value = "";
-
             if (column.showContentAs === "attribute") {
                 value = column.attribute?.get(item)?.displayValue ?? "";
             } else if (column.showContentAs === "dynamicText") {
-                value = column.dynamicText?.get(item)?.value ?? "";
+                const dynamicText = column.dynamicText?.get(item);
+                if (dynamicText?.status === "loading") {
+                    hasLoadingItem = true;
+                } else if (dynamicText?.status === "unavailable") {
+                    value = "n/a";
+                } else {
+                    value = dynamicText?.value ?? "";
+                }
             } else {
                 value = "n/a (custom content)";
             }
-
             return value;
         });
     });
 
-    return { type: "data", payload: items };
+    if (hasLoadingItem) {
+        return {
+            status: "pending"
+        };
+    }
+
+    return { status: "ready", message: { type: "data", payload: items } };
 }
 
 type CallbackFunction = (msg: Message) => Promise<void> | void;
@@ -397,7 +418,7 @@ function exportStateReducer(state: State, action: Action): State {
     }
 
     if (action.type === "ColumnsUpdate") {
-        if (state.phase === "readyToStart" || state.phase === "exportColumns") {
+        if (state.phase === "readyToStart" || state.phase === "exportColumns" || state.phase === "exportData") {
             return {
                 ...state,
                 columns: action.payload.columns
@@ -511,8 +532,11 @@ function createExportFlow(): [ExportFlowFn, ExportFlowCleanup] {
         if (state.phase === "exportData") {
             const { currentItems, callback, columns } = state;
             if (currentItems.length > 0) {
-                await controller.exec(() => callback(exportData(currentItems, columns)));
-                controller.exec(() => dispatch({ type: "PageExported" }));
+                const result = exportData(currentItems, columns);
+                if (result.status === "ready") {
+                    await controller.exec(() => callback(result.message));
+                    controller.exec(() => dispatch({ type: "PageExported" }));
+                }
             }
             return;
         }

diff --git a/packages/pluggableWidgets/datagrid-web/src/package.xml b/packages/pluggableWidgets/datagrid-web/src/package.xml
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <package xmlns="http://www.mendix.com/package/1.0/">
-    <clientModule name="Datagrid" version="2.12.0" xmlns="http://www.mendix.com/clientModule/1.0/">
+    <clientModule name="Datagrid" version="2.12.1" xmlns="http://www.mendix.com/clientModule/1.0/">
         <widgetFiles>
             <widgetFile path="Datagrid.xml" />
         </widgetFiles>