fix(datagrid-web): fix not exporting dynamicText in xlsx

mendix · Jan 19, 2024 · 9d0235f · 9d0235f
1 parent 5a29566
commit 9d0235f
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 13 deletions.
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,49 @@ function exportColumns(columns: ColumnsType[]): Message {
     return { type: "columns", payload: exportColumns };
 }
 
-function exportData(data: ObjectItem[], columns: ColumnsType[]): Message {
-    const items = data.map(item => {
-        return columns.map(column => {
-            let value = "";
+type ExportDataResult =
+    | {
+          status: "pending";
+      }
+    | {
+          status: "ready";
+          message: Message;
+      };
+
+function exportData(data: ObjectItem[], columns: ColumnsType[]): ExportDataResult {
+    const rows = [];
+    let hasLoadingItem = false;
 
+    for (const item of data) {
+        const row = [];
+        for (const column of columns) {
+            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)";
             }
+            row.push(value);
+        }
+        rows.push(row);
+    }
 
-            return value;
-        });
-    });
+    if (hasLoadingItem) {
+        return {
+            status: "pending"
+        };
+    }
 
-    return { type: "data", payload: items };
+    return { status: "ready", message: { type: "data", payload: rows } };
 }
 
 type CallbackFunction = (msg: Message) => Promise<void> | void;
@@ -397,7 +422,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 +536,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;
         }