Facebook/react
1
0
Fork 0
mirror of https://github.com/facebook/react.git synced 2025-11-01 09:12:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

[DevTools] Track whether to auto select when new timeline entries come on (#34698)

Browse Source 
This auto updates to select the last entry in the timeline until we make
the first selection. That way when new content loads in, we show the
last timeline of what is visible.
This commit is contained in:
Sebastian Markbåge
2025-10-02 17:06:52 -04:00
committed by GitHub
parent 7d9f876cbc
commit f89ed71ddf
1 changed files with 12 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseTreeContext.js
Vendored
+12 -1
View File
@@ -30,6 +30,7 @@ export type SuspenseTreeState = {
hoveredTimelineIndex: number | -1,
uniqueSuspendersOnly: boolean,
playing: boolean,
autoSelect: boolean,
};
type ACTION_SUSPENSE_TREE_MUTATION = {
@@ -123,6 +124,7 @@ function getInitialState(store: Store): SuspenseTreeState {
hoveredTimelineIndex: -1,
uniqueSuspendersOnly,
playing: false,
autoSelect: true,
};
return initialState;
@@ -181,7 +183,10 @@ function SuspenseTreeContextController({children}: Props): React.Node {
selectedTimelineID === null || nextTimeline.length === 0
? -1
: nextTimeline.indexOf(selectedTimelineID);
if (nextTimeline.length > 0 && nextTimelineIndex === -1) {
if (
nextTimeline.length > 0 &&
(nextTimelineIndex === -1 || state.autoSelect)
) {
nextTimelineIndex = nextTimeline.length - 1;
selectedSuspenseID = nextTimeline[nextTimelineIndex];
}
@@ -212,6 +217,7 @@ function SuspenseTreeContextController({children}: Props): React.Node {
...state,
selectedSuspenseID,
playing: false, // pause
autoSelect: false,
};
}
case 'SET_SUSPENSE_LINEAGE': {
@@ -223,6 +229,7 @@ function SuspenseTreeContextController({children}: Props): React.Node {
lineage,
selectedSuspenseID: suspenseID,
playing: false, // pause
autoSelect: false,
};
}
case 'SET_SUSPENSE_TIMELINE': {
@@ -277,6 +284,7 @@ function SuspenseTreeContextController({children}: Props): React.Node {
selectedSuspenseID: nextSelectedSuspenseID,
timelineIndex: nextTimelineIndex,
playing: false, // pause
autoSelect: false,
};
}
case 'SUSPENSE_SKIP_TIMELINE_INDEX': {
@@ -299,6 +307,7 @@ function SuspenseTreeContextController({children}: Props): React.Node {
selectedSuspenseID: nextSelectedSuspenseID,
timelineIndex: nextTimelineIndex,
playing: false, // pause
autoSelect: false,
};
}
case 'SUSPENSE_PLAY_PAUSE': {
@@ -325,6 +334,7 @@ function SuspenseTreeContextController({children}: Props): React.Node {
selectedSuspenseID: nextSelectedSuspenseID,
timelineIndex: nextTimelineIndex,
playing: mode === 'toggle' ? !state.playing : mode === 'play',
autoSelect: false,
};
}
case 'SUSPENSE_PLAY_TICK': {
@@ -381,6 +391,7 @@ function SuspenseTreeContextController({children}: Props): React.Node {
selectedSuspenseID: nextSelectedSuspenseID,
timelineIndex: nextTimelineIndex,
playing: false, // pause
autoSelect: false,
};
}
case 'HOVER_TIMELINE_FOR_ID': {