Fix customer is not present on the order list page (#3823)

.changeset/real-buckets-explode.md

@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+Fix customer is not present in order list view

src/components/Datagrid/customCells/cells.ts

@@ -3,7 +3,7 @@ import {
   numberCellEmptyValue,
 } from "@dashboard/components/Datagrid/customCells/NumberCell";
 import { Locale } from "@dashboard/components/Locale";
-import { GridCell, GridCellKind } from "@glideapps/glide-data-grid";
+import { GridCell, GridCellKind, TextCell } from "@glideapps/glide-data-grid";
 
 import {
   DropdownCell,
@@ -30,7 +30,7 @@ export function textCell(value: string): GridCell {
 export function readonlyTextCell(
   value: string,
   hasCursorPointer: boolean = true,
-): GridCell {
+): TextCell {
   return {
     cursor: hasCursorPointer ? "pointer" : "default",
     allowOverlay: false,

src/orders/components/OrderListDatagrid/datagrid.test.ts

@@ -0,0 +1,54 @@
+import { OrderListQuery } from "@dashboard/graphql";
+import { RelayToFlat } from "@dashboard/types";
+
+import { getCustomerCellContent } from "./datagrid";
+
+describe("getCustomerCellContent", () => {
+  it("should return billing address first name and last name when exists", () => {
+    // Arrange
+    const data = {
+      billingAddress: {
+        firstName: "John",
+        lastName: "Doe",
+      },
+    } as RelayToFlat<NonNullable<OrderListQuery["orders"]>>[number];
+
+    // Act
+    const result = getCustomerCellContent(data);
+
+    // Assert
+    expect(result.data).toEqual("John Doe");
+    expect(result.displayData).toEqual("John Doe");
+  });
+
+  it("should return user email when exists", () => {
+    // Arrange
+    const data = {
+      billingAddress: {
+        city: "New York",
+      },
+      userEmail: "john@doe.com",
+    } as RelayToFlat<NonNullable<OrderListQuery["orders"]>>[number];
+
+    // Act
+    const result = getCustomerCellContent(data);
+
+    // Assert
+    expect(result.data).toEqual("john@doe.com");
+    expect(result.displayData).toEqual("john@doe.com");
+  });
+
+  it("should return - when no user email and billing address", () => {
+    // Arrange
+    const data = {} as RelayToFlat<
+      NonNullable<OrderListQuery["orders"]>
+    >[number];
+
+    // Act
+    const result = getCustomerCellContent(data);
+
+    // Assert
+    expect(result.data).toEqual("-");
+    expect(result.displayData).toEqual("-");
+  });
+});

src/orders/components/OrderListDatagrid/datagrid.ts

@@ -18,7 +18,7 @@ import {
 import { OrderListUrlSortField } from "@dashboard/orders/urls";
 import { RelayToFlat, Sort } from "@dashboard/types";
 import { getColumnSortDirectionIcon } from "@dashboard/utils/columns/getColumnSortDirectionIcon";
-import { GridCell, Item } from "@glideapps/glide-data-grid";
+import { GridCell, Item, TextCell } from "@glideapps/glide-data-grid";
 import {
   DefaultTheme,
   ThemeTokensValues,
@@ -127,8 +127,8 @@ export function getDateCellContent(
 
 export function getCustomerCellContent(
   rowData: RelayToFlat<OrderListQuery["orders"]>[number],
-) {
+): TextCell {
-  if (rowData.billingAddress) {
+  if (rowData?.billingAddress?.firstName && rowData?.billingAddress?.lastName) {
     return readonlyTextCell(
       `${rowData.billingAddress.firstName} ${rowData.billingAddress.lastName}`,
     );