jens/flipper
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

rename controls to tree controls and consistent button style

Browse Source 
Reviewed By: mweststrate

Differential Revision: D47672437

fbshipit-source-id: 5ce237cfd300a481450411a0242410e01bcc5411
This commit is contained in:
Luke De Feo
2023-07-26 03:22:38 -07:00
committed by Facebook GitHub Bot
parent ab84bb9bad
commit f854e9f3f3
3 changed files with 7 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
desktop/plugins/public/ui-debugger/components/main.tsx
View File

@@ -22,7 +22,7 @@ import {Id, Metadata, MetadataId, ClientNode} from '../ClientTypes';
import {PerfStats} from './PerfStats'; import {PerfStats} from './PerfStats';
import {Visualization2D} from './visualizer/Visualization2D'; import {Visualization2D} from './visualizer/Visualization2D';
import {Inspector} from './sidebar/Inspector'; import {Inspector} from './sidebar/Inspector';
import {Controls} from './Controls'; import {TreeControls} from './tree/TreeControls';
import {Button, Spin} from 'antd'; import {Button, Spin} from 'antd';
import {QueryClientProvider} from 'react-query'; import {QueryClientProvider} from 'react-query';
import {Tree2} from './tree/Tree'; import {Tree2} from './tree/Tree';
@@ -118,7 +118,7 @@ export function Component() {
borderRadius: theme.borderRadius, borderRadius: theme.borderRadius,
backgroundColor: theme.backgroundDefault, backgroundColor: theme.backgroundDefault,
}}> }}>
<Controls /> <TreeControls />
<Tree2 nodes={nodes} rootId={rootId} /> <Tree2 nodes={nodes} rootId={rootId} />
</Layout.Container> </Layout.Container>

6
desktop/plugins/public/ui-debugger/components/Controls.tsx → desktop/plugins/public/ui-debugger/components/tree/TreeControls.tsx
View File

@@ -8,7 +8,7 @@
*/ */
import React, {useState} from 'react'; import React, {useState} from 'react';
import {plugin} from '../index'; import {plugin} from '../../index';
import { import {
Button, Button,
Input, Input,
@@ -26,9 +26,9 @@ import {
SearchOutlined, SearchOutlined,
} from '@ant-design/icons'; } from '@ant-design/icons';
import {usePlugin, useValue, Layout} from 'flipper-plugin'; import {usePlugin, useValue, Layout} from 'flipper-plugin';
import {FrameworkEventType} from '../ClientTypes'; import {FrameworkEventType} from '../../ClientTypes';
export const Controls: React.FC = () => { export const TreeControls: React.FC = () => {
const instance = usePlugin(plugin); const instance = usePlugin(plugin);
const searchTerm = useValue(instance.uiState.searchTerm); const searchTerm = useValue(instance.uiState.searchTerm);
const isPaused = useValue(instance.uiState.isPaused); const isPaused = useValue(instance.uiState.isPaused);

2
desktop/plugins/public/ui-debugger/components/visualizer/VisualizerControls.tsx
View File

@@ -87,6 +87,7 @@ export function VisualiserControls({
<Layout.Horizontal gap="medium"> <Layout.Horizontal gap="medium">
<Tooltip title={targetToolTip}> <Tooltip title={targetToolTip}>
<Button <Button
shape="circle"
onClick={() => { onClick={() => {
if (targetMode.state === 'disabled') { if (targetMode.state === 'disabled') {
setTargetMode({state: 'active'}); setTargetMode({state: 'active'});
@@ -108,6 +109,7 @@ export function VisualiserControls({
</Tooltip> </Tooltip>
<Tooltip title={focusToolTip}> <Tooltip title={focusToolTip}>
<Button <Button
shape="circle"
disabled={focusDisabled} disabled={focusDisabled}
onClick={() => { onClick={() => {
if (focusedNode == null) { if (focusedNode == null) {