1 files changed, 31 insertions, 6 deletions

diff --git a/webapp/components/needs_team.jsx b/webapp/components/needs_team.jsx
index 07b90636d..a8c7b3508 100644
--- a/webapp/components/needs_team.jsx
+++ b/webapp/components/needs_team.jsx
@@ -41,19 +41,34 @@ export default class NeedsTeam extends React.Component {
     constructor(params) {
         super(params);
 
-        this.onChanged = this.onChanged.bind(this);
+        this.onTeamChanged = this.onTeamChanged.bind(this);
+        this.onPreferencesChanged = this.onPreferencesChanged.bind(this);
+
+        const team = TeamStore.getCurrent();
 
         this.state = {
-            team: TeamStore.getCurrent()
+            team,
+            theme: PreferenceStore.getTheme(team.id)
         };
     }
 
-    onChanged() {
+    onTeamChanged() {
+        const team = TeamStore.getCurrent();
+
         this.setState({
-            team: TeamStore.getCurrent()
+            team,
+            theme: PreferenceStore.getTheme(team.id)
         });
     }
 
+    onPreferencesChanged(category) {
+        if (!category || category === Preferences.CATEGORY_THEME) {
+            this.setState({
+                theme: PreferenceStore.getTheme(this.state.team.id)
+            });
+        }
+    }
+
     componentWillMount() {
         // Go to tutorial if we are first arriving
         const tutorialStep = PreferenceStore.getInt(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), 999);
@@ -63,7 +78,8 @@ export default class NeedsTeam extends React.Component {
     }
 
     componentDidMount() {
-        TeamStore.addChangeListener(this.onChanged);
+        TeamStore.addChangeListener(this.onTeamChanged);
+        PreferenceStore.addChangeListener(this.onPreferencesChanged);
 
         // Emit view action
         GlobalActions.viewLoggedIn();
@@ -80,10 +96,19 @@ export default class NeedsTeam extends React.Component {
         $(window).on('blur', () => {
             window.isActive = false;
         });
+
+        Utils.applyTheme(this.state.theme);
+    }
+
+    componentDidUpdate(prevProps, prevState) {
+        if (!Utils.areObjectsEqual(prevState.theme, this.state.theme)) {
+            Utils.applyTheme(this.state.theme);
+        }
     }
 
     componentWillUnmount() {
-        TeamStore.removeChangeListener(this.onChanged);
+        TeamStore.removeChangeListener(this.onTeamChanged);
+        PreferenceStore.removeChangeListener(this.onPreferencesChanged);
         $(window).off('focus');
         $(window).off('blur');
     }