Group app wide ui state into one object

Summary: Should be a bit easier to see what UI state we are holding at the plugin instance level

Reviewed By: lblasa

Differential Revision: D41498272

fbshipit-source-id: 6d88086766efd9c39f71be7e2ce32c5058494c96

desktop/plugins/public/ui-debugger/components/main.tsx

@@ -30,7 +30,7 @@ export function Component() {
 
   useHotkeys('ctrl+i', () => setShowPerfStats((show) => !show));
 
-  const searchTerm = useValue(instance.searchTerm);
+  const searchTerm = useValue(instance.uiState.searchTerm);
   const {ctrlPressed} = useKeyboardModifiers();
 
   function renderSidebar(
@@ -55,7 +55,7 @@ export function Component() {
         <Layout.Container grow pad="medium" gap="small">
           <Input
             value={searchTerm}
-            onChange={(e) => instance.searchTerm.set(e.target.value)}
+            onChange={(e) => instance.uiState.searchTerm.set(e.target.value)}
           />
           <Layout.ScrollContainer>
             <Tree