Remove Console feature
Reviewed By: fabiomassimo Differential Revision: D27622952 fbshipit-source-id: 45ce5188a55f50b8ca28f28f354d9402902a5df8
This commit is contained in:
committed by
Facebook GitHub Bot
parent
ab255f0d13
commit
32bf4c32c2
@@ -188,7 +188,6 @@ export {
|
||||
export {ContextMenuExtension} from './ui/components/elements-inspector/elements';
|
||||
export {default as ElementsInspector} from './ui/components/elements-inspector/ElementsInspector';
|
||||
export {InspectorSidebar} from './ui/components/elements-inspector/sidebar';
|
||||
export {Console} from './ui/components/console';
|
||||
export {default as Sheet} from './ui/components/Sheet';
|
||||
export {default as FileSelector} from './ui/components/FileSelector';
|
||||
export {KeyboardActions} from './MenuBar';
|
||||
|
||||
@@ -1,211 +0,0 @@
|
||||
/**
|
||||
* 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, {Component} from 'react';
|
||||
import CodeBlock from './CodeBlock';
|
||||
import {colors} from './colors';
|
||||
import ManagedTable from './table/ManagedTable';
|
||||
import FlexColumn from './FlexColumn';
|
||||
import Text from './Text';
|
||||
import {DataInspector} from 'flipper-plugin';
|
||||
import Input from './Input';
|
||||
import View from './View';
|
||||
import styled from '@emotion/styled';
|
||||
import {TableBodyRow, TableRows} from './table/types';
|
||||
import {PluginClient} from '../../plugin';
|
||||
|
||||
type ValueWithType = {
|
||||
type: string;
|
||||
value: any;
|
||||
};
|
||||
type SuccessResult = {
|
||||
isSuccess: true;
|
||||
value: ValueWithType;
|
||||
};
|
||||
type FailedResult = {
|
||||
isSuccess: false;
|
||||
error: string;
|
||||
};
|
||||
|
||||
type CommandResult = SuccessResult | FailedResult;
|
||||
|
||||
type Props = {
|
||||
client: PluginClient;
|
||||
getContext: () => string;
|
||||
};
|
||||
type State = {
|
||||
isConsoleEnabled: boolean;
|
||||
script: string;
|
||||
previousExecutions: Array<{
|
||||
command: string;
|
||||
result: CommandResult;
|
||||
}>;
|
||||
};
|
||||
|
||||
class ConsoleError extends Component<{
|
||||
error: Error | string | void;
|
||||
className?: string;
|
||||
}> {
|
||||
static Container = styled(CodeBlock)({
|
||||
backgroundColor: colors.redTint,
|
||||
color: colors.red,
|
||||
overflow: 'auto',
|
||||
flexGrow: 1,
|
||||
margin: '0 -8px',
|
||||
padding: '0 8px',
|
||||
});
|
||||
|
||||
render() {
|
||||
const {className, error} = this.props;
|
||||
return (
|
||||
<ConsoleError.Container className={className}>
|
||||
{(error || '').toString()}
|
||||
</ConsoleError.Container>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export class Console extends Component<Props, State> {
|
||||
static title = 'Console';
|
||||
static id = 'Console';
|
||||
static icon = 'chevron-right';
|
||||
|
||||
static TableColumns = {
|
||||
command: {
|
||||
value: 'Commands',
|
||||
},
|
||||
};
|
||||
|
||||
static Window = styled(FlexColumn)({
|
||||
padding: '15px',
|
||||
flexGrow: 1,
|
||||
});
|
||||
static Input = styled(Input)({
|
||||
width: '100%',
|
||||
});
|
||||
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
isConsoleEnabled: false,
|
||||
script: '',
|
||||
previousExecutions: [],
|
||||
};
|
||||
}
|
||||
|
||||
executeScriptOnDevice = () => {
|
||||
this.props.client
|
||||
.call('executeCommand', {
|
||||
command: this.state.script,
|
||||
context: this.props.getContext(),
|
||||
})
|
||||
.then((result: ValueWithType) => {
|
||||
this.setState({
|
||||
script: '',
|
||||
previousExecutions: [
|
||||
...this.state.previousExecutions,
|
||||
{
|
||||
command: this.state.script,
|
||||
result: {isSuccess: true, value: result},
|
||||
},
|
||||
],
|
||||
});
|
||||
})
|
||||
.catch((onReject?) => {
|
||||
this.setState({
|
||||
previousExecutions: [
|
||||
...this.state.previousExecutions,
|
||||
{
|
||||
command: this.state.script,
|
||||
result: {
|
||||
isSuccess: false,
|
||||
error: (onReject && onReject.message) || '',
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
onInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
this.setState({script: event.target.value});
|
||||
};
|
||||
|
||||
onSubmit = (event: React.FormEvent) => {
|
||||
if (this.state.script != '') {
|
||||
this.executeScriptOnDevice();
|
||||
}
|
||||
event.preventDefault();
|
||||
};
|
||||
|
||||
buildCommandResultRowPair(
|
||||
command: string,
|
||||
result: CommandResult,
|
||||
index: number,
|
||||
): TableRows {
|
||||
const key = index * 2;
|
||||
const commandRow: TableBodyRow = {
|
||||
columns: {
|
||||
command: {value: <Text>{command}</Text>},
|
||||
},
|
||||
key: key.toString(),
|
||||
};
|
||||
const resultRow: TableBodyRow = {
|
||||
columns: {
|
||||
command: {
|
||||
value: result.isSuccess ? (
|
||||
<DataInspector
|
||||
data={result.value}
|
||||
expandRoot={true}
|
||||
collapsed={true}
|
||||
/>
|
||||
) : (
|
||||
<ConsoleError error={(result as FailedResult).error} />
|
||||
),
|
||||
},
|
||||
},
|
||||
key: (key + 1).toString(),
|
||||
};
|
||||
return [commandRow, resultRow];
|
||||
}
|
||||
|
||||
renderPreviousCommands() {
|
||||
const rows: TableRows = this.state.previousExecutions
|
||||
.map(({command, result}, index) =>
|
||||
this.buildCommandResultRowPair(command, result, index),
|
||||
)
|
||||
.reduce((x, y) => x.concat(y), []);
|
||||
return rows.length ? (
|
||||
<ManagedTable
|
||||
columns={Console.TableColumns}
|
||||
rows={rows}
|
||||
multiline={true}
|
||||
stickyBottom={true}
|
||||
highlightableRows={false}
|
||||
hideHeader={true}
|
||||
autoHeight={true}
|
||||
/>
|
||||
) : null;
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Console.Window>
|
||||
<View grow={true}>{this.renderPreviousCommands()}</View>
|
||||
<form onSubmit={this.onSubmit}>
|
||||
<Console.Input
|
||||
onChange={this.onInputChange}
|
||||
placeholder="Command"
|
||||
value={this.state.script}
|
||||
/>
|
||||
</form>
|
||||
</Console.Window>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -14,8 +14,6 @@ import {Logger} from '../../../fb-interfaces/Logger';
|
||||
import Panel from '../Panel';
|
||||
import {DataInspector} from 'flipper-plugin';
|
||||
import {Component} from 'react';
|
||||
import {Console} from '../console';
|
||||
import GK from '../../../fb-stubs/GK';
|
||||
import React from 'react';
|
||||
|
||||
import deepEqual from 'deep-equal';
|
||||
@@ -87,39 +85,13 @@ type Props = {
|
||||
extensions?: Array<Function>;
|
||||
};
|
||||
|
||||
type State = {
|
||||
isConsoleEnabled: boolean;
|
||||
};
|
||||
type State = {};
|
||||
|
||||
export class InspectorSidebar extends Component<Props, State> {
|
||||
state = {
|
||||
isConsoleEnabled: false,
|
||||
};
|
||||
state = {};
|
||||
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
this.checkIfConsoleIsEnabled();
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps: Props) {
|
||||
if (prevProps.client !== this.props.client) {
|
||||
this.checkIfConsoleIsEnabled();
|
||||
}
|
||||
}
|
||||
|
||||
async checkIfConsoleIsEnabled() {
|
||||
if (
|
||||
this.props.client.isConnected &&
|
||||
(await this.props.client.supportsMethod('isConsoleEnabled'))
|
||||
) {
|
||||
this.props.client
|
||||
.call('isConsoleEnabled')
|
||||
.then((result: {isEnabled: boolean}) => {
|
||||
this.setState({isConsoleEnabled: result.isEnabled});
|
||||
});
|
||||
} else {
|
||||
this.setState({isConsoleEnabled: false});
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
@@ -185,14 +157,6 @@ export class InspectorSidebar extends Component<Props, State> {
|
||||
}
|
||||
}
|
||||
|
||||
if (GK.get('sonar_show_console_plugin') && this.state.isConsoleEnabled) {
|
||||
sections.push(
|
||||
<Panel heading="JS Console" floating={false} grow={false}>
|
||||
<Console client={this.props.client} getContext={() => element.id} />
|
||||
</Panel>,
|
||||
);
|
||||
}
|
||||
|
||||
return sections;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -155,8 +155,6 @@ export {default as ElementsInspector} from './components/elements-inspector/Elem
|
||||
export {InspectorSidebar} from './components/elements-inspector/sidebar';
|
||||
export {VisualizerPortal} from './components/elements-inspector/Visualizer';
|
||||
|
||||
export {Console} from './components/console';
|
||||
|
||||
export {default as Sheet} from './components/Sheet';
|
||||
export {StarButton} from './components/StarButton';
|
||||
export {Markdown} from './components/Markdown';
|
||||
|
||||
@@ -146,15 +146,6 @@ NSObject* flattenLayoutEditorMessage(NSObject* field);
|
||||
responder);
|
||||
}];
|
||||
|
||||
[connection receive:@"isConsoleEnabled"
|
||||
withBlock:^(NSDictionary* params, id<FlipperResponder> responder) {
|
||||
FlipperPerformBlockOnMainThread(
|
||||
^{
|
||||
[responder success:@{@"isEnabled" : @NO}];
|
||||
},
|
||||
responder);
|
||||
}];
|
||||
|
||||
[connection receive:@"getSearchResults"
|
||||
withBlock:^(NSDictionary* params, id<FlipperResponder> responder) {
|
||||
FlipperPerformBlockOnMainThread(
|
||||
|
||||
Reference in New Issue
Block a user