108 lines
3 KiB
TypeScript
108 lines
3 KiB
TypeScript
import DialogContentText from "@material-ui/core/DialogContentText";
|
|
import React from "react";
|
|
import { FormattedMessage, IntlShape, useIntl } from "react-intl";
|
|
|
|
import ActionDialog from "@saleor/components/ActionDialog";
|
|
import { ConfirmButtonTransitionState } from "@saleor/components/ConfirmButton";
|
|
|
|
export type OrderDraftFinalizeWarning =
|
|
| "no-shipping"
|
|
| "no-billing"
|
|
| "no-user"
|
|
| "no-shipping-method"
|
|
| "unnecessary-shipping-method";
|
|
|
|
export interface OrderDraftFinalizeDialogProps {
|
|
confirmButtonState: ConfirmButtonTransitionState;
|
|
open: boolean;
|
|
orderNumber: string;
|
|
warnings: OrderDraftFinalizeWarning[];
|
|
onClose: () => void;
|
|
onConfirm: () => void;
|
|
}
|
|
|
|
const warningToText = (warning: OrderDraftFinalizeWarning, intl: IntlShape) => {
|
|
switch (warning) {
|
|
case "no-shipping":
|
|
return intl.formatMessage({
|
|
defaultMessage: "No shipping address"
|
|
});
|
|
case "no-billing":
|
|
return intl.formatMessage({
|
|
defaultMessage: "No billing address"
|
|
});
|
|
case "no-user":
|
|
return intl.formatMessage({
|
|
defaultMessage: "No user information"
|
|
});
|
|
case "no-shipping-method":
|
|
return intl.formatMessage({
|
|
defaultMessage: "Some products require shipping, but no method provided"
|
|
});
|
|
case "unnecessary-shipping-method":
|
|
return intl.formatMessage({
|
|
defaultMessage: "Shipping method provided, but no product requires it"
|
|
});
|
|
}
|
|
};
|
|
|
|
const OrderDraftFinalizeDialog: React.StatelessComponent<
|
|
OrderDraftFinalizeDialogProps
|
|
> = ({
|
|
confirmButtonState,
|
|
open,
|
|
warnings,
|
|
onClose,
|
|
onConfirm,
|
|
orderNumber
|
|
}) => {
|
|
const intl = useIntl();
|
|
|
|
return (
|
|
<ActionDialog
|
|
onClose={onClose}
|
|
onConfirm={onConfirm}
|
|
open={open}
|
|
title={intl.formatMessage({
|
|
defaultMessage: "Finalize Draft Order",
|
|
description: "dialog header"
|
|
})}
|
|
confirmButtonLabel={
|
|
warnings.length > 0
|
|
? intl.formatMessage({
|
|
defaultMessage: "Finalize anyway",
|
|
description: "button"
|
|
})
|
|
: intl.formatMessage({
|
|
defaultMessage: "Finalize",
|
|
description: "button"
|
|
})
|
|
}
|
|
confirmButtonState={confirmButtonState}
|
|
variant={warnings.length > 0 ? "delete" : "default"}
|
|
>
|
|
<DialogContentText component="div">
|
|
{warnings.length > 0 && (
|
|
<>
|
|
<p>
|
|
<FormattedMessage defaultMessage="There are missing or incorrect informations about this order:" />
|
|
</p>
|
|
<ul>
|
|
{warnings.map(warning => (
|
|
<li key={warning}>{warningToText(warning, intl)}</li>
|
|
))}
|
|
</ul>
|
|
</>
|
|
)}
|
|
<FormattedMessage
|
|
defaultMessage="Are you sure you want to finalize draft #{number}?"
|
|
values={{
|
|
orderNumber
|
|
}}
|
|
/>
|
|
</DialogContentText>
|
|
</ActionDialog>
|
|
);
|
|
};
|
|
OrderDraftFinalizeDialog.displayName = "OrderDraftFinalize";
|
|
export default OrderDraftFinalizeDialog;
|