Add prices in grant refund view (#4455)

* Fix types * Add unit prices in grant refund view * Strict typing on ProductCard * Add changeset * Update schema * Build types * Update lockfile * Extract messages * Trigger deployment --------- Co-authored-by: Paweł Chyła <chyla1988@gmail.com> Co-authored-by: wojteknowacki <124166231+wojteknowacki@users.noreply.github.com>
saleor · Dec 18, 2023 · dd1d1db · dd1d1db
1 parent 0ed13e8
commit dd1d1db
Show file tree

Hide file tree

Showing 8 changed files with 41 additions and 6 deletions.
diff --git a/.changeset/giant-lamps-wash.md b/.changeset/giant-lamps-wash.md
@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+Add prices in grant refund view
diff --git a/introspection.json b/introspection.json
@@ -95679,6 +95679,12 @@
             "isDeprecated": false,
             "deprecationReason": null
           },
+          {
+            "name": "STOCK_ALREADY_EXISTS",
+            "description": null,
+            "isDeprecated": false,
+            "deprecationReason": null
+          },
           {
             "name": "UNIQUE",
             "description": null,

diff --git a/locale/defaultMessages.json b/locale/defaultMessages.json
@@ -3225,6 +3225,10 @@
   "KRqgfo": {
     "string": "User is out of your permissions scope"
   },
+  "KWXwFo": {
+    "context": "grant refund table, column header",
+    "string": "Unit price"
+  },
   "KXkdMH": {
     "context": "order discount removed title",
     "string": "Order discount was removed by"

diff --git a/schema.graphql b/schema.graphql
@@ -24013,6 +24013,7 @@ enum ProductVariantBulkErrorCode {
   NOT_PRODUCTS_VARIANT
   PRODUCT_NOT_ASSIGNED_TO_CHANNEL
   REQUIRED
+  STOCK_ALREADY_EXISTS
   UNIQUE
 }
 

diff --git a/src/graphql/types.generated.ts b/src/graphql/types.generated.ts
@@ -5604,6 +5604,7 @@ export enum ProductVariantBulkErrorCode {
   NOT_PRODUCTS_VARIANT = 'NOT_PRODUCTS_VARIANT',
   PRODUCT_NOT_ASSIGNED_TO_CHANNEL = 'PRODUCT_NOT_ASSIGNED_TO_CHANNEL',
   REQUIRED = 'REQUIRED',
+  STOCK_ALREADY_EXISTS = 'STOCK_ALREADY_EXISTS',
   UNIQUE = 'UNIQUE'
 }
 

diff --git a/src/orders/components/OrderGrantRefundPage/components/ProductCard.tsx b/src/orders/components/OrderGrantRefundPage/components/ProductCard.tsx
@@ -1,4 +1,4 @@
-// @ts-strict-ignore
+import Money from "@dashboard/components/Money";
 import TableCellAvatar from "@dashboard/components/TableCellAvatar";
 import TableRowLink from "@dashboard/components/TableRowLink";
 import { OrderLineGrantRefundFragment } from "@dashboard/graphql";
@@ -75,6 +75,9 @@ export const ProductsCard: React.FC<ProductsCardProps> = ({
           <TableCell className={classes.colProduct}>
             <FormattedMessage {...productCardMessages.product} />
           </TableCell>
+          <TableCell className={classes.colUnitPrice}>
+            <FormattedMessage {...productCardMessages.unitPrice} />
+          </TableCell>
           <TableCell className={classes.colQuantity}>
             <FormattedMessage {...productCardMessages.quantity} />
           </TableCell>
@@ -86,19 +89,25 @@ export const ProductsCard: React.FC<ProductsCardProps> = ({
           {renderCollection(
             lines,
             line => {
+              if (!line) {
+                return null;
+              }
               const stateLine = state.lines.get(line.id);
 
               return (
-                <TableRowLink key={line?.id}>
+                <TableRowLink key={line.id}>
                   <TableCellAvatar
-                    thumbnail={line?.thumbnail?.url}
+                    thumbnail={line.thumbnail?.url}
                     className={classes.colProduct}
                   >
                     <div className={classes.productName}>
-                      <span>{line?.productName}</span>
+                      <span>{line.productName}</span>
                       <span>{line.variantName}</span>
                     </div>
                   </TableCellAvatar>
+                  <TableCell className={classes.colUnitPrice}>
+                    <Money money={line.unitPrice.gross} />
+                  </TableCell>
                   <TableCell className={classes.colQuantity}>
                     {line.quantity}
                   </TableCell>
@@ -109,11 +118,11 @@ export const ProductsCard: React.FC<ProductsCardProps> = ({
                       type="number"
                       max={stateLine?.availableQuantity}
                       min={0}
-                      data-test-id={"quantityInput" + line?.id}
+                      data-test-id={"quantityInput" + line.id}
                       value={stateLine?.selectedQuantity ?? 0}
                       onChange={getHandleAmountChange(line)}
                       endAdornment={
-                        line?.quantity && (
+                        line.quantity && (
                           <Box
                             fontSize="bodySmall"
                             whiteSpace="nowrap"

diff --git a/src/orders/components/OrderGrantRefundPage/messages.ts b/src/orders/components/OrderGrantRefundPage/messages.ts
@@ -95,6 +95,11 @@ export const productCardMessages = defineMessages({
     id: "1/oauz",
     description: "grant refund table, column header",
   },
+  unitPrice: {
+    defaultMessage: "Unit price",
+    id: "KWXwFo",
+    description: "grant refund table, column header",
+  },
 });
 
 export const fulfilmentStatusMessages = defineMessages({

diff --git a/src/orders/components/OrderGrantRefundPage/styles.ts b/src/orders/components/OrderGrantRefundPage/styles.ts
@@ -22,6 +22,10 @@ export const useProductsCardStyles = makeStyles(
         textAlign: "right",
         width: `${75 + 32 + 32}px`,
       },
+      colUnitPrice: {
+        textAlign: "right",
+        width: `${100 + 32 + 32}px`,
+      },
     };
   },
   { name: "ProductsCard" },