fix: improving theme jank

src/components/context/theme.js

@@ -17,11 +17,21 @@ class ThemeToggler extends React.Component {
         : "DARK",
   }
 
-  toggle = () => {
+  componentDidMount() {
+    // set the body style property on mount so routes don't flash between transitions
+    const { themeName } = this.state
+    this.toggle(themeName)
+  }
+
+  toggle = newThemeName => {
     const { themeName } = this.state
     const body = document.body
     let newTheme
-    newTheme = themeName === "LIGHT" ? "DARK" : "LIGHT"
+    if (newThemeName) {
+      newTheme = newThemeName
+    } else {
+      newTheme = themeName === "LIGHT" ? "DARK" : "LIGHT"
+    }
     body.style.setProperty(
       "background-color",
       theme[newTheme].colors.bodyBackground