(updated) snapshot interace

Author: Theqwertypusher

src/app/components/PerformanceVisx.tsx

@@ -20,8 +20,6 @@ seen in recoil apps...
  */
 
 /* TYPESCRIPT */
-type snapshot = any;
-
 interface margin { top: number; right: number; bottom: number; left: number };
 
 interface TooltipData {
@@ -35,6 +33,10 @@ interface TooltipData {
   color: string;
 }
 
+interface data {
+  snapshotId?: string;
+}
+
 // typescript for PROPS from StateRoute.tsx
 interface BarStackProps {
   width: number;
@@ -43,6 +45,13 @@ interface BarStackProps {
   hierarchy: any;
 }
 
+interface snapshot {
+  children: [];
+  componentData: any;
+  name: string;
+  state: string;
+}
+
 /* DEFAULTS */
 const margin = { top: 60, right: 30, bottom: 0, left: 50 };
 const axisColor = '#679DCA';
@@ -58,10 +67,6 @@ const tooltipStyles = {
 
 // traverses a snapshot - returns object of rendering times OR component state types. Depends on 2nd arg
 
-interface data {
-  snapshotId?: string;
-}
-
 const traverse = (snapshot, data: data = {}) => {
   if (!snapshot.children[0]) return;
   for (let i = 0; i < snapshot.children.length; i++) {
@@ -115,7 +120,7 @@ const PerformanceVisx = (props: BarStackProps) => {
 
   const data = getPerfMetrics(snapshots, getSnapshotIds(hierarchy));
 
-  const keys = Object.keys(data[0]).filter(d => d !== 'snapshotId') as [];
+  const keys = Object.keys(data[0]).filter(d => d !== 'snapshotId');
 
   const allComponentStates = traverse(snapshots[0]);