saleor-dashboard/src/discounts/views/VoucherCreate.tsx

89 lines
3 KiB
TypeScript
Raw Normal View History

2019-06-19 14:40:52 +00:00
import * as React from "react";
import { WindowTitle } from "@saleor/components/WindowTitle";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import i18n from "../../i18n";
import { decimal, getMutationState, maybe } from "../../misc";
import {
DiscountValueTypeEnum,
VoucherDiscountValueType,
VoucherTypeEnum
} from "../../types/globalTypes";
import VoucherCreatePage from "../components/VoucherCreatePage";
import { TypedVoucherCreate } from "../mutations";
import { VoucherCreate } from "../types/VoucherCreate";
import { voucherListUrl, voucherUrl } from "../urls";
function discountValueTypeEnum(
type: VoucherDiscountValueType
): DiscountValueTypeEnum {
return type.toString() === DiscountValueTypeEnum.FIXED
? DiscountValueTypeEnum.FIXED
: DiscountValueTypeEnum.PERCENTAGE;
}
export const VoucherDetails: React.StatelessComponent = () => {
const navigate = useNavigator();
const notify = useNotifier();
const shop = useShop();
const handleVoucherCreate = (data: VoucherCreate) => {
if (data.voucherCreate.errors.length === 0) {
notify({
text: i18n.t("Successfully created voucher", {
context: "notification"
})
});
navigate(voucherUrl(data.voucherCreate.voucher.id), true);
}
};
return (
<TypedVoucherCreate onCompleted={handleVoucherCreate}>
{(voucherCreate, voucherCreateOpts) => {
const formTransitionState = getMutationState(
voucherCreateOpts.called,
voucherCreateOpts.loading,
maybe(() => voucherCreateOpts.data.voucherCreate.errors)
);
return (
<>
<WindowTitle title={i18n.t("Vouchers")} />
<VoucherCreatePage
defaultCurrency={maybe(() => shop.defaultCurrency)}
disabled={voucherCreateOpts.loading}
errors={maybe(() => voucherCreateOpts.data.voucherCreate.errors)}
onBack={() => navigate(voucherListUrl())}
onSubmit={formData =>
voucherCreate({
variables: {
input: {
code: formData.code,
discountValue: decimal(formData.value),
discountValueType: discountValueTypeEnum(
formData.discountType
),
endDate:
formData.endDate === "" ? null : formData.endDate,
minAmountSpent: formData.minAmountSpent,
name: formData.name,
startDate:
formData.startDate === "" ? null : formData.startDate,
type: VoucherTypeEnum[formData.type]
}
}
})
}
saveButtonBarState={formTransitionState}
/>
</>
);
}}
</TypedVoucherCreate>
);
};
export default VoucherDetails;