Add form error stories

src/storybook/stories/categories/CategoryCreatePage.tsx

@@ -1,6 +1,7 @@
 import { storiesOf } from "@storybook/react";
 import React from "react";
 
+import { ProductErrorCode } from "@saleor/types/globalTypes";
 import CategoryCreatePage, {
   CategoryCreatePageProps
 } from "../../../categories/components/CategoryCreatePage";
@@ -19,4 +20,22 @@ storiesOf("Views / Categories / Create category", module)
   .add("default", () => <CategoryCreatePage {...createProps} />)
   .add("When loading", () => (
     <CategoryCreatePage {...createProps} disabled={true} />
+  ))
+  .add("form errors", () => (
+    <CategoryCreatePage
+      {...createProps}
+      errors={[
+        {
+          code: ProductErrorCode.REQUIRED,
+          field: "name"
+        },
+        {
+          code: ProductErrorCode.REQUIRED,
+          field: "descriptionJson"
+        }
+      ].map(err => ({
+        __typename: "ProductError",
+        ...err
+      }))}
+    />
   ));

src/storybook/stories/categories/CategoryUpdatePage.tsx

@@ -3,6 +3,7 @@ import { Omit } from "@material-ui/core";
 import { storiesOf } from "@storybook/react";
 import React from "react";
 
+import { ProductErrorCode } from "@saleor/types/globalTypes";
 import { category as categoryFixture } from "../../../categories/fixtures";
 
 import CategoryUpdatePage, {
@@ -79,4 +80,22 @@ storiesOf("Views / Categories / Update category", module)
       products={undefined}
       category={undefined}
     />
+  ))
+  .add("form errors", () => (
+    <CategoryUpdatePage
+      {...updateProps}
+      errors={[
+        {
+          code: ProductErrorCode.REQUIRED,
+          field: "name"
+        },
+        {
+          code: ProductErrorCode.REQUIRED,
+          field: "descriptionJson"
+        }
+      ].map(err => ({
+        __typename: "ProductError",
+        ...err
+      }))}
+    />
   ));

src/storybook/stories/collections/CollectionCreatePage.tsx

@@ -2,6 +2,7 @@ import { Omit } from "@material-ui/core";
 import { storiesOf } from "@storybook/react";
 import React from "react";
 
+import { ProductErrorCode } from "@saleor/types/globalTypes";
 import CollectionCreatePage, {
   CollectionCreatePageProps
 } from "../../../collections/components/CollectionCreatePage";
@@ -18,4 +19,30 @@ const props: Omit<CollectionCreatePageProps, "classes"> = {
 storiesOf("Views / Collections / Create collection", module)
   .addDecorator(Decorator)
   .add("default", () => <CollectionCreatePage {...props} />)
-  .add("loading", () => <CollectionCreatePage {...props} disabled={true} />);
+  .add("loading", () => <CollectionCreatePage {...props} disabled={true} />)
+  .add("form errors", () => (
+    <CollectionCreatePage
+      {...props}
+      errors={[
+        {
+          code: ProductErrorCode.REQUIRED,
+          field: "name"
+        },
+        {
+          code: ProductErrorCode.REQUIRED,
+          field: "descriptionJson"
+        },
+        {
+          code: ProductErrorCode.INVALID,
+          field: "publicationDate"
+        },
+        {
+          code: ProductErrorCode.INVALID,
+          field: "isPublished"
+        }
+      ].map(err => ({
+        __typename: "ProductError",
+        ...err
+      }))}
+    />
+  ));

src/storybook/stories/collections/CollectionDetailsPage.tsx

@@ -4,7 +4,7 @@ import React from "react";
 
 import placeholderCollectionImage from "@assets/images/block1.jpg";
 import placeholderProductImage from "@assets/images/placeholder60x60.png";
-import { formError } from "@saleor/storybook/misc";
+import { ProductErrorCode } from "@saleor/types/globalTypes";
 import CollectionDetailsPage, {
   CollectionDetailsPageProps
 } from "../../../collections/components/CollectionDetailsPage";
@@ -42,9 +42,27 @@ storiesOf("Views / Collections / Collection details", module)
   .add("form errors", () => (
     <CollectionDetailsPage
       {...props}
-      errors={["name", "descriptionJson", "publicationDate", "isPublished"].map(
+      errors={[
-        formError
+        {
-      )}
+          code: ProductErrorCode.REQUIRED,
+          field: "name"
+        },
+        {
+          code: ProductErrorCode.REQUIRED,
+          field: "descriptionJson"
+        },
+        {
+          code: ProductErrorCode.INVALID,
+          field: "publicationDate"
+        },
+        {
+          code: ProductErrorCode.INVALID,
+          field: "isPublished"
+        }
+      ].map(err => ({
+        __typename: "ProductError",
+        ...err
+      }))}
     />
   ))
   .add("no products", () => (