pull master

Author: aquinojardim

src/app/containers/MainContainer.tsx

@@ -84,7 +84,7 @@ function MainContainer(): any {
   // if viewIndex is -1, then use the sliderIndex instead
   const snapshotView = viewIndex === -1 ? snapshots[sliderIndex] : snapshots[viewIndex];
   // gabi :: cleannign hierarchy and snapshotView from stateless data
-  const statelessCleanning = (
+  const statelessCleaning = (
     obj:{name?:string; componentData?:object; state?:string|any;stateSnaphot?:object; children?:any[];}) => {
     const newObj = { ...obj };
     if (newObj.name === 'nameless') {
@@ -97,23 +97,23 @@ function MainContainer(): any {
       delete newObj.state;
     }
     if (newObj.stateSnaphot) {
-      newObj.stateSnaphot = statelessCleanning(obj.stateSnaphot);
+      newObj.stateSnaphot = statelessCleaning(obj.stateSnaphot);
     }
     if (newObj.children) {
       newObj.children = [];
       if (obj.children.length > 0) {
         obj.children.forEach((element:{state?:object|string, children?:[]}) => {
           if (element.state !== 'stateless' || element.children.length > 0) {
-            const clean = statelessCleanning(element);
+            const clean = statelessCleaning(element);
             newObj.children.push(clean);
           }
         });
       }
     }
     return newObj;
   };
-  const snapshotDisplay = statelessCleanning(snapshotView);
-  const hierarchyDisplay = statelessCleanning(hierarchy);
+  const snapshotDisplay = statelessCleaning(snapshotView);
+  const hierarchyDisplay = statelessCleaning(hierarchy);
   return (
     <div className="main-container">
       <HeadContainer />

src/backend/linkFiber.ts

@@ -38,6 +38,7 @@ import 'core-js';
 // const componentActionsRecord = require('./masterState');
 
 import {
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
  Snapshot, Mode, ComponentData, HookStates, Fiber
 } from './types/backendTypes';
 import Tree from './tree';
@@ -114,7 +115,14 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
     } = currentFiber;
 
     let newState: any | {hooksState?: any[]} = {};
-    let componentData: ComponentData = {};
+    let componentData: {
+      hooksState?: any[],
+      hooksIndex?: number,
+      index?: number,
+      actualDuration?: number,
+      actualStartTime?: number,
+      selfBaseDuration?: number,
+      treeBaseDuration?: number} = {};
     let componentFound = false;
 
     // Check if node is a stateful setState component
@@ -138,16 +146,14 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
         const hooksNames = getHooksNames(elementType.toString());
         hooksStates.forEach((state, i) => {
           hooksIndex = componentActionsRecord.saveNew(state.state, state.component);
+          componentData.hooksIndex = hooksIndex;
           if (newState && newState.hooksState) {
-            newState.hooksState.push({ [hooksNames[i]]: state.state, componentData: { index: hooksIndex } });
-            // newState.hooksState.push([{ [hooksNames[i]]: state.state }, hooksIndex]);
+            newState.hooksState.push({ [hooksNames[i]]: state.state });
           } else if (newState) {
-            newState.hooksState = [{ [hooksNames[i]]: state.state, componentData: { index: hooksIndex } }];
-            // newState.hooksState = [{ [hooksNames[i]]: state.state }, hooksIndex];
+            newState.hooksState = [{ [hooksNames[i]]: state.state }];
           } else {
-            // newState = { hooksState: [{ [hooksNames[i]]: state.state }, hooksIndex] };
             newState = { hooksState: [] };
-            newState.hooksState.push({ [hooksNames[i]]: state.state, componentData: { index: hooksIndex } });
+            newState.hooksState.push({ [hooksNames[i]]: state.state });
           }
           componentFound = true;
         });
@@ -232,7 +238,6 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
     const reactInstance = devTools ? devTools.renderers.get(1) : null;
     fiberRoot = devTools.getFiberRoots(1).values().next().value;
     const throttledUpdateSnapshot = throttle(updateSnapShotTree, 140);
-
     document.addEventListener('visibilitychange', onVisibilityChange);
     if (reactInstance && reactInstance.version) {
       devTools.onCommitFiberRoot = (function (original) {

src/backend/timeJump.js

@@ -45,22 +45,13 @@ export default (origin, mode) => {
 
     // Check for hooks state and set it with dispatch()
     if (target.state && target.state.hooksState) {
-      console.log('SNAPSHOT TARGET: ', target);
-      // const hooksComponent = componentActionsRecord.getComponentByIndex(target.state.hooksState[1]);
       target.state.hooksState.forEach(hook => {
-        console.log('HOOK IS:', JSON.stringify(hook));
-        if (!hook.componentData) return;
-        const hooksComponent = componentActionsRecord.getComponentByIndex(hook.componentData.index);
-        // const [hooksState] = [target.state.hooksState];
-        delete hook.componentData;
-        const hooksState = Object.values(hook);
+        const hooksComponent = componentActionsRecord.getComponentByIndex(target.componentData.hooksIndex);
+        const hookState = Object.values(hook);
         if (hooksComponent && hooksComponent.dispatch) {
-          // hooksComponent.dispatch(Object.values(target.state.hooksState[0])[0]);
-          hooksComponent.dispatch(hooksState);
+          hooksComponent.dispatch(hookState[0]);
         }
       });
-      //target.children.forEach(child => jump(child));
-
     }
 
     target.children.forEach(child => {

src/backend/types/backendTypes.ts

@@ -28,6 +28,7 @@ export interface MsgData {
 
 export interface ComponentData {
   index?: number;
+  hooksIndex?: number;
   actualDuration?: number;
   actualStartTime?: number;
   selfBaseDuration?: number;