Add routing to albums.

react-debug/src/App.js

@@ -1,4 +1,11 @@
 import React from 'react';
+import {
+  HashRouter as Router,
+  Switch,
+  Route,
+  Link,
+  useParams
+} from "react-router-dom";
 
 import './App.css';
 
@@ -86,6 +93,13 @@ class AlbumIndex extends React.Component {
   }
 }
 
+const AlbumRoute = () => {
+  // We can use the `useParams` hook here to access
+  // the dynamic pieces of the URL.
+  let { album_id } = useParams();
+  return <Album album={album_id} />;
+}
+
 class App extends React.Component {
   constructor(props) {
     super(props);
@@ -97,15 +111,19 @@ class App extends React.Component {
     let {curAlbum} = this.state;
     console.log(this.state);
     let content;
-    if (curAlbum) {
-      content = <Album album={ curAlbum.slice(1) } />
-    } else {
-      content = <AlbumIndex />;
-    }
 
     return (
       <div className="container">
-      { content }
+        <Router>
+          <Switch>
+            <Route exact path="/">
+              <AlbumIndex />
+            </Route>
+            <Route exact path="/:album_id">
+              <AlbumRoute />
+            </Route>
+          </Switch>
+        </Router>
       </div>
     );
   }