diff --git a/desktop/.eslintrc.js b/desktop/.eslintrc.js index 130958235..8e09cbdfb 100644 --- a/desktop/.eslintrc.js +++ b/desktop/.eslintrc.js @@ -24,7 +24,7 @@ const prettierConfig = { module.exports = { parser: 'babel-eslint', root: true, - extends: 'fbjs', + extends: ['fbjs', 'prettier'], plugins: [ ...fbjs.plugins, 'header', @@ -43,8 +43,6 @@ module.exports = { 'prefer-const': [2, {destructuring: 'all'}], 'prefer-spread': 1, 'prefer-rest-params': 1, - 'max-len': 0, // lets prettier take care of this - indent: 0, // lets prettier take care of this 'no-console': 0, // we're setting window.console in App.js 'no-multi-spaces': 2, 'prefer-promise-reject-errors': 1, diff --git a/desktop/app/src/Client.tsx b/desktop/app/src/Client.tsx index 694ded944..d464e772c 100644 --- a/desktop/app/src/Client.tsx +++ b/desktop/app/src/Client.tsx @@ -116,7 +116,7 @@ export default class Client extends EventEmitter { store: Store; activePlugins: Set; device: Promise; - _deviceResolve: (device: BaseDevice) => void = _ => {}; + _deviceResolve: (device: BaseDevice) => void = (_) => {}; _deviceSet: false | BaseDevice = false; logger: Logger; lastSeenDeviceList: Array; @@ -194,7 +194,7 @@ export default class Client extends EventEmitter { const device = this.store .getState() .connections.devices.find( - device => device.serial === this.query.device_id, + (device) => device.serial === this.query.device_id, ); if (device) { resolve(device); @@ -214,7 +214,7 @@ export default class Client extends EventEmitter { } this.lastSeenDeviceList = this.store.getState().connections.devices; const matchingDevice = newDeviceList.find( - device => device.serial === this.query.device_id, + (device) => device.serial === this.query.device_id, ); if (matchingDevice) { clearTimeout(timeout); @@ -224,7 +224,7 @@ export default class Client extends EventEmitter { }); }), 'client-setMatchingDevice', - ).then(device => { + ).then((device) => { this._deviceSet = device; this._deviceResolve(device); }); @@ -244,10 +244,10 @@ export default class Client extends EventEmitter { const plugins = await this.rawCall<{plugins: Plugins}>( 'getPlugins', false, - ).then(data => data.plugins); + ).then((data) => data.plugins); this.plugins = plugins; const nativeplugins = plugins - .map(plugin => /_nativeplugin_([^_]+)_([^_]+)/.exec(plugin)) + .map((plugin) => /_nativeplugin_([^_]+)_([^_]+)/.exec(plugin)) .filter(notNull) .map(([id, type, title]) => { // TODO put this in another component, and make the "types" registerable @@ -318,7 +318,7 @@ export default class Client extends EventEmitter { }: ${error.message} + \nDevice Stack Trace: ${error.stacktrace}`, 'deviceError', ); - this.device.then(device => handleError(this.store, device, error)); + this.device.then((device) => handleError(this.store, device, error)); } else if (method === 'refreshPlugins') { this.refreshPlugins(); } else if (method === 'execute') { @@ -389,7 +389,7 @@ export default class Client extends EventEmitter { reject(data.error); const {error} = data; if (error) { - this.device.then(device => handleError(this.store, device, error)); + this.device.then((device) => handleError(this.store, device, error)); } } else { // ??? @@ -466,7 +466,7 @@ export default class Client extends EventEmitter { this.connection .requestResponse({data: JSON.stringify(data)}) .subscribe({ - onComplete: payload => { + onComplete: (payload) => { if (!fromPlugin || this.isAcceptingMessagesFromPlugin(plugin)) { const logEventName = this.getLogEventName(data); this.logger.trackTimeSince(mark, logEventName); @@ -478,7 +478,7 @@ export default class Client extends EventEmitter { } }, // Open fresco then layout and you get errors because responses come back after deinit. - onError: e => { + onError: (e) => { if (this.isAcceptingMessagesFromPlugin(plugin)) { reject(e); } @@ -555,8 +555,9 @@ export default class Client extends EventEmitter { send(api: string, method: string, params?: Object): void { if (!isProduction()) { console.warn( - `${api}:${method || - ''} client.send() is deprecated. Please use call() instead so you can handle errors.`, + `${api}:${ + method || '' + } client.send() is deprecated. Please use call() instead so you can handle errors.`, ); } return this.rawSend('execute', {api, method, params}); diff --git a/desktop/app/src/MenuBar.tsx b/desktop/app/src/MenuBar.tsx index 644ff123e..be4c664f8 100644 --- a/desktop/app/src/MenuBar.tsx +++ b/desktop/app/src/MenuBar.tsx @@ -81,18 +81,18 @@ export function setupMenuBar( // collect all keyboard actions from all plugins const registeredActions: Set = new Set( plugins - .map(plugin => plugin.keyboardActions || []) + .map((plugin) => plugin.keyboardActions || []) .reduce((acc: KeyboardActions, cv) => acc.concat(cv), []) .map((action: DefaultKeyboardAction | KeyboardAction) => typeof action === 'string' - ? defaultKeyboardActions.find(a => a.action === action) + ? defaultKeyboardActions.find((a) => a.action === action) : action, ) .filter(notNull), ); // add keyboard actions to - registeredActions.forEach(keyboardAction => { + registeredActions.forEach((keyboardAction) => { if (keyboardAction != null) { appendMenuItem(template, actionHandler, keyboardAction); } @@ -102,15 +102,15 @@ export function setupMenuBar( const applicationMenu = electron.remote.Menu.buildFromTemplate(template); // add menu items to map, so we can modify them easily later - registeredActions.forEach(keyboardAction => { + registeredActions.forEach((keyboardAction) => { if (keyboardAction != null) { const {topLevelMenu, label, action} = keyboardAction; const menu = applicationMenu.items.find( - menuItem => menuItem.label === topLevelMenu, + (menuItem) => menuItem.label === topLevelMenu, ); if (menu && menu.submenu) { const menuItem = menu.submenu.items.find( - menuItem => menuItem.label === label, + (menuItem) => menuItem.label === label, ); menuItem && menuItems.set(action, menuItem); } @@ -131,7 +131,7 @@ function appendMenuItem( return; } const itemIndex = template.findIndex( - menu => menu.label === keyboardAction.topLevelMenu, + (menu) => menu.label === keyboardAction.topLevelMenu, ); if (itemIndex > -1 && template[itemIndex].submenu != null) { (template[itemIndex].submenu as MenuItemConstructorOptions[]).push({ @@ -160,16 +160,18 @@ export function activateMenuItems( // enable keyboard actions for the current plugin if (activePlugin.constructor.keyboardActions != null) { - (activePlugin.constructor.keyboardActions || []).forEach(keyboardAction => { - const action = - typeof keyboardAction === 'string' - ? keyboardAction - : keyboardAction.action; - const item = menuItems.get(action); - if (item != null) { - item.enabled = true; - } - }); + (activePlugin.constructor.keyboardActions || []).forEach( + (keyboardAction) => { + const action = + typeof keyboardAction === 'string' + ? keyboardAction + : keyboardAction.action; + const item = menuItems.get(action); + if (item != null) { + item.enabled = true; + } + }, + ); } // set the application menu again to make sure it updates @@ -206,7 +208,7 @@ function getTemplate( { label: 'Import Flipper File...', accelerator: 'CommandOrControl+O', - click: function() { + click: function () { showOpenDialog(store); }, }, @@ -218,7 +220,7 @@ function getTemplate( const supportRequestSubmenu = [ { label: 'Create...', - click: function() { + click: function () { // Dispatch an action to open the export screen of Support Request form store.dispatch(setStaticView(SupportRequestFormV2)); }, @@ -278,7 +280,7 @@ function getTemplate( { label: 'Reload', accelerator: 'CmdOrCtrl+R', - click: function( + click: function ( _, focusedWindow: electron.BrowserWindow | undefined, ) { @@ -289,14 +291,14 @@ function getTemplate( }, { label: 'Toggle Full Screen', - accelerator: (function() { + accelerator: (function () { if (process.platform === 'darwin') { return 'Ctrl+Command+F'; } else { return 'F11'; } })(), - click: function( + click: function ( _, focusedWindow: electron.BrowserWindow | undefined, ) { @@ -307,20 +309,20 @@ function getTemplate( }, { label: 'Manage Plugins...', - click: function() { + click: function () { store.dispatch(setActiveSheet(ACTIVE_SHEET_PLUGINS)); }, }, { label: 'Toggle Developer Tools', - accelerator: (function() { + accelerator: (function () { if (process.platform === 'darwin') { return 'Alt+Command+I'; } else { return 'Ctrl+Shift+I'; } })(), - click: function( + click: function ( _, focusedWindow: electron.BrowserWindow | undefined, ) { @@ -357,7 +359,7 @@ function getTemplate( submenu: [ { label: 'Getting started', - click: function() { + click: function () { shell.openExternal( 'https://fbflipper.com/docs/getting-started.html', ); @@ -365,7 +367,7 @@ function getTemplate( }, { label: 'Create plugins', - click: function() { + click: function () { shell.openExternal( 'https://fbflipper.com/docs/tutorial/intro.html', ); @@ -373,7 +375,7 @@ function getTemplate( }, { label: 'Report problems', - click: function() { + click: function () { shell.openExternal('https://github.com/facebook/flipper/issues'); }, }, @@ -427,13 +429,13 @@ function getTemplate( { label: 'Quit', accelerator: 'Command+Q', - click: function() { + click: function () { app.quit(); }, }, ], }); - const windowMenu = template.find(function(m) { + const windowMenu = template.find(function (m) { return m.role === 'window'; }); if (windowMenu) { diff --git a/desktop/app/src/NotificationsHub.tsx b/desktop/app/src/NotificationsHub.tsx index 7bf52285d..0f46be712 100644 --- a/desktop/app/src/NotificationsHub.tsx +++ b/desktop/app/src/NotificationsHub.tsx @@ -108,16 +108,18 @@ class NotificationsTable extends Component { if (this.props.filters.length !== prevProps.filters.length) { this.props.updatePluginBlacklist( this.props.filters - .filter(f => f.type === 'exclude' && f.key.toLowerCase() === 'plugin') - .map(f => String(f.value)), + .filter( + (f) => f.type === 'exclude' && f.key.toLowerCase() === 'plugin', + ) + .map((f) => String(f.value)), ); this.props.updateCategoryBlacklist( this.props.filters .filter( - f => f.type === 'exclude' && f.key.toLowerCase() === 'category', + (f) => f.type === 'exclude' && f.key.toLowerCase() === 'category', ) - .map(f => String(f.value)), + .map((f) => String(f.value)), ); } @@ -162,7 +164,7 @@ class NotificationsTable extends Component { // filter plugins const blacklistedPlugins = new Set( - this.props.blacklistedPlugins.map(p => p.toLowerCase()), + this.props.blacklistedPlugins.map((p) => p.toLowerCase()), ); if (blacklistedPlugins.has(n.pluginId.toLowerCase())) { return false; @@ -172,7 +174,7 @@ class NotificationsTable extends Component { const {category} = n.notification; if (category) { const blacklistedCategories = new Set( - this.props.blacklistedCategories.map(p => p.toLowerCase()), + this.props.blacklistedCategories.map((p) => p.toLowerCase()), ); if (blacklistedCategories.has(category.toLowerCase())) { return false; @@ -320,7 +322,7 @@ type NotificationBoxProps = { severity: keyof typeof SEVERITY_COLOR_MAP; }; -const NotificationBox = styled(FlexRow)(props => ({ +const NotificationBox = styled(FlexRow)((props) => ({ backgroundColor: props.inactive ? 'transparent' : colors.white, opacity: props.inactive ? 0.5 : 1, alignItems: 'flex-start', @@ -360,7 +362,7 @@ const Title = styled.div({ }); const NotificationContent = styled(FlexColumn)<{isSelected?: boolean}>( - props => ({ + (props) => ({ marginLeft: 6, marginRight: 10, flexGrow: 1, diff --git a/desktop/app/src/PluginContainer.tsx b/desktop/app/src/PluginContainer.tsx index 026de022f..4bbd87d65 100644 --- a/desktop/app/src/PluginContainer.tsx +++ b/desktop/app/src/PluginContainer.tsx @@ -198,11 +198,11 @@ class PluginContainer extends PureComponent { activePlugin, pluginKey, this.store, - progress => { + (progress) => { this.setState({progress}); }, this.idler, - ).then(completed => { + ).then((completed) => { const duration = Date.now() - start; this.props.logger.track( 'duration', @@ -345,7 +345,7 @@ class PluginContainer extends PureComponent { } : pluginState, setStaticView: (payload: StaticView) => this.props.setStaticView(payload), - setPersistedState: state => setPluginState({pluginKey, state}), + setPersistedState: (state) => setPluginState({pluginKey, state}), target, deepLinkPayload: this.props.deepLinkPayload, selectPlugin: (pluginID: string, deepLinkPayload: string | null) => { @@ -353,7 +353,7 @@ class PluginContainer extends PureComponent { // check if plugin will be available if ( target instanceof Client && - target.plugins.some(p => p === pluginID) + target.plugins.some((p) => p === pluginID) ) { this.props.selectPlugin({selectedPlugin: pluginID, deepLinkPayload}); return true; @@ -371,8 +371,9 @@ class PluginContainer extends PureComponent { + heading={`Plugin "${ + activePlugin.title || 'Unknown' + }" encountered an error during render`}> {React.createElement(activePlugin, props)} diff --git a/desktop/app/src/chrome/AutoUpdateVersion.tsx b/desktop/app/src/chrome/AutoUpdateVersion.tsx index 9893e8eb2..a5e41a901 100644 --- a/desktop/app/src/chrome/AutoUpdateVersion.tsx +++ b/desktop/app/src/chrome/AutoUpdateVersion.tsx @@ -57,7 +57,7 @@ export default class AutoUpdateVersion extends Component { notification.onclick = remote.autoUpdater.quitAndInstall; }); - remote.autoUpdater.on('error', error => { + remote.autoUpdater.on('error', (error) => { this.setState({updater: 'error', error: error.toString()}); }); diff --git a/desktop/app/src/chrome/BugReporterDialog.tsx b/desktop/app/src/chrome/BugReporterDialog.tsx index e44179674..be9fdbb83 100644 --- a/desktop/app/src/chrome/BugReporterDialog.tsx +++ b/desktop/app/src/chrome/BugReporterDialog.tsx @@ -172,7 +172,7 @@ class BugReporterDialog extends Component { success: id, }); }) - .catch(err => { + .catch((err) => { this.setState({ error: err.message, submitting: false, diff --git a/desktop/app/src/chrome/DevicesButton.tsx b/desktop/app/src/chrome/DevicesButton.tsx index 1266da9d6..1d5c7b742 100644 --- a/desktop/app/src/chrome/DevicesButton.tsx +++ b/desktop/app/src/chrome/DevicesButton.tsx @@ -48,13 +48,13 @@ class DevicesButton extends Component { // On Linux, you must run the emulator from the directory it's in because // reasons ... which('emulator') - .then(emulatorPath => { + .then((emulatorPath) => { if (emulatorPath) { const child = spawn(emulatorPath, [`@${name}`], { detached: true, cwd: dirname(emulatorPath), }); - child.stderr.on('data', data => { + child.stderr.on('data', (data) => { console.error(`Android emulator error: ${data}`); }); child.on('error', console.error); @@ -96,7 +96,7 @@ class DevicesButton extends Component { enabled: false, }, ...devices - .filter(device => device.deviceType === 'physical') + .filter((device) => device.deviceType === 'physical') .map((device: BaseDevice) => ({ click: () => selectDevice(device), checked: device === selectedDevice, @@ -114,7 +114,7 @@ class DevicesButton extends Component { enabled: false, }, ...devices - .filter(device => device.deviceType === 'emulator') + .filter((device) => device.deviceType === 'emulator') .map((device: BaseDevice) => ({ click: () => selectDevice(device), checked: device === selectedDevice, @@ -132,7 +132,7 @@ class DevicesButton extends Component { enabled: false, }, ...devices - .filter(device => device.isArchived) + .filter((device) => device.isArchived) .map((device: BaseDevice) => ({ click: () => selectDevice(device), checked: device === selectedDevice, diff --git a/desktop/app/src/chrome/DoctorBar.tsx b/desktop/app/src/chrome/DoctorBar.tsx index 008482fc4..bc7dbcdb6 100644 --- a/desktop/app/src/chrome/DoctorBar.tsx +++ b/desktop/app/src/chrome/DoctorBar.tsx @@ -59,7 +59,7 @@ class DoctorBar extends Component { static getDerivedStateFromProps(props: Props, state: State): State | null { const failedCategories = Object.values( props.healthcheckReport.categories, - ).filter(cat => hasProblems(cat.result)); + ).filter((cat) => hasProblems(cat.result)); if (failedCategories.length == 1) { const failedCat = failedCategories[0]; if (failedCat.key === 'ios' || failedCat.key === 'android') { @@ -131,7 +131,7 @@ class DoctorBar extends Component { ); } setVisible(visible: boolean) { - this.setState(prevState => { + this.setState((prevState) => { return { ...prevState, visible, diff --git a/desktop/app/src/chrome/DoctorSheet.tsx b/desktop/app/src/chrome/DoctorSheet.tsx index b7b3695a9..e898a4a85 100644 --- a/desktop/app/src/chrome/DoctorSheet.tsx +++ b/desktop/app/src/chrome/DoctorSheet.tsx @@ -286,7 +286,7 @@ class DoctorSheet extends Component { } onAcknowledgeOnCloseChanged(acknowledge: boolean): void { - this.setState(prevState => { + this.setState((prevState) => { return { ...prevState, acknowledgeOnClose: acknowledge, @@ -304,7 +304,9 @@ class DoctorSheet extends Component { getCheckMessage(checkKey: string): string { for (const cat of Object.values(this.props.healthcheckReport.categories)) { - const check = Object.values(cat.checks).find(chk => chk.key === checkKey); + const check = Object.values(cat.checks).find( + (chk) => chk.key === checkKey, + ); if (check) { return check.result.message || ''; } @@ -328,7 +330,7 @@ class DoctorSheet extends Component { /> {category.result.status !== 'SKIPPED' && ( - {Object.values(category.checks).map(check => ( + {Object.values(category.checks).map((check) => ( e.urgent); + const urgentErrors = props.errors.filter((e) => e.urgent); return ( @@ -52,7 +52,7 @@ const ErrorBar = memo(function ErrorBar(props: Props) { ))} setCollapsed(c => !c)} + onClick={() => setCollapsed((c) => !c)} title="Show / hide errors"> {(error.details || error.error) && (