Implement generate invoice mutation

src/fragments/errors.ts

@@ -104,3 +104,10 @@ export const webhookErrorFragment = gql`
     field
   }
 `;
+
+export const invoiceErrorFragment = gql`
+  fragment InvoiceErrorFragment on InvoiceError {
+    code
+    field
+  }
+`;

src/fragments/orders.ts

@@ -69,6 +69,7 @@ export const fragmentInvoice = gql`
     number
     createdAt
     url
+    status
   }
 `;
 

src/fragments/types/OrderDetailsFragment.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL fragment: OrderDetailsFragment
@@ -252,6 +252,7 @@ export interface OrderDetailsFragment_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderDetailsFragment {

src/orders/components/OrderDetailsPage/OrderDetailsPage.tsx

@@ -65,6 +65,8 @@ export interface OrderDetailsPageProps extends UserPermissionProps {
   onNoteAdd(data: HistoryFormData);
   onProfileView();
   onInvoiceClick(invoice: InvoiceFragment);
+  onInvoiceGenerate();
+  onInvoiceSend(invoice: InvoiceFragment);
 }
 
 const OrderDetailsPage: React.FC<OrderDetailsPageProps> = (props) => {
@@ -85,6 +87,8 @@ const OrderDetailsPage: React.FC<OrderDetailsPageProps> = (props) => {
     onShippingAddressEdit,
     onProfileView,
     onInvoiceClick,
+    onInvoiceGenerate,
+    onInvoiceSend,
   } = props;
   const classes = useStyles(props);
 
@@ -186,6 +190,8 @@ const OrderDetailsPage: React.FC<OrderDetailsPageProps> = (props) => {
           <OrderInvoiceList
             invoices={order?.invoices}
             onInvoiceClick={onInvoiceClick}
+            onInvoiceGenerate={onInvoiceGenerate}
+            onInvoiceSend={onInvoiceSend}
           />
           <CardSpacer />
           <OrderCustomerNote note={maybe(() => order.customerNote)} />

src/orders/components/OrderInvoiceList/OrderInvoiceList.tsx

@@ -37,9 +37,9 @@ const useStyles = makeStyles(
 
 interface OrderInvoiceListProps {
   invoices: InvoiceFragment[];
-  onInvoiceGenerate?: () => void;
+  onInvoiceGenerate: () => void;
-  onInvoiceClick?: (invoice: InvoiceFragment) => void;
+  onInvoiceClick: (invoice: InvoiceFragment) => void;
-  onInvoiceSend?: (invoice: InvoiceFragment) => void;
+  onInvoiceSend: (invoice: InvoiceFragment) => void;
 }
 
 const OrderInvoiceList: React.FC<OrderInvoiceListProps> = (props) => {
@@ -49,6 +49,10 @@ const OrderInvoiceList: React.FC<OrderInvoiceListProps> = (props) => {
 
   const intl = useIntl();
 
+  const generatedInvoices = invoices?.filter(
+    (invoice) => invoice.status === "SUCCESS"
+  );
+
   return (
     <Card>
       <CardTitle
@@ -67,10 +71,12 @@ const OrderInvoiceList: React.FC<OrderInvoiceListProps> = (props) => {
           )
         }
       />
-      <CardContent className={invoices?.length && classes.cardContentTable}>
+      <CardContent
-        {!invoices ? (
+        className={generatedInvoices?.length && classes.cardContentTable}
+      >
+        {!generatedInvoices ? (
           <Skeleton />
-        ) : !invoices?.length ? (
+        ) : !generatedInvoices?.length ? (
           <Typography color="textSecondary">
             <FormattedMessage defaultMessage="No invoices to be shown" />
           </Typography>
@@ -95,7 +101,7 @@ const OrderInvoiceList: React.FC<OrderInvoiceListProps> = (props) => {
               </TableRow>
             </TableHead>
             <TableBody>
-              {invoices?.map((invoice) => (
+              {generatedInvoices.map((invoice) => (
                 <TableRow key={invoice.id}>
                   <TableCell
                     className={

src/orders/containers/OrderOperations.tsx

@@ -3,6 +3,7 @@ import React from "react";
 import { getMutationProviderData } from "../../misc";
 import { PartialMutationProviderOutput } from "../../types";
 import {
+  TypedInvoiceRequestMutation,
   TypedOrderAddNoteMutation,
   TypedOrderCancelMutation,
   TypedOrderCaptureMutation,
@@ -20,6 +21,10 @@ import {
   TypedOrderUpdateMutation,
   TypedOrderVoidMutation
 } from "../mutations";
+import {
+  InvoiceRequest,
+  InvoiceRequestVariables
+} from "../types/InvoiceRequest";
 import { OrderAddNote, OrderAddNoteVariables } from "../types/OrderAddNote";
 import { OrderCancel, OrderCancelVariables } from "../types/OrderCancel";
 import { OrderCapture, OrderCaptureVariables } from "../types/OrderCapture";
@@ -128,6 +133,10 @@ interface OrderOperationsProps {
       OrderLineUpdate,
       OrderLineUpdateVariables
     >;
+    orderInvoiceRequest: PartialMutationProviderOutput<
+      InvoiceRequest,
+      InvoiceRequestVariables
+    >;
   }) => React.ReactNode;
   onOrderFulfillmentCancel: (data: OrderFulfillmentCancel) => void;
   onOrderFulfillmentUpdate: (data: OrderFulfillmentUpdateTracking) => void;
@@ -145,6 +154,7 @@ interface OrderOperationsProps {
   onOrderLineDelete: (data: OrderLineDelete) => void;
   onOrderLinesAdd: (data: OrderLinesAdd) => void;
   onOrderLineUpdate: (data: OrderLineUpdate) => void;
+  onInvoiceRequest: (data: InvoiceRequest) => void;
 }
 
 const OrderOperations: React.FC<OrderOperationsProps> = ({
@@ -164,7 +174,8 @@ const OrderOperations: React.FC<OrderOperationsProps> = ({
   onDraftFinalize,
   onOrderFulfillmentCancel,
   onOrderFulfillmentUpdate,
-  onOrderMarkAsPaid
+  onOrderMarkAsPaid,
+  onInvoiceRequest
 }) => (
   <TypedOrderVoidMutation onCompleted={onOrderVoid}>
     {(...orderVoid) => (
@@ -233,58 +244,71 @@ const OrderOperations: React.FC<OrderOperationsProps> = ({
                                                               >
                                                                 {(
                                                                   ...markAsPaid
-                                                                ) =>
+                                                                ) => (
-                                                                  children({
+                                                                  <TypedInvoiceRequestMutation
-                                                                    orderAddNote: getMutationProviderData(
+                                                                    onCompleted={
-                                                                      ...addNote
+                                                                      onInvoiceRequest
-                                                                    ),
+                                                                    }
-                                                                    orderCancel: getMutationProviderData(
+                                                                  >
-                                                                      ...orderCancel
+                                                                    {(
-                                                                    ),
+                                                                      ...invoiceRequest
-                                                                    orderDraftCancel: getMutationProviderData(
+                                                                    ) =>
-                                                                      ...cancelDraft
+                                                                      children({
-                                                                    ),
+                                                                        orderAddNote: getMutationProviderData(
-                                                                    orderDraftFinalize: getMutationProviderData(
+                                                                          ...addNote
-                                                                      ...finalizeDraft
+                                                                        ),
-                                                                    ),
+                                                                        orderCancel: getMutationProviderData(
-                                                                    orderDraftUpdate: getMutationProviderData(
+                                                                          ...orderCancel
-                                                                      ...updateDraft
+                                                                        ),
-                                                                    ),
+                                                                        orderDraftCancel: getMutationProviderData(
-                                                                    orderFulfillmentCancel: getMutationProviderData(
+                                                                          ...cancelDraft
-                                                                      ...cancelFulfillment
+                                                                        ),
-                                                                    ),
+                                                                        orderDraftFinalize: getMutationProviderData(
-                                                                    orderFulfillmentUpdateTracking: getMutationProviderData(
+                                                                          ...finalizeDraft
-                                                                      ...updateTrackingNumber
+                                                                        ),
-                                                                    ),
+                                                                        orderDraftUpdate: getMutationProviderData(
-                                                                    orderLineDelete: getMutationProviderData(
+                                                                          ...updateDraft
-                                                                      ...deleteOrderLine
+                                                                        ),
-                                                                    ),
+                                                                        orderFulfillmentCancel: getMutationProviderData(
-                                                                    orderLineUpdate: getMutationProviderData(
+                                                                          ...cancelFulfillment
-                                                                      ...updateOrderLine
+                                                                        ),
-                                                                    ),
+                                                                        orderFulfillmentUpdateTracking: getMutationProviderData(
-                                                                    orderLinesAdd: getMutationProviderData(
+                                                                          ...updateTrackingNumber
-                                                                      ...addOrderLine
+                                                                        ),
-                                                                    ),
+                                                                        orderInvoiceRequest: getMutationProviderData(
-                                                                    orderPaymentCapture: getMutationProviderData(
+                                                                          ...invoiceRequest
-                                                                      ...paymentCapture
+                                                                        ),
-                                                                    ),
+                                                                        orderLineDelete: getMutationProviderData(
-                                                                    orderPaymentMarkAsPaid: getMutationProviderData(
+                                                                          ...deleteOrderLine
-                                                                      ...markAsPaid
+                                                                        ),
-                                                                    ),
+                                                                        orderLineUpdate: getMutationProviderData(
-                                                                    orderPaymentRefund: getMutationProviderData(
+                                                                          ...updateOrderLine
-                                                                      ...paymentRefund
+                                                                        ),
-                                                                    ),
+                                                                        orderLinesAdd: getMutationProviderData(
-                                                                    orderShippingMethodUpdate: getMutationProviderData(
+                                                                          ...addOrderLine
-                                                                      ...updateShippingMethod
+                                                                        ),
-                                                                    ),
+                                                                        orderPaymentCapture: getMutationProviderData(
-                                                                    orderUpdate: getMutationProviderData(
+                                                                          ...paymentCapture
-                                                                      ...update
+                                                                        ),
-                                                                    ),
+                                                                        orderPaymentMarkAsPaid: getMutationProviderData(
-                                                                    orderVoid: getMutationProviderData(
+                                                                          ...markAsPaid
-                                                                      ...orderVoid
+                                                                        ),
-                                                                    )
+                                                                        orderPaymentRefund: getMutationProviderData(
-                                                                  })
+                                                                          ...paymentRefund
-                                                                }
+                                                                        ),
+                                                                        orderShippingMethodUpdate: getMutationProviderData(
+                                                                          ...updateShippingMethod
+                                                                        ),
+                                                                        orderUpdate: getMutationProviderData(
+                                                                          ...update
+                                                                        ),
+                                                                        orderVoid: getMutationProviderData(
+                                                                          ...orderVoid
+                                                                        )
+                                                                      })
+                                                                    }
+                                                                  </TypedInvoiceRequestMutation>
+                                                                )}
                                                               </TypedOrderMarkAsPaidMutation>
                                                             )}
                                                           </TypedOrderDraftCancelMutation>

src/orders/mutations.ts

@@ -1,5 +1,8 @@
 import { fragmentAddress } from "@saleor/fragments/address";
-import { orderErrorFragment } from "@saleor/fragments/errors";
+import {
+  invoiceErrorFragment,
+  orderErrorFragment
+} from "@saleor/fragments/errors";
 import {
   fragmentOrderDetails,
   fragmentOrderEvent
@@ -9,6 +12,10 @@ import gql from "graphql-tag";
 
 import { TypedMutation } from "../mutations";
 import { FulfillOrder, FulfillOrderVariables } from "./types/FulfillOrder";
+import {
+  InvoiceRequest,
+  InvoiceRequestVariables
+} from "./types/InvoiceRequest";
 import { OrderAddNote, OrderAddNoteVariables } from "./types/OrderAddNote";
 import { OrderCancel, OrderCancelVariables } from "./types/OrderCancel";
 import { OrderCapture, OrderCaptureVariables } from "./types/OrderCapture";
@@ -448,3 +455,22 @@ export const useOrderFulfill = makeMutation<
   FulfillOrder,
   FulfillOrderVariables
 >(fulfillOrder);
+
+const invoiceRequestMutation = gql`
+  ${invoiceErrorFragment}
+  ${fragmentInvoice}
+  mutation InvoiceRequest($orderId: ID!) {
+    requestInvoice(orderId: $orderId) {
+      errors: invoiceErrors {
+        ...InvoiceErrorFragment
+      }
+      invoice {
+        ...InvoiceFragment
+      }
+    }
+  }
+`;
+export const TypedInvoiceRequestMutation = TypedMutation<
+  InvoiceRequest,
+  InvoiceRequestVariables
+>(invoiceRequestMutation);

src/orders/types/FulfillOrder.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderFulfillInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderFulfillInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: FulfillOrder
@@ -260,6 +260,7 @@ export interface FulfillOrder_orderFulfill_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface FulfillOrder_orderFulfill_order {

src/orders/types/InvoiceErrorFragment.ts

@@ -0,0 +1,15 @@
+/* tslint:disable */
+/* eslint-disable */
+// This file was automatically generated and should not be edited.
+
+import { InvoiceErrorCode } from "./../../types/globalTypes";
+
+// ====================================================
+// GraphQL fragment: InvoiceErrorFragment
+// ====================================================
+
+export interface InvoiceErrorFragment {
+  __typename: "InvoiceError";
+  code: InvoiceErrorCode;
+  field: string | null;
+}

src/orders/types/InvoiceFragment.ts

@@ -2,6 +2,8 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
+import { JobStatusEnum } from "./../../types/globalTypes";
+
 // ====================================================
 // GraphQL fragment: InvoiceFragment
 // ====================================================
@@ -12,4 +14,5 @@ export interface InvoiceFragment {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }

src/orders/types/InvoiceRequest.ts

@@ -0,0 +1,38 @@
+/* tslint:disable */
+/* eslint-disable */
+// This file was automatically generated and should not be edited.
+
+import { InvoiceErrorCode, JobStatusEnum } from "./../../types/globalTypes";
+
+// ====================================================
+// GraphQL mutation operation: InvoiceRequest
+// ====================================================
+
+export interface InvoiceRequest_requestInvoice_errors {
+  __typename: "InvoiceError";
+  code: InvoiceErrorCode;
+  field: string | null;
+}
+
+export interface InvoiceRequest_requestInvoice_invoice {
+  __typename: "Invoice";
+  id: string;
+  number: string | null;
+  createdAt: any;
+  url: string | null;
+  status: JobStatusEnum;
+}
+
+export interface InvoiceRequest_requestInvoice {
+  __typename: "RequestInvoice";
+  errors: InvoiceRequest_requestInvoice_errors[];
+  invoice: InvoiceRequest_requestInvoice_invoice | null;
+}
+
+export interface InvoiceRequest {
+  requestInvoice: InvoiceRequest_requestInvoice | null;
+}
+
+export interface InvoiceRequestVariables {
+  orderId: string;
+}

src/orders/types/OrderCancel.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderCancel
@@ -258,6 +258,7 @@ export interface OrderCancel_orderCancel_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderCancel_orderCancel_order {

src/orders/types/OrderCapture.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderCapture
@@ -258,6 +258,7 @@ export interface OrderCapture_orderCapture_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderCapture_orderCapture_order {

src/orders/types/OrderDetails.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, WeightUnitsEnum } from "./../../types/globalTypes";
+import { OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum, WeightUnitsEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL query operation: OrderDetails
@@ -252,6 +252,7 @@ export interface OrderDetails_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderDetails_order {

src/orders/types/OrderDraftCancel.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderDraftCancel
@@ -258,6 +258,7 @@ export interface OrderDraftCancel_draftOrderDelete_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderDraftCancel_draftOrderDelete_order {

src/orders/types/OrderDraftFinalize.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderDraftFinalize
@@ -258,6 +258,7 @@ export interface OrderDraftFinalize_draftOrderComplete_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderDraftFinalize_draftOrderComplete_order {

src/orders/types/OrderDraftUpdate.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { DraftOrderInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { DraftOrderInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderDraftUpdate
@@ -258,6 +258,7 @@ export interface OrderDraftUpdate_draftOrderUpdate_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderDraftUpdate_draftOrderUpdate_order {

src/orders/types/OrderFulfillmentCancel.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { FulfillmentCancelInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { FulfillmentCancelInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderFulfillmentCancel
@@ -258,6 +258,7 @@ export interface OrderFulfillmentCancel_orderFulfillmentCancel_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderFulfillmentCancel_orderFulfillmentCancel_order {

src/orders/types/OrderFulfillmentUpdateTracking.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { FulfillmentUpdateTrackingInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { FulfillmentUpdateTrackingInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderFulfillmentUpdateTracking
@@ -258,6 +258,7 @@ export interface OrderFulfillmentUpdateTracking_orderFulfillmentUpdateTracking_o
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderFulfillmentUpdateTracking_orderFulfillmentUpdateTracking_order {

src/orders/types/OrderLineDelete.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderLineDelete
@@ -258,6 +258,7 @@ export interface OrderLineDelete_draftOrderLineDelete_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderLineDelete_draftOrderLineDelete_order {

src/orders/types/OrderLineUpdate.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderLineInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderLineInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderLineUpdate
@@ -258,6 +258,7 @@ export interface OrderLineUpdate_draftOrderLineUpdate_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderLineUpdate_draftOrderLineUpdate_order {

src/orders/types/OrderLinesAdd.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderLineCreateInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderLineCreateInput, OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderLinesAdd
@@ -258,6 +258,7 @@ export interface OrderLinesAdd_draftOrderLinesCreate_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderLinesAdd_draftOrderLinesCreate_order {

src/orders/types/OrderMarkAsPaid.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderMarkAsPaid
@@ -258,6 +258,7 @@ export interface OrderMarkAsPaid_orderMarkAsPaid_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderMarkAsPaid_orderMarkAsPaid_order {

src/orders/types/OrderRefund.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderRefund
@@ -258,6 +258,7 @@ export interface OrderRefund_orderRefund_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderRefund_orderRefund_order {

src/orders/types/OrderVoid.ts

@@ -2,7 +2,7 @@
 /* eslint-disable */
 // This file was automatically generated and should not be edited.
 
-import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction } from "./../../types/globalTypes";
+import { OrderErrorCode, OrderEventsEmailsEnum, OrderEventsEnum, FulfillmentStatus, PaymentChargeStatusEnum, OrderStatus, OrderAction, JobStatusEnum } from "./../../types/globalTypes";
 
 // ====================================================
 // GraphQL mutation operation: OrderVoid
@@ -258,6 +258,7 @@ export interface OrderVoid_orderVoid_order_invoices {
   number: string | null;
   createdAt: any;
   url: string | null;
+  status: JobStatusEnum;
 }
 
 export interface OrderVoid_orderVoid_order {

src/orders/views/OrderDetails/index.tsx

@@ -148,6 +148,7 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
                 onDraftFinalize={orderMessages.handleDraftFinalize}
                 onDraftCancel={orderMessages.handleDraftCancel}
                 onOrderMarkAsPaid={orderMessages.handleOrderMarkAsPaid}
+                onInvoiceRequest={() => null}
               >
                 {({
                   orderAddNote,
@@ -166,6 +167,7 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
                   orderDraftCancel,
                   orderDraftFinalize,
                   orderPaymentMarkAsPaid,
+                  orderInvoiceRequest,
                 }) => (
                   <>
                     {order?.status !== OrderStatus.DRAFT ? (
@@ -233,6 +235,12 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
                           onInvoiceClick={(invoice) =>
                             window.open(invoice.url, "_blank")
                           }
+                          onGenerateInvoice={() =>
+                            orderInvoiceRequest.mutate({
+                              orderId: id,
+                            })
+                          }
+                          onSendInvoice={() => null}
                         />
                         <OrderCannotCancelOrderDialog
                           onClose={closeModal}

src/storybook/__snapshots__/Stories.test.ts.snap

@@ -67063,55 +67063,12 @@ exports[`Storyshots Views / Orders / Order details cancelled 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -68199,55 +68156,12 @@ exports[`Storyshots Views / Orders / Order details default 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -69335,55 +69249,12 @@ exports[`Storyshots Views / Orders / Order details fulfilled 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -71090,55 +70961,12 @@ exports[`Storyshots Views / Orders / Order details no customer note 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -72226,55 +72054,12 @@ exports[`Storyshots Views / Orders / Order details no payment 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -73362,55 +73147,12 @@ exports[`Storyshots Views / Orders / Order details no shipping address 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -74498,55 +74240,12 @@ exports[`Storyshots Views / Orders / Order details partially fulfilled 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -75634,55 +75333,12 @@ exports[`Storyshots Views / Orders / Order details payment confirmed 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -76770,55 +76426,12 @@ exports[`Storyshots Views / Orders / Order details payment error 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -77906,55 +77519,12 @@ exports[`Storyshots Views / Orders / Order details pending payment 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -79042,55 +78612,12 @@ exports[`Storyshots Views / Orders / Order details refunded payment 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -80178,55 +79705,12 @@ exports[`Storyshots Views / Orders / Order details rejected payment 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>
@@ -81314,55 +80798,12 @@ exports[`Storyshots Views / Orders / Order details unfulfilled 1`] = `
             class="CardTitle-hr-id"
           />
           <div
-            class="MuiCardContent-root-id OrderInvoiceList-cardContentTable-id"
+            class="MuiCardContent-root-id"
           >
             <div
-              class="ResponsiveTable-root-id"
+              class="MuiTypography-root-id MuiTypography-body1-id MuiTypography-colorTextSecondary-id"
             >
-              <table
+              No invoices to be shown
-                class="MuiTable-root-id"
-              >
-                <thead
-                  class="MuiTableHead-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id MuiTableRow-head-id"
-                  >
-                    <th
-                      class="MuiTableCell-root-id MuiTableCell-head-id TableCellHeader-root-id OrderInvoiceList-colNumber-id"
-                      scope="col"
-                    >
-                      <div
-                        class="TableCellHeader-labelContainer-id"
-                      >
-                        <div
-                          class="TableCellHeader-label-id"
-                        >
-                          Invoice no
-                        </div>
-                      </div>
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  class="MuiTableBody-root-id"
-                >
-                  <tr
-                    class="MuiTableRow-root-id"
-                  >
-                    <td
-                      class="MuiTableCell-root-id MuiTableCell-body-id OrderInvoiceList-colNumberClickable-id"
-                    >
-                      Invoice 1
-                      <div
-                        class="MuiTypography-root-id MuiTypography-caption-id"
-                      >
-                        created Jun 22, 2020
-                      </div>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
             </div>
           </div>
         </div>

src/types/globalTypes.ts

@@ -380,6 +380,23 @@ export enum FulfillmentStatus {
   FULFILLED = "FULFILLED",
 }
 
+export enum InvoiceErrorCode {
+  EMAIL_NOT_SET = "EMAIL_NOT_SET",
+  INVALID_STATUS = "INVALID_STATUS",
+  NOT_FOUND = "NOT_FOUND",
+  NOT_READY = "NOT_READY",
+  NUMBER_NOT_SET = "NUMBER_NOT_SET",
+  REQUIRED = "REQUIRED",
+  URL_NOT_SET = "URL_NOT_SET",
+}
+
+export enum JobStatusEnum {
+  DELETED = "DELETED",
+  FAILED = "FAILED",
+  PENDING = "PENDING",
+  SUCCESS = "SUCCESS",
+}
+
 export enum LanguageCodeEnum {
   AR = "AR",
   AZ = "AZ",