Migrate framework events backing data structure to datasource

Summary: This will allow us to build a nice table easily.

Reviewed By: lblasa

Differential Revision: D47520029

fbshipit-source-id: 3cdd776533b66688329171eb29b892e0b9153540

desktop/plugins/public/ui-debugger/components/sidebar/Inspector.tsx

@@ -42,7 +42,6 @@ export const Inspector: React.FC<Props> = ({
 }) => {
   const instance = usePlugin(plugin);
   const selectedNodeId = useValue(instance.uiState.selectedNode)?.id;
-  const frameworkEvents = useValue(instance.frameworkEvents);
 
   const selectedNode = selectedNodeId ? nodes.get(selectedNodeId) : undefined;
   if (!selectedNode) {
@@ -50,8 +49,8 @@ export const Inspector: React.FC<Props> = ({
   }
 
   const selectedFrameworkEvents = selectedNodeId
-    ? frameworkEvents?.get(selectedNodeId)
-    : undefined;
+    ? instance.frameworkEvents.getAllRecordsByIndex({nodeId: selectedNodeId})
+    : [];
 
   return (
     <Layout.Container gap pad>
@@ -108,7 +107,7 @@ export const Inspector: React.FC<Props> = ({
             />
           </Tab>
         )}
-        {selectedFrameworkEvents && (
+        {selectedFrameworkEvents?.length > 0 && (
           <Tab
             key={'events'}
             tab={