fix(ui-mode): fix issue when updating state while rendering

[mxschmitt]

Motivation: This fixes a React warning of updating component state on a render. It was caught by HMR of React Dev Server:

react-dom.development.js:86 Warning: Cannot update a component (`UIModeView`) while rendering a different component (`TestListView`). To locate the bad setState() call inside `TestListView`, follow the stack trace as described in https://reactjs.org/link/setstate-in-render
    at TestListView (http://localhost:44223/trace/src/ui/uiModeTestListView.tsx:38:5)
    at MillionProfilerRaw (http://localhost:44223/trace/node_modules/.vite/deps/@million_lint_runtime-dev.js?v=362ca7e4:7363:13)
    at div
    at div
    at div
    at SplitView (http://localhost:44223/trace/@fs/Users/maxschmitt/Developer/playwright/packages/web/src/components/splitView.tsx:31:5)
    at MillionProfilerRaw (http://localhost:44223/trace/node_modules/.vite/deps/@million_lint_runtime-dev.js?v=362ca7e4:7363:13)
    at div
    at UIModeView (http://localhost:44223/trace/src/ui/uiModeView.tsx:70:28)
printWarning    @   react-dom.development.js:86

See https://reactjs.org/link/setstate-in-render for more details.

[github-actions[bot]]

Test results for "tests 1"

2 flaky

:warning: [webkit-library] › library/inspector/cli-codegen-aria.spec.ts:78:7 › should update aria snapshot highlight @webkit-ubuntu-22.04-node18
:warning: [playwright-test] › ui-mode-test-watch.spec.ts:145:5 › should watch all @windows-latest-node18-1

36899 passed, 650 skipped :heavy_check_mark::heavy_check_mark::heavy_check_mark:

Merge workflow run.