diff options
author | Stefan Malzner <stefan@adlk.io> | 2017-10-13 12:29:40 +0200 |
---|---|---|
committer | Stefan Malzner <stefan@adlk.io> | 2017-10-13 12:29:40 +0200 |
commit | 58cda9cc7fb79ca9df6746de7f9662bc08dc156a (patch) | |
tree | 1211600c2a5d3b5f81c435c6896618111a611720 /src/components/settings/settings | |
download | ferdium-app-58cda9cc7fb79ca9df6746de7f9662bc08dc156a.tar.gz ferdium-app-58cda9cc7fb79ca9df6746de7f9662bc08dc156a.tar.zst ferdium-app-58cda9cc7fb79ca9df6746de7f9662bc08dc156a.zip |
initial commit
Diffstat (limited to 'src/components/settings/settings')
-rw-r--r-- | src/components/settings/settings/EditSettingsForm.js | 148 |
1 files changed, 148 insertions, 0 deletions
diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js new file mode 100644 index 000000000..02736dbb9 --- /dev/null +++ b/src/components/settings/settings/EditSettingsForm.js | |||
@@ -0,0 +1,148 @@ | |||
1 | import { remote } from 'electron'; | ||
2 | import React, { Component } from 'react'; | ||
3 | import PropTypes from 'prop-types'; | ||
4 | import { observer } from 'mobx-react'; | ||
5 | import { defineMessages, intlShape } from 'react-intl'; | ||
6 | |||
7 | import Form from '../../../lib/Form'; | ||
8 | import Button from '../../ui/Button'; | ||
9 | import Toggle from '../../ui/Toggle'; | ||
10 | import Select from '../../ui/Select'; | ||
11 | |||
12 | const messages = defineMessages({ | ||
13 | headline: { | ||
14 | id: 'settings.app.headline', | ||
15 | defaultMessage: '!!!Settings', | ||
16 | }, | ||
17 | headlineGeneral: { | ||
18 | id: 'settings.app.headlineGeneral', | ||
19 | defaultMessage: '!!!General', | ||
20 | }, | ||
21 | headlineLanguage: { | ||
22 | id: 'settings.app.headlineLanguage', | ||
23 | defaultMessage: '!!!Language', | ||
24 | }, | ||
25 | headlineUpdates: { | ||
26 | id: 'settings.app.headlineUpdates', | ||
27 | defaultMessage: '!!!Updates', | ||
28 | }, | ||
29 | buttonSearchForUpdate: { | ||
30 | id: 'settings.app.buttonSearchForUpdate', | ||
31 | defaultMessage: '!!!Check for updates', | ||
32 | }, | ||
33 | buttonInstallUpdate: { | ||
34 | id: 'settings.app.buttonInstallUpdate', | ||
35 | defaultMessage: '!!!Restart & install update', | ||
36 | }, | ||
37 | updateStatusSearching: { | ||
38 | id: 'settings.app.updateStatusSearching', | ||
39 | defaultMessage: '!!!Is searching for update', | ||
40 | }, | ||
41 | updateStatusAvailable: { | ||
42 | id: 'settings.app.updateStatusAvailable', | ||
43 | defaultMessage: '!!!Update available, downloading...', | ||
44 | }, | ||
45 | updateStatusUpToDate: { | ||
46 | id: 'settings.app.updateStatusUpToDate', | ||
47 | defaultMessage: '!!!You are using the latest version of Franz', | ||
48 | }, | ||
49 | currentVersion: { | ||
50 | id: 'settings.app.currentVersion', | ||
51 | defaultMessage: '!!!Current version:', | ||
52 | }, | ||
53 | }); | ||
54 | |||
55 | @observer | ||
56 | export default class EditSettingsForm extends Component { | ||
57 | static propTypes = { | ||
58 | checkForUpdates: PropTypes.func.isRequired, | ||
59 | installUpdate: PropTypes.func.isRequired, | ||
60 | form: PropTypes.instanceOf(Form).isRequired, | ||
61 | onSubmit: PropTypes.func.isRequired, | ||
62 | isCheckingForUpdates: PropTypes.bool.isRequired, | ||
63 | isUpdateAvailable: PropTypes.bool.isRequired, | ||
64 | noUpdateAvailable: PropTypes.bool.isRequired, | ||
65 | updateIsReadyToInstall: PropTypes.bool.isRequired, | ||
66 | }; | ||
67 | |||
68 | static contextTypes = { | ||
69 | intl: intlShape, | ||
70 | }; | ||
71 | |||
72 | submit(e) { | ||
73 | e.preventDefault(); | ||
74 | this.props.form.submit({ | ||
75 | onSuccess: (form) => { | ||
76 | const values = form.values(); | ||
77 | this.props.onSubmit(values); | ||
78 | }, | ||
79 | onError: () => {}, | ||
80 | }); | ||
81 | } | ||
82 | |||
83 | render() { | ||
84 | const { | ||
85 | checkForUpdates, | ||
86 | installUpdate, | ||
87 | form, | ||
88 | isCheckingForUpdates, | ||
89 | isUpdateAvailable, | ||
90 | noUpdateAvailable, | ||
91 | updateIsReadyToInstall, | ||
92 | } = this.props; | ||
93 | const { intl } = this.context; | ||
94 | |||
95 | let updateButtonLabelMessage = messages.buttonSearchForUpdate; | ||
96 | if (isCheckingForUpdates) { | ||
97 | updateButtonLabelMessage = messages.updateStatusSearching; | ||
98 | } else if (isUpdateAvailable) { | ||
99 | updateButtonLabelMessage = messages.updateStatusAvailable; | ||
100 | } else { | ||
101 | updateButtonLabelMessage = messages.buttonSearchForUpdate; | ||
102 | } | ||
103 | |||
104 | return ( | ||
105 | <div className="settings__main"> | ||
106 | <div className="settings__header"> | ||
107 | <h1>{intl.formatMessage(messages.headline)}</h1> | ||
108 | </div> | ||
109 | <div className="settings__body"> | ||
110 | <form | ||
111 | onSubmit={e => this.submit(e)} | ||
112 | onChange={e => this.submit(e)} | ||
113 | id="form" | ||
114 | > | ||
115 | <h2>{intl.formatMessage(messages.headlineGeneral)}</h2> | ||
116 | <Toggle field={form.$('autoLaunchOnStart')} /> | ||
117 | <Toggle field={form.$('runInBackground')} /> | ||
118 | {process.platform === 'win32' && ( | ||
119 | <Toggle field={form.$('minimizeToSystemTray')} /> | ||
120 | )} | ||
121 | <h2>{intl.formatMessage(messages.headlineLanguage)}</h2> | ||
122 | <Select field={form.$('locale')} showLabel={false} /> | ||
123 | <h2>{intl.formatMessage(messages.headlineUpdates)}</h2> | ||
124 | {updateIsReadyToInstall ? ( | ||
125 | <Button | ||
126 | label={intl.formatMessage(messages.buttonInstallUpdate)} | ||
127 | onClick={installUpdate} | ||
128 | /> | ||
129 | ) : ( | ||
130 | <Button | ||
131 | label={intl.formatMessage(updateButtonLabelMessage)} | ||
132 | onClick={checkForUpdates} | ||
133 | disabled={isCheckingForUpdates || isUpdateAvailable} | ||
134 | loaded={!isCheckingForUpdates || !isUpdateAvailable} | ||
135 | /> | ||
136 | )} | ||
137 | {noUpdateAvailable && ( | ||
138 | <p>{intl.formatMessage(messages.updateStatusUpToDate)}</p> | ||
139 | )} | ||
140 | <br /> | ||
141 | <Toggle field={form.$('beta')} /> | ||
142 | {intl.formatMessage(messages.currentVersion)} {remote.app.getVersion()} | ||
143 | </form> | ||
144 | </div> | ||
145 | </div> | ||
146 | ); | ||
147 | } | ||
148 | } | ||