diff --git a/src/PluginContainer.tsx b/src/PluginContainer.tsx index 338087dfc..672f9a424 100644 --- a/src/PluginContainer.tsx +++ b/src/PluginContainer.tsx @@ -24,6 +24,7 @@ import { styled, ArchivedDevice, } from 'flipper'; +import {StaticView, setStaticView} from './reducers/connections'; import React, {PureComponent} from 'react'; import {connect} from 'react-redux'; import {setPluginState} from './reducers/pluginStates'; @@ -66,6 +67,7 @@ type DispatchFromProps = { deepLinkPayload: string | null; }) => any; setPluginState: (payload: {pluginKey: string; state: any}) => void; + setStaticView: (payload: StaticView) => void; }; type Props = StateFromProps & DispatchFromProps & OwnProps; @@ -136,6 +138,7 @@ class PluginContainer extends PureComponent { ...pluginState, } : pluginState, + setStaticView: (payload: StaticView) => this.props.setStaticView(payload), setPersistedState: state => setPluginState({pluginKey, state}), target, deepLinkPayload: this.props.deepLinkPayload, @@ -228,5 +231,6 @@ export default connect( { setPluginState, selectPlugin, + setStaticView, }, )(PluginContainer); diff --git a/src/index.tsx b/src/index.tsx index 4afa2e7f6..b91a9aa5d 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -24,9 +24,12 @@ export {PluginClient, Props} from './plugin'; export {default as Client} from './Client'; export {MetricType} from './utils/exportMetrics'; export {clipboard} from 'electron'; +export { + default as SupportRequestFormManager, +} from './fb-stubs/SupportRequestFormManager'; export {default as constants} from './fb-stubs/constants'; export {connect} from 'react-redux'; -export {selectPlugin} from './reducers/connections'; +export {selectPlugin, StaticView} from './reducers/connections'; export {writeBufferToFile, bufferToBlob} from './utils/screenshot'; export {getPluginKey, getPersistedState} from './utils/pluginUtils'; export {Idler} from './utils/Idler'; diff --git a/src/plugin.tsx b/src/plugin.tsx index 6233fe569..b136556a3 100644 --- a/src/plugin.tsx +++ b/src/plugin.tsx @@ -17,6 +17,7 @@ import {ReactNode, Component} from 'react'; import BaseDevice from './devices/BaseDevice'; import {serialize, deserialize} from './utils/serialization'; import {Idler} from './utils/Idler'; +import {StaticView} from './reducers/connections'; type Parameters = any; // This function is intended to be called from outside of the plugin. @@ -60,6 +61,7 @@ export type Props = { selectPlugin: (pluginID: string, deepLinkPayload: string | null) => boolean; isArchivedDevice: boolean; selectedApp: string | null; + setStaticView: (payload: StaticView) => void; }; export type BaseAction = { diff --git a/src/plugins/layout/index.tsx b/src/plugins/layout/index.tsx index 4a6ebbca1..19a577833 100644 --- a/src/plugins/layout/index.tsx +++ b/src/plugins/layout/index.tsx @@ -22,6 +22,11 @@ import { Button, GK, Idler, + Text, + styled, + colors, + SupportRequestFormManager, + constants, } from 'flipper'; import Inspector from './Inspector'; import ToolbarIcon from './ToolbarIcon'; @@ -49,7 +54,39 @@ export type PersistedState = { AXelements: ElementMap; }; +const FlipperADBarContainer = styled(FlexRow)({ + backgroundColor: colors.warningTint, + flexGrow: 1, + height: 50, + justifyContent: 'center', + alignItems: 'center', + borderWidth: 2, +}); + +const FlipperADText = styled(Text)({ + padding: 10, +}); + export default class Layout extends FlipperPlugin { + FlipperADBar() { + return ( + + + You can now submit support requests to Litho Group from Flipper. This + automatically attaches critical information for reproducing your issue + with just a single click. + + + + ); + } + static exportPersistedState = async ( callClient: ( method: 'getAllNodes', @@ -164,7 +201,7 @@ export default class Layout extends FlipperPlugin { ax: this.state.inAXMode, }); }; - + showFlipperADBar: boolean = false; render() { const inspectorProps = { client: this.getClient(), @@ -184,7 +221,9 @@ export default class Layout extends FlipperPlugin { } else if (selectedElement) { element = this.props.persistedState.elements[selectedElement]; } - + if (!constants.IS_PUBLIC_BUILD && !this.showFlipperADBar) { + this.showFlipperADBar = element != null && element.decoration === 'litho'; + } const inspector = ( { initialQuery={this.props.deepLinkPayload} /> - {inspector} {divider} {axInspector} + {this.showFlipperADBar && this.FlipperADBar()}