Add logout button

ui/src/Layout.js

@@ -39,8 +39,7 @@ const Content = styled.div`
   overflow-y: scroll;
 `
 
-const SideButton = props => {
+const SideButtonLink = styled(NavLink)`
-  const StyledLink = styled(NavLink)`
   text-align: center;
   padding-top: 8px;
   padding-left: 2px;
@@ -59,12 +58,13 @@ const SideButton = props => {
   :hover {
     transform: scale(1.02);
   }
-  `
+`
 
+const SideButton = props => {
   return (
-    <StyledLink {...props} activeStyle={{ color: '#4183c4' }}>
+    <SideButtonLink {...props} activeStyle={{ color: '#4183c4' }}>
       {props.children}
-    </StyledLink>
+    </SideButtonLink>
   )
 }
 
@@ -120,6 +120,10 @@ const Layout = ({ children, title }) => (
             return null
           }}
         </Query>
+        <SideButton to="/logout">
+          <Icon name="lock" />
+          <SideButtonLabel>Log out</SideButtonLabel>
+        </SideButton>
       </SideMenu>
     </Authorized>
     <Sidebar>

ui/src/Routes.js

@@ -31,6 +31,12 @@ class Routes extends React.Component {
       >
         <Switch>
           <Route path="/login" component={LoginPage} />
+          <Route path="/logout">
+            {() => {
+              localStorage.removeItem('token')
+              location.href = '/'
+            }}
+          </Route>
           <Route path="/initialSetup" component={InitialSetupPage} />
           <Route path="/share" component={SharePage} />
           <AuthorizedRoute exact path="/albums" component={AlbumsPage} />