saleor-dashboard/src/storybook/stories/collections/CollectionDetailsPage.tsx
Krzysztof Wolski a82de30309
Add circleci config and enhance our linters (#519)
* Add circleci config

* Season linting config

* Apply code style
2020-05-14 11:30:32 +02:00

80 lines
2.2 KiB
TypeScript

import placeholderCollectionImage from "@assets/images/block1.jpg";
import placeholderProductImage from "@assets/images/placeholder60x60.png";
import { Omit } from "@material-ui/core";
import { ProductErrorCode } from "@saleor/types/globalTypes";
import { storiesOf } from "@storybook/react";
import React from "react";
import CollectionDetailsPage, {
CollectionDetailsPageProps
} from "../../../collections/components/CollectionDetailsPage";
import { collection as collectionFixture } from "../../../collections/fixtures";
import { listActionsProps, pageListProps } from "../../../fixtures";
import Decorator from "../../Decorator";
const collection = collectionFixture(
placeholderCollectionImage,
placeholderProductImage
);
const props: Omit<CollectionDetailsPageProps, "classes"> = {
...listActionsProps,
...pageListProps.default,
collection,
disabled: false,
errors: [],
isFeatured: true,
onBack: () => undefined,
onCollectionRemove: () => undefined,
onImageDelete: () => undefined,
onImageUpload: () => undefined,
onProductUnassign: () => undefined,
onSubmit: () => undefined,
saveButtonBarState: "default"
};
storiesOf("Views / Collections / Collection details", module)
.addDecorator(Decorator)
.add("default", () => <CollectionDetailsPage {...props} />)
.add("loading", () => (
<CollectionDetailsPage {...props} collection={undefined} disabled={true} />
))
.add("form errors", () => (
<CollectionDetailsPage
{...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
}))}
/>
))
.add("no products", () => (
<CollectionDetailsPage
{...props}
collection={{
...collection,
products: {
...collection.products,
edges: []
}
}}
disabled={true}
/>
));