diff --git a/src/storybook/__snapshots__/Stories.test.ts.snap b/src/storybook/__snapshots__/Stories.test.ts.snap
index 0a8bbeb98..10081e2ab 100644
--- a/src/storybook/__snapshots__/Stories.test.ts.snap
+++ b/src/storybook/__snapshots__/Stories.test.ts.snap
@@ -26957,8 +26957,21 @@ exports[`Storyshots Views / Collections / Collection list default 1`] = `
         </div>
       </div>
       <div
-        class="SearchBar-root-id"
+        class="FilterBar-root-id"
       >
+        <div>
+          <button
+            class="MuiButtonBase-root-id Filter-filterButton-id Filter-addFilterButton-id"
+            tabindex="0"
+            type="button"
+          >
+            <div
+              class="MuiTypography-root-id Filter-addFilterText-id MuiTypography-body1-id"
+            >
+              Filters
+            </div>
+          </button>
+        </div>
         <div
           class="MuiFormControl-root-id MuiTextField-root-id SearchInput-root-id"
         >
@@ -27540,8 +27553,21 @@ exports[`Storyshots Views / Collections / Collection list loading 1`] = `
         </div>
       </div>
       <div
-        class="SearchBar-root-id"
+        class="FilterBar-root-id"
       >
+        <div>
+          <button
+            class="MuiButtonBase-root-id Filter-filterButton-id Filter-addFilterButton-id"
+            tabindex="0"
+            type="button"
+          >
+            <div
+              class="MuiTypography-root-id Filter-addFilterText-id MuiTypography-body1-id"
+            >
+              Filters
+            </div>
+          </button>
+        </div>
         <div
           class="MuiFormControl-root-id MuiTextField-root-id SearchInput-root-id"
         >
@@ -27918,8 +27944,21 @@ exports[`Storyshots Views / Collections / Collection list no data 1`] = `
         </div>
       </div>
       <div
-        class="SearchBar-root-id"
+        class="FilterBar-root-id"
       >
+        <div>
+          <button
+            class="MuiButtonBase-root-id Filter-filterButton-id Filter-addFilterButton-id"
+            tabindex="0"
+            type="button"
+          >
+            <div
+              class="MuiTypography-root-id Filter-addFilterText-id MuiTypography-body1-id"
+            >
+              Filters
+            </div>
+          </button>
+        </div>
         <div
           class="MuiFormControl-root-id MuiTextField-root-id SearchInput-root-id"
         >
diff --git a/src/storybook/stories/collections/CollectionListPage.tsx b/src/storybook/stories/collections/CollectionListPage.tsx
index 80b741a6f..b5a0c0348 100644
--- a/src/storybook/stories/collections/CollectionListPage.tsx
+++ b/src/storybook/stories/collections/CollectionListPage.tsx
@@ -2,6 +2,7 @@ import { storiesOf } from "@storybook/react";
 import React from "react";
 
 import { CollectionListUrlSortField } from "@saleor/collections/urls";
+import { CollectionPublished } from "@saleor/types/globalTypes";
 import CollectionListPage, {
   CollectionListPageProps
 } from "../../../collections/components/CollectionListPage";
@@ -11,7 +12,8 @@ import {
   pageListProps,
   searchPageProps,
   tabPageProps,
-  sortPageProps
+  sortPageProps,
+  filterPageProps
 } from "../../../fixtures";
 import Decorator from "../../Decorator";
 
@@ -20,6 +22,13 @@ const props: CollectionListPageProps = {
   ...pageListProps.default,
   ...searchPageProps,
   ...sortPageProps,
+  ...filterPageProps,
+  filterOpts: {
+    status: {
+      active: false,
+      value: CollectionPublished.PUBLISHED
+    }
+  },
   sort: {
     ...sortPageProps.sort,
     sort: CollectionListUrlSortField.name