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

Use error codes in product types section

Browse source
This commit is contained in:
dominik-zeglen 2020-03-10 12:38:01 +01:00
parent 2fd7893df5
commit 0f28c8f4f5
22 changed files with 122 additions and 236 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/productTypes/components/AssignAttributeDialog/AssignAttributeDialog.tsx
View file

@ -30,6 +30,8 @@ import useSearchQuery from "@saleor/hooks/useSearchQuery";
import { buttonMessages } from "@saleor/intl";
import { maybe, renderCollection } from "@saleor/misc";
import { FetchMoreProps } from "@saleor/types";
import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
import { getProductErrorMessage } from "@saleor/utils/errors";
import { SearchAttributes_productType_availableAttributes_edges_node } from "../../hooks/useAvailableAttributeSearch/types/SearchAttributes";
const useStyles = makeStyles(
@ -61,7 +63,7 @@ const useStyles = makeStyles(
export interface AssignAttributeDialogProps extends FetchMoreProps {
confirmButtonState: ConfirmButtonTransitionState;
errors: string[];
errors: ProductErrorFragment[];
open: boolean;
attributes: SearchAttributes_productType_availableAttributes_edges_node[];
selected: string[];
@ -188,7 +190,7 @@ const AssignAttributeDialog: React.FC<AssignAttributeDialogProps> = ({
<DialogContent>
{errors.map((error, errorIndex) => (
<DialogContentText color="error" key={errorIndex}>
{error}
{getProductErrorMessage(error, intl)}
</DialogContentText>
))}
</DialogContent>

112
src/productTypes/components/ProductTypeAttributeEditDialog/ProductTypeAttributeEditDialog.tsx
View file

@ -1,112 +0,0 @@
import Button from "@material-ui/core/Button";
import Dialog from "@material-ui/core/Dialog";
import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import DialogTitle from "@material-ui/core/DialogTitle";
import TextField from "@material-ui/core/TextField";
import React from "react";
import { FormattedMessage, useIntl } from "react-intl";
import Form from "@saleor/components/Form";
import { FormSpacer } from "@saleor/components/FormSpacer";
import ListField from "@saleor/components/ListField";
import { buttonMessages } from "@saleor/intl";
import { UserError } from "@saleor/types";
import { getFieldError } from "@saleor/utils/errors";
export interface FormData {
name: string;
values: Array<{
label: string;
value: string;
}>;
}
export interface ProductTypeAttributeEditDialogProps {
disabled: boolean;
errors: UserError[];
name: string;
opened: boolean;
title: string;
values: Array<{
label: string;
value: string;
}>;
onClose: () => void;
onConfirm: (data: FormData) => void;
}
const ProductTypeAttributeEditDialog: React.FC<ProductTypeAttributeEditDialogProps> = ({
disabled,
errors,
name,
opened,
title,
values,
onClose,
onConfirm
}) => {
const intl = useIntl();
const initialForm: FormData = {
name: name || "",
values: values || []
};
return (
<Dialog onClose={onClose} open={opened}>
<Form initial={initialForm} onSubmit={onConfirm}>
{({ change, data }) => (
<>
<DialogTitle>{title}</DialogTitle>
<DialogContent>
<TextField
disabled={disabled}
error={!!getFieldError(errors, "name")}
fullWidth
label={intl.formatMessage({
defaultMessage: "Attribute name"
})}
helperText={getFieldError(errors, "name")?.message}
name="name"
value={data.name}
onChange={change}
/>
<FormSpacer />
<ListField
autoComplete="off"
disabled={disabled}
error={
!!getFieldError(errors, "values") ||
!!getFieldError(errors, "addValues") ||
!!getFieldError(errors, "removeValues")
}
fullWidth
name="values"
label={intl.formatMessage({
defaultMessage: "Attribute values"
})}
helperText={
getFieldError(errors, "values") ||
getFieldError(errors, "addValues") ||
getFieldError(errors, "removeValues")
}
values={data.values}
onChange={change}
/>
</DialogContent>
<DialogActions>
<Button onClick={onClose}>
<FormattedMessage {...buttonMessages.back} />
</Button>
<Button color="primary" variant="contained" type="submit">
<FormattedMessage {...buttonMessages.confirm} />
</Button>
</DialogActions>
</>
)}
</Form>
</Dialog>
);
};
ProductTypeAttributeEditDialog.displayName = "ProductTypeAttributeEditDialog";
export default ProductTypeAttributeEditDialog;

2
src/productTypes/components/ProductTypeAttributeEditDialog/index.ts
View file

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

5
src/productTypes/components/ProductTypeCreatePage/ProductTypeCreatePage.tsx
View file

@ -13,8 +13,8 @@ import { ChangeEvent, FormChange } from "@saleor/hooks/useForm";
import useStateFromProps from "@saleor/hooks/useStateFromProps";
import { sectionNames } from "@saleor/intl";
import { ProductTypeDetails_taxTypes } from "@saleor/productTypes/types/ProductTypeDetails";
import { UserError } from "@saleor/types";
import { WeightUnitsEnum } from "@saleor/types/globalTypes";
import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
import ProductTypeDetails from "../ProductTypeDetails/ProductTypeDetails";
import ProductTypeShipping from "../ProductTypeShipping/ProductTypeShipping";
import ProductTypeTaxes from "../ProductTypeTaxes/ProductTypeTaxes";
@ -27,7 +27,7 @@ export interface ProductTypeForm {
}
export interface ProductTypeCreatePageProps {
errors: UserError[];
errors: ProductErrorFragment[];
defaultWeightUnit: WeightUnitsEnum;
disabled: boolean;
pageTitle: string;
@ -106,6 +106,7 @@ const ProductTypeCreatePage: React.FC<ProductTypeCreatePageProps> = ({
disabled={disabled}
data={data}
defaultWeightUnit={defaultWeightUnit}
errors={errors}
onChange={change}
/>
</div>

14
src/productTypes/components/ProductTypeDetails/ProductTypeDetails.tsx
View file

@ -7,8 +7,8 @@ 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 { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
import { getFormErrors, getProductErrorMessage } from "@saleor/utils/errors";
const useStyles = makeStyles(
{
@ -24,16 +24,18 @@ interface ProductTypeDetailsProps {
name: string;
};
disabled: boolean;
errors: UserError[];
errors: ProductErrorFragment[];
onChange: (event: React.ChangeEvent<any>) => void;
}
const ProductTypeDetails: React.FC<ProductTypeDetailsProps> = props => {
const { data, disabled, errors, onChange } = props;
const classes = useStyles(props);
const classes = useStyles(props);
const intl = useIntl();
const formErrors = getFormErrors(["name"], errors);
return (
<Card className={classes.root}>
<CardTitle
@ -42,9 +44,9 @@ const ProductTypeDetails: React.FC<ProductTypeDetailsProps> = props => {
<CardContent>
<TextField
disabled={disabled}
error={!!getFieldError(errors, "name")}
error={!!formErrors.name}
fullWidth
helperText={getFieldError(errors, "name")?.message}
helperText={getProductErrorMessage(formErrors.name, intl)}
label={intl.formatMessage({
defaultMessage: "Product Type Name"
})}

6
src/productTypes/components/ProductTypeDetailsPage/ProductTypeDetailsPage.tsx
View file

@ -14,8 +14,9 @@ import { ChangeEvent, FormChange } from "@saleor/hooks/useForm";
import useStateFromProps from "@saleor/hooks/useStateFromProps";
import { sectionNames } from "@saleor/intl";
import { maybe } from "@saleor/misc";
import { ListActions, ReorderEvent, UserError } from "@saleor/types";
import { ListActions, ReorderEvent } from "@saleor/types";
import { AttributeTypeEnum, WeightUnitsEnum } from "@saleor/types/globalTypes";
import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
import {
ProductTypeDetails_productType,
ProductTypeDetails_taxTypes
@ -41,7 +42,7 @@ export interface ProductTypeForm {
}
export interface ProductTypeDetailsPageProps {
errors: UserError[];
errors: ProductErrorFragment[];
productType: ProductTypeDetails_productType;
defaultWeightUnit: WeightUnitsEnum;
disabled: boolean;
@ -200,6 +201,7 @@ const ProductTypeDetailsPage: React.FC<ProductTypeDetailsPageProps> = ({
disabled={disabled}
data={data}
defaultWeightUnit={defaultWeightUnit}
errors={errors}
onChange={change}
/>
</div>

18
src/productTypes/components/ProductTypeShipping/ProductTypeShipping.tsx
View file

@ -6,6 +6,8 @@ import { useIntl } from "react-intl";
import CardTitle from "@saleor/components/CardTitle";
import { ControlledCheckbox } from "@saleor/components/ControlledCheckbox";
import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
import { getFormErrors, getProductErrorMessage } from "@saleor/utils/errors";
import { WeightUnitsEnum } from "../../../types/globalTypes";
interface ProductTypeShippingProps {
@ -15,6 +17,7 @@ interface ProductTypeShippingProps {
};
defaultWeightUnit: WeightUnitsEnum;
disabled: boolean;
errors: ProductErrorFragment[];
onChange: (event: React.ChangeEvent<any>) => void;
}
@ -22,10 +25,13 @@ const ProductTypeShipping: React.FC<ProductTypeShippingProps> = ({
data,
defaultWeightUnit,
disabled,
errors,
onChange
}) => {
const intl = useIntl();
const formErrors = getFormErrors(["weight"], errors);
return (
<Card>
<CardTitle
@ -48,15 +54,19 @@ const ProductTypeShipping: React.FC<ProductTypeShippingProps> = ({
{data.isShippingRequired && (
<TextField
disabled={disabled}
error={!!formErrors.weight}
InputProps={{ endAdornment: defaultWeightUnit }}
label={intl.formatMessage({
defaultMessage: "Weight"
})}
name="weight"
helperText={intl.formatMessage({
defaultMessage:
"Used to calculate rates for shipping for products of this product type, when specific weight is not given"
})}
helperText={
getProductErrorMessage(formErrors.weight, intl) ||
intl.formatMessage({
defaultMessage:
"Used to calculate rates for shipping for products of this product type, when specific weight is not given"
})
}
type="number"
value={data.weight}
onChange={onChange}

43
src/productTypes/mutations.ts
View file

@ -1,5 +1,6 @@
import gql from "graphql-tag";
import { productErrorFragment } from "@saleor/attributes/mutations";
import { TypedMutation } from "../mutations";
import { productTypeDetailsFragment } from "./queries";
import {
@ -32,11 +33,11 @@ import {
} from "./types/UnassignAttribute";
export const productTypeDeleteMutation = gql`
${productErrorFragment}
mutation ProductTypeDelete($id: ID!) {
productTypeDelete(id: $id) {
errors {
field
message
errors: productErrors {
...ProductErrorFragment
}
productType {
id
@ -50,11 +51,11 @@ export const TypedProductTypeDeleteMutation = TypedMutation<
>(productTypeDeleteMutation);
export const productTypeBulkDeleteMutation = gql`
${productErrorFragment}
mutation ProductTypeBulkDelete($ids: [ID]!) {
productTypeBulkDelete(ids: $ids) {
errors {
field
message
errors: productErrors {
...ProductErrorFragment
}
}
}
@ -65,12 +66,12 @@ export const TypedProductTypeBulkDeleteMutation = TypedMutation<
>(productTypeBulkDeleteMutation);
export const productTypeUpdateMutation = gql`
${productErrorFragment}
${productTypeDetailsFragment}
mutation ProductTypeUpdate($id: ID!, $input: ProductTypeInput!) {
productTypeUpdate(id: $id, input: $input) {
errors {
field
message
errors: productErrors {
...ProductErrorFragment
}
productType {
...ProductTypeDetailsFragment
@ -84,12 +85,12 @@ export const TypedProductTypeUpdateMutation = TypedMutation<
>(productTypeUpdateMutation);
export const assignAttributeMutation = gql`
${productErrorFragment}
${productTypeDetailsFragment}
mutation AssignAttribute($id: ID!, $operations: [AttributeAssignInput!]!) {
attributeAssign(productTypeId: $id, operations: $operations) {
errors {
field
message
errors: productErrors {
...ProductErrorFragment
}
productType {
...ProductTypeDetailsFragment
@ -103,12 +104,12 @@ export const TypedAssignAttributeMutation = TypedMutation<
>(assignAttributeMutation);
export const unassignAttributeMutation = gql`
${productErrorFragment}
${productTypeDetailsFragment}
mutation UnassignAttribute($id: ID!, $ids: [ID]!) {
attributeUnassign(productTypeId: $id, attributeIds: $ids) {
errors {
field
message
errors: productErrors {
...ProductErrorFragment
}
productType {
...ProductTypeDetailsFragment
@ -122,12 +123,12 @@ export const TypedUnassignAttributeMutation = TypedMutation<
>(unassignAttributeMutation);
export const productTypeCreateMutation = gql`
${productErrorFragment}
${productTypeDetailsFragment}
mutation ProductTypeCreate($input: ProductTypeInput!) {
productTypeCreate(input: $input) {
errors {
field
message
errors: productErrors {
...ProductErrorFragment
}
productType {
...ProductTypeDetailsFragment
@ -141,6 +142,7 @@ export const TypedProductTypeCreateMutation = TypedMutation<
>(productTypeCreateMutation);
const productTypeAttributeReorder = gql`
${productErrorFragment}
${productTypeDetailsFragment}
mutation ProductTypeAttributeReorder(
$move: ReorderInput!
@ -152,9 +154,8 @@ const productTypeAttributeReorder = gql`
productTypeId: $productTypeId
type: $type
) {
errors {
field
message
errors: productErrors {
...ProductErrorFragment
}
productType {
...ProductTypeDetailsFragment

6
src/productTypes/types/AssignAttribute.ts
View file

@ -2,16 +2,16 @@
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { AttributeAssignInput } from "./../../types/globalTypes";
import { AttributeAssignInput, ProductErrorCode } from "./../../types/globalTypes";
// ====================================================
// GraphQL mutation operation: AssignAttribute
// ====================================================
export interface AssignAttribute_attributeAssign_errors {
__typename: "Error";
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
message: string | null;
}
export interface AssignAttribute_attributeAssign_productType_taxType {

6
src/productTypes/types/ProductTypeAttributeReorder.ts
View file

@ -2,16 +2,16 @@
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { ReorderInput, AttributeTypeEnum } from "./../../types/globalTypes";
import { ReorderInput, AttributeTypeEnum, ProductErrorCode } from "./../../types/globalTypes";
// ====================================================
// GraphQL mutation operation: ProductTypeAttributeReorder
// ====================================================
export interface ProductTypeAttributeReorder_productTypeReorderAttributes_errors {
__typename: "Error";
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
message: string | null;
}
export interface ProductTypeAttributeReorder_productTypeReorderAttributes_productType_taxType {

6
src/productTypes/types/ProductTypeBulkDelete.ts
View file

@ -2,14 +2,16 @@
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { ProductErrorCode } from "./../../types/globalTypes";
// ====================================================
// GraphQL mutation operation: ProductTypeBulkDelete
// ====================================================
export interface ProductTypeBulkDelete_productTypeBulkDelete_errors {
__typename: "Error";
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
message: string | null;
}
export interface ProductTypeBulkDelete_productTypeBulkDelete {

6
src/productTypes/types/ProductTypeCreate.ts
View file

@ -2,16 +2,16 @@
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { ProductTypeInput } from "./../../types/globalTypes";
import { ProductTypeInput, ProductErrorCode } from "./../../types/globalTypes";
// ====================================================
// GraphQL mutation operation: ProductTypeCreate
// ====================================================
export interface ProductTypeCreate_productTypeCreate_errors {
__typename: "Error";
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
message: string | null;
}
export interface ProductTypeCreate_productTypeCreate_productType_taxType {

6
src/productTypes/types/ProductTypeDelete.ts
View file

@ -2,14 +2,16 @@
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { ProductErrorCode } from "./../../types/globalTypes";
// ====================================================
// GraphQL mutation operation: ProductTypeDelete
// ====================================================
export interface ProductTypeDelete_productTypeDelete_errors {
__typename: "Error";
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
message: string | null;
}
export interface ProductTypeDelete_productTypeDelete_productType {

6
src/productTypes/types/ProductTypeUpdate.ts
View file

@ -2,16 +2,16 @@
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { ProductTypeInput } from "./../../types/globalTypes";
import { ProductTypeInput, ProductErrorCode } from "./../../types/globalTypes";
// ====================================================
// GraphQL mutation operation: ProductTypeUpdate
// ====================================================
export interface ProductTypeUpdate_productTypeUpdate_errors {
__typename: "Error";
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
message: string | null;
}
export interface ProductTypeUpdate_productTypeUpdate_productType_taxType {

6
src/productTypes/types/UnassignAttribute.ts
View file

@ -2,14 +2,16 @@
/* eslint-disable */
// This file was automatically generated and should not be edited.
import { ProductErrorCode } from "./../../types/globalTypes";
// ====================================================
// GraphQL mutation operation: UnassignAttribute
// ====================================================
export interface UnassignAttribute_attributeUnassign_errors {
__typename: "Error";
__typename: "ProductError";
code: ProductErrorCode;
field: string | null;
message: string | null;
}
export interface UnassignAttribute_attributeUnassign_productType_taxType {

7
src/productTypes/views/ProductTypeCreate.tsx
View file

@ -57,10 +57,9 @@ export const ProductTypeCreate: React.FC = () => {
<ProductTypeCreatePage
defaultWeightUnit={maybe(() => data.shop.defaultWeightUnit)}
disabled={loading}
errors={maybe(
() => createProductTypeOpts.data.productTypeCreate.errors,
[]
)}
errors={
createProductTypeOpts.data?.productTypeCreate.errors || []
}
pageTitle={intl.formatMessage({
defaultMessage: "Create Product Type",
description: "header",

21
src/productTypes/views/ProductTypeUpdate/errors.tsx
View file

@ -1,19 +1,19 @@
import React from "react";
import { UserError } from "../../../types";
import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
interface ProductTypeUpdateErrorsState {
addAttributeErrors: UserError[];
editAttributeErrors: UserError[];
formErrors: UserError[];
addAttributeErrors: ProductErrorFragment[];
editAttributeErrors: ProductErrorFragment[];
formErrors: ProductErrorFragment[];
}
interface ProductTypeUpdateErrorsProps {
children: (props: {
errors: ProductTypeUpdateErrorsState;
set: {
addAttributeErrors: (errors: UserError[]) => void;
editAttributeErrors: (errors: UserError[]) => void;
formErrors: (errors: UserError[]) => void;
addAttributeErrors: (errors: ProductErrorFragment[]) => void;
editAttributeErrors: (errors: ProductErrorFragment[]) => void;
formErrors: (errors: ProductErrorFragment[]) => void;
};
}) => React.ReactNode;
}
@ -32,11 +32,12 @@ export class ProductTypeUpdateErrors extends React.Component<
return this.props.children({
errors: this.state,
set: {
addAttributeErrors: (addAttributeErrors: UserError[]) =>
addAttributeErrors: (addAttributeErrors: ProductErrorFragment[]) =>
this.setState({ addAttributeErrors }),
editAttributeErrors: (editAttributeErrors: UserError[]) =>
editAttributeErrors: (editAttributeErrors: ProductErrorFragment[]) =>
this.setState({ editAttributeErrors }),
formErrors: (formErrors: UserError[]) => this.setState({ formErrors })
formErrors: (formErrors: ProductErrorFragment[]) =>
this.setState({ formErrors })
}
});
}

11
src/productTypes/views/ProductTypeUpdate/index.tsx
View file

@ -319,13 +319,10 @@ export const ProductTypeUpdate: React.FC<ProductTypeUpdateProps> = ({
)
)}
confirmButtonState={assignAttribute.opts.status}
errors={maybe(
() =>
assignAttribute.opts.data.attributeAssign.errors.map(
err => err.message
),
[]
)}
errors={
assignAttribute.opts.data?.attributeAssign
.errors || []
}
loading={result.loading}
onClose={closeModal}
onSubmit={handleAssignAttribute}

13
src/storybook/stories/components/AssignAttributeDialog.tsx
View file

@ -6,7 +6,7 @@ import { fetchMoreProps } from "@saleor/fixtures";
import AssignAttributeDialog, {
AssignAttributeDialogProps
} from "@saleor/productTypes/components/AssignAttributeDialog";
import { formError } from "@saleor/storybook/misc";
import { ProductErrorCode } from "@saleor/types/globalTypes";
import Decorator from "../../Decorator";
const props: AssignAttributeDialogProps = {
@ -30,5 +30,14 @@ storiesOf("Generics / Assign attributes dialog", module)
<AssignAttributeDialog {...props} attributes={undefined} loading={true} />
))
.add("errors", () => (
<AssignAttributeDialog {...props} errors={[formError("").message]} />
<AssignAttributeDialog
{...props}
errors={[
{
__typename: "ProductError" as "ProductError",
code: ProductErrorCode.INVALID,
field: null
}
]}
/>
));

38
src/storybook/stories/productTypes/ProductTypeAttributeEditDialog.tsx
View file

@ -1,38 +0,0 @@
import { storiesOf } from "@storybook/react";
import React from "react";
import { formError } from "@saleor/storybook/misc";
import ProductTypeAttributeEditDialog, {
ProductTypeAttributeEditDialogProps
} from "../../../productTypes/components/ProductTypeAttributeEditDialog";
import { attributes } from "../../../productTypes/fixtures";
import Decorator from "../../Decorator";
const attribute = attributes[0];
const props: ProductTypeAttributeEditDialogProps = {
disabled: false,
errors: [],
name: attribute.name,
onClose: () => undefined,
onConfirm: () => undefined,
opened: true,
title: "Add Attribute",
values: attribute.values.map(value => ({
label: value.name,
value: value.id
}))
};
storiesOf("Product types / Edit attribute", module)
.addDecorator(Decorator)
.add("default", () => <ProductTypeAttributeEditDialog {...props} />)
.add("loading", () => (
<ProductTypeAttributeEditDialog {...props} disabled={true} />
))
.add("form errors", () => (
<ProductTypeAttributeEditDialog
{...props}
errors={["name", "values"].map(field => formError(field))}
/>
));

9
src/storybook/stories/productTypes/ProductTypeCreatePage.tsx
View file

@ -2,12 +2,11 @@ import { Omit } from "@material-ui/core";
import { storiesOf } from "@storybook/react";
import React from "react";
import { formError } from "@saleor/storybook/misc";
import ProductTypeCreatePage, {
ProductTypeCreatePageProps,
ProductTypeForm
} from "../../../productTypes/components/ProductTypeCreatePage";
import { WeightUnitsEnum } from "../../../types/globalTypes";
import { WeightUnitsEnum, ProductErrorCode } from "../../../types/globalTypes";
import Decorator from "../../Decorator";
const props: Omit<ProductTypeCreatePageProps, "classes"> = {
@ -30,6 +29,10 @@ storiesOf("Views / Product types / Create product type", module)
.add("form errors", () => (
<ProductTypeCreatePage
{...props}
errors={(["name"] as Array<keyof ProductTypeForm>).map(formError)}
errors={(["name"] as Array<keyof ProductTypeForm>).map(field => ({
__typename: "ProductError",
code: ProductErrorCode.INVALID,
field
}))}
/>
));

11
src/storybook/stories/productTypes/ProductTypeDetailsPage.tsx
View file

@ -3,13 +3,12 @@ import { storiesOf } from "@storybook/react";
import React from "react";
import { listActionsProps } from "@saleor/fixtures";
import { formError } from "@saleor/storybook/misc";
import ProductTypeDetailsPage, {
ProductTypeDetailsPageProps,
ProductTypeForm
} from "../../../productTypes/components/ProductTypeDetailsPage";
import { productType } from "../../../productTypes/fixtures";
import { WeightUnitsEnum } from "../../../types/globalTypes";
import { WeightUnitsEnum, ProductErrorCode } from "../../../types/globalTypes";
import Decorator from "../../Decorator";
const props: Omit<ProductTypeDetailsPageProps, "classes"> = {
@ -55,6 +54,12 @@ storiesOf("Views / Product types / Product type details", module)
.add("form errors", () => (
<ProductTypeDetailsPage
{...props}
errors={(["name"] as Array<keyof ProductTypeForm>).map(formError)}
errors={(["name", "weight"] as Array<keyof ProductTypeForm>).map(
field => ({
__typename: "ProductError",
code: ProductErrorCode.INVALID,
field
})
)}
/>
));