Prechádzať zdrojové kódy

fix(dashboard): Display new line assets in order modification preview

Michael Bromley 3 mesiacov pred
rodič
commit
c4c851af64

+ 4 - 1
packages/dashboard/src/app/routes/_authenticated/_orders/components/order-table.tsx

@@ -34,7 +34,10 @@ function createCustomizeColumns(currencyCode: string) {
             accessorKey: 'featuredAsset',
             cell: ({ row }: { row: any }) => {
                 const asset = row.original.featuredAsset;
-                return <VendureImage asset={asset} preset="tiny" />;
+                const fallbackAsset =
+                    row.original.productVariant?.featuredAsset ??
+                    row.original.productVariant?.product?.featuredAsset;
+                return <VendureImage asset={asset ?? fallbackAsset} preset="tiny" />;
             },
         },
         productVariant: {

+ 17 - 1
packages/dashboard/src/app/routes/_authenticated/_orders/orders.graphql.ts

@@ -638,8 +638,24 @@ export const modifyOrderDocument = graphql(
         mutation ModifyOrder($input: ModifyOrderInput!) {
             modifyOrder(input: $input) {
                 __typename
-                ...OrderDetail
                 ...ErrorResult
+                ... on Order {
+                    lines {
+                        productVariant {
+                            featuredAsset {
+                                id
+                                preview
+                            }
+                            product {
+                                featuredAsset {
+                                    id
+                                    preview
+                                }
+                            }
+                        }
+                    }
+                }
+                ...OrderDetail
             }
         }
     `,

+ 6 - 7
packages/dashboard/src/lib/components/shared/vendure-image.tsx

@@ -99,9 +99,9 @@ export interface VendureImageProps extends React.ImgHTMLAttributes<HTMLImageElem
     useFocalPoint?: boolean;
     /**
      * @description
-     * The fallback to show if no asset is provided. If no fallback is provided, 
+     * The fallback to show if no asset is provided. If no fallback is provided,
      * a default placeholder will be shown.
-     */ 
+     */
     fallback?: React.ReactNode;
     /**
      * @description
@@ -113,9 +113,9 @@ export interface VendureImageProps extends React.ImgHTMLAttributes<HTMLImageElem
 /**
  * @description
  * A component for displaying an image from a Vendure asset.
- * 
+ *
  * Supports the following features:
- * 
+ *
  * * Presets
  * * Cropping
  * * Resizing
@@ -123,7 +123,7 @@ export interface VendureImageProps extends React.ImgHTMLAttributes<HTMLImageElem
  * * Quality
  * * Focal point
  * * Fallback
- * 
+ *
  * @example
  * ```tsx
  *  <VendureImage
@@ -154,14 +154,13 @@ export function VendureImage({
     ref,
     ...imgProps
 }: VendureImageProps) {
-    if (!asset) {
+    if (!asset || !asset.preview) {
         return fallback ? (
             <>{fallback}</>
         ) : (
             <PlaceholderImage preset={preset} width={width} height={height} className={className} />
         );
     }
-
     // Build the URL with query parameters
     const url = new URL(asset.preview);