diff --git a/src/discounts/components/DiscountDates/DiscountDates.tsx b/src/discounts/components/DiscountDates/DiscountDates.tsx index 3437f82cf..734a24773 100644 --- a/src/discounts/components/DiscountDates/DiscountDates.tsx +++ b/src/discounts/components/DiscountDates/DiscountDates.tsx @@ -8,8 +8,9 @@ import CardTitle from "@saleor/components/CardTitle"; import { ControlledCheckbox } from "@saleor/components/ControlledCheckbox"; import Grid from "@saleor/components/Grid"; import { commonMessages } from "@saleor/intl"; -import { getFieldError } from "@saleor/utils/errors"; -import { UserError } from "../../../types"; +import { getFormErrors } from "@saleor/utils/errors"; +import getDiscountErrorMessage from "@saleor/utils/errors/discounts"; +import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment"; interface DiscountDatesProps { data: { @@ -21,7 +22,7 @@ interface DiscountDatesProps { }; defaultCurrency: string; disabled: boolean; - errors: UserError[]; + errors: DiscountErrorFragment[]; onChange: (event: React.ChangeEvent) => void; } @@ -33,6 +34,8 @@ const DiscountDates = ({ }: DiscountDatesProps) => { const intl = useIntl(); + const formErrors = getFormErrors(["startDate", "endDate"], errors); + return ( void; onSubmit: (data: FormData) => void; diff --git a/src/discounts/components/SaleDetailsPage/SaleDetailsPage.tsx b/src/discounts/components/SaleDetailsPage/SaleDetailsPage.tsx index 2f8d660e6..d615284bd 100644 --- a/src/discounts/components/SaleDetailsPage/SaleDetailsPage.tsx +++ b/src/discounts/components/SaleDetailsPage/SaleDetailsPage.tsx @@ -11,8 +11,9 @@ import PageHeader from "@saleor/components/PageHeader"; import SaveButtonBar from "@saleor/components/SaveButtonBar"; import { Tab, TabContainer } from "@saleor/components/Tab"; import { sectionNames } from "@saleor/intl"; +import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment"; import { maybe, splitDateTime } from "../../../misc"; -import { ListProps, TabListActions, UserError } from "../../../types"; +import { ListProps, TabListActions } from "../../../types"; import { SaleType as SaleTypeEnum } from "../../../types/globalTypes"; import { SaleDetails_sale } from "../../types/SaleDetails"; import DiscountCategories from "../DiscountCategories"; @@ -55,7 +56,7 @@ export interface SaleDetailsPageProps > { activeTab: SaleDetailsPageTab; defaultCurrency: string; - errors: UserError[]; + errors: DiscountErrorFragment[]; sale: SaleDetails_sale; saveButtonBarState: ConfirmButtonTransitionState; onBack: () => void; diff --git a/src/discounts/components/SaleInfo/SaleInfo.tsx b/src/discounts/components/SaleInfo/SaleInfo.tsx index c1047cca2..90908fd10 100644 --- a/src/discounts/components/SaleInfo/SaleInfo.tsx +++ b/src/discounts/components/SaleInfo/SaleInfo.tsx @@ -6,14 +6,15 @@ import { useIntl } from "react-intl"; import CardTitle from "@saleor/components/CardTitle"; import { commonMessages } from "@saleor/intl"; -import { UserError } from "@saleor/types"; -import { getFieldError } from "@saleor/utils/errors"; +import { getFormErrors } from "@saleor/utils/errors"; +import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment"; +import getDiscountErrorMessage from "@saleor/utils/errors/discounts"; import { FormData } from "../SaleDetailsPage"; export interface SaleInfoProps { data: FormData; disabled: boolean; - errors: UserError[]; + errors: DiscountErrorFragment[]; onChange: (event: React.ChangeEvent) => void; } @@ -25,6 +26,8 @@ const SaleInfo: React.FC = ({ }) => { const intl = useIntl(); + const formErrors = getFormErrors(["name"], errors); + return ( = ({ = ({ }) => { const intl = useIntl(); + const formErrors = getFormErrors(["value"], errors); + return ( = ({ defaultMessage: "Discount Value", description: "sale discount" })} - error={!!getFieldError(errors, "value")} + error={!!formErrors.value} name="value" InputProps={{ endAdornment: data.type === SaleType.FIXED ? currencySymbol : "%" }} - helperText={getFieldError(errors, "value")?.message} + helperText={getDiscountErrorMessage(formErrors.value, intl)} value={data.value} onChange={onChange} /> diff --git a/src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx b/src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx index 83a3c4958..fb09430bf 100644 --- a/src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx +++ b/src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx @@ -10,7 +10,7 @@ import Grid from "@saleor/components/Grid"; import PageHeader from "@saleor/components/PageHeader"; import SaveButtonBar from "@saleor/components/SaveButtonBar"; import { sectionNames } from "@saleor/intl"; -import { UserError } from "../../../types"; +import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment"; import { DiscountValueTypeEnum, VoucherTypeEnum @@ -21,8 +21,8 @@ import VoucherInfo from "../VoucherInfo"; import VoucherLimits from "../VoucherLimits"; import VoucherRequirements from "../VoucherRequirements"; import VoucherTypes from "../VoucherTypes"; - import VoucherValue from "../VoucherValue"; + export interface FormData { applyOncePerCustomer: boolean; applyOncePerOrder: boolean; @@ -45,7 +45,7 @@ export interface FormData { export interface VoucherCreatePageProps { defaultCurrency: string; disabled: boolean; - errors: UserError[]; + errors: DiscountErrorFragment[]; saveButtonBarState: ConfirmButtonTransitionState; onBack: () => void; onSubmit: (data: FormData) => void; diff --git a/src/discounts/components/VoucherDates/VoucherDates.tsx b/src/discounts/components/VoucherDates/VoucherDates.tsx index f687e357a..3f94dfa76 100644 --- a/src/discounts/components/VoucherDates/VoucherDates.tsx +++ b/src/discounts/components/VoucherDates/VoucherDates.tsx @@ -8,15 +8,16 @@ import CardTitle from "@saleor/components/CardTitle"; import { ControlledCheckbox } from "@saleor/components/ControlledCheckbox"; import Grid from "@saleor/components/Grid"; import { commonMessages } from "@saleor/intl"; -import { getFieldError } from "@saleor/utils/errors"; -import { UserError } from "../../../types"; +import { getFormErrors } from "@saleor/utils/errors"; +import getDiscountErrorMessage from "@saleor/utils/errors/discounts"; +import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment"; import { FormData } from "../VoucherDetailsPage"; interface VoucherDatesProps { data: FormData; defaultCurrency: string; disabled: boolean; - errors: UserError[]; + errors: DiscountErrorFragment[]; onChange: (event: React.ChangeEvent) => void; } @@ -28,6 +29,8 @@ const VoucherDates = ({ }: VoucherDatesProps) => { const intl = useIntl(); + const formErrors = getFormErrors(["startDate", "endDate"], errors); + return ( { activeTab: VoucherDetailsPageTab; defaultCurrency: string; - errors: UserError[]; + errors: DiscountErrorFragment[]; saveButtonBarState: ConfirmButtonTransitionState; voucher: VoucherDetails_voucher; onBack: () => void; diff --git a/src/discounts/components/VoucherInfo/VoucherInfo.tsx b/src/discounts/components/VoucherInfo/VoucherInfo.tsx index 942b9ca48..0ca4160d3 100644 --- a/src/discounts/components/VoucherInfo/VoucherInfo.tsx +++ b/src/discounts/components/VoucherInfo/VoucherInfo.tsx @@ -7,14 +7,15 @@ import { FormattedMessage, useIntl } from "react-intl"; import Button from "@material-ui/core/Button"; import CardTitle from "@saleor/components/CardTitle"; import { commonMessages } from "@saleor/intl"; -import { getFieldError } from "@saleor/utils/errors"; -import { generateCode } from "../../../misc"; -import { UserError } from "../../../types"; +import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment"; +import { getFormErrors } from "@saleor/utils/errors"; +import getDiscountErrorMessage from "@saleor/utils/errors/discounts"; import { FormData } from "../VoucherDetailsPage"; +import { generateCode } from "../../../misc"; interface VoucherInfoProps { data: FormData; - errors: UserError[]; + errors: DiscountErrorFragment[]; disabled: boolean; variant: "create" | "update"; onChange: (event: any) => void; @@ -29,6 +30,8 @@ const VoucherInfo = ({ }: VoucherInfoProps) => { const intl = useIntl(); + const formErrors = getFormErrors(["code"], errors); + const onGenerateCode = () => onChange({ target: { @@ -55,9 +58,9 @@ const VoucherInfo = ({ ) => void; } @@ -26,6 +27,8 @@ const VoucherLimits = ({ }: VoucherLimitsProps) => { const intl = useIntl(); + const formErrors = getFormErrors(["usageLimit"], errors); + return ( ) => void; } @@ -28,6 +29,11 @@ const VoucherRequirements = ({ }: VoucherRequirementsProps) => { const intl = useIntl(); + const formErrors = getFormErrors( + ["minSpent", "minCheckoutItemsQuantity"], + errors + ); + const minimalOrderValueText = intl.formatMessage({ defaultMessage: "Minimal order value", description: "voucher requirement" @@ -77,8 +83,8 @@ const VoucherRequirements = ({ {data.requirementsPicker === RequirementsPicker.ORDER ? ( ) => void; } @@ -26,6 +27,8 @@ const VoucherTypes = ({ }: VoucherTypesProps) => { const intl = useIntl(); + const formErrors = getFormErrors(["discountType"], errors); + const voucherTypeChoices = [ { label: intl.formatMessage({ @@ -63,8 +66,8 @@ const VoucherTypes = ({ ) => void; @@ -48,6 +49,8 @@ const VoucherValue: React.FC = props => { const classes = useStyles(props); const intl = useIntl(); + const formErrors = getFormErrors(["discountValue", "type"], errors); + const translatedVoucherTypes = translateVoucherTypes(intl); const voucherTypeChoices = Object.values(VoucherType).map(type => ({ label: translatedVoucherTypes[type], @@ -65,7 +68,7 @@ const VoucherValue: React.FC = props => { = props => { name: "discountType" as keyof FormData, values: null }} - helperText={getFieldError(errors, "discountValue")?.message} + helperText={getDiscountErrorMessage(formErrors.discountValue, intl)} name={"value" as keyof FormData} onChange={onChange} label={intl.formatMessage({ @@ -94,8 +97,8 @@ const VoucherValue: React.FC = props => {