Fix Profiler root change error (#18880)

This commit is contained in:
Nick Reiley 2020-05-13 03:47:23 +05:00 committed by GitHub
parent 61f2a560e0
commit a3fccd2567
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 37 additions and 28 deletions

View File

@ -22,7 +22,7 @@ import type {ProfilingDataFrontend} from './types';
export type TabID = 'flame-chart' | 'ranked-chart' | 'interactions';
export type Context = {|
// Which tab is selexted in the Profiler UI?
// Which tab is selected in the Profiler UI?
selectedTabID: TabID,
selectTab(id: TabID): void,
@ -129,6 +129,38 @@ function ProfilerContextController({children}: Props) {
setPrevProfilingData,
] = useState<ProfilingDataFrontend | null>(null);
const [rootID, setRootID] = useState<number | null>(null);
const [selectedFiberID, selectFiberID] = useState<number | null>(null);
const [selectedFiberName, selectFiberName] = useState<string | null>(null);
const selectFiber = useCallback(
(id: number | null, name: string | null) => {
selectFiberID(id);
selectFiberName(name);
// Sync selection to the Components tab for convenience.
if (id !== null) {
const element = store.getElementByID(id);
// Keep in mind that profiling data may be from a previous session.
// In that case, IDs may match up arbitrarily; to be safe, compare both ID and display name.
if (element !== null && element.displayName === name) {
dispatch({
type: 'SELECT_ELEMENT_BY_ID',
payload: id,
});
}
}
},
[dispatch, selectFiberID, selectFiberName, store],
);
const setRootIDAndClearFiber = useCallback(
(id: number | null) => {
selectFiber(null, null);
setRootID(id);
},
[setRootID, selectFiber],
);
if (prevProfilingData !== profilingData) {
batchedUpdates(() => {
@ -150,9 +182,9 @@ function ProfilerContextController({children}: Props) {
selectedElementRootID !== null &&
dataForRoots.has(selectedElementRootID)
) {
setRootID(selectedElementRootID);
setRootIDAndClearFiber(selectedElementRootID);
} else {
setRootID(firstRootID);
setRootIDAndClearFiber(firstRootID);
}
}
}
@ -180,34 +212,10 @@ function ProfilerContextController({children}: Props) {
null,
);
const [selectedTabID, selectTab] = useState<TabID>('flame-chart');
const [selectedFiberID, selectFiberID] = useState<number | null>(null);
const [selectedFiberName, selectFiberName] = useState<string | null>(null);
const [selectedInteractionID, selectInteraction] = useState<number | null>(
null,
);
const selectFiber = useCallback(
(id: number | null, name: string | null) => {
selectFiberID(id);
selectFiberName(name);
// Sync selection to the Components tab for convenience.
if (id !== null) {
const element = store.getElementByID(id);
// Keep in mind that profiling data may be from a previous session.
// In that case, IDs may match up arbitrarily; to be safe, compare both ID and display name.
if (element !== null && element.displayName === name) {
dispatch({
type: 'SELECT_ELEMENT_BY_ID',
payload: id,
});
}
}
},
[dispatch, selectFiberID, selectFiberName, store],
);
if (isProfiling) {
batchedUpdates(() => {
if (selectedCommitIndex !== null) {
@ -237,7 +245,7 @@ function ProfilerContextController({children}: Props) {
supportsProfiling,
rootID,
setRootID,
setRootID: setRootIDAndClearFiber,
isCommitFilterEnabled,
setIsCommitFilterEnabled,
@ -268,6 +276,7 @@ function ProfilerContextController({children}: Props) {
rootID,
setRootID,
setRootIDAndClearFiber,
isCommitFilterEnabled,
setIsCommitFilterEnabled,