diff --git a/desktop/app/src/App.tsx b/desktop/app/src/App.tsx index 24739d453..bd2e7455d 100644 --- a/desktop/app/src/App.tsx +++ b/desktop/app/src/App.tsx @@ -13,39 +13,19 @@ import {connect} from 'react-redux'; import TitleBar from './chrome/TitleBar'; import MainSidebar2 from './chrome/mainsidebar/MainSidebar2'; import DoctorBar from './chrome/DoctorBar'; -import ShareSheetExportUrl from './chrome/ShareSheetExportUrl'; -import SignInSheet from './chrome/SignInSheet'; -import ExportDataPluginSheet from './chrome/ExportDataPluginSheet'; -import ShareSheetExportFile from './chrome/ShareSheetExportFile'; -import JSEmulatorLauncherSheet from './chrome/JSEmulatorLauncherSheet'; import PluginContainer from './PluginContainer'; -import Sheet from './chrome/Sheet'; import {ipcRenderer, remote} from 'electron'; import { - ActiveSheet, - ShareType, - ACTIVE_SHEET_PLUGINS, - ACTIVE_SHEET_SHARE_DATA, - ACTIVE_SHEET_SIGN_IN, - ACTIVE_SHEET_SETTINGS, - ACTIVE_SHEET_DOCTOR, - ACTIVE_SHEET_SHARE_DATA_IN_FILE, - ACTIVE_SHEET_SELECT_PLUGINS_TO_EXPORT, - ACTIVE_SHEET_PLUGIN_SHEET, - ACTIVE_SHEET_JS_EMULATOR_LAUNCHER, - ACTIVE_SHEET_CHANGELOG, - setActiveSheet, ACTIVE_SHEET_CHANGELOG_RECENT_ONLY, + setActiveSheet, } from './reducers/application'; import {Logger} from './fb-interfaces/Logger'; import {State as Store} from './reducers/index'; import {StaticView} from './reducers/connections'; -import PluginManager from './chrome/plugin-manager/PluginManager'; import StatusBar from './chrome/StatusBar'; -import SettingsSheet from './chrome/SettingsSheet'; -import DoctorSheet from './chrome/DoctorSheet'; -import ChangelogSheet, {hasNewChangesToShow} from './chrome/ChangelogSheet'; +import {hasNewChangesToShow} from './chrome/ChangelogSheet'; import QPL, {QuickLogActionType, FLIPPER_QPL_EVENTS} from './fb-stubs/QPL'; +import {SheetRenderer} from './chrome/SheetRenderer'; const version = remote.app.getVersion(); @@ -55,8 +35,6 @@ type OwnProps = { type StateFromProps = { leftSidebarVisible: boolean; - activeSheet: ActiveSheet; - share: ShareType | null; staticView: StaticView; }; @@ -104,56 +82,6 @@ export class App extends React.Component { } } - getSheet = (onHide: () => any) => { - const {activeSheet} = this.props; - switch (activeSheet) { - case ACTIVE_SHEET_PLUGINS: - return ; - case ACTIVE_SHEET_SIGN_IN: - return ; - case ACTIVE_SHEET_SETTINGS: - return ; - case ACTIVE_SHEET_DOCTOR: - return ; - case ACTIVE_SHEET_CHANGELOG: - return ; - case ACTIVE_SHEET_CHANGELOG_RECENT_ONLY: - return ; - case ACTIVE_SHEET_SELECT_PLUGINS_TO_EXPORT: - return ; - case ACTIVE_SHEET_SHARE_DATA: - return ( - - ); - case ACTIVE_SHEET_SHARE_DATA_IN_FILE: - return this.props.share && this.props.share.type === 'file' ? ( - - ) : ( - (() => { - console.error('No file provided when calling share sheet.'); - return null; - })() - ); - case ACTIVE_SHEET_PLUGIN_SHEET: - // Currently unused. - return null; - case ACTIVE_SHEET_JS_EMULATOR_LAUNCHER: - return ; - default: - return null; - } - }; - render() { return ( @@ -163,7 +91,7 @@ export class App extends React.Component { <> - {this.getSheet} + @@ -198,13 +126,8 @@ export class App extends React.Component { } export default connect( - ({ - application: {leftSidebarVisible, activeSheet, share}, - connections: {staticView}, - }) => ({ + ({application: {leftSidebarVisible}, connections: {staticView}}) => ({ leftSidebarVisible, - activeSheet, - share: share, staticView, }), { diff --git a/desktop/app/src/chrome/Sheet.tsx b/desktop/app/src/chrome/Sheet.tsx index 758246c1c..5f4f1d35a 100644 --- a/desktop/app/src/chrome/Sheet.tsx +++ b/desktop/app/src/chrome/Sheet.tsx @@ -76,6 +76,8 @@ class Sheet extends Component { } componentWillUnmount() { + // When switching to Sandy, we need to short-circuit this as this component itself will be thrown away + this.props.onHideSheet(); document.removeEventListener('keydown', this.onKeyDown); } diff --git a/desktop/app/src/chrome/SheetRenderer.tsx b/desktop/app/src/chrome/SheetRenderer.tsx new file mode 100644 index 000000000..6b8a32d28 --- /dev/null +++ b/desktop/app/src/chrome/SheetRenderer.tsx @@ -0,0 +1,93 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @format + */ + +import React, {useCallback} from 'react'; +import ShareSheetExportUrl from './ShareSheetExportUrl'; +import SignInSheet from './SignInSheet'; +import ExportDataPluginSheet from './ExportDataPluginSheet'; +import ShareSheetExportFile from './ShareSheetExportFile'; +import JSEmulatorLauncherSheet from './JSEmulatorLauncherSheet'; +import Sheet from './Sheet'; +import { + ACTIVE_SHEET_PLUGINS, + ACTIVE_SHEET_SHARE_DATA, + ACTIVE_SHEET_SIGN_IN, + ACTIVE_SHEET_SETTINGS, + ACTIVE_SHEET_DOCTOR, + ACTIVE_SHEET_SHARE_DATA_IN_FILE, + ACTIVE_SHEET_SELECT_PLUGINS_TO_EXPORT, + ACTIVE_SHEET_PLUGIN_SHEET, + ACTIVE_SHEET_JS_EMULATOR_LAUNCHER, + ACTIVE_SHEET_CHANGELOG, + ACTIVE_SHEET_CHANGELOG_RECENT_ONLY, +} from '../reducers/application'; +import {Logger} from '../fb-interfaces/Logger'; +import PluginManager from './plugin-manager/PluginManager'; +import SettingsSheet from './SettingsSheet'; +import DoctorSheet from './DoctorSheet'; +import ChangelogSheet from './ChangelogSheet'; +import {useStore} from '../utils/useStore'; + +export function SheetRenderer({logger}: {logger: Logger}) { + const activeSheet = useStore((state) => state.application.activeSheet); + // MWE: share being grabbed (and stored) here isn't ideal, clean up in the future? + const share = useStore((state) => state.application.share); + + const renderSheet = useCallback( + (onHide: () => any) => { + switch (activeSheet) { + case ACTIVE_SHEET_PLUGINS: + return ; + case ACTIVE_SHEET_SIGN_IN: + return ; + case ACTIVE_SHEET_SETTINGS: + return ; + case ACTIVE_SHEET_DOCTOR: + return ; + case ACTIVE_SHEET_CHANGELOG: + return ; + case ACTIVE_SHEET_CHANGELOG_RECENT_ONLY: + return ; + case ACTIVE_SHEET_SELECT_PLUGINS_TO_EXPORT: + return ; + case ACTIVE_SHEET_SHARE_DATA: + return ( + + ); + case ACTIVE_SHEET_SHARE_DATA_IN_FILE: + return share && share.type === 'file' ? ( + + ) : ( + (() => { + console.error('No file provided when calling share sheet.'); + return null; + })() + ); + case ACTIVE_SHEET_PLUGIN_SHEET: + // Currently unused. + return null; + case ACTIVE_SHEET_JS_EMULATOR_LAUNCHER: + return ; + default: + return null; + } + }, + [activeSheet, logger, share], + ); + + return {renderSheet}; +} diff --git a/desktop/app/src/plugin.tsx b/desktop/app/src/plugin.tsx index 381cbd6ac..cdaab6c53 100644 --- a/desktop/app/src/plugin.tsx +++ b/desktop/app/src/plugin.tsx @@ -8,7 +8,6 @@ */ import {KeyboardActions} from './MenuBar'; -import {App} from './App'; import {Logger} from './fb-interfaces/Logger'; import Client from './Client'; import {Store} from './reducers/index'; @@ -162,7 +161,6 @@ export abstract class FlipperBasePlugin< reducers: { [actionName: string]: (state: State, actionData: any) => Partial; } = {}; - app: App | null = null; onKeyboardAction: ((action: string) => void) | undefined; toJSON() { diff --git a/desktop/app/src/sandy-chrome/SandyApp.tsx b/desktop/app/src/sandy-chrome/SandyApp.tsx index 6d1012647..863068adf 100644 --- a/desktop/app/src/sandy-chrome/SandyApp.tsx +++ b/desktop/app/src/sandy-chrome/SandyApp.tsx @@ -25,6 +25,7 @@ import {AppInspect} from './appinspect/AppInspect'; import PluginContainer from '../PluginContainer'; import {ContentContainer} from './ContentContainer'; import {Notification} from './notification/Notification'; +import {SheetRenderer} from '../chrome/SheetRenderer'; export type ToplevelNavItem = | 'appinspect' @@ -92,7 +93,10 @@ export function SandyApp({logger}: {logger: Logger}) { return ( - + <> + + +