remove metro button
Reviewed By: lblasa Differential Revision: D51199560 fbshipit-source-id: ebd844a57b0b30859b186361136cc8a2f897d9f2
This commit is contained in:
committed by
Facebook GitHub Bot
parent
9ca6f01c40
commit
5269800738
@@ -1,94 +0,0 @@
|
|||||||
/**
|
|
||||||
* Copyright (c) Meta Platforms, Inc. and 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, useEffect, useState} from 'react';
|
|
||||||
import {MetroReportableEvent} from 'flipper-common';
|
|
||||||
import {useStore} from '../utils/useStore';
|
|
||||||
import {Button as AntButton} from 'antd';
|
|
||||||
import {MenuOutlined, ReloadOutlined} from '@ant-design/icons';
|
|
||||||
import {theme} from 'flipper-plugin';
|
|
||||||
import {BaseDevice} from 'flipper-frontend-core';
|
|
||||||
|
|
||||||
export default function MetroButton() {
|
|
||||||
const device = useStore((state) =>
|
|
||||||
state.connections.devices.find(
|
|
||||||
(device) => device.os === 'Metro' && device.connected.get(),
|
|
||||||
),
|
|
||||||
) as BaseDevice | undefined;
|
|
||||||
|
|
||||||
const sendCommand = useCallback(
|
|
||||||
(command: string) => {
|
|
||||||
device?.sendMetroCommand(command);
|
|
||||||
},
|
|
||||||
[device],
|
|
||||||
);
|
|
||||||
const [progress, setProgress] = useState(1);
|
|
||||||
const [_hasBuildError, setHasBuildError] = useState(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (!device) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
function metroEventListener(event: MetroReportableEvent) {
|
|
||||||
if (event.type === 'bundle_build_started') {
|
|
||||||
setHasBuildError(false);
|
|
||||||
setProgress(0);
|
|
||||||
} else if (event.type === 'bundle_build_failed') {
|
|
||||||
setHasBuildError(true);
|
|
||||||
setProgress(1);
|
|
||||||
} else if (event.type === 'bundle_build_done') {
|
|
||||||
setHasBuildError(false);
|
|
||||||
setProgress(1);
|
|
||||||
} else if (event.type === 'bundle_transform_progressed') {
|
|
||||||
setProgress(event.transformedFileCount / event.totalFileCount);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const handle = device.addLogListener((l) => {
|
|
||||||
if (l.tag !== 'client_log') {
|
|
||||||
try {
|
|
||||||
metroEventListener(JSON.parse(l.message));
|
|
||||||
} catch (e) {
|
|
||||||
console.warn('Failed to parse metro message: ', l, e);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
return () => {
|
|
||||||
device.removeLogListener(handle);
|
|
||||||
};
|
|
||||||
}, [device]);
|
|
||||||
|
|
||||||
if (!device) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<AntButton
|
|
||||||
icon={<ReloadOutlined />}
|
|
||||||
title="Reload React Native App"
|
|
||||||
type="ghost"
|
|
||||||
onClick={() => {
|
|
||||||
sendCommand('reload');
|
|
||||||
}}
|
|
||||||
loading={progress < 1}
|
|
||||||
style={{color: _hasBuildError ? theme.errorColor : undefined}}
|
|
||||||
/>
|
|
||||||
<AntButton
|
|
||||||
icon={<MenuOutlined />}
|
|
||||||
title="Open the React Native Dev Menu on the device"
|
|
||||||
type="ghost"
|
|
||||||
onClick={() => {
|
|
||||||
sendCommand('devMenu');
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -13,7 +13,6 @@ import {LeftSidebar, SidebarTitle} from '../LeftSidebar';
|
|||||||
import {Layout, styled} from '../../ui';
|
import {Layout, styled} from '../../ui';
|
||||||
import {theme, useValue} from 'flipper-plugin';
|
import {theme, useValue} from 'flipper-plugin';
|
||||||
import {PluginList} from './PluginList';
|
import {PluginList} from './PluginList';
|
||||||
import MetroButton from '../../chrome/MetroButton';
|
|
||||||
import {BookmarkSection} from './BookmarkSection';
|
import {BookmarkSection} from './BookmarkSection';
|
||||||
import Client from '../../Client';
|
import Client from '../../Client';
|
||||||
import {BaseDevice} from 'flipper-frontend-core';
|
import {BaseDevice} from 'flipper-frontend-core';
|
||||||
@@ -47,11 +46,6 @@ export function AppInspect() {
|
|||||||
</Toolbar>
|
</Toolbar>
|
||||||
<Layout.Container padv="small" padh="medium" gap={theme.space.large}>
|
<Layout.Container padv="small" padh="medium" gap={theme.space.large}>
|
||||||
{isDeviceConnected && isAppConnected && <BookmarkSection />}
|
{isDeviceConnected && isAppConnected && <BookmarkSection />}
|
||||||
{isDeviceConnected && activeDevice && (
|
|
||||||
<Toolbar gap>
|
|
||||||
<MetroButton />
|
|
||||||
</Toolbar>
|
|
||||||
)}
|
|
||||||
</Layout.Container>
|
</Layout.Container>
|
||||||
</Layout.Container>
|
</Layout.Container>
|
||||||
<Layout.ScrollContainer vertical padv={theme.space.large}>
|
<Layout.ScrollContainer vertical padv={theme.space.large}>
|
||||||
|
|||||||
Reference in New Issue
Block a user