djkato/saleor-dashboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix shipping forms save button disabled state (#855)

Browse source 
* fix shipping forms save button disabled state

* update defaultMessages
This commit is contained in:
AlicjaSzu 2020-11-24 14:17:03 +01:00 committed by GitHub
parent 101e2c7cdc
commit 51548af8d3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 60 additions and 47 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
locale/defaultMessages.json
View file

@ -5283,6 +5283,10 @@
"src_dot_shipping_dot_components_dot_ShippingZonesList_dot_655374584": { "src_dot_shipping_dot_components_dot_ShippingZonesList_dot_655374584": {
"string": "No shipping zones found" "string": "No shipping zones found"
}, },
"src_dot_shipping_dot_invalid": {
"context": "error message",
"string": "Value is invalid"
},
"src_dot_shipping_dot_price": { "src_dot_shipping_dot_price": {
"context": "error message", "context": "error message",
"string": "Maximum price cannot be lower than minimum" "string": "Maximum price cannot be lower than minimum"

1
src/shipping/components/OrderValue/OrderValue.tsx
View file

@ -164,6 +164,7 @@ export const OrderValue: React.FC<OrderValueProps> = ({
})} })}
name={`maxValue:${channel.name}`} name={`maxValue:${channel.name}`}
value={channel.maxValue} value={channel.maxValue}
InputProps={{ inputProps: { min: channel.minValue } }}
onChange={e => onChange={e =>
onChannelsChange(channel.id, { onChannelsChange(channel.id, {
...channel, ...channel,

8
src/shipping/components/OrderWeight/OrderWeight.tsx
View file

@ -74,13 +74,18 @@ export const OrderWeight: React.FC<OrderWeightProps> = ({
formErrors.minimumOrderWeight, formErrors.minimumOrderWeight,
intl intl
)} )}
error={!!formErrors.maximumOrderWeight} error={!!formErrors.minimumOrderWeight}
fullWidth fullWidth
label={intl.formatMessage({ label={intl.formatMessage({
defaultMessage: "Min. Order Weight" defaultMessage: "Min. Order Weight"
})} })}
name="minValue" name="minValue"
type="number" type="number"
inputProps={{
min: 0,
type: "number"
}}
InputProps={{ inputProps: { min: 0 } }}
value={minValue} value={minValue}
onChange={onChange} onChange={onChange}
/> />
@ -97,6 +102,7 @@ export const OrderWeight: React.FC<OrderWeightProps> = ({
})} })}
name="maxValue" name="maxValue"
type="number" type="number"
InputProps={{ inputProps: { min: minValue } }}
value={maxValue} value={maxValue}
onChange={onChange} onChange={onChange}
/> />

12
src/shipping/components/ShippingZoneRatesPage/ShippingZoneRatesPage.tsx
View file

@ -64,6 +64,7 @@ export const ShippingZoneRatesPage: React.FC<ShippingZoneRatesPageProps> = ({
variant variant
}) => { }) => {
const intl = useIntl(); const intl = useIntl();
const isPriceVariant = variant === ShippingMethodTypeEnum.PRICE;
const initialForm: FormData = { const initialForm: FormData = {
channelListings: shippingChannels, channelListings: shippingChannels,
maxValue: rate?.maximumOrderWeight?.value.toString() || "", maxValue: rate?.maximumOrderWeight?.value.toString() || "",
@ -81,11 +82,8 @@ export const ShippingZoneRatesPage: React.FC<ShippingZoneRatesPageProps> = ({
onChannelsChange, onChannelsChange,
triggerChange triggerChange
); );
const formDisabled = data.channelListings?.some( const formDisabled = data.channelListings?.some(channel =>
channel => validatePrice(channel.price)
validatePrice(channel.minValue) ||
validatePrice(channel.maxValue) ||
validatePrice(channel.price)
); );
return ( return (
@ -96,7 +94,7 @@ export const ShippingZoneRatesPage: React.FC<ShippingZoneRatesPageProps> = ({
<PageHeader <PageHeader
title={ title={
rate?.name || rate?.name ||
(variant === ShippingMethodTypeEnum.PRICE (isPriceVariant
? intl.formatMessage({ ? intl.formatMessage({
defaultMessage: "Price Rate Create", defaultMessage: "Price Rate Create",
description: "page title" description: "page title"
@ -116,7 +114,7 @@ export const ShippingZoneRatesPage: React.FC<ShippingZoneRatesPageProps> = ({
onChange={change} onChange={change}
/> />
<CardSpacer /> <CardSpacer />
{variant === ShippingMethodTypeEnum.PRICE ? ( {isPriceVariant ? (
<OrderValue <OrderValue
channels={data.channelListings} channels={data.channelListings}
errors={channelErrors} errors={channelErrors}

6
src/shipping/errors.ts
View file

@ -4,6 +4,10 @@ import getShippingErrorMessage from "@saleor/utils/errors/shipping";
import { defineMessages, IntlShape } from "react-intl"; import { defineMessages, IntlShape } from "react-intl";
const messages = defineMessages({ const messages = defineMessages({
invalid: {
defaultMessage: "Value is invalid",
description: "error message"
},
price: { price: {
defaultMessage: "Maximum price cannot be lower than minimum", defaultMessage: "Maximum price cannot be lower than minimum",
description: "error message" description: "error message"
@ -33,6 +37,8 @@ export function getShippingWeightRateErrorMessage(
switch (err?.code) { switch (err?.code) {
case ShippingErrorCode.MAX_LESS_THAN_MIN: case ShippingErrorCode.MAX_LESS_THAN_MIN:
return intl.formatMessage(messages.weight); return intl.formatMessage(messages.weight);
case ShippingErrorCode.INVALID:
return intl.formatMessage(messages.invalid);
default: default:
getShippingErrorMessage(err, intl); getShippingErrorMessage(err, intl);
} }

14
src/shipping/views/PriceRatesCreate/PriceRatesCreate.tsx
View file

@ -5,7 +5,7 @@ import { WindowTitle } from "@saleor/components/WindowTitle";
import useChannels from "@saleor/hooks/useChannels"; import useChannels from "@saleor/hooks/useChannels";
import useNavigator from "@saleor/hooks/useNavigator"; import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier"; import useNotifier from "@saleor/hooks/useNotifier";
import { sectionNames } from "@saleor/intl"; import { commonMessages, sectionNames } from "@saleor/intl";
import { FormData } from "@saleor/shipping/components/ShippingZoneRatesPage"; import { FormData } from "@saleor/shipping/components/ShippingZoneRatesPage";
import ShippingZoneRatesPage from "@saleor/shipping/components/ShippingZoneRatesPage"; import ShippingZoneRatesPage from "@saleor/shipping/components/ShippingZoneRatesPage";
import { import {
@ -19,7 +19,6 @@ import {
shippingZoneUrl shippingZoneUrl
} from "@saleor/shipping/urls"; } from "@saleor/shipping/urls";
import { ShippingMethodTypeEnum } from "@saleor/types/globalTypes"; import { ShippingMethodTypeEnum } from "@saleor/types/globalTypes";
import getShippingErrorMessage from "@saleor/utils/errors/shipping";
import React from "react"; import React from "react";
import { useIntl } from "react-intl"; import { useIntl } from "react-intl";
@ -41,6 +40,10 @@ export const PriceRatesCreate: React.FC<PriceRatesCreateProps> = ({ id }) => {
onCompleted: data => { onCompleted: data => {
const errors = data.shippingMethodChannelListingUpdate.errors; const errors = data.shippingMethodChannelListingUpdate.errors;
if (errors.length === 0) { if (errors.length === 0) {
notify({
status: "success",
text: intl.formatMessage(commonMessages.savedChanges)
});
navigate( navigate(
shippingPriceRatesEditUrl( shippingPriceRatesEditUrl(
id, id,
@ -83,13 +86,6 @@ export const PriceRatesCreate: React.FC<PriceRatesCreateProps> = ({ id }) => {
data.channelListings data.channelListings
) )
}); });
} else {
errors.map(err =>
notify({
status: "error",
text: getShippingErrorMessage(err, intl)
})
);
} }
}; };
const handleBack = () => navigate(shippingZoneUrl(id)); const handleBack = () => navigate(shippingZoneUrl(id));

8
src/shipping/views/PriceRatesUpdate/PriceRatesUpdate.tsx
View file

@ -26,7 +26,6 @@ import {
import { useShippingZone } from "@saleor/shipping/queries"; import { useShippingZone } from "@saleor/shipping/queries";
import { shippingZoneUrl } from "@saleor/shipping/urls"; import { shippingZoneUrl } from "@saleor/shipping/urls";
import { ShippingMethodTypeEnum } from "@saleor/types/globalTypes"; import { ShippingMethodTypeEnum } from "@saleor/types/globalTypes";
import getShippingErrorMessage from "@saleor/utils/errors/shipping";
import React from "react"; import React from "react";
import { useIntl } from "react-intl"; import { useIntl } from "react-intl";
@ -113,13 +112,6 @@ export const PriceRatesUpdate: React.FC<PriceRatesUpdateProps> = ({
shippingChannels shippingChannels
) )
}); });
} else {
errors.map(err =>
notify({
status: "error",
text: getShippingErrorMessage(err, intl)
})
);
} }
}; };

14
src/shipping/views/WeightRatesCreate/WeightRatesCreate.tsx
View file

@ -8,7 +8,7 @@ import { WindowTitle } from "@saleor/components/WindowTitle";
import useChannels from "@saleor/hooks/useChannels"; import useChannels from "@saleor/hooks/useChannels";
import useNavigator from "@saleor/hooks/useNavigator"; import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier"; import useNotifier from "@saleor/hooks/useNotifier";
import { sectionNames } from "@saleor/intl"; import { commonMessages, sectionNames } from "@saleor/intl";
import { FormData } from "@saleor/shipping/components/ShippingZoneRatesPage"; import { FormData } from "@saleor/shipping/components/ShippingZoneRatesPage";
import ShippingZoneRatesPage from "@saleor/shipping/components/ShippingZoneRatesPage"; import ShippingZoneRatesPage from "@saleor/shipping/components/ShippingZoneRatesPage";
import { import {
@ -22,7 +22,6 @@ import {
shippingZoneUrl shippingZoneUrl
} from "@saleor/shipping/urls"; } from "@saleor/shipping/urls";
import { ShippingMethodTypeEnum } from "@saleor/types/globalTypes"; import { ShippingMethodTypeEnum } from "@saleor/types/globalTypes";
import getShippingErrorMessage from "@saleor/utils/errors/shipping";
import React from "react"; import React from "react";
import { useIntl } from "react-intl"; import { useIntl } from "react-intl";
@ -44,6 +43,10 @@ export const WeightRatesCreate: React.FC<WeightRatesCreateProps> = ({ id }) => {
onCompleted: data => { onCompleted: data => {
const errors = data.shippingMethodChannelListingUpdate.errors; const errors = data.shippingMethodChannelListingUpdate.errors;
if (errors.length === 0) { if (errors.length === 0) {
notify({
status: "success",
text: intl.formatMessage(commonMessages.savedChanges)
});
navigate( navigate(
shippingWeightRatesEditUrl( shippingWeightRatesEditUrl(
id, id,
@ -87,13 +90,6 @@ export const WeightRatesCreate: React.FC<WeightRatesCreateProps> = ({ id }) => {
data.channelListings data.channelListings
) )
}); });
} else {
errors.map(err =>
notify({
status: "error",
text: getShippingErrorMessage(err, intl)
})
);
} }
}; };

8
src/shipping/views/WeightRatesUpdate/WeightRatesUpdate.tsx
View file

@ -26,7 +26,6 @@ import { useShippingMethodChannelListingUpdate } from "@saleor/shipping/mutation
import { useShippingZone } from "@saleor/shipping/queries"; import { useShippingZone } from "@saleor/shipping/queries";
import { shippingZoneUrl } from "@saleor/shipping/urls"; import { shippingZoneUrl } from "@saleor/shipping/urls";
import { ShippingMethodTypeEnum } from "@saleor/types/globalTypes"; import { ShippingMethodTypeEnum } from "@saleor/types/globalTypes";
import getShippingErrorMessage from "@saleor/utils/errors/shipping";
import React from "react"; import React from "react";
import { useIntl } from "react-intl"; import { useIntl } from "react-intl";
@ -113,13 +112,6 @@ export const WeightRatesUpdate: React.FC<WeightRatesUpdateProps> = ({
shippingChannels shippingChannels
) )
}); });
} else {
errors.map(err =>
notify({
status: "error",
text: getShippingErrorMessage(err, intl)
})
);
} }
}; };

32
src/storybook/__snapshots__/Stories.test.ts.snap
View file

@ -12425,7 +12425,7 @@ exports[`Storyshots Shipping / Order value rates default 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
min="0" min="1"
name="maxValue:Channel USD" name="maxValue:Channel USD"
type="number" type="number"
value="2" value="2"
@ -12671,7 +12671,7 @@ exports[`Storyshots Shipping / Order value rates loading 1`] = `
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
disabled="" disabled=""
min="0" min="1"
name="maxValue:Channel USD" name="maxValue:Channel USD"
type="number" type="number"
value="2" value="2"
@ -12802,6 +12802,7 @@ exports[`Storyshots Shipping / Order weight rates default 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
min="0"
name="minValue" name="minValue"
type="number" type="number"
value="1" value="1"
@ -12837,6 +12838,7 @@ exports[`Storyshots Shipping / Order weight rates default 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
min="1"
name="maxValue" name="maxValue"
type="number" type="number"
value="2" value="2"
@ -12954,6 +12956,7 @@ exports[`Storyshots Shipping / Order weight rates form errors 1`] = `
<input <input
aria-invalid="true" aria-invalid="true"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
min="0"
name="minValue" name="minValue"
type="number" type="number"
value="1" value="1"
@ -12973,6 +12976,11 @@ exports[`Storyshots Shipping / Order weight rates form errors 1`] = `
</legend> </legend>
</fieldset> </fieldset>
</div> </div>
<p
class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
>
Value is invalid
</p>
</div> </div>
<div <div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id" class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
@ -12989,6 +12997,7 @@ exports[`Storyshots Shipping / Order weight rates form errors 1`] = `
<input <input
aria-invalid="true" aria-invalid="true"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
min="1"
name="maxValue" name="maxValue"
type="number" type="number"
value="2" value="2"
@ -13008,6 +13017,11 @@ exports[`Storyshots Shipping / Order weight rates form errors 1`] = `
</legend> </legend>
</fieldset> </fieldset>
</div> </div>
<p
class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
>
Value is invalid
</p>
</div> </div>
</div> </div>
</div> </div>
@ -13109,6 +13123,7 @@ exports[`Storyshots Shipping / Order weight rates loading 1`] = `
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
min="0"
name="minValue" name="minValue"
type="number" type="number"
value="1" value="1"
@ -13145,6 +13160,7 @@ exports[`Storyshots Shipping / Order weight rates loading 1`] = `
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
min="1"
name="maxValue" name="maxValue"
type="number" type="number"
value="2" value="2"
@ -13262,6 +13278,7 @@ exports[`Storyshots Shipping / Order weight rates new 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
min="0"
name="minValue" name="minValue"
type="number" type="number"
value="" value=""
@ -13297,6 +13314,7 @@ exports[`Storyshots Shipping / Order weight rates new 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
min=""
name="maxValue" name="maxValue"
type="number" type="number"
value="" value=""
@ -13898,7 +13916,7 @@ exports[`Storyshots Shipping / ShippingZoneRates page default price 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
min="0" min=""
name="maxValue:channel" name="maxValue:channel"
type="number" type="number"
value="" value=""
@ -14326,6 +14344,7 @@ exports[`Storyshots Shipping / ShippingZoneRates page default weight 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
min="0"
name="minValue" name="minValue"
type="number" type="number"
value="" value=""
@ -14361,6 +14380,7 @@ exports[`Storyshots Shipping / ShippingZoneRates page default weight 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
min=""
name="maxValue" name="maxValue"
type="number" type="number"
value="" value=""
@ -14891,7 +14911,7 @@ exports[`Storyshots Shipping / ShippingZoneRates page loading 1`] = `
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
disabled="" disabled=""
min="0" min=""
name="maxValue:channel" name="maxValue:channel"
type="number" type="number"
value="" value=""
@ -15542,7 +15562,7 @@ exports[`Storyshots Shipping / ShippingZoneRates page update price 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
min="0" min="1"
name="maxValue:test" name="maxValue:test"
type="number" type="number"
value="20" value="20"
@ -16054,6 +16074,7 @@ exports[`Storyshots Shipping / ShippingZoneRates page update weight 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
min="0"
name="minValue" name="minValue"
type="number" type="number"
value="0" value="0"
@ -16089,6 +16110,7 @@ exports[`Storyshots Shipping / ShippingZoneRates page update weight 1`] = `
<input <input
aria-invalid="false" aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
min="0"
name="maxValue" name="maxValue"
type="number" type="number"
value="80" value="80"