diff options
author | 2019-10-18 20:15:56 +0200 | |
---|---|---|
committer | 2019-10-18 20:15:56 +0200 | |
commit | d443bca3c82230dd6b9c59d55fbde01a051a6ab5 (patch) | |
tree | 68751f48cc2ed70d0e78a1f5bb102ee9daedd334 /src/components | |
parent | Fix lint (diff) | |
parent | Fix lint (diff) | |
download | ferdium-app-d443bca3c82230dd6b9c59d55fbde01a051a6ab5.tar.gz ferdium-app-d443bca3c82230dd6b9c59d55fbde01a051a6ab5.tar.zst ferdium-app-d443bca3c82230dd6b9c59d55fbde01a051a6ab5.zip |
Merge branch 'develop' into local-server
Diffstat (limited to 'src/components')
-rw-r--r-- | src/components/auth/Pricing.js | 2 | ||||
-rw-r--r-- | src/components/layout/Sidebar.js | 8 | ||||
-rw-r--r-- | src/components/services/content/ServiceView.js | 2 | ||||
-rw-r--r-- | src/components/services/content/Services.js | 2 | ||||
-rw-r--r-- | src/components/settings/services/EditServiceForm.js | 30 | ||||
-rw-r--r-- | src/components/settings/settings/EditSettingsForm.js | 32 | ||||
-rw-r--r-- | src/components/subscription/TrialForm.js | 2 | ||||
-rw-r--r-- | src/components/ui/Button.js | 15 | ||||
-rw-r--r-- | src/components/ui/FullscreenLoader/index.js | 19 | ||||
-rw-r--r-- | src/components/ui/FullscreenLoader/styles.js | 1 | ||||
-rw-r--r-- | src/components/ui/Loader.js | 15 | ||||
-rw-r--r-- | src/components/ui/WebviewLoader/index.js | 2 |
12 files changed, 110 insertions, 20 deletions
diff --git a/src/components/auth/Pricing.js b/src/components/auth/Pricing.js index a77ad7742..aadb18d91 100644 --- a/src/components/auth/Pricing.js +++ b/src/components/auth/Pricing.js | |||
@@ -95,7 +95,7 @@ const styles = theme => ({ | |||
95 | }, | 95 | }, |
96 | }); | 96 | }); |
97 | 97 | ||
98 | export default @observer @injectSheet(styles) class Signup extends Component { | 98 | export default @injectSheet(styles) @observer class Signup extends Component { |
99 | static propTypes = { | 99 | static propTypes = { |
100 | onSubmit: PropTypes.func.isRequired, | 100 | onSubmit: PropTypes.func.isRequired, |
101 | isLoadingRequiredData: PropTypes.bool.isRequired, | 101 | isLoadingRequiredData: PropTypes.bool.isRequired, |
diff --git a/src/components/layout/Sidebar.js b/src/components/layout/Sidebar.js index d0cae3443..f7d10735c 100644 --- a/src/components/layout/Sidebar.js +++ b/src/components/layout/Sidebar.js | |||
@@ -116,7 +116,7 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp | |||
116 | { stores.settings.all.app.lockingFeatureEnabled ? ( | 116 | { stores.settings.all.app.lockingFeatureEnabled ? ( |
117 | <button | 117 | <button |
118 | type="button" | 118 | type="button" |
119 | className={`sidebar__button sidebar__button--audio ${isAppMuted ? 'is-muted' : ''}`} | 119 | className="sidebar__button" |
120 | onClick={() => { | 120 | onClick={() => { |
121 | // Disable lock first - otherwise the application might not update correctly | 121 | // Disable lock first - otherwise the application might not update correctly |
122 | actions.settings.update({ | 122 | actions.settings.update({ |
@@ -201,6 +201,12 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp | |||
201 | data-tip={`${intl.formatMessage(messages.settings)} (${ctrlKey}+,)`} | 201 | data-tip={`${intl.formatMessage(messages.settings)} (${ctrlKey}+,)`} |
202 | > | 202 | > |
203 | <i className="mdi mdi-settings" /> | 203 | <i className="mdi mdi-settings" /> |
204 | { (this.props.stores.app.updateStatus === this.props.stores.app.updateStatusTypes.AVAILABLE | ||
205 | || this.props.stores.app.updateStatus === this.props.stores.app.updateStatusTypes.DOWNLOADED) && ( | ||
206 | <span className="update-availible"> | ||
207 | • | ||
208 | </span> | ||
209 | ) } | ||
204 | </button> | 210 | </button> |
205 | {this.state.tooltipEnabled && ( | 211 | {this.state.tooltipEnabled && ( |
206 | <ReactTooltip place="right" type="dark" effect="solid" /> | 212 | <ReactTooltip place="right" type="dark" effect="solid" /> |
diff --git a/src/components/services/content/ServiceView.js b/src/components/services/content/ServiceView.js index 664a494c1..49ee24361 100644 --- a/src/components/services/content/ServiceView.js +++ b/src/components/services/content/ServiceView.js | |||
@@ -15,7 +15,7 @@ import SettingsStore from '../../../stores/SettingsStore'; | |||
15 | import WebControlsScreen from '../../../features/webControls/containers/WebControlsScreen'; | 15 | import WebControlsScreen from '../../../features/webControls/containers/WebControlsScreen'; |
16 | import { CUSTOM_WEBSITE_ID } from '../../../features/webControls/constants'; | 16 | import { CUSTOM_WEBSITE_ID } from '../../../features/webControls/constants'; |
17 | 17 | ||
18 | export default @observer @inject('stores', 'actions') class ServiceView extends Component { | 18 | export default @inject('stores', 'actions') @observer class ServiceView extends Component { |
19 | static propTypes = { | 19 | static propTypes = { |
20 | service: PropTypes.instanceOf(ServiceModel).isRequired, | 20 | service: PropTypes.instanceOf(ServiceModel).isRequired, |
21 | setWebviewReference: PropTypes.func.isRequired, | 21 | setWebviewReference: PropTypes.func.isRequired, |
diff --git a/src/components/services/content/Services.js b/src/components/services/content/Services.js index 6d7909362..80f17d8f2 100644 --- a/src/components/services/content/Services.js +++ b/src/components/services/content/Services.js | |||
@@ -44,7 +44,7 @@ const styles = { | |||
44 | }, | 44 | }, |
45 | }; | 45 | }; |
46 | 46 | ||
47 | export default @observer @inject('actions') @injectSheet(styles) class Services extends Component { | 47 | export default @injectSheet(styles) @inject('actions') @observer class Services extends Component { |
48 | static propTypes = { | 48 | static propTypes = { |
49 | services: MobxPropTypes.arrayOrObservableArray, | 49 | services: MobxPropTypes.arrayOrObservableArray, |
50 | setWebviewReference: PropTypes.func.isRequired, | 50 | setWebviewReference: PropTypes.func.isRequired, |
diff --git a/src/components/settings/services/EditServiceForm.js b/src/components/settings/services/EditServiceForm.js index 5fe00cb8b..76138aa15 100644 --- a/src/components/settings/services/EditServiceForm.js +++ b/src/components/settings/services/EditServiceForm.js | |||
@@ -29,6 +29,10 @@ const messages = defineMessages({ | |||
29 | id: 'settings.service.form.deleteButton', | 29 | id: 'settings.service.form.deleteButton', |
30 | defaultMessage: '!!!Delete Service', | 30 | defaultMessage: '!!!Delete Service', |
31 | }, | 31 | }, |
32 | openDarkmodeCss: { | ||
33 | id: 'settings.service.form.openDarkmodeCss', | ||
34 | defaultMessage: '!!!Open darkmode.css', | ||
35 | }, | ||
32 | availableServices: { | 36 | availableServices: { |
33 | id: 'settings.service.form.availableServices', | 37 | id: 'settings.service.form.availableServices', |
34 | defaultMessage: '!!!Available services', | 38 | defaultMessage: '!!!Available services', |
@@ -127,6 +131,8 @@ export default @observer class EditServiceForm extends Component { | |||
127 | form: PropTypes.instanceOf(Form).isRequired, | 131 | form: PropTypes.instanceOf(Form).isRequired, |
128 | onSubmit: PropTypes.func.isRequired, | 132 | onSubmit: PropTypes.func.isRequired, |
129 | onDelete: PropTypes.func.isRequired, | 133 | onDelete: PropTypes.func.isRequired, |
134 | openDarkmodeCss: PropTypes.func.isRequired, | ||
135 | isOpeningDarkModeCss: PropTypes.bool.isRequired, | ||
130 | isSaving: PropTypes.bool.isRequired, | 136 | isSaving: PropTypes.bool.isRequired, |
131 | isDeleting: PropTypes.bool.isRequired, | 137 | isDeleting: PropTypes.bool.isRequired, |
132 | isProxyFeatureEnabled: PropTypes.bool.isRequired, | 138 | isProxyFeatureEnabled: PropTypes.bool.isRequired, |
@@ -193,6 +199,8 @@ export default @observer class EditServiceForm extends Component { | |||
193 | isSaving, | 199 | isSaving, |
194 | isDeleting, | 200 | isDeleting, |
195 | onDelete, | 201 | onDelete, |
202 | openDarkmodeCss, | ||
203 | isOpeningDarkModeCss, | ||
196 | isProxyFeatureEnabled, | 204 | isProxyFeatureEnabled, |
197 | isServiceProxyIncludedInCurrentPlan, | 205 | isServiceProxyIncludedInCurrentPlan, |
198 | isSpellcheckerIncludedInCurrentPlan, | 206 | isSpellcheckerIncludedInCurrentPlan, |
@@ -218,6 +226,23 @@ export default @observer class EditServiceForm extends Component { | |||
218 | /> | 226 | /> |
219 | ); | 227 | ); |
220 | 228 | ||
229 | const openDarkmodeCssButton = isOpeningDarkModeCss ? ( | ||
230 | <Button | ||
231 | label={intl.formatMessage(messages.openDarkmodeCss)} | ||
232 | loaded={false} | ||
233 | buttonType="secondary" | ||
234 | className="settings__open-dark-mode-button" | ||
235 | disabled | ||
236 | /> | ||
237 | ) : ( | ||
238 | <Button | ||
239 | buttonType="secondary" | ||
240 | label={intl.formatMessage(messages.openDarkmodeCss)} | ||
241 | className="settings__open-dark-mode-button" | ||
242 | onClick={openDarkmodeCss} | ||
243 | /> | ||
244 | ); | ||
245 | |||
221 | let activeTabIndex = 0; | 246 | let activeTabIndex = 0; |
222 | if (recipe.hasHostedOption && service.team) { | 247 | if (recipe.hasHostedOption && service.team) { |
223 | activeTabIndex = 1; | 248 | activeTabIndex = 1; |
@@ -329,9 +354,7 @@ export default @observer class EditServiceForm extends Component { | |||
329 | 354 | ||
330 | <div className="settings__settings-group"> | 355 | <div className="settings__settings-group"> |
331 | <h3>{intl.formatMessage(messages.headlineGeneral)}</h3> | 356 | <h3>{intl.formatMessage(messages.headlineGeneral)}</h3> |
332 | {recipe.hasDarkMode && ( | 357 | <Toggle field={form.$('isDarkModeEnabled')} /> |
333 | <Toggle field={form.$('isDarkModeEnabled')} /> | ||
334 | )} | ||
335 | <Toggle field={form.$('isEnabled')} /> | 358 | <Toggle field={form.$('isEnabled')} /> |
336 | </div> | 359 | </div> |
337 | </div> | 360 | </div> |
@@ -406,6 +429,7 @@ export default @observer class EditServiceForm extends Component { | |||
406 | <div className="settings__controls"> | 429 | <div className="settings__controls"> |
407 | {/* Delete Button */} | 430 | {/* Delete Button */} |
408 | {action === 'edit' && deleteButton} | 431 | {action === 'edit' && deleteButton} |
432 | {action === 'edit' && openDarkmodeCssButton} | ||
409 | 433 | ||
410 | {/* Save Button */} | 434 | {/* Save Button */} |
411 | {isSaving || isValidatingCustomUrl ? ( | 435 | {isSaving || isValidatingCustomUrl ? ( |
diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js index b01368f69..2be5c4ed7 100644 --- a/src/components/settings/settings/EditSettingsForm.js +++ b/src/components/settings/settings/EditSettingsForm.js | |||
@@ -79,6 +79,14 @@ const messages = defineMessages({ | |||
79 | id: 'settings.app.headlineAppearance', | 79 | id: 'settings.app.headlineAppearance', |
80 | defaultMessage: '!!!Appearance', | 80 | defaultMessage: '!!!Appearance', |
81 | }, | 81 | }, |
82 | universalDarkModeInfo: { | ||
83 | id: 'settings.app.universalDarkModeInfo', | ||
84 | defaultMessage: '!!!Universal Dark Mode tries to dynamically generate dark mode styles for services that are otherwise not currently supported.', | ||
85 | }, | ||
86 | accentColorInfo: { | ||
87 | id: 'settings.app.accentColorInfo', | ||
88 | defaultMessage: '!!!Write your accent color in a CSS-compatible format. (Default: #7367f0)', | ||
89 | }, | ||
82 | headlineAdvanced: { | 90 | headlineAdvanced: { |
83 | id: 'settings.app.headlineAdvanced', | 91 | id: 'settings.app.headlineAdvanced', |
84 | defaultMessage: '!!!Advanced', | 92 | defaultMessage: '!!!Advanced', |
@@ -152,6 +160,7 @@ export default @observer class EditSettingsForm extends Component { | |||
152 | server: PropTypes.string.isRequired, | 160 | server: PropTypes.string.isRequired, |
153 | noUpdates: PropTypes.bool.isRequired, | 161 | noUpdates: PropTypes.bool.isRequired, |
154 | hibernationEnabled: PropTypes.bool.isRequired, | 162 | hibernationEnabled: PropTypes.bool.isRequired, |
163 | isDarkmodeEnabled: PropTypes.bool.isRequired, | ||
155 | openProcessManager: PropTypes.func.isRequired, | 164 | openProcessManager: PropTypes.func.isRequired, |
156 | }; | 165 | }; |
157 | 166 | ||
@@ -188,6 +197,7 @@ export default @observer class EditSettingsForm extends Component { | |||
188 | server, | 197 | server, |
189 | noUpdates, | 198 | noUpdates, |
190 | hibernationEnabled, | 199 | hibernationEnabled, |
200 | isDarkmodeEnabled, | ||
191 | openProcessManager, | 201 | openProcessManager, |
192 | } = this.props; | 202 | } = this.props; |
193 | const { intl } = this.context; | 203 | const { intl } = this.context; |
@@ -373,6 +383,28 @@ export default @observer class EditSettingsForm extends Component { | |||
373 | <Toggle field={form.$('showDisabledServices')} /> | 383 | <Toggle field={form.$('showDisabledServices')} /> |
374 | <Toggle field={form.$('showMessageBadgeWhenMuted')} /> | 384 | <Toggle field={form.$('showMessageBadgeWhenMuted')} /> |
375 | <Toggle field={form.$('darkMode')} /> | 385 | <Toggle field={form.$('darkMode')} /> |
386 | {isDarkmodeEnabled && ( | ||
387 | <> | ||
388 | <Toggle field={form.$('universalDarkMode')} /> | ||
389 | <p | ||
390 | className="settings__message" | ||
391 | style={{ | ||
392 | borderTop: 0, marginTop: 0, paddingTop: 0, marginBottom: '2rem', | ||
393 | }} | ||
394 | > | ||
395 | <span> | ||
396 | { intl.formatMessage(messages.universalDarkModeInfo) } | ||
397 | </span> | ||
398 | </p> | ||
399 | </> | ||
400 | )} | ||
401 | |||
402 | <Input | ||
403 | placeholder="Accent Color" | ||
404 | onChange={e => this.submit(e)} | ||
405 | field={form.$('accentColor')} | ||
406 | /> | ||
407 | <p>{intl.formatMessage(messages.accentColorInfo)}</p> | ||
376 | 408 | ||
377 | {/* Language */} | 409 | {/* Language */} |
378 | <h2 id="language">{intl.formatMessage(messages.headlineLanguage)}</h2> | 410 | <h2 id="language">{intl.formatMessage(messages.headlineLanguage)}</h2> |
diff --git a/src/components/subscription/TrialForm.js b/src/components/subscription/TrialForm.js index 9ed548f16..6ccdf20ae 100644 --- a/src/components/subscription/TrialForm.js +++ b/src/components/subscription/TrialForm.js | |||
@@ -56,7 +56,7 @@ const styles = theme => ({ | |||
56 | }, | 56 | }, |
57 | }); | 57 | }); |
58 | 58 | ||
59 | export default @observer @injectSheet(styles) class TrialForm extends Component { | 59 | export default @injectSheet(styles) @observer class TrialForm extends Component { |
60 | static propTypes = { | 60 | static propTypes = { |
61 | activateTrial: PropTypes.func.isRequired, | 61 | activateTrial: PropTypes.func.isRequired, |
62 | isActivatingTrial: PropTypes.bool.isRequired, | 62 | isActivatingTrial: PropTypes.bool.isRequired, |
diff --git a/src/components/ui/Button.js b/src/components/ui/Button.js index e2d7cea83..5066b9c06 100644 --- a/src/components/ui/Button.js +++ b/src/components/ui/Button.js | |||
@@ -1,10 +1,10 @@ | |||
1 | import React, { Component } from 'react'; | 1 | import React, { Component } from 'react'; |
2 | import PropTypes from 'prop-types'; | 2 | import PropTypes from 'prop-types'; |
3 | import { observer } from 'mobx-react'; | 3 | import { observer, inject } from 'mobx-react'; |
4 | import Loader from 'react-loader'; | 4 | import Loader from 'react-loader'; |
5 | import classnames from 'classnames'; | 5 | import classnames from 'classnames'; |
6 | 6 | ||
7 | export default @observer class Button extends Component { | 7 | export default @inject('stores') @observer class Button extends Component { |
8 | static propTypes = { | 8 | static propTypes = { |
9 | className: PropTypes.string, | 9 | className: PropTypes.string, |
10 | label: PropTypes.string.isRequired, | 10 | label: PropTypes.string.isRequired, |
@@ -14,12 +14,19 @@ export default @observer class Button extends Component { | |||
14 | buttonType: PropTypes.string, | 14 | buttonType: PropTypes.string, |
15 | loaded: PropTypes.bool, | 15 | loaded: PropTypes.bool, |
16 | htmlForm: PropTypes.string, | 16 | htmlForm: PropTypes.string, |
17 | stores: PropTypes.shape({ | ||
18 | settings: PropTypes.shape({ | ||
19 | app: PropTypes.shape({ | ||
20 | accentColor: PropTypes.string.isRequired, | ||
21 | }).isRequired, | ||
22 | }).isRequired, | ||
23 | }).isRequired, | ||
17 | }; | 24 | }; |
18 | 25 | ||
19 | static defaultProps = { | 26 | static defaultProps = { |
20 | className: null, | 27 | className: null, |
21 | disabled: false, | 28 | disabled: false, |
22 | onClick: () => {}, | 29 | onClick: () => { }, |
23 | type: 'button', | 30 | type: 'button', |
24 | buttonType: '', | 31 | buttonType: '', |
25 | loaded: true, | 32 | loaded: true, |
@@ -69,7 +76,7 @@ export default @observer class Button extends Component { | |||
69 | loaded={loaded} | 76 | loaded={loaded} |
70 | lines={10} | 77 | lines={10} |
71 | scale={0.4} | 78 | scale={0.4} |
72 | color={buttonType !== 'secondary' ? '#FFF' : '#7367F0'} | 79 | color={buttonType !== 'secondary' ? '#FFF' : this.props.stores.settings.app.accentColor} |
73 | component="span" | 80 | component="span" |
74 | /> | 81 | /> |
75 | {label} | 82 | {label} |
diff --git a/src/components/ui/FullscreenLoader/index.js b/src/components/ui/FullscreenLoader/index.js index 06dab1eb6..d8cdc2e8a 100644 --- a/src/components/ui/FullscreenLoader/index.js +++ b/src/components/ui/FullscreenLoader/index.js | |||
@@ -1,6 +1,6 @@ | |||
1 | import React, { Component } from 'react'; | 1 | import React, { Component } from 'react'; |
2 | import PropTypes from 'prop-types'; | 2 | import PropTypes from 'prop-types'; |
3 | import { observer } from 'mobx-react'; | 3 | import { observer, inject } from 'mobx-react'; |
4 | import injectSheet, { withTheme } from 'react-jss'; | 4 | import injectSheet, { withTheme } from 'react-jss'; |
5 | import classnames from 'classnames'; | 5 | import classnames from 'classnames'; |
6 | 6 | ||
@@ -8,7 +8,7 @@ import Loader from '../Loader'; | |||
8 | 8 | ||
9 | import styles from './styles'; | 9 | import styles from './styles'; |
10 | 10 | ||
11 | export default @observer @withTheme @injectSheet(styles) class FullscreenLoader extends Component { | 11 | export default @inject('stores') @withTheme @injectSheet(styles) @observer class FullscreenLoader extends Component { |
12 | static propTypes = { | 12 | static propTypes = { |
13 | className: PropTypes.string, | 13 | className: PropTypes.string, |
14 | title: PropTypes.string.isRequired, | 14 | title: PropTypes.string.isRequired, |
@@ -16,6 +16,13 @@ export default @observer @withTheme @injectSheet(styles) class FullscreenLoader | |||
16 | theme: PropTypes.object.isRequired, | 16 | theme: PropTypes.object.isRequired, |
17 | spinnerColor: PropTypes.string, | 17 | spinnerColor: PropTypes.string, |
18 | children: PropTypes.node, | 18 | children: PropTypes.node, |
19 | stores: PropTypes.shape({ | ||
20 | settings: PropTypes.shape({ | ||
21 | app: PropTypes.shape({ | ||
22 | accentColor: PropTypes.string.isRequired, | ||
23 | }).isRequired, | ||
24 | }).isRequired, | ||
25 | }).isRequired, | ||
19 | }; | 26 | }; |
20 | 27 | ||
21 | static defaultProps = { | 28 | static defaultProps = { |
@@ -32,10 +39,16 @@ export default @observer @withTheme @injectSheet(styles) class FullscreenLoader | |||
32 | spinnerColor, | 39 | spinnerColor, |
33 | className, | 40 | className, |
34 | theme, | 41 | theme, |
42 | stores, | ||
35 | } = this.props; | 43 | } = this.props; |
36 | 44 | ||
37 | return ( | 45 | return ( |
38 | <div className={classes.wrapper}> | 46 | <div |
47 | className={classes.wrapper} | ||
48 | style={{ | ||
49 | background: stores.app.accentColor, | ||
50 | }} | ||
51 | > | ||
39 | <div | 52 | <div |
40 | className={classnames({ | 53 | className={classnames({ |
41 | [`${classes.component}`]: true, | 54 | [`${classes.component}`]: true, |
diff --git a/src/components/ui/FullscreenLoader/styles.js b/src/components/ui/FullscreenLoader/styles.js index d516781a8..64d24e4ce 100644 --- a/src/components/ui/FullscreenLoader/styles.js +++ b/src/components/ui/FullscreenLoader/styles.js | |||
@@ -4,7 +4,6 @@ export default { | |||
4 | alignItems: 'center', | 4 | alignItems: 'center', |
5 | position: 'absolute', | 5 | position: 'absolute', |
6 | width: '100%', | 6 | width: '100%', |
7 | background: 'linear-gradient( 135deg, #CE9FFC 10%, #7367F0 100%)', | ||
8 | }, | 7 | }, |
9 | component: { | 8 | component: { |
10 | width: '100%', | 9 | width: '100%', |
diff --git a/src/components/ui/Loader.js b/src/components/ui/Loader.js index de8769b6c..4d7113aa1 100644 --- a/src/components/ui/Loader.js +++ b/src/components/ui/Loader.js | |||
@@ -1,22 +1,30 @@ | |||
1 | import React, { Component } from 'react'; | 1 | import React, { Component } from 'react'; |
2 | import { observer, inject } from 'mobx-react'; | ||
2 | import PropTypes from 'prop-types'; | 3 | import PropTypes from 'prop-types'; |
3 | import Loader from 'react-loader'; | 4 | import Loader from 'react-loader'; |
4 | 5 | ||
5 | import { oneOrManyChildElements } from '../../prop-types'; | 6 | import { oneOrManyChildElements } from '../../prop-types'; |
6 | 7 | ||
7 | export default class LoaderComponent extends Component { | 8 | export default @inject('stores') @observer class LoaderComponent extends Component { |
8 | static propTypes = { | 9 | static propTypes = { |
9 | children: oneOrManyChildElements, | 10 | children: oneOrManyChildElements, |
10 | loaded: PropTypes.bool, | 11 | loaded: PropTypes.bool, |
11 | className: PropTypes.string, | 12 | className: PropTypes.string, |
12 | color: PropTypes.string, | 13 | color: PropTypes.string, |
14 | stores: PropTypes.shape({ | ||
15 | settings: PropTypes.shape({ | ||
16 | app: PropTypes.shape({ | ||
17 | accentColor: PropTypes.string.isRequired, | ||
18 | }).isRequired, | ||
19 | }).isRequired, | ||
20 | }).isRequired, | ||
13 | }; | 21 | }; |
14 | 22 | ||
15 | static defaultProps = { | 23 | static defaultProps = { |
16 | children: null, | 24 | children: null, |
17 | loaded: false, | 25 | loaded: false, |
18 | className: '', | 26 | className: '', |
19 | color: '#7367F0', | 27 | color: 'ACCENT', |
20 | }; | 28 | }; |
21 | 29 | ||
22 | render() { | 30 | render() { |
@@ -24,9 +32,10 @@ export default class LoaderComponent extends Component { | |||
24 | children, | 32 | children, |
25 | loaded, | 33 | loaded, |
26 | className, | 34 | className, |
27 | color, | ||
28 | } = this.props; | 35 | } = this.props; |
29 | 36 | ||
37 | const color = this.props.color !== 'ACCENT' ? this.props.color : this.props.stores.settings.app.accentColor; | ||
38 | |||
30 | return ( | 39 | return ( |
31 | <Loader | 40 | <Loader |
32 | loaded={loaded} | 41 | loaded={loaded} |
diff --git a/src/components/ui/WebviewLoader/index.js b/src/components/ui/WebviewLoader/index.js index 58b6b6f1b..923f10327 100644 --- a/src/components/ui/WebviewLoader/index.js +++ b/src/components/ui/WebviewLoader/index.js | |||
@@ -14,7 +14,7 @@ const messages = defineMessages({ | |||
14 | }, | 14 | }, |
15 | }); | 15 | }); |
16 | 16 | ||
17 | export default @observer @injectSheet(styles) class WebviewLoader extends Component { | 17 | export default @injectSheet(styles) @observer class WebviewLoader extends Component { |
18 | static propTypes = { | 18 | static propTypes = { |
19 | name: PropTypes.string.isRequired, | 19 | name: PropTypes.string.isRequired, |
20 | classes: PropTypes.object.isRequired, | 20 | classes: PropTypes.object.isRequired, |