diff --git a/common/navigation-data.js b/common/navigation-data.js
index ace1cb3c..994e954a 100644
--- a/common/navigation-data.js
+++ b/common/navigation-data.js
@@ -38,7 +38,18 @@ const constructFilesTreeForNavigation = (library) => {
   return library;
 };
 
-export const generate = (library) => [
+const constructSlatesTreeForNavigation = (slates) => {
+  return slates.map((s) => {
+    return {
+      ...s,
+      name: s.slatename,
+      pageTitle: `Viewing ${s.slatename}`,
+      decorator: "SLATE",
+    };
+  });
+};
+
+export const generate = ({ library = [], slates = [] }) => [
   {
     id: 1,
     name: "Home",
@@ -66,7 +77,7 @@ export const generate = (library) => [
     name: "Slates",
     pageTitle: "Your slates",
     decorator: "SLATES",
-    children: [],
+    children: constructSlatesTreeForNavigation(slates),
   },
   // TODO(colin):
   // re-enable this when we do local offline.
diff --git a/components/core/ApplicationNavigation.js b/components/core/ApplicationNavigation.js
index 1be7ef1f..68c9a7c3 100644
--- a/components/core/ApplicationNavigation.js
+++ b/components/core/ApplicationNavigation.js
@@ -23,6 +23,7 @@ const IconMap = {
   MINERS: <SVG.Miners height="20px" />,
   STORAGE_MARKET: <SVG.StorageMarket height="20px" />,
   SLATES: <SVG.Slates height="20px" />,
+  SLATE: <SVG.Slates height="20px" />,
   LOCAL_DATA: <SVG.HardDrive height="20px" />,
   PROFILE_PAGE: <SVG.ProfileUser height="20px" />,
 };
diff --git a/pages/application.js b/pages/application.js
index 37980b90..7b3b0070 100644
--- a/pages/application.js
+++ b/pages/application.js
@@ -390,6 +390,7 @@ export default class ApplicationPage extends React.Component {
   };
 
   render() {
+    // NOTE(jim): Not authenticated.
     if (!this.state.viewer) {
       return (
         <WebsitePrototypeWrapper
@@ -405,7 +406,8 @@ export default class ApplicationPage extends React.Component {
       );
     }
 
-    const navigation = NavigationData.generate(this.state.viewer.library);
+    // NOTE(jim): Authenticated.
+    const navigation = NavigationData.generate(this.state.viewer);
     const next = this.state.history[this.state.currentIndex];
     const current = NavigationData.getCurrentById(navigation, next.id);