[DevTools] Lazily compute initial Tree state (#34078)
Sebastian "Sebbie" Silbermann committed
Aug 1, 2025 at 17:49 UTC
bdb4a96f628d3b426d3c79fbd598ec35c05835a3
1 file changed
+49
-26
packages/react-devtools-shared/src/devtools/views/Components/TreeContext.js
+49
-26
@@ -803,6 +803,45 @@ type Props = {
803
defaultInspectedElementIndex?: ?number,
804
};
805
806
+function getInitialState({
807
+ defaultOwnerID,
808
+ defaultInspectedElementID,
809
+ defaultInspectedElementIndex,
810
+ store,
811
+}: {
812
+ defaultOwnerID?: ?number,
813
+ defaultInspectedElementID?: ?number,
814
+ defaultInspectedElementIndex?: ?number,
815
+ store: Store,
816
+}): State {
817
+ return {
818
+ // Tree
819
+ numElements: store.numElements,
820
+ ownerSubtreeLeafElementID: null,
821
+
822
+ // Search
823
+ searchIndex: null,
824
+ searchResults: [],
825
+ searchText: '',
826
+
827
+ // Owners
828
+ ownerID: defaultOwnerID == null ? null : defaultOwnerID,
829
+ ownerFlatTree: null,
830
+
831
+ // Inspection element panel
832
+ inspectedElementID:
833
+ defaultInspectedElementID != null
834
+ ? defaultInspectedElementID
835
+ : store.lastSelectedHostInstanceElementId,
836
+ inspectedElementIndex:
837
+ defaultInspectedElementIndex != null
838
+ ? defaultInspectedElementIndex
839
+ : store.lastSelectedHostInstanceElementId
840
+ ? store.getIndexOfElementID(store.lastSelectedHostInstanceElementId)
841
+ : null,
842
+ };
843
+}
844
+
845
// TODO Remove TreeContextController wrapper element once global Context.write API exists.
846
function TreeContextController({
847
children,
@@ -866,32 +905,16 @@ function TreeContextController({
905
[store],
906
);
907
869
- const [state, dispatch] = useReducer(reducer, {
870
- // Tree
871
- numElements: store.numElements,
872
- ownerSubtreeLeafElementID: null,
873
-
874
- // Search
875
- searchIndex: null,
876
- searchResults: [],
877
- searchText: '',
878
-
879
- // Owners
880
- ownerID: defaultOwnerID == null ? null : defaultOwnerID,
881
- ownerFlatTree: null,
882
-
883
- // Inspection element panel
884
- inspectedElementID:
885
- defaultInspectedElementID != null
886
- ? defaultInspectedElementID
887
- : store.lastSelectedHostInstanceElementId,
888
- inspectedElementIndex:
889
- defaultInspectedElementIndex != null
890
- ? defaultInspectedElementIndex
891
- : store.lastSelectedHostInstanceElementId
892
- ? store.getIndexOfElementID(store.lastSelectedHostInstanceElementId)
893
- : null,
894
- });
908
+ const [state, dispatch] = useReducer(
909
+ reducer,
910
+ {
911
+ defaultOwnerID,
912
+ defaultInspectedElementID,
913
+ defaultInspectedElementIndex,
914
+ store,
915
+ },
916
+ getInitialState,
917
+ );
918
const transitionDispatch = useMemo(
919
() => (action: Action) =>
920
startTransition(() => {