From b30c31f8b7558fc664cee8734573c6d83cfe90e8 Mon Sep 17 00:00:00 2001 From: David Lechner Date: Fri, 29 Jan 2021 11:16:13 -0600 Subject: [PATCH] use shorthand form to map dispatches https://redux.js.org/style-guide/style-guide#use-the-object-shorthand-form-of-mapdispatch-with-connect --- src/components/AboutDialog.tsx | 9 ++++----- src/components/BluetoothButton.tsx | 7 +++---- src/components/Editor.tsx | 13 ++++++------- src/components/FlashButton.tsx | 20 ++++++-------------- src/components/LicenseDialog.tsx | 9 ++++----- src/components/OpenButton.tsx | 16 +++++----------- src/components/ReplButton.tsx | 7 +++---- src/components/RunButton.tsx | 7 +++---- src/components/SaveAsButton.tsx | 9 +++------ src/components/SettingsButton.tsx | 7 +++---- src/components/SettingsDrawer.tsx | 27 ++++++++++++--------------- src/components/StopButton.tsx | 7 +++---- src/components/Terminal.tsx | 9 +++------ 13 files changed, 58 insertions(+), 89 deletions(-) diff --git a/src/components/AboutDialog.tsx b/src/components/AboutDialog.tsx index a53f0ffc..7639d67a 100644 --- a/src/components/AboutDialog.tsx +++ b/src/components/AboutDialog.tsx @@ -7,7 +7,6 @@ import { AnchorButton, Button, Classes, Dialog } from '@blueprintjs/core'; import { WithI18nProps, withI18n } from '@shopify/react-i18n'; import React from 'react'; import { connect } from 'react-redux'; -import { Action, Dispatch } from '../actions'; import { closeAboutDialog, openLicenseDialog } from '../actions/app'; import { RootState } from '../reducers'; import { @@ -73,10 +72,10 @@ const mapStateToProps = (state: RootState): StateProps => ({ showAboutDialog: state.app.showAboutDialog, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onClose: (): Action => dispatch(closeAboutDialog()), - onLicenseButtonClick: (): Action => dispatch(openLicenseDialog()), -}); +const mapDispatchToProps: DispatchProps = { + onClose: closeAboutDialog, + onLicenseButtonClick: openLicenseDialog, +}; export default connect( mapStateToProps, diff --git a/src/components/BluetoothButton.tsx b/src/components/BluetoothButton.tsx index bd455814..2ec44150 100644 --- a/src/components/BluetoothButton.tsx +++ b/src/components/BluetoothButton.tsx @@ -2,7 +2,6 @@ // Copyright (c) 2020 The Pybricks Authors import { connect } from 'react-redux'; -import { Action, Dispatch } from '../actions'; import { toggleBluetooth } from '../actions/ble'; import { RootState } from '../reducers'; import { BleConnectionState } from '../reducers/ble'; @@ -34,8 +33,8 @@ const mapStateToProps = (state: RootState): StateProps => { } }; -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onAction: (): Action => dispatch(toggleBluetooth()), -}); +const mapDispatchToProps: DispatchProps = { + onAction: toggleBluetooth, +}; export default connect(mapStateToProps, mapDispatchToProps)(ActionButton); diff --git a/src/components/Editor.tsx b/src/components/Editor.tsx index 222b51f0..d1d0b2fd 100644 --- a/src/components/Editor.tsx +++ b/src/components/Editor.tsx @@ -14,7 +14,6 @@ import React from 'react'; import AceEditor from 'react-ace'; import { IAceEditor } from 'react-ace/lib/types'; import { connect } from 'react-redux'; -import { Action, Dispatch } from '../actions'; import { setEditSession, storageChanged } from '../actions/editor'; import { compile } from '../actions/mpy'; import { toggleBoolean } from '../actions/settings'; @@ -221,14 +220,14 @@ const mapStateToProps = (state: RootState): StateProps => ({ showDocs: state.settings.showDocs, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onSessionChanged: (s): Action => dispatch(setEditSession(s)), - onProgramStorageChanged: (v): Action => dispatch(storageChanged(v)), +const mapDispatchToProps: DispatchProps = { + onSessionChanged: setEditSession, + onProgramStorageChanged: storageChanged, // REVISIT: the options here might need to be changed - hopefully there is // one setting that works for all hub types for cases where we aren't connected. - onCheck: (script) => dispatch(compile(script)), - onToggleDocs: () => dispatch(toggleBoolean(SettingId.ShowDocs)), -}); + onCheck: compile, + onToggleDocs: () => toggleBoolean(SettingId.ShowDocs), +}; export default connect( mapStateToProps, diff --git a/src/components/FlashButton.tsx b/src/components/FlashButton.tsx index 86d60e28..c8275972 100644 --- a/src/components/FlashButton.tsx +++ b/src/components/FlashButton.tsx @@ -2,7 +2,6 @@ // Copyright (c) 2020-2021 The Pybricks Authors import { connect } from 'react-redux'; -import { Dispatch } from '../actions'; import { flashFirmware } from '../actions/flash-firmware'; import * as notification from '../actions/notification'; import { RootState } from '../reducers'; @@ -25,19 +24,12 @@ const mapStateToProps = (state: RootState): StateProps => ({ progress: state.firmware.progress === null ? undefined : state.firmware.progress, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onFile: (data): void => { - dispatch(flashFirmware(data)); - }, - onReject: (file): void => { - dispatch( - notification.add('error', `'${file.name}' is not a valid firmware file.`), - ); - }, - onClick: (): void => { - dispatch(flashFirmware()); - }, -}); +const mapDispatchToProps: DispatchProps = { + onFile: flashFirmware, + onReject: (file) => + notification.add('error', `'${file.name}' is not a valid firmware file.`), + onClick: () => flashFirmware(), +}; const mergeProps = ( stateProps: StateProps, diff --git a/src/components/LicenseDialog.tsx b/src/components/LicenseDialog.tsx index 50e17fb6..69d2b1af 100644 --- a/src/components/LicenseDialog.tsx +++ b/src/components/LicenseDialog.tsx @@ -15,7 +15,6 @@ import { import { WithI18nProps, withI18n } from '@shopify/react-i18n'; import React from 'react'; import { connect } from 'react-redux'; -import { Action, Dispatch } from '../actions'; import { closeLicenseDialog } from '../actions/app'; import { select } from '../actions/license'; import { RootState } from '../reducers'; @@ -152,10 +151,10 @@ const mapStateToProps = (state: RootState): StateProps => ({ licenseInfo: state.license.selected, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onClose: (): Action => dispatch(closeLicenseDialog()), - onSelectPackage: (info): Action => dispatch(select(info)), -}); +const mapDispatchToProps: DispatchProps = { + onClose: closeLicenseDialog, + onSelectPackage: select, +}; export default connect( mapStateToProps, diff --git a/src/components/OpenButton.tsx b/src/components/OpenButton.tsx index 725dc6f7..5b586281 100644 --- a/src/components/OpenButton.tsx +++ b/src/components/OpenButton.tsx @@ -2,7 +2,6 @@ // Copyright (c) 2020 The Pybricks Authors import { connect } from 'react-redux'; -import { Dispatch } from '../actions'; import * as editor from '../actions/editor'; import * as notification from '../actions/notification'; import { RootState } from '../reducers'; @@ -18,16 +17,11 @@ const mapStateToProps = (state: RootState): StateProps => ({ enabled: state.editor.current !== null, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onFile: (data): void => { - dispatch(editor.open(data)); - }, - onReject: (file): void => { - dispatch( - notification.add('error', `'${file.name}' is not a valid python file.`), - ); - }, -}); +const mapDispatchToProps: DispatchProps = { + onFile: editor.open, + onReject: (file) => + notification.add('error', `'${file.name}' is not a valid python file.`), +}; const mergeProps = ( stateProps: StateProps, diff --git a/src/components/ReplButton.tsx b/src/components/ReplButton.tsx index b09418d7..e6230634 100644 --- a/src/components/ReplButton.tsx +++ b/src/components/ReplButton.tsx @@ -2,7 +2,6 @@ // Copyright (c) 2020 The Pybricks Authors import { connect } from 'react-redux'; -import { Action, Dispatch } from '../actions'; import { repl } from '../actions/hub'; import { RootState } from '../reducers'; import { HubRuntimeState } from '../reducers/hub'; @@ -21,9 +20,9 @@ const mapStateToProps = (state: RootState): StateProps => ({ state.hub.runtime === HubRuntimeState.Error, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onAction: (): Action => dispatch(repl()), -}); +const mapDispatchToProps: DispatchProps = { + onAction: repl, +}; const mergeProps = ( stateProps: StateProps, diff --git a/src/components/RunButton.tsx b/src/components/RunButton.tsx index 1f1462ab..77005fac 100644 --- a/src/components/RunButton.tsx +++ b/src/components/RunButton.tsx @@ -2,7 +2,6 @@ // Copyright (c) 2020 The Pybricks Authors import { connect } from 'react-redux'; -import { Action, Dispatch } from '../actions'; import { downloadAndRun } from '../actions/hub'; import { RootState } from '../reducers'; import { HubRuntimeState } from '../reducers/hub'; @@ -20,9 +19,9 @@ const mapStateToProps = (state: RootState): StateProps => ({ state.editor.current !== null && state.hub.runtime === HubRuntimeState.Idle, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onAction: (): Action => dispatch(downloadAndRun()), -}); +const mapDispatchToProps: DispatchProps = { + onAction: downloadAndRun, +}; const mergeProps = ( stateProps: StateProps, diff --git a/src/components/SaveAsButton.tsx b/src/components/SaveAsButton.tsx index 53da0bca..12df0514 100644 --- a/src/components/SaveAsButton.tsx +++ b/src/components/SaveAsButton.tsx @@ -2,7 +2,6 @@ // Copyright (c) 2020 The Pybricks Authors import { connect } from 'react-redux'; -import { Dispatch } from '../actions'; import * as editor from '../actions/editor'; import { RootState } from '../reducers'; import ActionButton, { ActionButtonProps } from './ActionButton'; @@ -18,11 +17,9 @@ const mapStateToProps = (state: RootState): StateProps => ({ enabled: state.editor.current !== null, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onAction: (): void => { - dispatch(editor.saveAs()); - }, -}); +const mapDispatchToProps: DispatchProps = { + onAction: editor.saveAs, +}; const mergeProps = ( stateProps: StateProps, diff --git a/src/components/SettingsButton.tsx b/src/components/SettingsButton.tsx index 7d4eafb4..e54680f8 100644 --- a/src/components/SettingsButton.tsx +++ b/src/components/SettingsButton.tsx @@ -2,7 +2,6 @@ // Copyright (c) 2021 The Pybricks Authors import { connect } from 'react-redux'; -import { Action, Dispatch } from '../actions'; import { openSettings as openSettings } from '../actions/app'; import ActionButton, { ActionButtonProps } from './ActionButton'; import { TooltipId } from './button-i18n'; @@ -12,9 +11,9 @@ type StateProps = undefined; type DispatchProps = Pick; type OwnProps = Pick; -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onAction: (): Action => dispatch(openSettings()), -}); +const mapDispatchToProps: DispatchProps = { + onAction: openSettings, +}; const mergeProps = ( _stateProps: StateProps, diff --git a/src/components/SettingsDrawer.tsx b/src/components/SettingsDrawer.tsx index ec123ce9..d5c61f60 100644 --- a/src/components/SettingsDrawer.tsx +++ b/src/components/SettingsDrawer.tsx @@ -18,7 +18,6 @@ import { import { WithI18nProps, withI18n } from '@shopify/react-i18n'; import React from 'react'; import { connect } from 'react-redux'; -import { Action, Dispatch } from '../actions'; import { checkForUpdate, closeSettings, @@ -330,20 +329,18 @@ const mapStateToProps = (state: RootState): StateProps => ({ readyForOfflineUse: state.app.readyForOfflineUse, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onClose: (): Action => dispatch(closeSettings()), - onShowDocsChanged: (checked): Action => - dispatch(setBoolean(SettingId.ShowDocs, checked)), - onDarkModeChanged: (checked): Action => - dispatch(setBoolean(SettingId.DarkMode, checked)), - onFlashCurrentProgramChanged: (checked): Action => - dispatch(setBoolean(SettingId.FlashCurrentProgram, checked)), - onAbout: (): Action => dispatch(openAboutDialog()), - onToggleDocs: (): Action => dispatch(toggleBoolean(SettingId.ShowDocs)), - onCheckForUpdate: (registration) => dispatch(checkForUpdate(registration)), - onReload: (registration) => dispatch(reload(registration)), - onInstallPrompt: (event) => dispatch(installPrompt(event)), -}); +const mapDispatchToProps: DispatchProps = { + onClose: closeSettings, + onShowDocsChanged: (checked) => setBoolean(SettingId.ShowDocs, checked), + onDarkModeChanged: (checked) => setBoolean(SettingId.DarkMode, checked), + onFlashCurrentProgramChanged: (checked) => + setBoolean(SettingId.FlashCurrentProgram, checked), + onAbout: openAboutDialog, + onToggleDocs: () => toggleBoolean(SettingId.ShowDocs), + onCheckForUpdate: checkForUpdate, + onReload: reload, + onInstallPrompt: installPrompt, +}; export default connect( mapStateToProps, diff --git a/src/components/StopButton.tsx b/src/components/StopButton.tsx index abc217c9..f0917496 100644 --- a/src/components/StopButton.tsx +++ b/src/components/StopButton.tsx @@ -2,7 +2,6 @@ // Copyright (c) 2020 The Pybricks Authors import { connect } from 'react-redux'; -import { Action, Dispatch } from '../actions'; import { stop } from '../actions/hub'; import { RootState } from '../reducers'; import { HubRuntimeState } from '../reducers/hub'; @@ -19,9 +18,9 @@ const mapStateToProps = (state: RootState): StateProps => ({ enabled: state.hub.runtime === HubRuntimeState.Running, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onAction: (): Action => dispatch(stop()), -}); +const mapDispatchToProps: DispatchProps = { + onAction: stop, +}; const mergeProps = ( stateProps: StateProps, diff --git a/src/components/Terminal.tsx b/src/components/Terminal.tsx index 84816b39..b6dd1350 100644 --- a/src/components/Terminal.tsx +++ b/src/components/Terminal.tsx @@ -14,7 +14,6 @@ import { connect } from 'react-redux'; import { Observable, Unsubscribe } from 'redux'; import { Terminal as XTerm } from 'xterm'; import { FitAddon } from 'xterm-addon-fit'; -import { Dispatch } from '../actions'; import { receiveData } from '../actions/terminal'; import { RootState } from '../reducers'; import { isMacOS } from '../utils/os'; @@ -175,11 +174,9 @@ const mapStateToProps = (state: RootState): StateProps => ({ darkMode: state.settings.darkMode, }); -const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ - onData: (d): void => { - dispatch(receiveData(d)); - }, -}); +const mapDispatchToProps: DispatchProps = { + onData: receiveData, +}; export default connect( mapStateToProps,