diff --git a/app/src/__stories__/ChannelBalance.stories.tsx b/app/src/__stories__/ChannelBalance.stories.tsx
index c4905e27..f39dac3e 100644
--- a/app/src/__stories__/ChannelBalance.stories.tsx
+++ b/app/src/__stories__/ChannelBalance.stories.tsx
@@ -5,7 +5,7 @@ import { Store } from 'store';
 import ChannelBalance from 'components/loop/ChannelBalance';
 
 export default {
-  title: 'Channel Balance',
+  title: 'Components/Channel Balance',
   component: ChannelBalance,
   parameters: { centered: true },
 };
diff --git a/app/src/__stories__/ChannelList.stories.tsx b/app/src/__stories__/ChannelList.stories.tsx
index 9626c267..b61c9516 100644
--- a/app/src/__stories__/ChannelList.stories.tsx
+++ b/app/src/__stories__/ChannelList.stories.tsx
@@ -4,7 +4,7 @@ import { Store } from 'store';
 import ChannelList from 'components/loop/ChannelList';
 
 export default {
-  title: 'Channel List',
+  title: 'Components/Channel List',
   component: ChannelList,
   parameters: { contained: true },
 };
diff --git a/app/src/__stories__/ChannelRow.stories.tsx b/app/src/__stories__/ChannelRow.stories.tsx
index f0d90634..dcd6c594 100644
--- a/app/src/__stories__/ChannelRow.stories.tsx
+++ b/app/src/__stories__/ChannelRow.stories.tsx
@@ -5,7 +5,7 @@ import { Store } from 'store';
 import ChannelRow, { ChannelRowHeader } from 'components/loop/ChannelRow';
 
 export default {
-  title: 'Channel Row',
+  title: 'Components/Channel Row',
   component: ChannelRow,
   parameters: { contained: true },
 };
diff --git a/app/src/__stories__/Layout.stories.tsx b/app/src/__stories__/Layout.stories.tsx
index 5ba7ee87..b2ce9238 100644
--- a/app/src/__stories__/Layout.stories.tsx
+++ b/app/src/__stories__/Layout.stories.tsx
@@ -1,6 +1,7 @@
 import React, { useEffect } from 'react';
 import { StoryContext } from '@storybook/addons';
 import { Store } from 'store';
+import LoopPage from 'components/loop/LoopPage';
 import { Layout } from '../components/layout';
 
 export default {
@@ -8,32 +9,11 @@ export default {
   component: Layout,
 };
 
-const SampleContent = () => (
-  <>
-    <h1 style={{ textAlign: 'center' }}>Lorem ipsum dolor sit amet</h1>
-    {[...Array(10)].map((_, i) => (
-      <p key={i}>
-        At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis
-        praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias
-        excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui
-        officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem
-        rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est
-        eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere
-        possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem
-        quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et
-        voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic
-        tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias
-        consequatur aut perferendis doloribus asperiores repellat.
-      </p>
-    ))}
-  </>
-);
-
 export const Default = () => <Layout />;
 
 export const WithContent = () => (
   <Layout>
-    <SampleContent />
+    <LoopPage />
   </Layout>
 );
 
@@ -51,7 +31,7 @@ export const Collapsed = (ctx: StoryContext) => {
 
   return (
     <Layout>
-      <SampleContent />
+      <LoopPage />
     </Layout>
   );
 };
diff --git a/app/src/__stories__/LoopHistory.stories.tsx b/app/src/__stories__/LoopHistory.stories.tsx
index ff670647..6ecc4a16 100644
--- a/app/src/__stories__/LoopHistory.stories.tsx
+++ b/app/src/__stories__/LoopHistory.stories.tsx
@@ -5,7 +5,7 @@ import Tile from 'components/common/Tile';
 import LoopHistory from 'components/loop/LoopHistory';
 
 export default {
-  title: 'Loop History',
+  title: 'Components/Loop History',
   component: LoopHistory,
   parameters: { centered: true },
 };
diff --git a/app/src/__stories__/NodeStatus.stories.tsx b/app/src/__stories__/NodeStatus.stories.tsx
index a216af8b..e91115e5 100644
--- a/app/src/__stories__/NodeStatus.stories.tsx
+++ b/app/src/__stories__/NodeStatus.stories.tsx
@@ -4,7 +4,7 @@ import { Store } from 'store';
 import NodeStatus from 'components/NodeStatus';
 
 export default {
-  title: 'Node Status',
+  title: 'Components/Node Status',
   component: NodeStatus,
   parameters: { centered: true },
 };
diff --git a/app/src/__stories__/Tile.stories.tsx b/app/src/__stories__/Tile.stories.tsx
index bbfc24c2..a3e48fba 100644
--- a/app/src/__stories__/Tile.stories.tsx
+++ b/app/src/__stories__/Tile.stories.tsx
@@ -3,7 +3,7 @@ import { action } from '@storybook/addon-actions';
 import Tile from 'components/common/Tile';
 
 export default {
-  title: 'Tile',
+  title: 'Components/Tile',
   component: Tile,
   parameters: { centered: true },
 };