diff --git a/lib/ui/src/modules/ui/components/left_panel/index.js b/lib/ui/src/modules/ui/components/left_panel/index.js
index 78b7f11da6da..2529ed4238cc 100755
--- a/lib/ui/src/modules/ui/components/left_panel/index.js
+++ b/lib/ui/src/modules/ui/components/left_panel/index.js
@@ -25,6 +25,10 @@ const storyProps = [
   'sidebarAnimations',
 ];
 
+function hierarchyContainsStories(storiesHierarchy) {
+  return storiesHierarchy && storiesHierarchy.map.size
+}
+
 // eslint-disable-next-line react/prefer-stateless-function
 class LeftPanel extends Component {
   render() {
@@ -46,7 +50,9 @@ class LeftPanel extends Component {
           onChange={text => onStoryFilter(text)}
         />
         <div style={scrollStyle}>
-          {storiesHierarchy ? <Stories {...pick(this.props, storyProps)} /> : null}
+          {hierarchyContainsStories(storiesHierarchy) 
+            ? <Stories {...pick(this.props, storyProps)} /> 
+            : null}
         </div>
       </div>
     );
diff --git a/lib/ui/src/modules/ui/components/left_panel/index.test.js b/lib/ui/src/modules/ui/components/left_panel/index.test.js
index 3a2e4b219edd..03c3e2da6aae 100755
--- a/lib/ui/src/modules/ui/components/left_panel/index.test.js
+++ b/lib/ui/src/modules/ui/components/left_panel/index.test.js
@@ -44,6 +44,13 @@ describe('manager.ui.components.left_panel.index', () => {
     });
   });
 
+  test('should not render stories if storiesHierarchy exists but is empty', () => {
+    const storiesHierarchy = createHierarchy([]);
+    const wrap = shallow(<LeftPanel storiesHierarchy={storiesHierarchy} />);
+
+    expect(wrap.find(Stories).exists()).toBe(false);
+  });
+
   describe('onStoryFilter prop', () => {
     test('should set filter as an empty text on TextFilter.onClear', () => {
       const onStoryFilter = jest.fn();