From 537697a6e9757f118d09d9e76362ba1ff617e2c6 Mon Sep 17 00:00:00 2001 From: Markus Hatvan Date: Mon, 13 Sep 2021 14:45:46 +0200 Subject: chore: upgrade intl dependencies (#1920) --- .../services/content/ConnectionLostBanner.js | 16 ++-- .../content/ErrorHandlers/WebviewErrorHandler.js | 38 +++----- src/components/services/content/ServiceDisabled.js | 17 ++-- src/components/services/content/ServiceView.js | 43 +++++---- src/components/services/content/Services.js | 103 +++++++++++---------- .../services/content/WebviewCrashHandler.js | 26 +++--- src/components/services/tabs/TabItem.js | 46 ++++----- src/components/services/tabs/Tabbar.js | 20 ++-- 8 files changed, 152 insertions(+), 157 deletions(-) (limited to 'src/components/services') diff --git a/src/components/services/content/ConnectionLostBanner.js b/src/components/services/content/ConnectionLostBanner.js index ebe863333..423edb3c7 100644 --- a/src/components/services/content/ConnectionLostBanner.js +++ b/src/components/services/content/ConnectionLostBanner.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import { observer } from 'mobx-react'; import injectSheet from 'react-jss'; import { Icon } from '@meetfranz/ui'; -import { intlShape, defineMessages } from 'react-intl'; +import { defineMessages, injectIntl } from 'react-intl'; import { mdiAlert } from '@mdi/js'; import { LIVE_API_FERDI_WEBSITE } from '../../../config'; @@ -12,15 +12,15 @@ import { LIVE_API_FERDI_WEBSITE } from '../../../config'; const messages = defineMessages({ text: { id: 'connectionLostBanner.message', - defaultMessage: '!!!Oh no! Ferdi lost the connection to {name}.', + defaultMessage: 'Oh no! Ferdi lost the connection to {name}.', }, moreInformation: { id: 'connectionLostBanner.informationLink', - defaultMessage: '!!!What happened?', + defaultMessage: 'What happened?', }, cta: { id: 'connectionLostBanner.cta', - defaultMessage: '!!!Reload Service', + defaultMessage: 'Reload Service', }, }); @@ -78,16 +78,12 @@ class ConnectionLostBanner extends Component { reload: PropTypes.func.isRequired, }; - static contextTypes = { - intl: intlShape, - }; - inputRef = React.createRef(); render() { const { classes, name, reload } = this.props; - const { intl } = this.context; + const { intl } = this.props; return (
@@ -110,4 +106,4 @@ class ConnectionLostBanner extends Component { } } -export default ConnectionLostBanner; +export default injectIntl(ConnectionLostBanner); diff --git a/src/components/services/content/ErrorHandlers/WebviewErrorHandler.js b/src/components/services/content/ErrorHandlers/WebviewErrorHandler.js index 36e0ac418..41d84c0b0 100644 --- a/src/components/services/content/ErrorHandlers/WebviewErrorHandler.js +++ b/src/components/services/content/ErrorHandlers/WebviewErrorHandler.js @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { observer } from 'mobx-react'; -import { defineMessages, intlShape } from 'react-intl'; +import { defineMessages, injectIntl } from 'react-intl'; import injectSheet from 'react-jss'; import Button from '../../../ui/Button'; @@ -11,27 +11,29 @@ import styles from './styles'; const messages = defineMessages({ headline: { id: 'service.errorHandler.headline', - defaultMessage: '!!!Oh no!', + defaultMessage: 'Oh no!', }, text: { id: 'service.errorHandler.text', - defaultMessage: '!!!{name} has failed to load.', + defaultMessage: '{name} has failed to load.', }, action: { id: 'service.errorHandler.action', - defaultMessage: '!!!Reload {name}', + defaultMessage: 'Reload {name}', }, editAction: { id: 'service.errorHandler.editAction', - defaultMessage: '!!!Edit {name}', + defaultMessage: 'Edit {name}', }, errorMessage: { id: 'service.errorHandler.message', - defaultMessage: '!!!Error:', + defaultMessage: 'Error:', }, }); -export default @injectSheet(styles) @observer class WebviewErrorHandler extends Component { +@injectSheet(styles) +@observer +class WebviewErrorHandler extends Component { static propTypes = { name: PropTypes.string.isRequired, reload: PropTypes.func.isRequired, @@ -40,30 +42,16 @@ export default @injectSheet(styles) @observer class WebviewErrorHandler extends classes: PropTypes.object.isRequired, }; - static contextTypes = { - intl: intlShape, - }; - render() { - const { - name, - reload, - edit, - errorMessage, - classes, - } = this.props; - const { intl } = this.context; + const { name, reload, edit, errorMessage, classes } = this.props; + const { intl } = this.props; return (

{intl.formatMessage(messages.headline)}

{intl.formatMessage(messages.text, { name })}

- - {intl.formatMessage(messages.errorMessage)} - : - - {' '} + {intl.formatMessage(messages.errorMessage)}:{' '} {errorMessage}

@@ -82,3 +70,5 @@ export default @injectSheet(styles) @observer class WebviewErrorHandler extends ); } } + +export default injectIntl(WebviewErrorHandler); diff --git a/src/components/services/content/ServiceDisabled.js b/src/components/services/content/ServiceDisabled.js index d0f12256e..e59ed58bd 100644 --- a/src/components/services/content/ServiceDisabled.js +++ b/src/components/services/content/ServiceDisabled.js @@ -1,38 +1,35 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { observer } from 'mobx-react'; -import { defineMessages, intlShape } from 'react-intl'; +import { defineMessages, injectIntl } from 'react-intl'; import Button from '../../ui/Button'; const messages = defineMessages({ headline: { id: 'service.disabledHandler.headline', - defaultMessage: '!!!{name} is disabled', + defaultMessage: '{name} is disabled', }, action: { id: 'service.disabledHandler.action', - defaultMessage: '!!!Enable {name}', + defaultMessage: 'Enable {name}', }, }); -export default @observer class ServiceDisabled extends Component { +@observer +class ServiceDisabled extends Component { static propTypes = { name: PropTypes.string.isRequired, enable: PropTypes.func.isRequired, }; - static contextTypes = { - intl: intlShape, - }; - countdownInterval = null; countdownIntervalTimeout = 1000; render() { const { name, enable } = this.props; - const { intl } = this.context; + const { intl } = this.props; return (
@@ -46,3 +43,5 @@ export default @observer class ServiceDisabled extends Component { ); } } + +export default injectIntl(ServiceDisabled); diff --git a/src/components/services/content/ServiceView.js b/src/components/services/content/ServiceView.js index 3fc084ff0..fa866e153 100644 --- a/src/components/services/content/ServiceView.js +++ b/src/components/services/content/ServiceView.js @@ -15,7 +15,9 @@ import SettingsStore from '../../../stores/SettingsStore'; import WebControlsScreen from '../../../features/webControls/containers/WebControlsScreen'; import { CUSTOM_WEBSITE_RECIPE_ID } from '../../../config'; -export default @inject('stores', 'actions') @observer class ServiceView extends Component { +@inject('stores', 'actions') +@observer +class ServiceView extends Component { static propTypes = { service: PropTypes.instanceOf(ServiceModel).isRequired, setWebviewReference: PropTypes.func.isRequired, @@ -63,7 +65,7 @@ export default @inject('stores', 'actions') @observer class ServiceView extends clearTimeout(this.hibernationTimer); } - updateTargetUrl = (event) => { + updateTargetUrl = event => { let visible = true; if (event.url === '' || event.url === '#') { visible = false; @@ -86,11 +88,12 @@ export default @inject('stores', 'actions') @observer class ServiceView extends isSpellcheckerEnabled, } = this.props; - const { - navigationBarBehaviour, - } = stores.settings.app; + const { navigationBarBehaviour } = stores.settings.app; - const showNavBar = navigationBarBehaviour === 'always' || (navigationBarBehaviour === 'custom' && service.recipe.id === CUSTOM_WEBSITE_RECIPE_ID); + const showNavBar = + navigationBarBehaviour === 'always' || + (navigationBarBehaviour === 'custom' && + service.recipe.id === CUSTOM_WEBSITE_RECIPE_ID); const webviewClasses = classnames({ services__webview: true, @@ -101,9 +104,7 @@ export default @inject('stores', 'actions') @observer class ServiceView extends let statusBar = null; if (this.state.statusBarVisible) { - statusBar = ( - - ); + statusBar = ; } return ( @@ -117,11 +118,11 @@ export default @inject('stores', 'actions') @observer class ServiceView extends reload={reload} /> )} - {service.isEnabled && service.isLoading && service.isFirstLoad && !service.isServiceAccessRestricted && ( - + {service.isEnabled && + service.isLoading && + service.isFirstLoad && + !service.isServiceAccessRestricted && ( + )} {service.isError && ( {!service.isHibernating ? ( <> - {showNavBar && ( - - )} + {showNavBar && } ) : (
- 😴 - {' '} - This service is currently hibernating. If this page doesn't close soon, please try reloading Ferdi. + + 😴 + {' '} + This service is currently hibernating. If this page doesn't + close soon, please try reloading Ferdi.
)} @@ -171,3 +172,5 @@ export default @inject('stores', 'actions') @observer class ServiceView extends ); } } + +export default ServiceView; diff --git a/src/components/services/content/Services.js b/src/components/services/content/Services.js index bb93ff7d4..fb43fb816 100644 --- a/src/components/services/content/Services.js +++ b/src/components/services/content/Services.js @@ -2,7 +2,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { observer, PropTypes as MobxPropTypes, inject } from 'mobx-react'; import { Link } from 'react-router'; -import { defineMessages, intlShape } from 'react-intl'; +import { defineMessages, injectIntl } from 'react-intl'; import Confetti from 'react-confetti'; import ms from 'ms'; import injectSheet from 'react-jss'; @@ -14,23 +14,24 @@ import serverlessLogin from '../../../helpers/serverless-helpers'; const messages = defineMessages({ welcome: { id: 'services.welcome', - defaultMessage: '!!!Welcome to Ferdi', + defaultMessage: 'Welcome to Ferdi', }, getStarted: { id: 'services.getStarted', - defaultMessage: '!!!Get started', + defaultMessage: 'Get started', }, login: { id: 'services.login', - defaultMessage: '!!!Please login to use Ferdi.', + defaultMessage: 'Please login to use Ferdi.', }, serverless: { id: 'services.serverless', - defaultMessage: '!!!Use Ferdi without an Account', + defaultMessage: 'Use Ferdi without an Account', }, serverInfo: { id: 'services.serverInfo', - defaultMessage: '!!!Optionally, you can change your Ferdi server by clicking the cog in the bottom left corner. If you are switching over (from one of the hosted servers) to using Ferdi without an account, please be informed that you can export your data from that server and subsequently import it using the Help menu to resurrect all your workspaces and configured services!', + defaultMessage: + 'Optionally, you can change your Ferdi server by clicking the cog in the bottom left corner. If you are switching over (from one of the hosted servers) to using Ferdi without an account, please be informed that you can export your data from that server and subsequently import it using the Help menu to resurrect all your workspaces and configured services!', }, }); @@ -43,7 +44,10 @@ const styles = { }, }; -export default @injectSheet(styles) @inject('actions') @observer class Services extends Component { +@injectSheet(styles) +@inject('actions') +@observer +class Services extends Component { static propTypes = { services: MobxPropTypes.arrayOrObservableArray, setWebviewReference: PropTypes.func.isRequired, @@ -63,10 +67,6 @@ export default @injectSheet(styles) @inject('actions') @observer class Services services: [], }; - static contextTypes = { - intl: intlShape, - }; - state = { showConfetti: true, }; @@ -112,11 +112,9 @@ export default @injectSheet(styles) @inject('actions') @observer class Services isSpellcheckerEnabled, } = this.props; - const { - showConfetti, - } = this.state; + const { showConfetti } = this.state; - const { intl } = this.context; + const { intl } = this.props; const isLoggedIn = Boolean(localStorage.getItem('authToken')); return ( @@ -131,25 +129,28 @@ export default @injectSheet(styles) @inject('actions') @observer class Services
)} {services.length === 0 && ( - +
- Logo + Logo

{intl.formatMessage(messages.welcome)}

- { !isLoggedIn && ( + {!isLoggedIn && ( <>

{intl.formatMessage(messages.login)}

{intl.formatMessage(messages.serverInfo)}

- ) } - - - { isLoggedIn ? intl.formatMessage(messages.getStarted) : 'Login' } + )} + + + {isLoggedIn + ? intl.formatMessage(messages.getStarted) + : 'Login'} {!isLoggedIn && (
); } } + +export default injectIntl(Services); diff --git a/src/components/services/content/WebviewCrashHandler.js b/src/components/services/content/WebviewCrashHandler.js index 10ff0bbbb..a332602be 100644 --- a/src/components/services/content/WebviewCrashHandler.js +++ b/src/components/services/content/WebviewCrashHandler.js @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { observer } from 'mobx-react'; -import { defineMessages, intlShape } from 'react-intl'; +import { defineMessages, injectIntl } from 'react-intl'; import ms from 'ms'; import Button from '../../ui/Button'; @@ -9,35 +9,33 @@ import Button from '../../ui/Button'; const messages = defineMessages({ headline: { id: 'service.crashHandler.headline', - defaultMessage: '!!!Oh no!', + defaultMessage: 'Oh no!', }, text: { id: 'service.crashHandler.text', - defaultMessage: '!!!{name} has caused an error.', + defaultMessage: '{name} has caused an error.', }, action: { id: 'service.crashHandler.action', - defaultMessage: '!!!Reload {name}', + defaultMessage: 'Reload {name}', }, autoReload: { id: 'service.crashHandler.autoReload', - defaultMessage: '!!!Trying to automatically restore {name} in {seconds} seconds', + defaultMessage: + 'Trying to automatically restore {name} in {seconds} seconds', }, }); -export default @observer class WebviewCrashHandler extends Component { +@observer +class WebviewCrashHandler extends Component { static propTypes = { name: PropTypes.string.isRequired, reload: PropTypes.func.isRequired, }; - static contextTypes = { - intl: intlShape, - }; - state = { countdown: ms('10s'), - } + }; countdownInterval = null; @@ -47,7 +45,7 @@ export default @observer class WebviewCrashHandler extends Component { const { reload } = this.props; this.countdownInterval = setInterval(() => { - this.setState((prevState) => ({ + this.setState(prevState => ({ countdown: prevState.countdown - this.countdownIntervalTimeout, })); @@ -60,7 +58,7 @@ export default @observer class WebviewCrashHandler extends Component { render() { const { name, reload } = this.props; - const { intl } = this.context; + const { intl } = this.props; return (
@@ -82,3 +80,5 @@ export default @observer class WebviewCrashHandler extends Component { ); } } + +export default injectIntl(WebviewCrashHandler); diff --git a/src/components/services/tabs/TabItem.js b/src/components/services/tabs/TabItem.js index e5892be5d..b1a3ffbbb 100644 --- a/src/components/services/tabs/TabItem.js +++ b/src/components/services/tabs/TabItem.js @@ -1,6 +1,6 @@ import { Menu, dialog, app, getCurrentWindow } from '@electron/remote'; import React, { Component } from 'react'; -import { defineMessages, intlShape } from 'react-intl'; +import { defineMessages, injectIntl } from 'react-intl'; import PropTypes from 'prop-types'; import { observer } from 'mobx-react'; import classnames from 'classnames'; @@ -20,56 +20,55 @@ const IS_SERVICE_DEBUGGING_ENABLED = ( const messages = defineMessages({ reload: { id: 'tabs.item.reload', - defaultMessage: '!!!Reload', + defaultMessage: 'Reload', }, disableNotifications: { id: 'tabs.item.disableNotifications', - defaultMessage: '!!!Disable notifications', + defaultMessage: 'Disable notifications', }, enableNotifications: { id: 'tabs.item.enableNotification', - defaultMessage: '!!!Enable notifications', + defaultMessage: 'Enable notifications', }, disableAudio: { id: 'tabs.item.disableAudio', - defaultMessage: '!!!Disable audio', + defaultMessage: 'Disable audio', }, enableAudio: { id: 'tabs.item.enableAudio', - defaultMessage: '!!!Enable audio', + defaultMessage: 'Enable audio', }, enableDarkMode: { id: 'tabs.item.enableDarkMode', - defaultMessage: '!!!Enable Dark mode', + defaultMessage: 'Enable Dark mode', }, disableDarkMode: { id: 'tabs.item.disableDarkMode', - defaultMessage: '!!!Disable Dark mode', + defaultMessage: 'Disable Dark mode', }, disableService: { id: 'tabs.item.disableService', - defaultMessage: '!!!Disable Service', + defaultMessage: 'Disable Service', }, enableService: { id: 'tabs.item.enableService', - defaultMessage: '!!!Enable Service', + defaultMessage: 'Enable Service', }, hibernateService: { id: 'tabs.item.hibernateService', - defaultMessage: '!!!Hibernate Service', + defaultMessage: 'Hibernate Service', }, wakeUpService: { id: 'tabs.item.wakeUpService', - defaultMessage: '!!!Wake Up Service', + defaultMessage: 'Wake Up Service', }, deleteService: { id: 'tabs.item.deleteService', - defaultMessage: '!!!Delete Service', + defaultMessage: 'Delete Service', }, confirmDeleteService: { id: 'tabs.item.confirmDeleteService', - defaultMessage: - '!!!Do you really want to delete the {serviceName} service?', + defaultMessage: 'Do you really want to delete the {serviceName} service?', }, }); @@ -134,10 +133,6 @@ class TabItem extends Component { showMessageBadgesEvenWhenMuted: PropTypes.bool.isRequired, }; - static contextTypes = { - intl: intlShape, - }; - @observable isPolled = false; @observable isPollAnswered = false; @@ -185,7 +180,7 @@ class TabItem extends Component { showMessageBadgeWhenMutedSetting, showMessageBadgesEvenWhenMuted, } = this.props; - const { intl } = this.context; + const { intl } = this.props; const menuTemplate = [ { @@ -256,7 +251,10 @@ class TabItem extends Component { detail: intl.formatMessage(messages.confirmDeleteService, { serviceName: service.name || service.recipe.name, }), - buttons: [intl.formatMessage(globalMessages.yes), intl.formatMessage(globalMessages.no)], + buttons: [ + intl.formatMessage(globalMessages.yes), + intl.formatMessage(globalMessages.no), + ], }); if (selection === 0) { deleteService(); @@ -304,7 +302,9 @@ class TabItem extends Component { onClick={clickHandler} onContextMenu={() => menu.popup(getCurrentWindow())} data-tip={`${service.name} ${ - shortcutIndex <= 9 ? `(${cmdOrCtrlShortcutKey(false)}+${shortcutIndex})` : '' + shortcutIndex <= 9 + ? `(${cmdOrCtrlShortcutKey(false)}+${shortcutIndex})` + : '' }`} > @@ -332,4 +332,4 @@ class TabItem extends Component { } } -export default SortableElement(TabItem); +export default injectIntl(SortableElement(TabItem)); diff --git a/src/components/services/tabs/Tabbar.js b/src/components/services/tabs/Tabbar.js index c1421a2b1..a77799819 100644 --- a/src/components/services/tabs/Tabbar.js +++ b/src/components/services/tabs/Tabbar.js @@ -4,7 +4,8 @@ import { observer, PropTypes as MobxPropTypes } from 'mobx-react'; import TabBarSortableList from './TabBarSortableList'; -export default @observer class TabBar extends Component { +@observer +class TabBar extends Component { static propTypes = { services: MobxPropTypes.arrayOrObservableArray.isRequired, setActive: PropTypes.func.isRequired, @@ -26,16 +27,13 @@ export default @observer class TabBar extends Component { }; onSortEnd = ({ oldIndex, newIndex }) => { - const { - enableToolTip, - reorder, - } = this.props; + const { enableToolTip, reorder } = this.props; enableToolTip(); reorder({ oldIndex, newIndex }); }; - shouldPreventSorting = (event) => event.target.tagName !== 'LI'; + shouldPreventSorting = event => event.target.tagName !== 'LI'; toggleService = ({ serviceId, isEnabled }) => { const { updateService } = this.props; @@ -102,10 +100,10 @@ export default @observer class TabBar extends Component { toggleAudio={toggleAudio} toggleDarkMode={toggleDarkMode} deleteService={deleteService} - disableService={(args) => this.disableService(args)} - enableService={(args) => this.enableService(args)} - hibernateService={(args) => this.hibernateService(args)} - wakeUpService={(args) => this.wakeUpService(args)} + disableService={args => this.disableService(args)} + enableService={args => this.enableService(args)} + hibernateService={args => this.hibernateService(args)} + wakeUpService={args => this.wakeUpService(args)} openSettings={openSettings} distance={20} axis={axis} @@ -118,3 +116,5 @@ export default @observer class TabBar extends Component { ); } } + +export default TabBar; -- cgit v1.2.3-70-g09d2