Skip to content

Commit cf87200

Browse files
authored
Merge pull request #333 from open-source-labs/oliver/cleanup
Refactoring for v24 launch
2 parents 2b408b0 + 2c14ad0 commit cf87200

File tree

8 files changed

+38
-61
lines changed

8 files changed

+38
-61
lines changed

package.json

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,10 @@
3232
"url": "https://github.com/open-source-labs/reactime"
3333
},
3434
"contributors": [
35+
"Jesse Guerrero",
36+
"Oliver Cho",
37+
"Eva Ury",
38+
"Amy Yang",
3539
"Abaas Khorrami",
3640
"Alex Gomez",
3741
"Alexander Landeros",
Lines changed: 23 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,39 @@
1-
import React from "react";
1+
import React from 'react';
22
import { ParentSize } from '@visx/responsive';
3-
import AxTree from "./Ax";
4-
import { AxContainer } from "../../../FrontendTypes";
3+
import AxTree from './Ax';
4+
import { AxContainer } from '../../../FrontendTypes';
55

66
// Container to hold AxTree. AxTree is conditionally rendered based on the state of the setter function "showTree" in StateRoute
77

88
const AxContainer = (props: AxContainer) => {
9-
const {
10-
axSnapshots, // from 'tabs[currentTab]' object in 'MainContainer'
11-
snapshot, // from 'tabs[currentTab]' object in 'MainContainer'
12-
snapshots, // from 'tabs[currentTab].snapshotDisplay' object in 'MainContainer'
13-
currLocation, // from 'tabs[currentTab]' object in 'MainContainer'
14-
} = props;
15-
16-
return (
17-
<div style={{height: '90vh'}}>
9+
const {
10+
axSnapshots, // from 'tabs[currentTab]' object in 'MainContainer'
11+
snapshot, // from 'tabs[currentTab]' object in 'MainContainer'
12+
snapshots, // from 'tabs[currentTab].snapshotDisplay' object in 'MainContainer'
13+
currLocation, // from 'tabs[currentTab]' object in 'MainContainer'
14+
} = props;
15+
16+
return (
17+
<div style={{ height: '90vh' }}>
1818
<ParentSize className='componentMapContainer'>
1919
{({ width, height }) => {
2020
// eslint-disable-next-line react/prop-types
2121
const maxHeight: number = 1200;
2222
const h = Math.min(height, maxHeight);
23-
console.log('h: ', h);
24-
console.log('width', width)
2523
return (
26-
<AxTree
27-
axSnapshots={axSnapshots}
28-
snapshot={snapshot}
29-
snapshots={snapshots}
30-
currLocation={currLocation}
31-
width={width}
32-
height={h}
33-
/>
24+
<AxTree
25+
axSnapshots={axSnapshots}
26+
snapshot={snapshot}
27+
snapshots={snapshots}
28+
currLocation={currLocation}
29+
width={width}
30+
height={h}
31+
/>
3432
);
3533
}}
3634
</ParentSize>
3735
</div>
38-
)
39-
}
36+
);
37+
};
4038

41-
export default AxContainer;
39+
export default AxContainer;

src/app/components/StateRoute/AxMap/ToolTipDataDisplay.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -44,8 +44,8 @@ const ToolTipDataDisplay = ({ containerName, dataObj }) => {
4444
//ignored reasons here
4545
//&& key = name? / order?
4646
for (const key in dataObj) {
47-
console.log('keys in dataObj in tooltiptotalDisplay: ', key);
48-
if(key === 'properties' || key === 'ignored' || key === 'ignoredReasons'){// loop through properties, adding them to the data object
47+
if (key === 'properties' || key === 'ignored' || key === 'ignoredReasons') {
48+
// loop through properties, adding them to the data object
4949

5050
if (typeof dataObj[key] === 'string') {
5151
//if 'key' is ignored, put the ignored key and its value on the data object

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

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,6 @@ export default function ComponentMap({
109109
hideTooltip, // function to close a tooltip
110110
} = useTooltip(); // returns an object with several properties that you can use to manage the tooltip state of your component
111111

112-
console.log('tooltipData component map: ', tooltipData);
113112
const {
114113
containerRef, // Access to the container's bounding box. This will be empty on first render.
115114
TooltipInPortal, // TooltipWithBounds in a Portal, outside of your component DOM tree

src/app/slices/mainSlice.ts

Lines changed: 8 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -47,31 +47,17 @@ export const mainSlice = createSlice({
4747
tabs[currentTab].viewIndex = 0;
4848
tabs[currentTab].playing = false;
4949

50-
// REFACTORED TO HAVE CLEAR BUTTON KEEP CURRENT STATE OF DEMO APP RATHER THAN JUST THE LAST STATE RECORDED
51-
// PRIOR IMPLEMENTATION WAS FAILING TO RESET STATE OF DEMO APP UPON CLEAR
52-
// IF CHANGING, CHANGE BACKGROUND.JS TOO
53-
54-
// const lastSnapshot = tabs[currentTab].snapshots[tabs[currentTab].snapshots.length - 1]; // the most recent snapshot
55-
// const lastAxSnapshot = tabs[currentTab].axSnapshots[tabs[currentTab].axSnapshots.length - 1]; // the most recent snapshot
56-
const currSnapshot = tabs[currentTab].snapshots[tabs[currentTab].currLocation.index]; // the most recent snapshot
57-
const currAxSnapshot = tabs[currentTab].axSnapshots[tabs[currentTab].currLocation.index]; // the most recent snapshot
58-
59-
// tabs[currentTab].hierarchy.stateSnapshot = { ...lastSnapshot }; // resets hierarchy to page last state recorded
60-
// // not sure why shallow deep copy
61-
// tabs[currentTab].hierarchy.axSnapshot = lastAxSnapshot; // resets hierarchy to page last state recorded
62-
// tabs[currentTab].hierarchy.children = []; // resets hierarchy
63-
// tabs[currentTab].snapshots = [lastSnapshot]; // resets snapshots to page last state recorded
64-
// tabs[currentTab].axSnapshots = [lastAxSnapshot]; // resets snapshots to page last state recorded
65-
66-
tabs[currentTab].hierarchy.stateSnapshot = { ...currSnapshot }; // resets hierarchy to page last state recorded
50+
const currSnapshot = tabs[currentTab].snapshots[tabs[currentTab].currLocation.index]; // current snapshot
51+
const currAxSnapshot = tabs[currentTab].axSnapshots[tabs[currentTab].currLocation.index]; // current snapshot
52+
53+
tabs[currentTab].hierarchy.stateSnapshot = { ...currSnapshot }; // resets hierarchy to page current snapshot
6754
// not sure why shallow deep copy
68-
tabs[currentTab].hierarchy.axSnapshot = currAxSnapshot; // resets hierarchy to page last state recorded
55+
tabs[currentTab].hierarchy.axSnapshot = currAxSnapshot; // resets hierarchy to current snapshot
6956
tabs[currentTab].hierarchy.children = []; // resets hierarchy
70-
tabs[currentTab].snapshots = [currSnapshot]; // resets snapshots to page last state recorded
71-
tabs[currentTab].axSnapshots = [currAxSnapshot]; // resets snapshots to page last state recorded
57+
tabs[currentTab].snapshots = [currSnapshot]; // resets snapshots to current snapshot
58+
tabs[currentTab].axSnapshots = [currAxSnapshot]; // resets snapshots to current snapshot
7259

73-
// resets currLocation to page last state recorded
74-
// tabs[currentTab].currLocation = tabs[currentTab].hierarchy;
60+
// resets currLocation to current snapshot
7561
tabs[currentTab].index = 1;
7662
tabs[currentTab].currParent = 0;
7763
tabs[currentTab].currBranch = 1;

src/backend/controllers/timeJump.ts

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -49,12 +49,6 @@ async function updateReactFiberTree(
4949
targetSnapshot,
5050
circularComponentTable: Set<any> = new Set(),
5151
): Promise<void> {
52-
console.log(
53-
'updateReactFiberTree: targetSnapshot:',
54-
targetSnapshot,
55-
'circularComponentTable:',
56-
circularComponentTable,
57-
);
5852
if (!targetSnapshot) return;
5953
// Base Case: if has visited, return
6054
if (circularComponentTable.has(targetSnapshot)) {

src/extension/background.js

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -358,9 +358,6 @@ chrome.runtime.onConnect.addListener((port) => {
358358

359359
// emptySnap actions comes through when the user uses the 'clear' button on the front end to clear the snapshot history and move slider back to 0 position
360360
case 'emptySnap':
361-
// REFACTORED TO HAVE CLEAR BUTTON KEEP CURRENT STATE OF DEMO APP RATHER THAN JUST THE LAST STATE RECORDED
362-
// PRIOR IMPLEMENTATION WAS FAILING TO RESET STATE OF DEMO APP UPON CLEAR
363-
// IF CHANGING, CHANGE MAINSLICE.JS TOO
364361
tabsObj[tabId].snapshots = [tabsObj[tabId].snapshots[tabsObj[tabId].currLocation.index]]; // reset snapshots to current page state
365362
tabsObj[tabId].hierarchy.children = []; // resets hierarchy
366363
tabsObj[tabId].hierarchy.stateSnapshot = {
@@ -372,7 +369,6 @@ chrome.runtime.onConnect.addListener((port) => {
372369
tabsObj[tabId].axSnapshots[tabsObj[tabId].currLocation.index],
373370
]; // resets axSnapshots to current page state
374371
tabsObj[tabId].hierarchy.axSnapshot = tabsObj[tabId].axSnapshots[0]; // resets hierarchy to ax tree of current page state
375-
// tabsObj[tabId].currLocation = tabsObj[tabId].hierarchy; // resets currLocation to page last state recorded
376372
tabsObj[tabId].index = 1; //reset index
377373
tabsObj[tabId].currParent = 0; // reset currParent
378374
tabsObj[tabId].currBranch = 1; // reset currBranch

src/extension/build/manifest.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "Reactime",
3-
"version": "23.0.0",
3+
"version": "24.0.0",
44
"devtools_page": "devtools.html",
55
"description": "A Chrome extension that helps debug React applications by memorizing the state of components with every render.",
66
"manifest_version": 3,

0 commit comments

Comments
 (0)