Allow switching theme, fixes #5

This commit is contained in:
Alex Gleason 2020-04-14 22:09:59 -05:00
parent 5d0d47eeba
commit 3088ffff6a
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
6 changed files with 51 additions and 11 deletions

View file

@ -0,0 +1,7 @@
export const SET_THEME = 'SET_THEME';
export function setTheme(theme) {
return (dispatch, getState) => {
dispatch({ type: SET_THEME, theme });
};
}

View file

@ -3,6 +3,7 @@
import React from 'react';
import { Provider, connect } from 'react-redux';
import PropTypes from 'prop-types';
import { Helmet } from'react-helmet';
import configureStore from '../store/configureStore';
import { INTRODUCTION_VERSION } from '../actions/onboarding';
import { Switch, BrowserRouter, Route } from 'react-router-dom';
@ -40,6 +41,7 @@ const mapStateToProps = (state) => {
return {
showIntroduction,
me,
theme: state.getIn(['settings', 'theme']),
};
};
@ -49,10 +51,11 @@ class GabSocialMount extends React.PureComponent {
static propTypes = {
showIntroduction: PropTypes.bool,
me: PropTypes.string,
theme: PropTypes.string,
};
render() {
const { me } = this.props;
const { me, theme } = this.props;
if (me === null) return null;
// Disabling introduction for launch
@ -63,14 +66,19 @@ class GabSocialMount extends React.PureComponent {
// }
return (
<BrowserRouter basename='/web'>
<ScrollContext>
<Switch>
{!me && <Route exact path='/' component={LandingPage} />}
<Route path='/' component={UI} />
</Switch>
</ScrollContext>
</BrowserRouter>
<>
<Helmet>
{theme && <link rel='stylesheet' href={`/packs/css/${theme}.chunk.css`} />}
</Helmet>
<BrowserRouter basename='/web'>
<ScrollContext>
<Switch>
{!me && <Route exact path='/' component={LandingPage} />}
<Route path='/' component={UI} />
</Switch>
</ScrollContext>
</BrowserRouter>
</>
);
}

View file

@ -3,6 +3,7 @@ import { NOTIFICATIONS_FILTER_SET } from '../actions/notifications';
import { STORE_HYDRATE } from '../actions/store';
import { EMOJI_USE } from '../actions/emojis';
import { LIST_DELETE_SUCCESS, LIST_FETCH_FAIL } from '../actions/lists';
import { SET_THEME } from '../actions/theme';
import { Map as ImmutableMap, fromJS } from 'immutable';
import uuid from '../uuid';
@ -83,6 +84,8 @@ const initialState = ImmutableMap({
trends: ImmutableMap({
show: true,
}),
theme: 'lime',
});
const defaultColumns = fromJS([
@ -114,6 +117,8 @@ export default function settings(state = initialState, action) {
return action.error.response.status === 404 ? filterDeadListColumns(state, action.id) : state;
case LIST_DELETE_SUCCESS:
return filterDeadListColumns(state, action.id);
case SET_THEME:
return state.set('theme', action.theme);
default:
return state;
}

View file

@ -88,6 +88,7 @@
"rails-ujs": "^5.2.3",
"react": "^16.7.0",
"react-dom": "^16.7.0",
"react-helmet": "^6.0.0",
"react-hotkeys": "^1.1.4",
"react-immutable-proptypes": "^2.1.0",
"react-immutable-pure-component": "^1.1.1",

File diff suppressed because one or more lines are too long

View file

@ -8472,6 +8472,21 @@ react-event-listener@^0.6.0:
prop-types "^15.6.0"
warning "^4.0.1"
react-fast-compare@^2.0.4:
version "2.0.4"
resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-2.0.4.tgz#e84b4d455b0fec113e0402c329352715196f81f9"
integrity sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==
react-helmet@^6.0.0:
version "6.0.0"
resolved "https://registry.yarnpkg.com/react-helmet/-/react-helmet-6.0.0.tgz#fcb93ebaca3ba562a686eb2f1f9d46093d83b5f8"
integrity sha512-My6S4sa0uHN/IuVUn0HFmasW5xj9clTkB9qmMngscVycQ5vVG51Qp44BEvLJ4lixupTwDlU9qX1/sCrMN4AEPg==
dependencies:
object-assign "^4.1.1"
prop-types "^15.7.2"
react-fast-compare "^2.0.4"
react-side-effect "^2.1.0"
react-hotkeys@^1.1.4:
version "1.1.4"
resolved "https://registry.yarnpkg.com/react-hotkeys/-/react-hotkeys-1.1.4.tgz#a0712aa2e0c03a759fd7885808598497a4dace72"
@ -8643,6 +8658,11 @@ react-select@^2.4.4:
react-input-autosize "^2.2.1"
react-transition-group "^2.2.1"
react-side-effect@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/react-side-effect/-/react-side-effect-2.1.0.tgz#1ce4a8b4445168c487ed24dab886421f74d380d3"
integrity sha512-IgmcegOSi5SNX+2Snh1vqmF0Vg/CbkycU9XZbOHJlZ6kMzTmi3yc254oB1WCkgA7OQtIAoLmcSFuHTc/tlcqXg==
react-sparklines@^1.7.0:
version "1.7.0"
resolved "https://registry.yarnpkg.com/react-sparklines/-/react-sparklines-1.7.0.tgz#9b1d97e8c8610095eeb2ad658d2e1fcf91f91a60"