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

ShippingRateInfo component, separate ShippingZoneInfo, cleanups

Browse source
This commit is contained in:
Tomasz Szymanski 2021-01-07 11:52:12 +01:00
parent f502aff8b2
commit e48c025bec
9 changed files with 434 additions and 466 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

58
locale/defaultMessages.json
View file

@ -5380,6 +5380,9 @@
"src_dot_shipping_dot_components_dot_ShippingMethodProducts_dot_4190792473": {
"string": "Actions"
},
"src_dot_shipping_dot_components_dot_ShippingRateInfo_dot_579967655": {
"string": "Shipping rate name"
},
"src_dot_shipping_dot_components_dot_ShippingRateZipCodeRangeRemoveDialog_dot_1083561409": {
"string": "Are you sure you want to remove this ZIP-code rule?"
},
@ -5430,68 +5433,47 @@
"src_dot_shipping_dot_components_dot_ShippingZoneCountriesAssignDialog_dot_3510295703": {
"string": "Search Countries"
},
"src_dot_shipping_dot_components_dot_ShippingZoneCreatePage_dot_3877274856": {
"context": "character limit",
"string": "{numberOfCharacters} of {maxCharacters} characters"
},
"src_dot_shipping_dot_components_dot_ShippingZoneCreatePage_dot_countries": {
"context": "countries",
"context": "country list header",
"string": "Countries"
},
"src_dot_shipping_dot_components_dot_ShippingZoneCreatePage_dot_createZone": {
"context": "header",
"context": "section header",
"string": "Create New Shipping Zone"
},
"src_dot_shipping_dot_components_dot_ShippingZoneCreatePage_dot_defaultZone": {
"context": "default shipping zone",
"string": "This is default shipping zone, which means that it covers all of the countries which are not assigned to other shipping zones"
},
"src_dot_shipping_dot_components_dot_ShippingZoneCreatePage_dot_description": {
"context": "description",
"string": "Description"
},
"src_dot_shipping_dot_components_dot_ShippingZoneCreatePage_dot_descriptionMessage": {
"context": "field placeholder",
"string": "Description of a shipping zone."
},
"src_dot_shipping_dot_components_dot_ShippingZoneCreatePage_dot_noCountriesAssigned": {
"context": "no countries assigned to zone",
"string": "Currently, there are no countries assigned to this shipping zone"
},
"src_dot_shipping_dot_components_dot_ShippingZoneCreatePage_dot_shipping": {
"context": "shipping",
"string": "Shipping"
},
"src_dot_shipping_dot_components_dot_ShippingZoneDetailsPage_dot_3877274856": {
"context": "character limit",
"string": "{numberOfCharacters} of {maxCharacters} characters"
},
"src_dot_shipping_dot_components_dot_ShippingZoneDetailsPage_dot_countries": {
"context": "countries",
"context": "country list header",
"string": "Countries"
},
"src_dot_shipping_dot_components_dot_ShippingZoneDetailsPage_dot_defaultZone": {
"context": "default shipping zone",
"string": "This is default shipping zone, which means that it covers all of the countries which are not assigned to other shipping zones"
},
"src_dot_shipping_dot_components_dot_ShippingZoneDetailsPage_dot_description": {
"context": "description",
"string": "Description"
},
"src_dot_shipping_dot_components_dot_ShippingZoneDetailsPage_dot_descriptionMessage": {
"context": "field placeholder",
"string": "Description of a shipping zone."
},
"src_dot_shipping_dot_components_dot_ShippingZoneDetailsPage_dot_noCountriesAssigned": {
"context": "no countries assigned to zone",
"string": "Currently, there are no countries assigned to this shipping zone"
},
"src_dot_shipping_dot_components_dot_ShippingZoneDetailsPage_dot_shipping": {
"context": "shipping",
"context": "shipping section header",
"string": "Shipping"
},
"src_dot_shipping_dot_components_dot_ShippingZoneInfo_dot_579967655": {
"string": "Shipping rate name"
"src_dot_shipping_dot_components_dot_ShippingZoneInfo_dot_1470703814": {
"context": "field placeholder",
"string": "Description of a shipping zone."
},
"src_dot_shipping_dot_components_dot_ShippingZoneInfo_dot_1560416099": {
"string": "Shipping zone name"
},
"src_dot_shipping_dot_components_dot_ShippingZoneInfo_dot_3374163063": {
"string": "Description"
},
"src_dot_shipping_dot_components_dot_ShippingZoneInfo_dot_3877274856": {
"context": "character limit",
"string": "{numberOfCharacters} of {maxCharacters} characters"
},
"src_dot_shipping_dot_components_dot_ShippingZoneRatesCreatePage_dot_1161979494": {
"context": "page title",

52
src/shipping/components/ShippingRateInfo/ShippingRateInfo.tsx Normal file
View file

@ -0,0 +1,52 @@
import Card from "@material-ui/core/Card";
import CardContent from "@material-ui/core/CardContent";
import TextField from "@material-ui/core/TextField";
import CardTitle from "@saleor/components/CardTitle";
import { ShippingErrorFragment } from "@saleor/fragments/types/ShippingErrorFragment";
import { commonMessages } from "@saleor/intl";
import { getFormErrors } from "@saleor/utils/errors";
import getShippingErrorMessage from "@saleor/utils/errors/shipping";
import React from "react";
import { useIntl } from "react-intl";
export interface ShippingRateInfoProps {
data: Record<"name", string>;
disabled: boolean;
errors: ShippingErrorFragment[];
onChange: (event: React.ChangeEvent<any>) => void;
}
const ShippingRateInfo: React.FC<ShippingRateInfoProps> = ({
data,
disabled,
errors,
onChange
}) => {
const intl = useIntl();
const formErrors = getFormErrors(["name"], errors);
return (
<Card>
<CardTitle
title={intl.formatMessage(commonMessages.generalInformations)}
/>
<CardContent>
<TextField
disabled={disabled}
error={!!formErrors.name}
fullWidth
helperText={getShippingErrorMessage(formErrors.name, intl)}
label={intl.formatMessage({
defaultMessage: "Shipping rate name"
})}
name="name"
value={data.name}
onChange={onChange}
/>
</CardContent>
</Card>
);
};
ShippingRateInfo.displayName = "ShippingRateInfo";
export default ShippingRateInfo;

2
src/shipping/components/ShippingRateInfo/index.ts Normal file
View file

@ -0,0 +1,2 @@
export { default } from "./ShippingRateInfo";
export * from "./ShippingRateInfo";

80
src/shipping/components/ShippingZoneCreatePage/ShippingZoneCreatePage.tsx
View file

@ -1,5 +1,3 @@
import makeStyles from "@material-ui/core/styles/makeStyles";
import TextField from "@material-ui/core/TextField";
import AppHeader from "@saleor/components/AppHeader";
import CardSpacer from "@saleor/components/CardSpacer";
import { ConfirmButtonTransitionState } from "@saleor/components/ConfirmButton";
@ -13,7 +11,7 @@ import { CountryFragment } from "@saleor/fragments/types/CountryFragment";
import { ShippingErrorFragment } from "@saleor/fragments/types/ShippingErrorFragment";
import { sectionNames } from "@saleor/intl";
import React from "react";
import { defineMessages, FormattedMessage, useIntl } from "react-intl";
import { defineMessages, useIntl } from "react-intl";
import ShippingZoneCountriesAssignDialog from "../ShippingZoneCountriesAssignDialog";
import ShippingZoneInfo from "../ShippingZoneInfo";
@ -25,53 +23,22 @@ export interface FormData {
name: string;
}
const MAX_DESCRIPTION_LENGTH = 300;
const useStyles = makeStyles(
{
label: {
flex: 1
},
labelContainer: {
"& span": {
paddingRight: 30
},
display: "flex"
}
},
{ name: "ShippingZoneCreatePage" }
);
const messages = defineMessages({
countries: {
defaultMessage: "Countries",
description: "countries"
description: "country list header"
},
createZone: {
defaultMessage: "Create New Shipping Zone",
description: "header"
description: "section header"
},
defaultZone: {
defaultMessage:
"This is default shipping zone, which means that it covers all of the countries which are not assigned to other shipping zones",
description: "default shipping zone"
},
description: {
defaultMessage: "Description",
description: "description"
},
descriptionMessage: {
defaultMessage: "Description of a shipping zone.",
description: "field placeholder"
"This is default shipping zone, which means that it covers all of the countries which are not assigned to other shipping zones"
},
noCountriesAssigned: {
defaultMessage:
"Currently, there are no countries assigned to this shipping zone",
description: "no countries assigned to zone"
},
shipping: {
defaultMessage: "Shipping",
description: "shipping"
"Currently, there are no countries assigned to this shipping zone"
}
});
@ -93,7 +60,6 @@ const ShippingZoneCreatePage: React.FC<ShippingZoneCreatePageProps> = ({
saveButtonBarState
}) => {
const intl = useIntl();
const classes = useStyles({});
const [isModalOpened, setModalStatus] = React.useState(false);
const toggleModal = () => setModalStatus(!isModalOpened);
@ -122,42 +88,6 @@ const ShippingZoneCreatePage: React.FC<ShippingZoneCreatePageProps> = ({
onChange={change}
/>
<CardSpacer />
<TextField
error={data.description.length > MAX_DESCRIPTION_LENGTH}
name={"description"}
label={
<div className={classes.labelContainer}>
<div className={classes.label}>
<FormattedMessage {...messages.description} />
</div>
{data.description?.length > 0 && (
<span>
<FormattedMessage
defaultMessage="{numberOfCharacters} of {maxCharacters} characters"
description="character limit"
values={{
maxCharacters: MAX_DESCRIPTION_LENGTH,
numberOfCharacters: data.description.length
}}
/>
</span>
)}
</div>
}
InputProps={{
inputProps: {
maxLength: MAX_DESCRIPTION_LENGTH
}
}}
value={data.description}
onChange={change}
disabled={disabled}
fullWidth
multiline
placeholder={intl.formatMessage(messages.descriptionMessage)}
rows={10}
/>
<CardSpacer />
<CountryList
countries={data.countries.map(selectedCountry =>
countries.find(country => country.code === selectedCountry)

74
src/shipping/components/ShippingZoneDetailsPage/ShippingZoneDetailsPage.tsx
View file

@ -1,5 +1,3 @@
import makeStyles from "@material-ui/core/styles/makeStyles";
import TextField from "@material-ui/core/TextField";
import AppHeader from "@saleor/components/AppHeader";
import CardSpacer from "@saleor/components/CardSpacer";
import { ConfirmButtonTransitionState } from "@saleor/components/ConfirmButton";
@ -39,49 +37,22 @@ export interface FormData extends MetadataFormData {
warehouses: string[];
}
const MAX_DESCRIPTION_LENGTH = 300;
const useStyles = makeStyles(
{
label: {
flex: 1
},
labelContainer: {
"& span": {
paddingRight: 30
},
display: "flex"
}
},
{ name: "ShippingZoneDetailsPage" }
);
const messages = defineMessages({
countries: {
defaultMessage: "Countries",
description: "countries"
description: "country list header"
},
defaultZone: {
defaultMessage:
"This is default shipping zone, which means that it covers all of the countries which are not assigned to other shipping zones",
description: "default shipping zone"
},
description: {
defaultMessage: "Description",
description: "description"
},
descriptionMessage: {
defaultMessage: "Description of a shipping zone.",
description: "field placeholder"
"This is default shipping zone, which means that it covers all of the countries which are not assigned to other shipping zones"
},
noCountriesAssigned: {
defaultMessage:
"Currently, there are no countries assigned to this shipping zone",
description: "no countries assigned to zone"
"Currently, there are no countries assigned to this shipping zone"
},
shipping: {
defaultMessage: "Shipping",
description: "shipping"
description: "shipping section header"
}
});
@ -140,7 +111,6 @@ const ShippingZoneDetailsPage: React.FC<ShippingZoneDetailsPageProps> = ({
warehouses
}) => {
const intl = useIntl();
const classes = useStyles({});
const initialForm: FormData = {
description: shippingZone?.description || "",
@ -175,7 +145,6 @@ const ShippingZoneDetailsPage: React.FC<ShippingZoneDetailsPageProps> = ({
);
const changeMetadata = makeMetadataChangeHandler(change);
const description = data.description;
return (
<Container>
@ -246,41 +215,6 @@ const ShippingZoneDetailsPage: React.FC<ShippingZoneDetailsPageProps> = ({
warehouses={warehouseChoices}
/>
</div>
<TextField
error={description.length > MAX_DESCRIPTION_LENGTH}
name={"description"}
label={
<div className={classes.labelContainer}>
<div className={classes.label}>
<FormattedMessage {...messages.description} />
</div>
{description?.length > 0 && (
<span>
<FormattedMessage
defaultMessage="{numberOfCharacters} of {maxCharacters} characters"
description="character limit"
values={{
maxCharacters: MAX_DESCRIPTION_LENGTH,
numberOfCharacters: description.length
}}
/>
</span>
)}
</div>
}
InputProps={{
inputProps: {
maxLength: MAX_DESCRIPTION_LENGTH
}
}}
value={description}
onChange={change}
disabled={loading || disabled}
fullWidth
multiline
placeholder={intl.formatMessage(messages.descriptionMessage)}
rows={10}
/>
</Grid>
<SaveButtonBar
disabled={disabled || !hasChanged}

65
src/shipping/components/ShippingZoneInfo/ShippingZoneInfo.tsx
View file

@ -1,21 +1,40 @@
import Card from "@material-ui/core/Card";
import CardContent from "@material-ui/core/CardContent";
import makeStyles from "@material-ui/core/styles/makeStyles";
import TextField from "@material-ui/core/TextField";
import CardSpacer from "@saleor/components/CardSpacer";
import CardTitle from "@saleor/components/CardTitle";
import { ShippingErrorFragment } from "@saleor/fragments/types/ShippingErrorFragment";
import { commonMessages } from "@saleor/intl";
import { getFormErrors } from "@saleor/utils/errors";
import getShippingErrorMessage from "@saleor/utils/errors/shipping";
import React from "react";
import { useIntl } from "react-intl";
import { FormattedMessage, useIntl } from "react-intl";
export interface ShippingZoneInfoProps {
data: Record<"name", string>;
data: Record<"name" | "description", string>;
disabled: boolean;
errors: ShippingErrorFragment[];
onChange: (event: React.ChangeEvent<any>) => void;
}
const useStyles = makeStyles(
{
label: {
flex: 1
},
labelContainer: {
"& span": {
paddingRight: 30
},
display: "flex"
}
},
{ name: "ShippingZoneCreatePage" }
);
const MAX_DESCRIPTION_LENGTH = 300;
const ShippingZoneInfo: React.FC<ShippingZoneInfoProps> = ({
data,
disabled,
@ -23,6 +42,7 @@ const ShippingZoneInfo: React.FC<ShippingZoneInfoProps> = ({
onChange
}) => {
const intl = useIntl();
const classes = useStyles({});
const formErrors = getFormErrors(["name"], errors);
@ -38,12 +58,51 @@ const ShippingZoneInfo: React.FC<ShippingZoneInfoProps> = ({
fullWidth
helperText={getShippingErrorMessage(formErrors.name, intl)}
label={intl.formatMessage({
defaultMessage: "Shipping rate name"
defaultMessage: "Shipping zone name"
})}
name="name"
value={data.name}
onChange={onChange}
/>
<CardSpacer />
<TextField
error={data.description.length > MAX_DESCRIPTION_LENGTH}
name={"description"}
label={
<div className={classes.labelContainer}>
<div className={classes.label}>
<FormattedMessage defaultMessage="Description" />
</div>
{data.description?.length > 0 && (
<span>
<FormattedMessage
defaultMessage="{numberOfCharacters} of {maxCharacters} characters"
description="character limit"
values={{
maxCharacters: MAX_DESCRIPTION_LENGTH,
numberOfCharacters: data.description.length
}}
/>
</span>
)}
</div>
}
InputProps={{
inputProps: {
maxLength: MAX_DESCRIPTION_LENGTH
}
}}
value={data.description}
onChange={onChange}
disabled={disabled}
fullWidth
multiline
placeholder={intl.formatMessage({
defaultMessage: "Description of a shipping zone.",
description: "field placeholder"
})}
rows={10}
/>
</CardContent>
</Card>
);

4
src/shipping/components/ShippingZoneRatesCreatePage/ShippingZoneRatesCreatePage.tsx
View file

@ -15,7 +15,7 @@ import { validatePrice } from "@saleor/products/utils/validation";
import OrderValue from "@saleor/shipping/components/OrderValue";
import OrderWeight from "@saleor/shipping/components/OrderWeight";
import PricingCard from "@saleor/shipping/components/PricingCard";
import ShippingZoneInfo from "@saleor/shipping/components/ShippingZoneInfo";
import ShippingRateInfo from "@saleor/shipping/components/ShippingRateInfo";
import { createChannelsChangeHandler } from "@saleor/shipping/handlers";
import { ShippingMethodTypeEnum } from "@saleor/types/globalTypes";
import React from "react";
@ -116,7 +116,7 @@ export const ShippingZoneRatesCreatePage: React.FC<ShippingZoneRatesCreatePagePr
/>
<Grid>
<div>
<ShippingZoneInfo
<ShippingRateInfo
data={data}
disabled={disabled}
errors={errors}

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

@ -17,7 +17,7 @@ import OrderValue from "@saleor/shipping/components/OrderValue";
import OrderWeight from "@saleor/shipping/components/OrderWeight";
import PricingCard from "@saleor/shipping/components/PricingCard";
import ShippingMethodProducts from "@saleor/shipping/components/ShippingMethodProducts";
import ShippingZoneInfo from "@saleor/shipping/components/ShippingZoneInfo";
import ShippingRateInfo from "@saleor/shipping/components/ShippingRateInfo";
import { createChannelsChangeHandler } from "@saleor/shipping/handlers";
import { ShippingZone_shippingZone_shippingMethods } from "@saleor/shipping/types/ShippingZone";
import { ListActions, ListProps } from "@saleor/types";
@ -124,7 +124,7 @@ export const ShippingZoneRatesPage: React.FC<ShippingZoneRatesPageProps> = ({
<PageHeader title={rate?.name} />
<Grid>
<div>
<ShippingZoneInfo
<ShippingRateInfo
data={data}
disabled={disabled}
errors={errors}

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

@ -201865,7 +201865,7 @@ exports[`Storyshots Views / Shipping / Create shipping zone default 1`] = `
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
data-shrink="false"
>
Shipping rate name
Shipping zone name
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
@ -201893,53 +201893,53 @@ exports[`Storyshots Views / Shipping / Create shipping zone default 1`] = `
</fieldset>
</div>
</div>
</div>
</div>
<div
class="CardSpacer-spacer-id"
/>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
data-shrink="false"
>
<div
class="ShippingZoneCreatePage-labelContainer-id"
class="CardSpacer-spacer-id"
/>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<div
class="ShippingZoneCreatePage-label-id"
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
data-shrink="false"
>
Description
<div
class="ShippingZoneCreatePage-labelContainer-id"
>
<div
class="ShippingZoneCreatePage-label-id"
>
Description
</div>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
/>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0.01px"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
/>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0.01px"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
<div
@ -202095,7 +202095,7 @@ exports[`Storyshots Views / Shipping / Create shipping zone form errors 1`] = `
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id"
data-shrink="false"
>
Shipping rate name
Shipping zone name
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
@ -202128,53 +202128,53 @@ exports[`Storyshots Views / Shipping / Create shipping zone form errors 1`] = `
Invalid value
</p>
</div>
</div>
</div>
<div
class="CardSpacer-spacer-id"
/>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
data-shrink="false"
>
<div
class="ShippingZoneCreatePage-labelContainer-id"
class="CardSpacer-spacer-id"
/>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<div
class="ShippingZoneCreatePage-label-id"
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
data-shrink="false"
>
Description
<div
class="ShippingZoneCreatePage-labelContainer-id"
>
<div
class="ShippingZoneCreatePage-label-id"
>
Description
</div>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
/>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0.01px"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
/>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0.01px"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
<div
@ -202330,7 +202330,7 @@ exports[`Storyshots Views / Shipping / Create shipping zone loading 1`] = `
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-disabled-id MuiInputLabel-disabled-id"
data-shrink="false"
>
Shipping rate name
Shipping zone name
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
@ -202359,54 +202359,54 @@ exports[`Storyshots Views / Shipping / Create shipping zone loading 1`] = `
</fieldset>
</div>
</div>
</div>
</div>
<div
class="CardSpacer-spacer-id"
/>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-disabled-id MuiInputLabel-disabled-id"
data-shrink="false"
>
<div
class="ShippingZoneCreatePage-labelContainer-id"
class="CardSpacer-spacer-id"
/>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<div
class="ShippingZoneCreatePage-label-id"
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-disabled-id MuiInputLabel-disabled-id"
data-shrink="false"
>
Description
<div
class="ShippingZoneCreatePage-labelContainer-id"
>
<div
class="ShippingZoneCreatePage-label-id"
>
Description
</div>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
disabled=""
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
/>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0.01px"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
disabled=""
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
/>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0.01px"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
<div
@ -208724,7 +208724,7 @@ exports[`Storyshots Views / Shipping / Shipping zone details default 1`] = `
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
data-shrink="true"
>
Shipping rate name
Shipping zone name
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
@ -208752,6 +208752,58 @@ exports[`Storyshots Views / Shipping / Shipping zone details default 1`] = `
</fieldset>
</div>
</div>
<div
class="CardSpacer-spacer-id"
/>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
data-shrink="true"
>
<div
class="ShippingZoneCreatePage-labelContainer-id"
>
<div
class="ShippingZoneCreatePage-label-id"
>
Description
</div>
<span>
25 of 300 characters
</span>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
>
Shipping zone description
</textarea>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
</div>
</div>
<div
@ -209571,55 +209623,6 @@ exports[`Storyshots Views / Shipping / Shipping zone details default 1`] = `
</div>
</div>
</div>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
data-shrink="true"
>
<div
class="ShippingZoneDetailsPage-labelContainer-id"
>
<div
class="ShippingZoneDetailsPage-label-id"
>
Description
</div>
<span>
25 of 300 characters
</span>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
>
Shipping zone description
</textarea>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
</div>
</div>
</form>
@ -209685,7 +209688,7 @@ exports[`Storyshots Views / Shipping / Shipping zone details form errors 1`] = `
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id MuiFormLabel-filled-id"
data-shrink="true"
>
Shipping rate name
Shipping zone name
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
@ -209718,6 +209721,58 @@ exports[`Storyshots Views / Shipping / Shipping zone details form errors 1`] = `
Invalid value
</p>
</div>
<div
class="CardSpacer-spacer-id"
/>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
data-shrink="true"
>
<div
class="ShippingZoneCreatePage-labelContainer-id"
>
<div
class="ShippingZoneCreatePage-label-id"
>
Description
</div>
<span>
25 of 300 characters
</span>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
>
Shipping zone description
</textarea>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
</div>
</div>
<div
@ -210537,55 +210592,6 @@ exports[`Storyshots Views / Shipping / Shipping zone details form errors 1`] = `
</div>
</div>
</div>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
data-shrink="true"
>
<div
class="ShippingZoneDetailsPage-labelContainer-id"
>
<div
class="ShippingZoneDetailsPage-label-id"
>
Description
</div>
<span>
25 of 300 characters
</span>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
>
Shipping zone description
</textarea>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
</div>
</div>
</form>
@ -210656,7 +210662,7 @@ exports[`Storyshots Views / Shipping / Shipping zone details loading 1`] = `
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-disabled-id MuiInputLabel-disabled-id"
data-shrink="false"
>
Shipping rate name
Shipping zone name
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
@ -210685,6 +210691,54 @@ exports[`Storyshots Views / Shipping / Shipping zone details loading 1`] = `
</fieldset>
</div>
</div>
<div
class="CardSpacer-spacer-id"
/>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-disabled-id MuiInputLabel-disabled-id"
data-shrink="false"
>
<div
class="ShippingZoneCreatePage-labelContainer-id"
>
<div
class="ShippingZoneCreatePage-label-id"
>
Description
</div>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
disabled=""
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
/>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0.01px"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
</div>
</div>
<div
@ -211280,51 +211334,6 @@ exports[`Storyshots Views / Shipping / Shipping zone details loading 1`] = `
</div>
</div>
</div>
<div
class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
>
<label
class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-disabled-id MuiInputLabel-disabled-id"
data-shrink="false"
>
<div
class="ShippingZoneDetailsPage-labelContainer-id"
>
<div
class="ShippingZoneDetailsPage-label-id"
>
Description
</div>
</div>
</label>
<div
class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id MuiInputBase-multiline-id MuiOutlinedInput-multiline-id"
>
<textarea
aria-invalid="false"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id MuiInputBase-inputMultiline-id MuiOutlinedInput-inputMultiline-id"
disabled=""
maxlength="300"
name="description"
placeholder="Description of a shipping zone."
rows="10"
/>
<fieldset
aria-hidden="true"
class="PrivateNotchedOutline-root-id MuiOutlinedInput-notchedOutline-id"
style="padding-left:8px"
>
<legend
class="PrivateNotchedOutline-legend-id"
style="width:0.01px"
>
<span>
​
</span>
</legend>
</fieldset>
</div>
</div>
</div>
</div>
</form>