reactjs · gaearon · Nov 10, 2021 · Nov 7, 2021 · Nov 7, 2021 · Nov 7, 2021
diff --git a/beta/plugins/md-layout-loader.js b/beta/plugins/md-layout-loader.js
@@ -15,7 +15,7 @@ const fm = require('gray-matter');
 module.exports = async function (src) {
   const callback = this.async();
   const {content, data} = fm(src);
-  const layout = data.layout || 'Learn';
+  const layout = data.layout || 'Home';
   const code =
     `import withLayout from 'components/Layout/Layout${layout}';
 

diff --git a/beta/src/components/Layout/useRouteMeta.tsx b/beta/src/components/Layout/useRouteMeta.tsx
@@ -56,6 +56,11 @@ export function useRouteMeta(rootRoute?: RouteItem) {
   const routeTree = rootRoute || sidebarContext;
   const router = useRouter();
   const cleanedPath = router.pathname;
+  if (cleanedPath === '/404') {
+    return {
+      breadcrumbs: [],
+    };
+  }
   const breadcrumbs = getBreadcrumbs(cleanedPath, routeTree);
   return {
     ...getRouteMeta(cleanedPath, routeTree),

diff --git a/beta/src/pages/learn/add-react-to-a-website.md b/beta/src/pages/learn/add-react-to-a-website.md
@@ -1,5 +1,6 @@
 ---
 title: Add React to a Website
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/adding-interactivity.md b/beta/src/pages/learn/adding-interactivity.md
@@ -1,5 +1,6 @@
 ---
 title: Adding Interactivity
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/choosing-the-state-structure.md b/beta/src/pages/learn/choosing-the-state-structure.md
@@ -1,5 +1,6 @@
 ---
 title: Choosing the State Structure
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/conditional-rendering.md b/beta/src/pages/learn/conditional-rendering.md
@@ -1,5 +1,6 @@
 ---
 title: Conditional Rendering
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/describing-the-ui.md b/beta/src/pages/learn/describing-the-ui.md
@@ -1,5 +1,6 @@
 ---
 title: Describing the UI
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/editor-setup.md b/beta/src/pages/learn/editor-setup.md
@@ -1,5 +1,6 @@
 ---
 title: Editor Setup
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/escape-hatches.md b/beta/src/pages/learn/escape-hatches.md
@@ -1,5 +1,6 @@
 ---
 title: Escape Hatches
+layout: Learn
 ---
 
 This chapter is incomplete and is still being written!
diff --git a/beta/src/pages/learn/extracting-state-logic-into-a-reducer.md b/beta/src/pages/learn/extracting-state-logic-into-a-reducer.md
@@ -1,5 +1,6 @@
 ---
 title: Extracting State Logic into a Reducer
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/importing-and-exporting-components.md b/beta/src/pages/learn/importing-and-exporting-components.md
@@ -1,5 +1,6 @@
 ---
 title: Importing and Exporting Components
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/index.md b/beta/src/pages/learn/index.md
@@ -1,5 +1,6 @@
 ---
 title: Quick Start
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/installation.md b/beta/src/pages/learn/installation.md
@@ -1,5 +1,6 @@
 ---
 title: Installation
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/javascript-in-jsx-with-curly-braces.md b/beta/src/pages/learn/javascript-in-jsx-with-curly-braces.md
@@ -1,5 +1,6 @@
 ---
 title: JavaScript in JSX with Curly Braces
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/keeping-components-pure.md b/beta/src/pages/learn/keeping-components-pure.md
@@ -1,5 +1,6 @@
 ---
 title: Keeping Components Pure
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/managing-state.md b/beta/src/pages/learn/managing-state.md
@@ -1,5 +1,6 @@
 ---
 title: Managing State
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/manipulating-the-dom-with-refs.md b/beta/src/pages/learn/manipulating-the-dom-with-refs.md
@@ -1,5 +1,6 @@
 ---
 title: 'Manipulating the DOM with Refs'
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/passing-data-deeply-with-context.md b/beta/src/pages/learn/passing-data-deeply-with-context.md
@@ -1,5 +1,6 @@
 ---
 title: Passing Data Deeply with Context
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/passing-props-to-a-component.md b/beta/src/pages/learn/passing-props-to-a-component.md
@@ -1,5 +1,6 @@
 ---
 title: Passing Props to a Component
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/preserving-and-resetting-state.md b/beta/src/pages/learn/preserving-and-resetting-state.md
@@ -1,5 +1,6 @@
 ---
 title: Preserving and Resetting State
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/queueing-a-series-of-state-updates.md b/beta/src/pages/learn/queueing-a-series-of-state-updates.md
@@ -1,5 +1,6 @@
 ---
 title: Queueing a Series of State Updates
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/react-developer-tools.md b/beta/src/pages/learn/react-developer-tools.md
@@ -1,5 +1,6 @@
 ---
 title: React Developer Tools
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/reacting-to-input-with-state.md b/beta/src/pages/learn/reacting-to-input-with-state.md
@@ -1,5 +1,6 @@
 ---
 title: Reacting to Input with State
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/referencing-values-with-refs.md b/beta/src/pages/learn/referencing-values-with-refs.md
@@ -1,5 +1,6 @@
 ---
 title: 'Referencing Values with Refs'
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/render-and-commit.md b/beta/src/pages/learn/render-and-commit.md
@@ -1,5 +1,6 @@
 ---
 title: Render and Commit
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/rendering-lists.md b/beta/src/pages/learn/rendering-lists.md
@@ -1,5 +1,6 @@
 ---
 title: Rendering Lists
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/responding-to-events.md b/beta/src/pages/learn/responding-to-events.md
@@ -1,5 +1,6 @@
 ---
 title: Responding to Events
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/scaling-up-with-reducer-and-context.md b/beta/src/pages/learn/scaling-up-with-reducer-and-context.md
@@ -1,5 +1,6 @@
 ---
 title: Scaling Up with Reducer and Context
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/sharing-state-between-components.md b/beta/src/pages/learn/sharing-state-between-components.md
@@ -1,5 +1,6 @@
 ---
 title: Sharing State Between Components
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/start-a-new-react-project.md b/beta/src/pages/learn/start-a-new-react-project.md
@@ -1,5 +1,6 @@
 ---
 title: Start a New React Project
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/state-a-components-memory.md b/beta/src/pages/learn/state-a-components-memory.md
@@ -1,5 +1,6 @@
 ---
 title: "State: A Component's Memory"
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/state-as-a-snapshot.md b/beta/src/pages/learn/state-as-a-snapshot.md
@@ -1,5 +1,6 @@
 ---
 title: State as a Snapshot
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/thinking-in-react.md b/beta/src/pages/learn/thinking-in-react.md
@@ -1,5 +1,6 @@
 ---
 title: Thinking in React
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/updating-arrays-in-state.md b/beta/src/pages/learn/updating-arrays-in-state.md
@@ -1,5 +1,6 @@
 ---
 title: Updating Arrays in State
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/updating-objects-in-state.md b/beta/src/pages/learn/updating-objects-in-state.md
@@ -1,5 +1,6 @@
 ---
 title: Updating Objects in State
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/writing-markup-with-jsx.md b/beta/src/pages/learn/writing-markup-with-jsx.md
@@ -1,5 +1,6 @@
 ---
 title: Writing Markup with JSX
+layout: Learn
 ---
 
 <Intro>

diff --git a/beta/src/pages/learn/your-first-component.md b/beta/src/pages/learn/your-first-component.md
@@ -1,5 +1,6 @@
 ---
 title: Your First Component
+layout: Learn
 ---
 
 <Intro>