update theme based on prop change
This commit is contained in:
parent
7aae6baaa9
commit
4fad161ae0
3 changed files with 16 additions and 5 deletions
|
@ -3,6 +3,7 @@ import { selectPageTitle, selectHistoryIndex, selectActiveHistoryEntry } from 'l
|
|||
import { doRecordScroll } from 'redux/actions/navigation';
|
||||
import { selectUser } from 'lbryinc';
|
||||
import { doAlertError } from 'redux/actions/app';
|
||||
import { selectThemePath } from 'redux/selectors/settings';
|
||||
import App from './view';
|
||||
|
||||
const select = state => ({
|
||||
|
@ -10,6 +11,7 @@ const select = state => ({
|
|||
user: selectUser(state),
|
||||
currentStackIndex: selectHistoryIndex(state),
|
||||
currentPageAttributes: selectActiveHistoryEntry(state),
|
||||
theme: selectThemePath(state),
|
||||
});
|
||||
|
||||
const perform = dispatch => ({
|
||||
|
|
|
@ -6,7 +6,6 @@ import ReactModal from 'react-modal';
|
|||
import throttle from 'util/throttle';
|
||||
import SideBar from 'component/sideBar';
|
||||
import Header from 'component/header';
|
||||
import { whatIsTheTheme } from 'redux/selectors/settings';
|
||||
import { openContextMenu } from '../../util/contextMenu';
|
||||
|
||||
type Props = {
|
||||
|
@ -15,6 +14,7 @@ type Props = {
|
|||
currentStackIndex: number,
|
||||
currentPageAttributes: { path: string, scrollY: number },
|
||||
pageTitle: ?string,
|
||||
theme: string,
|
||||
};
|
||||
|
||||
class App extends React.PureComponent<Props> {
|
||||
|
@ -25,7 +25,7 @@ class App extends React.PureComponent<Props> {
|
|||
}
|
||||
|
||||
componentWillMount() {
|
||||
const { alertError } = this.props;
|
||||
const { alertError, theme } = this.props;
|
||||
|
||||
// TODO: create type for this object
|
||||
// it lives in jsonrpc.js
|
||||
|
@ -34,7 +34,7 @@ class App extends React.PureComponent<Props> {
|
|||
});
|
||||
|
||||
// $FlowFixMe
|
||||
document.documentElement.setAttribute('data-theme', whatIsTheTheme());
|
||||
document.documentElement.setAttribute('data-theme', theme);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
|
@ -54,12 +54,17 @@ class App extends React.PureComponent<Props> {
|
|||
}
|
||||
|
||||
componentDidUpdate(prevProps: Props) {
|
||||
const { currentStackIndex: prevStackIndex } = prevProps;
|
||||
const { currentStackIndex, currentPageAttributes } = this.props;
|
||||
const { currentStackIndex: prevStackIndex, theme: prevTheme } = prevProps;
|
||||
const { currentStackIndex, currentPageAttributes, theme } = this.props;
|
||||
|
||||
if (this.mainContent && currentStackIndex !== prevStackIndex && currentPageAttributes) {
|
||||
this.mainContent.scrollTop = currentPageAttributes.scrollY || 0;
|
||||
}
|
||||
|
||||
if (prevTheme !== theme) {
|
||||
// $FlowFixMe
|
||||
document.documentElement.setAttribute('data-theme', theme);
|
||||
}
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
|
|
|
@ -101,6 +101,10 @@
|
|||
lodash "^4.2.0"
|
||||
to-fast-properties "^2.0.0"
|
||||
|
||||
"@lbry/color@^1.0.2":
|
||||
version "1.0.3"
|
||||
resolved "https://registry.yarnpkg.com/@lbry/color/-/color-1.0.3.tgz#ec22b2c48b0e358759528fb3bbe7ba468d4e41ca"
|
||||
|
||||
"@mapbox/hast-util-table-cell-style@^0.1.3":
|
||||
version "0.1.3"
|
||||
resolved "https://registry.yarnpkg.com/@mapbox/hast-util-table-cell-style/-/hast-util-table-cell-style-0.1.3.tgz#5b7166ae01297d72216932b245e4b2f0b642dca6"
|
||||
|
|
Loading…
Add table
Reference in a new issue