Allow switching theme, fixes #5
This commit is contained in:
parent
5d0d47eeba
commit
3088ffff6a
6 changed files with 51 additions and 11 deletions
7
app/gabsocial/actions/theme.js
Normal file
7
app/gabsocial/actions/theme.js
Normal file
|
@ -0,0 +1,7 @@
|
|||
export const SET_THEME = 'SET_THEME';
|
||||
|
||||
export function setTheme(theme) {
|
||||
return (dispatch, getState) => {
|
||||
dispatch({ type: SET_THEME, theme });
|
||||
};
|
||||
}
|
|
@ -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>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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
20
yarn.lock
20
yarn.lock
|
@ -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"
|
||||
|
|
Loading…
Reference in a new issue