chore: wrap conditions around browser apis that cause issues at build time

src/App.js

@@ -40,12 +40,10 @@ const RouteLayout = styled.div`
 
 class App extends Component {
   state = {
-    authUser: JSON.parse(localStorage.getItem("authUser")),
     selectedTheme:
       new Date().getHours() >= 7 && new Date().getHours() <= 21
         ? "LIGHT"
         : "DARK",
-    online: navigator.onLine,
   }
 
   componentDidMount() {
@@ -56,6 +54,11 @@ class App extends Component {
     window.addEventListener("offline", () => {
       this.setState({ online: false })
     })
+
+    this.setState({
+      authUser: JSON.parse(localStorage.getItem("authUser")),
+      online: navigator.onLine,
+    })
   }
 
   onChangeTheme = () => {

src/components/Layout/Layout.js

@@ -6,12 +6,17 @@ export default ({ children }) => (
   <>
     <Global
       styles={css`
+        * {
+          transition: 0.2s all ease-in-out;
+        }
         body {
           margin: 0;
           padding: 0;
           font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
             "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
             "Helvetica Neue", sans-serif;
+          -webkit-font-smoothing: antialiased;
+          -moz-osx-font-smoothing: grayscale;
         }
       `}
     />

src/components/context/online.js

@@ -1,5 +1,5 @@
-import React from 'react'
+import React from "react"
 
 export const OnlineContext = React.createContext({
-  online: navigator.onLine,
-});
+  online: typeof window !== "undefined" && navigator && navigator.onLine,
+})

src/components/firebase/fire.js

@@ -13,21 +13,25 @@ const config = {
 
 class Firebase {
   constructor() {
-    app.initializeApp(config)
-    this.auth = app.auth()
-    this.db = app.firestore()
-    app
-      .firestore()
-      .enablePersistence()
-      .catch(function(err) {
-        if (err.code === "failed-precondition") {
-          console.error("firestore won't work offline with multiple tabs open")
-        } else if (err.code === "unimplemented") {
-          console.error(
-            "current browser can't take advantage of firestore offline"
-          )
-        }
-      })
+    if (typeof window !== "undefined") {
+      app.initializeApp(config)
+      this.auth = app.auth()
+      this.db = app.firestore()
+      app
+        .firestore()
+        .enablePersistence()
+        .catch(function(err) {
+          if (err.code === "failed-precondition") {
+            console.error(
+              "firestore won't work offline with multiple tabs open"
+            )
+          } else if (err.code === "unimplemented") {
+            console.error(
+              "current browser can't take advantage of firestore offline"
+            )
+          }
+        })
+    }
   }
 
   // Auth

src/components/screens/Start/Start.js

@@ -96,7 +96,7 @@ class Start extends Component {
           day. Sol Journal works offline and from any device. Use it as a place
           to record thoughts and events from the day.
         </P>
-        <Link to={todayUrl()} style={{ textDecoration: "none" }}>
+        <Link to={`/app${todayUrl()}`} style={{ textDecoration: "none" }}>
           <Button colors={theme.colors}>Write about today</Button>
         </Link>
         <div

src/components/session/withAuthentication.js

@@ -8,8 +8,12 @@ const withAuthentication = Component => {
     constructor(props) {
       super(props)
 
-      this.state = {
-        authUser: JSON.parse(localStorage.getItem("authUser")),
+      if (typeof window !== "undefined") {
+        this.state = {
+          authUser: JSON.parse(localStorage.getItem("authUser")),
+        }
+      } else {
+        this.state = { authUser: null }
       }
     }