Repository: facebook/react
File: packages/react-devtools-shared/src/devtools/views/Components/TreeContext.js (JavaScript)

Code before:
  );

  const [state, dispatch] = useReducer(reducer, {
    // Tree
    numElements: store.numElements,
    ownerSubtreeLeafElementID: null,

    // Search
    searchIndex: null,
    searchResults: [],
    searchText: '',

    // Owners
    ownerID: defaultOwnerID == null ? null : defaultOwnerID,
    ownerFlatTree: null,

    // Inspection element panel
    inspectedElementID:
      defaultInspectedElementID != null
        ? defaultInspectedElementID
        : store.lastSelectedHostInstanceElementId,
    inspectedElementIndex:
      defaultInspectedElementIndex != null
        ? defaultInspectedElementIndex
        : store.lastSelectedHostInstanceElementId
          ? store.getIndexOfElementID(store.lastSelectedHostInstanceElementId)
          : null,
  });
  const transitionDispatch = useMemo(
    () => (action: Action) =>
      startTransition(() => {
        dispatch(action);
      }),
    [dispatch],
  );

  // Listen for host element selections.
  useEffect(() => {
    const handler = (id: Element['id']) =>
      transitionDispatch({type: 'SELECT_ELEMENT_BY_ID', payload: id});

    store.addListener('hostInstanceSelected', handler);
    return () => store.removeListener('hostInstanceSelected', handler);
  }, [store, transitionDispatch]);

  // If a newly-selected search result or inspection selection is inside of a collapsed subtree, auto expand it.
  // This needs to be a layout effect to avoid temporarily flashing an incorrect selection.
  const prevInspectedElementID = useRef<number | null>(null);
  useLayoutEffect(() => {
    if (state.inspectedElementID !== prevInspectedElementID.current) {
      prevInspectedElementID.current = state.inspectedElementID;

Review comment (suggestion):
This is where the warning originates from. We didn't use that index anymore since we no longer relied on the default state yet the warning continued to be issue. It should only be issued when we actually use a problematic value.

Code after:
          case 'RESET_OWNER_STACK':
          case 'SELECT_ELEMENT_AT_INDEX':
          case 'SELECT_ELEMENT_BY_ID':
          case 'SELECT_CHILD_ELEMENT_IN_TREE':
          case 'SELECT_NEXT_ELEMENT_IN_TREE':
          case 'SELECT_NEXT_ELEMENT_WITH_ERROR_OR_WARNING_IN_TREE':
          case 'SELECT_NEXT_SIBLING_IN_TREE':
          case 'SELECT_OWNER_LIST_NEXT_ELEMENT_IN_TREE':
          case 'SELECT_OWNER_LIST_PREVIOUS_ELEMENT_IN_TREE':
          case 'SELECT_PARENT_ELEMENT_IN_TREE':
          case 'SELECT_PREVIOUS_ELEMENT_IN_TREE':
          case 'SELECT_PREVIOUS_ELEMENT_WITH_ERROR_OR_WARNING_IN_TREE':
          case 'SELECT_PREVIOUS_SIBLING_IN_TREE':
          case 'SELECT_OWNER':
          case 'SET_SEARCH_TEXT':
            state = reduceTreeState(store, state, action);
            state = reduceSearchState(store, state, action);
            state = reduceOwnersState(store, state, action);

            // TODO(hoxyq): review
            // If the selected ID is in a collapsed subtree, reset the selected index to null.
            // We'll know the correct index after the layout effect will toggle the tree,
            // and the store tree is mutated to account for that.
            if (
              state.inspectedElementID !== null &&
              store.isInsideCollapsedSubTree(state.inspectedElementID)
            ) {
              return {
                ...state,
                inspectedElementIndex: null,
              };
            }

            return state;
          default:
            throw new Error(`Unrecognized action "${type}"`);
        }
      },
    [store],
  );

  const [state, dispatch] = useReducer(
    reducer,
    {
      defaultOwnerID,
      defaultInspectedElementID,
      defaultInspectedElementIndex,
      store,
    },
    getInitialState,
  );