From 9deed974be4695fd9041cb5835e0f4400f25012d Mon Sep 17 00:00:00 2001 From: Michel Weststrate Date: Fri, 30 Oct 2020 04:20:00 -0700 Subject: [PATCH] Support active sheet mechanism in Sandy Summary: This diffs adds support for the activeSheets mechanism in Sandy. It should be removed in the future (see T78696648) since open a dialog and keeping dialog state locally results in much more straight forward code, but supporting this for now makes sure that old flows are still supported. With this change the plugin selection during a Flipper export for example wouldn't become visible Reviewed By: cekkaewnumchai Differential Revision: D24620074 fbshipit-source-id: f0558f5738e86a84a5cd0b9d574a3cfd0a3bf424 --- desktop/app/src/App.tsx | 87 ++------------------- desktop/app/src/chrome/Sheet.tsx | 2 + desktop/app/src/chrome/SheetRenderer.tsx | 93 +++++++++++++++++++++++ desktop/app/src/plugin.tsx | 2 - desktop/app/src/sandy-chrome/SandyApp.tsx | 6 +- 5 files changed, 105 insertions(+), 85 deletions(-) create mode 100644 desktop/app/src/chrome/SheetRenderer.tsx 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 ( - + <> + + +