Unconfirmed order view contents
This commit is contained in:
Tomasz Szymanski
parent
b0de18797e
commit
4cf8c95347
3 changed files with 568 additions and 241 deletions
|
|
@ -26,6 +26,8 @@ import { OrderStatus } from "../../../types/globalTypes";
|
|||
import { OrderDetails_order } from "../../types/OrderDetails";
|
||||
import OrderCustomer from "../OrderCustomer";
|
||||
import OrderCustomerNote from "../OrderCustomerNote";
|
||||
import OrderDraftDetails from "../OrderDraftDetails/OrderDraftDetails";
|
||||
import { FormData as OrderDraftDetailsProductsFormData } from "../OrderDraftDetailsProducts";
|
||||
import OrderFulfilledProductsCard from "../OrderFulfilledProductsCard";
|
||||
import OrderHistory, { FormData as HistoryFormData } from "../OrderHistory";
|
||||
import OrderInvoiceList from "../OrderInvoiceList";
|
||||
|
|
@ -77,6 +79,13 @@ export interface OrderDetailsPageProps extends UserPermissionProps {
|
|||
onNoteAdd(data: HistoryFormData);
|
||||
onProfileView();
|
||||
onOrderReturn();
|
||||
onOrderLineAdd: () => void;
|
||||
onOrderLineChange: (
|
||||
id: string,
|
||||
data: OrderDraftDetailsProductsFormData
|
||||
) => void;
|
||||
onOrderLineRemove: (id: string) => void;
|
||||
onShippingMethodEdit();
|
||||
onInvoiceClick(invoiceId: string);
|
||||
onInvoiceGenerate();
|
||||
onInvoiceSend(invoiceId: string);
|
||||
|
|
@ -121,6 +130,10 @@ const OrderDetailsPage: React.FC<OrderDetailsPageProps> = props => {
|
|||
onInvoiceGenerate,
|
||||
onInvoiceSend,
|
||||
onOrderReturn,
|
||||
onOrderLineAdd,
|
||||
onOrderLineChange,
|
||||
onOrderLineRemove,
|
||||
onShippingMethodEdit,
|
||||
onSubmit
|
||||
} = props;
|
||||
const classes = useStyles(props);
|
||||
|
|
@ -214,11 +227,25 @@ const OrderDetailsPage: React.FC<OrderDetailsPageProps> = props => {
|
|||
</div>
|
||||
<Grid>
|
||||
<div>
|
||||
<OrderUnfulfilledProductsCard
|
||||
canFulfill={canFulfill}
|
||||
lines={unfulfilled}
|
||||
onFulfill={onOrderFulfill}
|
||||
/>
|
||||
{order?.status !== OrderStatus.UNCONFIRMED ? (
|
||||
<OrderUnfulfilledProductsCard
|
||||
canFulfill={canFulfill}
|
||||
lines={unfulfilled}
|
||||
onFulfill={onOrderFulfill}
|
||||
/>
|
||||
) : (
|
||||
<>
|
||||
<OrderDraftDetails
|
||||
disabled={!order?.channel}
|
||||
order={order}
|
||||
onOrderLineAdd={onOrderLineAdd}
|
||||
onOrderLineChange={onOrderLineChange}
|
||||
onOrderLineRemove={onOrderLineRemove}
|
||||
onShippingMethodEdit={onShippingMethodEdit}
|
||||
/>
|
||||
<CardSpacer />
|
||||
</>
|
||||
)}
|
||||
{order?.fulfillments?.map(fulfillment => (
|
||||
<React.Fragment key={fulfillment.id}>
|
||||
<OrderFulfilledProductsCard
|
||||
|
|
@ -234,13 +261,15 @@ const OrderDetailsPage: React.FC<OrderDetailsPageProps> = props => {
|
|||
/>
|
||||
</React.Fragment>
|
||||
))}
|
||||
<OrderPayment
|
||||
order={order}
|
||||
onCapture={onPaymentCapture}
|
||||
onMarkAsPaid={onPaymentPaid}
|
||||
onRefund={onPaymentRefund}
|
||||
onVoid={onPaymentVoid}
|
||||
/>
|
||||
{order?.status !== OrderStatus.UNCONFIRMED && (
|
||||
<OrderPayment
|
||||
order={order}
|
||||
onCapture={onPaymentCapture}
|
||||
onMarkAsPaid={onPaymentPaid}
|
||||
onRefund={onPaymentRefund}
|
||||
onVoid={onPaymentVoid}
|
||||
/>
|
||||
)}
|
||||
<CardSpacer />
|
||||
<Metadata data={data} onChange={changeMetadata} />
|
||||
<OrderHistory
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ export const getEventMessage = (
|
|||
});
|
||||
case OrderEventsEnum.ADDED_PRODUCTS:
|
||||
return intl.formatMessage({
|
||||
defaultMessage: "Products were added to draft order",
|
||||
defaultMessage: "Products were added to an order",
|
||||
description: "order history message"
|
||||
});
|
||||
case OrderEventsEnum.DRAFT_CREATED:
|
||||
|
|
@ -46,7 +46,7 @@ export const getEventMessage = (
|
|||
});
|
||||
case OrderEventsEnum.REMOVED_PRODUCTS:
|
||||
return intl.formatMessage({
|
||||
defaultMessage: "Products were deleted from draft order",
|
||||
defaultMessage: "Products were deleted from an order",
|
||||
description: "order history message"
|
||||
});
|
||||
case OrderEventsEnum.EMAIL_SENT:
|
||||
|
|
|
|||
|
|
@ -212,238 +212,242 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
|
|||
orderInvoiceSend
|
||||
}) => (
|
||||
<>
|
||||
{order?.status !== OrderStatus.DRAFT ? (
|
||||
<>
|
||||
<WindowTitle
|
||||
title={intl.formatMessage(
|
||||
{
|
||||
defaultMessage: "Order #{orderNumber}",
|
||||
description: "window title"
|
||||
},
|
||||
{
|
||||
orderNumber: getStringOrPlaceholder(
|
||||
data?.order?.number
|
||||
{order?.status !== OrderStatus.DRAFT &&
|
||||
order?.status !== OrderStatus.UNCONFIRMED && (
|
||||
<>
|
||||
<WindowTitle
|
||||
title={intl.formatMessage(
|
||||
{
|
||||
defaultMessage: "Order #{orderNumber}",
|
||||
description: "window title"
|
||||
},
|
||||
{
|
||||
orderNumber: getStringOrPlaceholder(
|
||||
data?.order?.number
|
||||
)
|
||||
}
|
||||
)}
|
||||
/>
|
||||
<OrderDetailsPage
|
||||
onOrderReturn={() => navigate(orderReturnPath(id))}
|
||||
disabled={
|
||||
updateMetadataOpts.loading ||
|
||||
updatePrivateMetadataOpts.loading
|
||||
}
|
||||
onNoteAdd={variables =>
|
||||
orderAddNote.mutate({
|
||||
input: variables,
|
||||
order: id
|
||||
})
|
||||
}
|
||||
onBack={handleBack}
|
||||
order={order}
|
||||
saveButtonBarState={getMutationState(
|
||||
updateMetadataOpts.called ||
|
||||
updatePrivateMetadataOpts.called,
|
||||
updateMetadataOpts.loading ||
|
||||
updatePrivateMetadataOpts.loading,
|
||||
[
|
||||
...(updateMetadataOpts.data?.deleteMetadata
|
||||
.errors || []),
|
||||
...(updateMetadataOpts.data?.updateMetadata
|
||||
.errors || []),
|
||||
...(updatePrivateMetadataOpts.data
|
||||
?.deletePrivateMetadata.errors || []),
|
||||
...(updatePrivateMetadataOpts.data
|
||||
?.updatePrivateMetadata.errors || [])
|
||||
]
|
||||
)}
|
||||
shippingMethods={maybe(
|
||||
() => data.order.availableShippingMethods,
|
||||
[]
|
||||
)}
|
||||
userPermissions={user?.userPermissions || []}
|
||||
onOrderCancel={() => openModal("cancel")}
|
||||
onOrderFulfill={() => navigate(orderFulfillUrl(id))}
|
||||
onFulfillmentCancel={fulfillmentId =>
|
||||
navigate(
|
||||
orderUrl(id, {
|
||||
action: "cancel-fulfillment",
|
||||
id: fulfillmentId
|
||||
})
|
||||
)
|
||||
}
|
||||
)}
|
||||
/>
|
||||
<OrderDetailsPage
|
||||
onOrderReturn={() => navigate(orderReturnPath(id))}
|
||||
disabled={
|
||||
updateMetadataOpts.loading ||
|
||||
updatePrivateMetadataOpts.loading
|
||||
}
|
||||
onNoteAdd={variables =>
|
||||
orderAddNote.mutate({
|
||||
input: variables,
|
||||
order: id
|
||||
})
|
||||
}
|
||||
onBack={handleBack}
|
||||
order={order}
|
||||
saveButtonBarState={getMutationState(
|
||||
updateMetadataOpts.called ||
|
||||
updatePrivateMetadataOpts.called,
|
||||
updateMetadataOpts.loading ||
|
||||
updatePrivateMetadataOpts.loading,
|
||||
[
|
||||
...(updateMetadataOpts.data?.deleteMetadata
|
||||
.errors || []),
|
||||
...(updateMetadataOpts.data?.updateMetadata
|
||||
.errors || []),
|
||||
...(updatePrivateMetadataOpts.data
|
||||
?.deletePrivateMetadata.errors || []),
|
||||
...(updatePrivateMetadataOpts.data
|
||||
?.updatePrivateMetadata.errors || [])
|
||||
]
|
||||
)}
|
||||
shippingMethods={maybe(
|
||||
() => data.order.availableShippingMethods,
|
||||
[]
|
||||
)}
|
||||
userPermissions={user?.userPermissions || []}
|
||||
onOrderCancel={() => openModal("cancel")}
|
||||
onOrderFulfill={() => navigate(orderFulfillUrl(id))}
|
||||
onFulfillmentCancel={fulfillmentId =>
|
||||
navigate(
|
||||
orderUrl(id, {
|
||||
action: "cancel-fulfillment",
|
||||
id: fulfillmentId
|
||||
onFulfillmentTrackingNumberUpdate={fulfillmentId =>
|
||||
navigate(
|
||||
orderUrl(id, {
|
||||
action: "edit-fulfillment",
|
||||
id: fulfillmentId
|
||||
})
|
||||
)
|
||||
}
|
||||
onPaymentCapture={() => openModal("capture")}
|
||||
onPaymentVoid={() => openModal("void")}
|
||||
onPaymentRefund={() => navigate(orderRefundUrl(id))}
|
||||
onProductClick={id => () =>
|
||||
navigate(productUrl(id))}
|
||||
onBillingAddressEdit={() =>
|
||||
openModal("edit-billing-address")
|
||||
}
|
||||
onShippingAddressEdit={() =>
|
||||
openModal("edit-shipping-address")
|
||||
}
|
||||
onPaymentPaid={() => openModal("mark-paid")}
|
||||
onProfileView={() =>
|
||||
navigate(customerUrl(order.user.id))
|
||||
}
|
||||
onInvoiceClick={id =>
|
||||
window.open(
|
||||
order.invoices.find(
|
||||
invoice => invoice.id === id
|
||||
)?.url,
|
||||
"_blank"
|
||||
)
|
||||
}
|
||||
onInvoiceGenerate={() =>
|
||||
orderInvoiceRequest.mutate({
|
||||
orderId: id
|
||||
})
|
||||
)
|
||||
}
|
||||
onFulfillmentTrackingNumberUpdate={fulfillmentId =>
|
||||
navigate(
|
||||
orderUrl(id, {
|
||||
action: "edit-fulfillment",
|
||||
id: fulfillmentId
|
||||
}
|
||||
onInvoiceSend={id =>
|
||||
openModal("invoice-send", { id })
|
||||
}
|
||||
onSubmit={handleSubmit}
|
||||
/>
|
||||
<OrderCannotCancelOrderDialog
|
||||
onClose={closeModal}
|
||||
open={
|
||||
params.action === "cancel" &&
|
||||
order?.fulfillments.some(
|
||||
fulfillment =>
|
||||
fulfillment.status ===
|
||||
FulfillmentStatus.FULFILLED
|
||||
)
|
||||
}
|
||||
/>
|
||||
<OrderCancelDialog
|
||||
confirmButtonState={orderCancel.opts.status}
|
||||
errors={
|
||||
orderCancel.opts.data?.orderCancel.errors || []
|
||||
}
|
||||
number={order?.number}
|
||||
open={params.action === "cancel"}
|
||||
onClose={closeModal}
|
||||
onSubmit={() =>
|
||||
orderCancel.mutate({
|
||||
id
|
||||
})
|
||||
)
|
||||
}
|
||||
onPaymentCapture={() => openModal("capture")}
|
||||
onPaymentVoid={() => openModal("void")}
|
||||
onPaymentRefund={() => navigate(orderRefundUrl(id))}
|
||||
onProductClick={id => () => navigate(productUrl(id))}
|
||||
onBillingAddressEdit={() =>
|
||||
openModal("edit-billing-address")
|
||||
}
|
||||
onShippingAddressEdit={() =>
|
||||
openModal("edit-shipping-address")
|
||||
}
|
||||
onPaymentPaid={() => openModal("mark-paid")}
|
||||
onProfileView={() =>
|
||||
navigate(customerUrl(order.user.id))
|
||||
}
|
||||
onInvoiceClick={id =>
|
||||
window.open(
|
||||
order.invoices.find(invoice => invoice.id === id)
|
||||
?.url,
|
||||
"_blank"
|
||||
)
|
||||
}
|
||||
onInvoiceGenerate={() =>
|
||||
orderInvoiceRequest.mutate({
|
||||
orderId: id
|
||||
})
|
||||
}
|
||||
onInvoiceSend={id =>
|
||||
openModal("invoice-send", { id })
|
||||
}
|
||||
onSubmit={handleSubmit}
|
||||
/>
|
||||
<OrderCannotCancelOrderDialog
|
||||
onClose={closeModal}
|
||||
open={
|
||||
params.action === "cancel" &&
|
||||
order?.fulfillments.some(
|
||||
fulfillment =>
|
||||
fulfillment.status ===
|
||||
FulfillmentStatus.FULFILLED
|
||||
)
|
||||
}
|
||||
/>
|
||||
<OrderCancelDialog
|
||||
confirmButtonState={orderCancel.opts.status}
|
||||
errors={
|
||||
orderCancel.opts.data?.orderCancel.errors || []
|
||||
}
|
||||
number={order?.number}
|
||||
open={params.action === "cancel"}
|
||||
onClose={closeModal}
|
||||
onSubmit={() =>
|
||||
orderCancel.mutate({
|
||||
id
|
||||
})
|
||||
}
|
||||
/>
|
||||
<OrderMarkAsPaidDialog
|
||||
confirmButtonState={
|
||||
orderPaymentMarkAsPaid.opts.status
|
||||
}
|
||||
errors={
|
||||
orderPaymentMarkAsPaid.opts.data?.orderMarkAsPaid
|
||||
.errors || []
|
||||
}
|
||||
onClose={closeModal}
|
||||
onConfirm={() =>
|
||||
orderPaymentMarkAsPaid.mutate({
|
||||
id,
|
||||
transactionReference
|
||||
})
|
||||
}
|
||||
open={params.action === "mark-paid"}
|
||||
transactionReference={transactionReference}
|
||||
handleTransactionReference={({ target }) =>
|
||||
setTransactionReference(target.value)
|
||||
}
|
||||
/>
|
||||
<OrderPaymentVoidDialog
|
||||
confirmButtonState={orderVoid.opts.status}
|
||||
errors={orderVoid.opts.data?.orderVoid.errors || []}
|
||||
open={params.action === "void"}
|
||||
onClose={closeModal}
|
||||
onConfirm={() => orderVoid.mutate({ id })}
|
||||
/>
|
||||
<OrderPaymentDialog
|
||||
confirmButtonState={orderPaymentCapture.opts.status}
|
||||
errors={
|
||||
orderPaymentCapture.opts.data?.orderCapture
|
||||
.errors || []
|
||||
}
|
||||
initial={order?.total.gross.amount}
|
||||
open={params.action === "capture"}
|
||||
onClose={closeModal}
|
||||
onSubmit={variables =>
|
||||
orderPaymentCapture.mutate({
|
||||
...variables,
|
||||
id
|
||||
})
|
||||
}
|
||||
/>
|
||||
<OrderFulfillmentCancelDialog
|
||||
confirmButtonState={
|
||||
orderFulfillmentCancel.opts.status
|
||||
}
|
||||
errors={
|
||||
orderFulfillmentCancel.opts.data
|
||||
?.orderFulfillmentCancel.errors || []
|
||||
}
|
||||
open={params.action === "cancel-fulfillment"}
|
||||
warehouses={
|
||||
warehouses.data?.warehouses.edges.map(
|
||||
edge => edge.node
|
||||
) || []
|
||||
}
|
||||
onConfirm={variables =>
|
||||
orderFulfillmentCancel.mutate({
|
||||
id: params.id,
|
||||
input: variables
|
||||
})
|
||||
}
|
||||
onClose={closeModal}
|
||||
/>
|
||||
<OrderFulfillmentTrackingDialog
|
||||
confirmButtonState={
|
||||
orderFulfillmentUpdateTracking.opts.status
|
||||
}
|
||||
errors={
|
||||
orderFulfillmentUpdateTracking.opts.data
|
||||
?.orderFulfillmentUpdateTracking.errors || []
|
||||
}
|
||||
open={params.action === "edit-fulfillment"}
|
||||
trackingNumber={getStringOrPlaceholder(
|
||||
data?.order?.fulfillments.find(
|
||||
fulfillment => fulfillment.id === params.id
|
||||
)?.trackingNumber
|
||||
)}
|
||||
onConfirm={variables =>
|
||||
orderFulfillmentUpdateTracking.mutate({
|
||||
id: params.id,
|
||||
input: {
|
||||
}
|
||||
/>
|
||||
<OrderMarkAsPaidDialog
|
||||
confirmButtonState={
|
||||
orderPaymentMarkAsPaid.opts.status
|
||||
}
|
||||
errors={
|
||||
orderPaymentMarkAsPaid.opts.data?.orderMarkAsPaid
|
||||
.errors || []
|
||||
}
|
||||
onClose={closeModal}
|
||||
onConfirm={() =>
|
||||
orderPaymentMarkAsPaid.mutate({
|
||||
id,
|
||||
transactionReference
|
||||
})
|
||||
}
|
||||
open={params.action === "mark-paid"}
|
||||
transactionReference={transactionReference}
|
||||
handleTransactionReference={({ target }) =>
|
||||
setTransactionReference(target.value)
|
||||
}
|
||||
/>
|
||||
<OrderPaymentVoidDialog
|
||||
confirmButtonState={orderVoid.opts.status}
|
||||
errors={orderVoid.opts.data?.orderVoid.errors || []}
|
||||
open={params.action === "void"}
|
||||
onClose={closeModal}
|
||||
onConfirm={() => orderVoid.mutate({ id })}
|
||||
/>
|
||||
<OrderPaymentDialog
|
||||
confirmButtonState={orderPaymentCapture.opts.status}
|
||||
errors={
|
||||
orderPaymentCapture.opts.data?.orderCapture
|
||||
.errors || []
|
||||
}
|
||||
initial={order?.total.gross.amount}
|
||||
open={params.action === "capture"}
|
||||
onClose={closeModal}
|
||||
onSubmit={variables =>
|
||||
orderPaymentCapture.mutate({
|
||||
...variables,
|
||||
notifyCustomer: true
|
||||
}
|
||||
})
|
||||
}
|
||||
onClose={closeModal}
|
||||
/>
|
||||
<OrderInvoiceEmailSendDialog
|
||||
confirmButtonState={orderInvoiceSend.opts.status}
|
||||
errors={
|
||||
orderInvoiceSend.opts.data?.invoiceSendEmail
|
||||
.errors || []
|
||||
}
|
||||
open={params.action === "invoice-send"}
|
||||
invoice={order?.invoices?.find(
|
||||
invoice => invoice.id === params.id
|
||||
)}
|
||||
onClose={closeModal}
|
||||
onSend={() =>
|
||||
orderInvoiceSend.mutate({ id: params.id })
|
||||
}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
id
|
||||
})
|
||||
}
|
||||
/>
|
||||
<OrderFulfillmentCancelDialog
|
||||
confirmButtonState={
|
||||
orderFulfillmentCancel.opts.status
|
||||
}
|
||||
errors={
|
||||
orderFulfillmentCancel.opts.data
|
||||
?.orderFulfillmentCancel.errors || []
|
||||
}
|
||||
open={params.action === "cancel-fulfillment"}
|
||||
warehouses={
|
||||
warehouses.data?.warehouses.edges.map(
|
||||
edge => edge.node
|
||||
) || []
|
||||
}
|
||||
onConfirm={variables =>
|
||||
orderFulfillmentCancel.mutate({
|
||||
id: params.id,
|
||||
input: variables
|
||||
})
|
||||
}
|
||||
onClose={closeModal}
|
||||
/>
|
||||
<OrderFulfillmentTrackingDialog
|
||||
confirmButtonState={
|
||||
orderFulfillmentUpdateTracking.opts.status
|
||||
}
|
||||
errors={
|
||||
orderFulfillmentUpdateTracking.opts.data
|
||||
?.orderFulfillmentUpdateTracking.errors || []
|
||||
}
|
||||
open={params.action === "edit-fulfillment"}
|
||||
trackingNumber={getStringOrPlaceholder(
|
||||
data?.order?.fulfillments.find(
|
||||
fulfillment => fulfillment.id === params.id
|
||||
)?.trackingNumber
|
||||
)}
|
||||
onConfirm={variables =>
|
||||
orderFulfillmentUpdateTracking.mutate({
|
||||
id: params.id,
|
||||
input: {
|
||||
...variables,
|
||||
notifyCustomer: true
|
||||
}
|
||||
})
|
||||
}
|
||||
onClose={closeModal}
|
||||
/>
|
||||
<OrderInvoiceEmailSendDialog
|
||||
confirmButtonState={orderInvoiceSend.opts.status}
|
||||
errors={
|
||||
orderInvoiceSend.opts.data?.invoiceSendEmail
|
||||
.errors || []
|
||||
}
|
||||
open={params.action === "invoice-send"}
|
||||
invoice={order?.invoices?.find(
|
||||
invoice => invoice.id === params.id
|
||||
)}
|
||||
onClose={closeModal}
|
||||
onSend={() =>
|
||||
orderInvoiceSend.mutate({ id: params.id })
|
||||
}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
{order?.status === OrderStatus.DRAFT && (
|
||||
<>
|
||||
<WindowTitle
|
||||
title={intl.formatMessage(
|
||||
|
|
@ -586,6 +590,300 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
|
|||
/>
|
||||
</>
|
||||
)}
|
||||
{order?.status === OrderStatus.UNCONFIRMED && (
|
||||
<>
|
||||
<WindowTitle
|
||||
title={intl.formatMessage(
|
||||
{
|
||||
defaultMessage: "Order #{orderNumber}",
|
||||
description: "window title"
|
||||
},
|
||||
{
|
||||
orderNumber: getStringOrPlaceholder(
|
||||
data?.order?.number
|
||||
)
|
||||
}
|
||||
)}
|
||||
/>
|
||||
<OrderDetailsPage
|
||||
onOrderReturn={() => navigate(orderReturnPath(id))}
|
||||
disabled={
|
||||
updateMetadataOpts.loading ||
|
||||
updatePrivateMetadataOpts.loading
|
||||
}
|
||||
onNoteAdd={variables =>
|
||||
orderAddNote.mutate({
|
||||
input: variables,
|
||||
order: id
|
||||
})
|
||||
}
|
||||
onBack={handleBack}
|
||||
order={order}
|
||||
onOrderLineAdd={() => openModal("add-order-line")}
|
||||
onOrderLineChange={(id, data) =>
|
||||
orderLineUpdate.mutate({
|
||||
id,
|
||||
input: data
|
||||
})
|
||||
}
|
||||
onOrderLineRemove={id =>
|
||||
orderLineDelete.mutate({ id })
|
||||
}
|
||||
onShippingMethodEdit={() =>
|
||||
openModal("edit-shipping")
|
||||
}
|
||||
saveButtonBarState={getMutationState(
|
||||
updateMetadataOpts.called ||
|
||||
updatePrivateMetadataOpts.called,
|
||||
updateMetadataOpts.loading ||
|
||||
updatePrivateMetadataOpts.loading,
|
||||
[
|
||||
...(updateMetadataOpts.data?.deleteMetadata
|
||||
.errors || []),
|
||||
...(updateMetadataOpts.data?.updateMetadata
|
||||
.errors || []),
|
||||
...(updatePrivateMetadataOpts.data
|
||||
?.deletePrivateMetadata.errors || []),
|
||||
...(updatePrivateMetadataOpts.data
|
||||
?.updatePrivateMetadata.errors || [])
|
||||
]
|
||||
)}
|
||||
shippingMethods={maybe(
|
||||
() => data.order.availableShippingMethods,
|
||||
[]
|
||||
)}
|
||||
userPermissions={user?.userPermissions || []}
|
||||
onOrderCancel={() => openModal("cancel")}
|
||||
onOrderFulfill={() => navigate(orderFulfillUrl(id))}
|
||||
onFulfillmentCancel={fulfillmentId =>
|
||||
navigate(
|
||||
orderUrl(id, {
|
||||
action: "cancel-fulfillment",
|
||||
id: fulfillmentId
|
||||
})
|
||||
)
|
||||
}
|
||||
onFulfillmentTrackingNumberUpdate={fulfillmentId =>
|
||||
navigate(
|
||||
orderUrl(id, {
|
||||
action: "edit-fulfillment",
|
||||
id: fulfillmentId
|
||||
})
|
||||
)
|
||||
}
|
||||
onPaymentCapture={() => openModal("capture")}
|
||||
onPaymentVoid={() => openModal("void")}
|
||||
onPaymentRefund={() => navigate(orderRefundUrl(id))}
|
||||
onProductClick={id => () => navigate(productUrl(id))}
|
||||
onBillingAddressEdit={() =>
|
||||
openModal("edit-billing-address")
|
||||
}
|
||||
onShippingAddressEdit={() =>
|
||||
openModal("edit-shipping-address")
|
||||
}
|
||||
onPaymentPaid={() => openModal("mark-paid")}
|
||||
onProfileView={() =>
|
||||
navigate(customerUrl(order.user.id))
|
||||
}
|
||||
onInvoiceClick={id =>
|
||||
window.open(
|
||||
order.invoices.find(invoice => invoice.id === id)
|
||||
?.url,
|
||||
"_blank"
|
||||
)
|
||||
}
|
||||
onInvoiceGenerate={() =>
|
||||
orderInvoiceRequest.mutate({
|
||||
orderId: id
|
||||
})
|
||||
}
|
||||
onInvoiceSend={id =>
|
||||
openModal("invoice-send", { id })
|
||||
}
|
||||
onSubmit={handleSubmit}
|
||||
/>
|
||||
<OrderCannotCancelOrderDialog
|
||||
onClose={closeModal}
|
||||
open={
|
||||
params.action === "cancel" &&
|
||||
order?.fulfillments.some(
|
||||
fulfillment =>
|
||||
fulfillment.status ===
|
||||
FulfillmentStatus.FULFILLED
|
||||
)
|
||||
}
|
||||
/>
|
||||
<OrderCancelDialog
|
||||
confirmButtonState={orderCancel.opts.status}
|
||||
errors={
|
||||
orderCancel.opts.data?.orderCancel.errors || []
|
||||
}
|
||||
number={order?.number}
|
||||
open={params.action === "cancel"}
|
||||
onClose={closeModal}
|
||||
onSubmit={() =>
|
||||
orderCancel.mutate({
|
||||
id
|
||||
})
|
||||
}
|
||||
/>
|
||||
<OrderShippingMethodEditDialog
|
||||
confirmButtonState={
|
||||
orderShippingMethodUpdate.opts.status
|
||||
}
|
||||
errors={
|
||||
orderShippingMethodUpdate.opts.data
|
||||
?.orderUpdateShipping.errors || []
|
||||
}
|
||||
open={params.action === "edit-shipping"}
|
||||
shippingMethod={order?.shippingMethod?.id}
|
||||
shippingMethods={order?.availableShippingMethods}
|
||||
onClose={closeModal}
|
||||
onSubmit={variables =>
|
||||
orderShippingMethodUpdate.mutate({
|
||||
id,
|
||||
input: {
|
||||
shippingMethod: variables.shippingMethod
|
||||
}
|
||||
})
|
||||
}
|
||||
/>
|
||||
<OrderProductAddDialog
|
||||
confirmButtonState={orderLinesAdd.opts.status}
|
||||
errors={
|
||||
orderLinesAdd.opts.data?.orderLinesCreate.errors ||
|
||||
[]
|
||||
}
|
||||
loading={variantSearchOpts.loading}
|
||||
open={params.action === "add-order-line"}
|
||||
hasMore={
|
||||
variantSearchOpts.data?.search.pageInfo.hasNextPage
|
||||
}
|
||||
products={variantSearchOpts.data?.search.edges.map(
|
||||
edge => edge.node
|
||||
)}
|
||||
selectedChannelId={order?.channel?.id}
|
||||
onClose={closeModal}
|
||||
onFetch={variantSearch}
|
||||
onFetchMore={loadMore}
|
||||
onSubmit={variants =>
|
||||
orderLinesAdd.mutate({
|
||||
id,
|
||||
input: variants.map(variant => ({
|
||||
quantity: 1,
|
||||
variantId: variant.id
|
||||
}))
|
||||
})
|
||||
}
|
||||
/>
|
||||
<OrderMarkAsPaidDialog
|
||||
confirmButtonState={
|
||||
orderPaymentMarkAsPaid.opts.status
|
||||
}
|
||||
errors={
|
||||
orderPaymentMarkAsPaid.opts.data?.orderMarkAsPaid
|
||||
.errors || []
|
||||
}
|
||||
onClose={closeModal}
|
||||
onConfirm={() =>
|
||||
orderPaymentMarkAsPaid.mutate({
|
||||
id,
|
||||
transactionReference
|
||||
})
|
||||
}
|
||||
open={params.action === "mark-paid"}
|
||||
transactionReference={transactionReference}
|
||||
handleTransactionReference={({ target }) =>
|
||||
setTransactionReference(target.value)
|
||||
}
|
||||
/>
|
||||
<OrderPaymentVoidDialog
|
||||
confirmButtonState={orderVoid.opts.status}
|
||||
errors={orderVoid.opts.data?.orderVoid.errors || []}
|
||||
open={params.action === "void"}
|
||||
onClose={closeModal}
|
||||
onConfirm={() => orderVoid.mutate({ id })}
|
||||
/>
|
||||
<OrderPaymentDialog
|
||||
confirmButtonState={orderPaymentCapture.opts.status}
|
||||
errors={
|
||||
orderPaymentCapture.opts.data?.orderCapture
|
||||
.errors || []
|
||||
}
|
||||
initial={order?.total.gross.amount}
|
||||
open={params.action === "capture"}
|
||||
onClose={closeModal}
|
||||
onSubmit={variables =>
|
||||
orderPaymentCapture.mutate({
|
||||
...variables,
|
||||
id
|
||||
})
|
||||
}
|
||||
/>
|
||||
<OrderFulfillmentCancelDialog
|
||||
confirmButtonState={
|
||||
orderFulfillmentCancel.opts.status
|
||||
}
|
||||
errors={
|
||||
orderFulfillmentCancel.opts.data
|
||||
?.orderFulfillmentCancel.errors || []
|
||||
}
|
||||
open={params.action === "cancel-fulfillment"}
|
||||
warehouses={
|
||||
warehouses.data?.warehouses.edges.map(
|
||||
edge => edge.node
|
||||
) || []
|
||||
}
|
||||
onConfirm={variables =>
|
||||
orderFulfillmentCancel.mutate({
|
||||
id: params.id,
|
||||
input: variables
|
||||
})
|
||||
}
|
||||
onClose={closeModal}
|
||||
/>
|
||||
<OrderFulfillmentTrackingDialog
|
||||
confirmButtonState={
|
||||
orderFulfillmentUpdateTracking.opts.status
|
||||
}
|
||||
errors={
|
||||
orderFulfillmentUpdateTracking.opts.data
|
||||
?.orderFulfillmentUpdateTracking.errors || []
|
||||
}
|
||||
open={params.action === "edit-fulfillment"}
|
||||
trackingNumber={getStringOrPlaceholder(
|
||||
data?.order?.fulfillments.find(
|
||||
fulfillment => fulfillment.id === params.id
|
||||
)?.trackingNumber
|
||||
)}
|
||||
onConfirm={variables =>
|
||||
orderFulfillmentUpdateTracking.mutate({
|
||||
id: params.id,
|
||||
input: {
|
||||
...variables,
|
||||
notifyCustomer: true
|
||||
}
|
||||
})
|
||||
}
|
||||
onClose={closeModal}
|
||||
/>
|
||||
<OrderInvoiceEmailSendDialog
|
||||
confirmButtonState={orderInvoiceSend.opts.status}
|
||||
errors={
|
||||
orderInvoiceSend.opts.data?.invoiceSendEmail
|
||||
.errors || []
|
||||
}
|
||||
open={params.action === "invoice-send"}
|
||||
invoice={order?.invoices?.find(
|
||||
invoice => invoice.id === params.id
|
||||
)}
|
||||
onClose={closeModal}
|
||||
onSend={() =>
|
||||
orderInvoiceSend.mutate({ id: params.id })
|
||||
}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
<OrderAddressFields
|
||||
isDraft={order?.status === OrderStatus.DRAFT}
|
||||
orderUpdate={orderUpdate}
|
||||
|
|
|
|||
Loading…
Reference in a new issue