parsed tree to exclude context providers and consumers

Author: garrettlchow

src/app/components/StateRoute/ComponentMap/ComponentMap.tsx

@@ -172,7 +172,85 @@ export default function ComponentMap({
     }
   };
 
-  collectNodes(currentSnapshot);
+  const shouldIncludeNode = (node) => {
+    // Return false if node has any context properties
+    if (node?.componentData?.context && Object.keys(node.componentData.context).length > 0) {
+      return false;
+    }
+    // Return false if node name ends with 'Provider'
+    if (node?.name && node.name.endsWith('Provider')) {
+      return false;
+    }
+    return true;
+  };
+
+  const processTreeData = (node) => {
+    if (!node) return null;
+
+    // Create a new node
+    const newNode = { ...node };
+
+    if (node.children) {
+      // Process all children first
+      const processedChildren = node.children
+        .map((child) => processTreeData(child))
+        .filter(Boolean); // Remove null results
+
+      // For each child that shouldn't be included, replace it with its children
+      newNode.children = processedChildren.reduce((acc, child) => {
+        if (shouldIncludeNode(child)) {
+          // If child should be included, add it directly
+          acc.push(child);
+        } else {
+          // If child should be filtered out, add its children instead
+          if (child.children) {
+            acc.push(...child.children);
+          }
+        }
+        return acc;
+      }, []);
+    }
+
+    return newNode;
+  };
+
+  let filtered = processTreeData(currentSnapshot);
+  console.log('filtered', filtered);
+  collectNodes(filtered);
+
+  const keepContextAndProviderNodes = (node) => {
+    if (!node) return null;
+
+    // Check if this node should be kept
+    const hasContext =
+      node?.componentData?.context && Object.keys(node.componentData.context).length > 0;
+    const isProvider = node?.name && node.name.endsWith('Provider');
+    const shouldKeepNode = hasContext || isProvider;
+
+    // Process children first
+    let processedChildren = [];
+    if (node.children) {
+      processedChildren = node.children
+        .map((child) => keepContextAndProviderNodes(child))
+        .filter(Boolean); // Remove null results
+    }
+
+    // If this node should be kept or has kept children, return it
+    if (shouldKeepNode || processedChildren.length > 0) {
+      return {
+        ...node,
+        children: processedChildren,
+      };
+    }
+
+    // If neither the node should be kept nor it has kept children, filter it out
+    return null;
+  };
+
+  const contextProvidersOnly = keepContextAndProviderNodes(currentSnapshot);
+  console.log('context only', contextProvidersOnly);
+
+  collectNodes(filtered);
 
   // @ts
   // find the node that has been selected and use it as the root

src/backend/controllers/createTree.ts

@@ -244,6 +244,7 @@ export default function createTree(currentFiberNode: Fiber): Tree {
     }
     if (tag === ContextProvider && !elementType._context.displayName) {
       let stateData = memoizedProps.value;
+      console.log(stateData);
       if (stateData === null || typeof stateData !== 'object') {
         stateData = { CONTEXT: stateData };
       }