From 7135f5fabdc5d2cb3d781b8f2d18ee6cde1da46f Mon Sep 17 00:00:00 2001
From: Cassie Tarakajian <ctarakajian@gmail.com>
Date: Thu, 7 Nov 2019 16:56:46 -0500
Subject: [PATCH 1/3] update spacing on preview nav

---
 client/components/PreviewNav.jsx           | 2 +-
 client/styles/components/_preview-nav.scss | 6 ++++++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/client/components/PreviewNav.jsx b/client/components/PreviewNav.jsx
index b4062147..7169621d 100644
--- a/client/components/PreviewNav.jsx
+++ b/client/components/PreviewNav.jsx
@@ -7,7 +7,7 @@ const logoUrl = require('../images/p5js-logo-small.svg');
 const editorUrl = require('../images/code.svg');
 
 const PreviewNav = ({ owner, project }) => (
-  <nav className="nav">
+  <nav className="nav preview-nav">
     <div className="nav__items-left">
       <div className="nav__item-logo">
         <InlineSVG src={logoUrl} alt="p5.js logo" />
diff --git a/client/styles/components/_preview-nav.scss b/client/styles/components/_preview-nav.scss
index 14d9bdd3..47b39437 100644
--- a/client/styles/components/_preview-nav.scss
+++ b/client/styles/components/_preview-nav.scss
@@ -12,3 +12,9 @@
     }
   }
 }
+
+.preview-nav {
+  .nav__item {
+    margin-left: #{5 / $base-font-size}rem;
+  }
+}

From fbb1e9a05d0f576ff4bb274143afc19a468a9cf9 Mon Sep 17 00:00:00 2001
From: Cassie Tarakajian <ctarakajian@gmail.com>
Date: Thu, 14 Nov 2019 16:07:42 -0500
Subject: [PATCH 2/3] re #1207, update mongoose options for fetch example
 scripts

---
 server/scripts/examples-gg-latest.js | 3 ++-
 server/scripts/examples-ml5.js       | 5 ++---
 server/scripts/examples.js           | 3 ++-
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/server/scripts/examples-gg-latest.js b/server/scripts/examples-gg-latest.js
index 10a3fc05..10ff94e5 100644
--- a/server/scripts/examples-gg-latest.js
+++ b/server/scripts/examples-gg-latest.js
@@ -66,7 +66,8 @@ const headers = { 'User-Agent': 'p5js-web-editor/0.0.1' };
 
 const mongoConnectionString = process.env.MONGO_URL;
 
-mongoose.connect(mongoConnectionString, { useMongoClient: true });
+mongoose.connect(mongoConnectionString, { useNewUrlParser: true, useUnifiedTopology: true });
+mongoose.set('useCreateIndex', true);
 mongoose.connection.on('error', () => {
   console.error('MongoDB Connection Error. Please make sure that MongoDB is running.');
   process.exit(1);
diff --git a/server/scripts/examples-ml5.js b/server/scripts/examples-ml5.js
index 0721fe54..84e0a32a 100644
--- a/server/scripts/examples-ml5.js
+++ b/server/scripts/examples-ml5.js
@@ -30,9 +30,8 @@ const requestOptions = {
 };
 
 const mongoConnectionString = process.env.MONGO_URL;
-mongoose.connect(mongoConnectionString, {
-  useMongoClient: true
-});
+mongoose.connect(mongoConnectionString, { useNewUrlParser: true, useUnifiedTopology: true });
+mongoose.set('useCreateIndex', true);
 mongoose.connection.on('error', () => {
   console.error('MongoDB Connection Error. Please make sure that MongoDB is running.');
   process.exit(1);
diff --git a/server/scripts/examples.js b/server/scripts/examples.js
index 465760f8..ff108b9e 100644
--- a/server/scripts/examples.js
+++ b/server/scripts/examples.js
@@ -40,7 +40,8 @@ const headers = { 'User-Agent': 'p5js-web-editor/0.0.1' };
 
 const mongoConnectionString = process.env.MONGO_URL;
 
-mongoose.connect(mongoConnectionString, { useMongoClient: true });
+mongoose.connect(mongoConnectionString, { useNewUrlParser: true, useUnifiedTopology: true });
+mongoose.set('useCreateIndex', true);
 mongoose.connection.on('error', () => {
   console.error('MongoDB Connection Error. Please make sure that MongoDB is running.');
   process.exit(1);

From 0d1a4d25f666666f0e6ce376bad4269c20705138 Mon Sep 17 00:00:00 2001
From: Andrew Nicolaou <me@andrewnicolaou.co.uk>
Date: Mon, 25 Nov 2019 13:36:08 +0100
Subject: [PATCH 3/3] Keep theme in sync with state across the app

---
 client/modules/App/App.jsx            | 20 +++++++++++++++++---
 client/modules/IDE/pages/FullView.jsx |  9 ---------
 client/modules/IDE/pages/IDEView.jsx  |  5 -----
 3 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/client/modules/App/App.jsx b/client/modules/App/App.jsx
index 2678de7e..654610e4 100644
--- a/client/modules/App/App.jsx
+++ b/client/modules/App/App.jsx
@@ -14,7 +14,7 @@ class App extends React.Component {
 
   componentDidMount() {
     this.setState({ isMounted: true }); // eslint-disable-line react/no-did-mount-set-state
-    document.body.className = 'light';
+    document.body.className = this.props.theme;
   }
 
   componentWillReceiveProps(nextProps) {
@@ -23,6 +23,12 @@ class App extends React.Component {
     }
   }
 
+  componentDidUpdate(prevProps) {
+    if (this.props.theme !== prevProps.theme) {
+      document.body.className = this.props.theme;
+    }
+  }
+
   render() {
     return (
       <div className="app">
@@ -39,10 +45,18 @@ App.propTypes = {
     pathname: PropTypes.string
   }).isRequired,
   setPreviousPath: PropTypes.func.isRequired,
+  theme: PropTypes.string,
 };
 
 App.defaultProps = {
-  children: null
+  children: null,
+  theme: 'light'
 };
 
-export default connect(() => ({}), { setPreviousPath })(App);
+const mapStateToProps = state => ({
+  theme: state.preferences.theme,
+});
+
+const mapDispatchToProps = { setPreviousPath };
+
+export default connect(mapStateToProps, mapDispatchToProps)(App);
diff --git a/client/modules/IDE/pages/FullView.jsx b/client/modules/IDE/pages/FullView.jsx
index 7003496e..6a18566f 100644
--- a/client/modules/IDE/pages/FullView.jsx
+++ b/client/modules/IDE/pages/FullView.jsx
@@ -11,13 +11,6 @@ import * as ProjectActions from '../actions/project';
 class FullView extends React.Component {
   componentDidMount() {
     this.props.getProject(this.props.params.project_id);
-    document.body.className = this.props.theme;
-  }
-
-  componentWillUpdate(nextProps) {
-    if (nextProps.theme !== this.props.theme) {
-      document.body.className = nextProps.theme;
-    }
   }
 
   ident = () => {}
@@ -62,7 +55,6 @@ class FullView extends React.Component {
 }
 
 FullView.propTypes = {
-  theme: PropTypes.string.isRequired,
   params: PropTypes.shape({
     project_id: PropTypes.string
   }).isRequired,
@@ -98,7 +90,6 @@ FullView.propTypes = {
 function mapStateToProps(state) {
   return {
     user: state.user,
-    theme: state.preferences.theme,
     htmlFile: getHTMLFile(state.files),
     jsFiles: getJSFiles(state.files),
     cssFiles: getCSSFiles(state.files),
diff --git a/client/modules/IDE/pages/IDEView.jsx b/client/modules/IDE/pages/IDEView.jsx
index 29f8b6ee..0004f888 100644
--- a/client/modules/IDE/pages/IDEView.jsx
+++ b/client/modules/IDE/pages/IDEView.jsx
@@ -66,7 +66,6 @@ class IDEView extends React.Component {
 
     window.onbeforeunload = () => this.warnIfUnsavedChanges();
 
-    document.body.className = this.props.preferences.theme;
     this.autosaveInterval = null;
   }
 
@@ -90,10 +89,6 @@ class IDEView extends React.Component {
         this.props.getProject(nextProps.params.project_id);
       }
     }
-
-    if (nextProps.preferences.theme !== this.props.preferences.theme) {
-      document.body.className = nextProps.preferences.theme;
-    }
   }
 
   componentDidUpdate(prevProps) {