diff options
Diffstat (limited to 'src/components/settings/services')
-rw-r--r-- | src/components/settings/services/EditServiceForm.js | 57 |
1 files changed, 43 insertions, 14 deletions
diff --git a/src/components/settings/services/EditServiceForm.js b/src/components/settings/services/EditServiceForm.js index 5cde0db8e..fa34ac60b 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', |
@@ -63,7 +67,7 @@ const messages = defineMessages({ | |||
63 | }, | 67 | }, |
64 | customUrlPremiumInfo: { | 68 | customUrlPremiumInfo: { |
65 | id: 'settings.service.form.customUrlPremiumInfo', | 69 | id: 'settings.service.form.customUrlPremiumInfo', |
66 | defaultMessage: '!!!To add self hosted services, you need a Franz Premium Supporter Account.', | 70 | defaultMessage: '!!!To add self hosted services, you need a Ferdi Premium Supporter Account.', |
67 | }, | 71 | }, |
68 | customUrlUpgradeAccount: { | 72 | customUrlUpgradeAccount: { |
69 | id: 'settings.service.form.customUrlUpgradeAccount', | 73 | id: 'settings.service.form.customUrlUpgradeAccount', |
@@ -103,11 +107,11 @@ const messages = defineMessages({ | |||
103 | }, | 107 | }, |
104 | proxyRestartInfo: { | 108 | proxyRestartInfo: { |
105 | id: 'settings.service.form.proxy.restartInfo', | 109 | id: 'settings.service.form.proxy.restartInfo', |
106 | defaultMessage: '!!!Please restart Franz after changing proxy Settings.', | 110 | defaultMessage: '!!!Please restart Ferdi after changing proxy Settings.', |
107 | }, | 111 | }, |
108 | proxyInfo: { | 112 | proxyInfo: { |
109 | id: 'settings.service.form.proxy.info', | 113 | id: 'settings.service.form.proxy.info', |
110 | defaultMessage: '!!!Proxy settings will not be synchronized with the Franz servers.', | 114 | defaultMessage: '!!!Proxy settings will not be synchronized with the Ferdi servers.', |
111 | }, | 115 | }, |
112 | }); | 116 | }); |
113 | 117 | ||
@@ -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, |
@@ -155,7 +161,7 @@ export default @observer class EditServiceForm extends Component { | |||
155 | const values = form.values(); | 161 | const values = form.values(); |
156 | let isValid = true; | 162 | let isValid = true; |
157 | 163 | ||
158 | const files = form.$('customIcon').files; | 164 | const { files } = form.$('customIcon'); |
159 | if (files) { | 165 | if (files) { |
160 | values.iconFile = files[0]; | 166 | values.iconFile = files[0]; |
161 | } | 167 | } |
@@ -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; |
@@ -303,6 +328,18 @@ export default @observer class EditServiceForm extends Component { | |||
303 | )} | 328 | )} |
304 | </Tabs> | 329 | </Tabs> |
305 | )} | 330 | )} |
331 | |||
332 | {recipe.message && ( | ||
333 | <p | ||
334 | className="settings__message" | ||
335 | style={{ | ||
336 | marginTop: 0, | ||
337 | }} | ||
338 | > | ||
339 | <span className="mdi mdi-information" /> | ||
340 | {recipe.message} | ||
341 | </p> | ||
342 | )} | ||
306 | <div className="service-flex-grid"> | 343 | <div className="service-flex-grid"> |
307 | <div className="settings__options"> | 344 | <div className="settings__options"> |
308 | <div className="settings__settings-group"> | 345 | <div className="settings__settings-group"> |
@@ -329,9 +366,7 @@ export default @observer class EditServiceForm extends Component { | |||
329 | 366 | ||
330 | <div className="settings__settings-group"> | 367 | <div className="settings__settings-group"> |
331 | <h3>{intl.formatMessage(messages.headlineGeneral)}</h3> | 368 | <h3>{intl.formatMessage(messages.headlineGeneral)}</h3> |
332 | {recipe.hasDarkMode && ( | 369 | <Toggle field={form.$('isDarkModeEnabled')} /> |
333 | <Toggle field={form.$('isDarkModeEnabled')} /> | ||
334 | )} | ||
335 | <Toggle field={form.$('isEnabled')} /> | 370 | <Toggle field={form.$('isEnabled')} /> |
336 | </div> | 371 | </div> |
337 | </div> | 372 | </div> |
@@ -394,18 +429,12 @@ export default @observer class EditServiceForm extends Component { | |||
394 | </div> | 429 | </div> |
395 | </PremiumFeatureContainer> | 430 | </PremiumFeatureContainer> |
396 | )} | 431 | )} |
397 | |||
398 | {recipe.message && ( | ||
399 | <p className="settings__message"> | ||
400 | <span className="mdi mdi-information" /> | ||
401 | {recipe.message} | ||
402 | </p> | ||
403 | )} | ||
404 | </form> | 432 | </form> |
405 | </div> | 433 | </div> |
406 | <div className="settings__controls"> | 434 | <div className="settings__controls"> |
407 | {/* Delete Button */} | 435 | {/* Delete Button */} |
408 | {action === 'edit' && deleteButton} | 436 | {action === 'edit' && deleteButton} |
437 | {action === 'edit' && openDarkmodeCssButton} | ||
409 | 438 | ||
410 | {/* Save Button */} | 439 | {/* Save Button */} |
411 | {isSaving || isValidatingCustomUrl ? ( | 440 | {isSaving || isValidatingCustomUrl ? ( |