Fix stories

src/fixtures.ts

@@ -1,5 +1,4 @@
 import { ShopInfo_shop_permissions } from "./components/Shop/types/ShopInfo";
-import { Filter } from "./components/TableFilter";
 import {
   FetchMoreProps,
   FilterPageProps,
@@ -303,80 +302,14 @@ export const searchPageProps: SearchPageProps = {
   onSearchChange: () => undefined
 };
 
-export const filterPageProps: FilterPageProps = {
+export const filterPageProps: FilterPageProps<string, object> = {
   ...searchPageProps,
   ...tabPageProps,
   currencySymbol: "USD",
-  filtersList: [],
+  filterOpts: {},
-  onFilterAdd: () => undefined
+  onFilterChange: () => undefined
 };
 
-export const filters: Filter[] = [
-  {
-    label: "Property X is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property Y is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property Z is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property X is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property Y is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property Z is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property X is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property Y is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property Z is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property X is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property Y is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property Z is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property X is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property Y is ",
-    onClick: () => undefined
-  },
-  {
-    label: "Property Z is ",
-    onClick: () => undefined
-  }
-].map((filter, filterIndex) => ({
-  ...filter,
-  label: filter.label + filterIndex
-}));
-
 export const fetchMoreProps: FetchMoreProps = {
   hasMore: true,
   loading: false,

src/storybook/stories/orders/OrderListPage.tsx

@@ -5,9 +5,9 @@ import OrderListPage, {
   OrderListPageProps
 } from "@saleor/orders/components/OrderListPage";
 import { OrderListUrlSortField } from "@saleor/orders/urls";
+import { OrderStatusFilter } from "@saleor/types/globalTypes";
 import {
   filterPageProps,
-  filters,
   listActionsProps,
   pageListProps,
   sortPageProps
@@ -20,6 +20,19 @@ const props: OrderListPageProps = {
   ...pageListProps.default,
   ...filterPageProps,
   ...sortPageProps,
+  filterOpts: {
+    created: {
+      active: false,
+      value: {
+        max: "400",
+        min: "50"
+      }
+    },
+    status: {
+      active: false,
+      value: [OrderStatusFilter.CANCELED, OrderStatusFilter.FULFILLED]
+    }
+  },
   orders,
   sort: {
     ...sortPageProps.sort,
@@ -30,9 +43,6 @@ const props: OrderListPageProps = {
 storiesOf("Views / Orders / Order list", module)
   .addDecorator(Decorator)
   .add("default", () => <OrderListPage {...props} />)
-  .add("with custom filters", () => (
-    <OrderListPage {...props} filtersList={filters} />
-  ))
   .add("loading", () => (
     <OrderListPage
       {...props}

src/storybook/stories/products/ProductListPage.tsx

@@ -7,10 +7,11 @@ import { products as productListFixture } from "@saleor/products/fixtures";
 import { ProductListUrlSortField } from "@saleor/products/urls";
 import { attributes } from "@saleor/productTypes/fixtures";
 import { ListViews } from "@saleor/types";
+import { ProductStatus } from "@saleor/products/types";
+import { StockAvailability } from "@saleor/types/globalTypes";
 import {
   fetchMoreProps,
   filterPageProps,
-  filters,
   listActionsProps,
   pageListProps,
   sortPageProps
@@ -37,6 +38,23 @@ const props: ProductListPageProps = {
   activeAttributeSortId: undefined,
   availableInGridAttributes: attributes,
   defaultSettings: defaultListSettings[ListViews.PRODUCT_LIST],
+  filterOpts: {
+    price: {
+      active: false,
+      value: {
+        max: "30",
+        min: "10"
+      }
+    },
+    status: {
+      active: false,
+      value: ProductStatus.PUBLISHED
+    },
+    stockStatus: {
+      active: false,
+      value: StockAvailability.IN_STOCK
+    }
+  },
   gridAttributes: attributes,
   products,
   settings: {
@@ -49,14 +67,10 @@ const props: ProductListPageProps = {
 storiesOf("Views / Products / Product list", module)
   .addDecorator(Decorator)
   .add("default", () => <ProductListPage {...props} />)
-  .add("with custom filters", () => (
-    <ProductListPage {...props} filtersList={filters} />
-  ))
   .add("loading", () => (
     <ProductListPage
       {...props}
       products={undefined}
-      filtersList={undefined}
       currentTab={undefined}
       disabled={true}
     />