changed cleanning to cleaning in frontend types and diff

Author: morahgeist

src/app/FrontendTypes.ts

@@ -33,8 +33,8 @@ export interface TreeProps {
     stateSnaphot?: object;
     children?: any[];
   };
-  snapshots?:[];
-  currLocation?:object;
+  snapshots?: [];
+  currLocation?: object;
 }
 
 export interface BarStackProp {
@@ -159,7 +159,7 @@ export interface ActionProps {
   last: boolean;
   index: number;
   sliderIndex: number;
-  dispatch: (a: { type: string; payload: unknown; }) => void;
+  dispatch: (a: { type: string; payload: unknown }) => void;
   displayName: string;
   componentName: string;
   componentData: { actualDuration: number } | undefined;
@@ -249,7 +249,7 @@ export interface LinkControlProps {
   setStepPercent: (percent: number) => void;
   setSelectedNode: (selectedNode: string) => void;
   snapShots: Record<string, unknown>;
-};
+}
 
 export interface ControlStyles {
   fontSize: string;
@@ -270,7 +270,7 @@ export interface DropDownStyle {
 
 export interface Node {
   children?: Node[];
-  name?: string
+  name?: string;
   // other properties here
 }
 
@@ -286,7 +286,7 @@ export interface LinkTypesProps {
   margin?: { top: number; right: number; bottom: number; left: number };
   snapshots: Record<string, unknown>;
   currentSnapshot?: Record<string, unknown>;
-};
+}
 
 export interface ToolTipStyles {
   defaultStyles: React.CSSProperties;
@@ -307,12 +307,12 @@ export interface OptionsCursorTrueWithMargin {
   shiftY: number;
 }
 
-export interface StatelessCleanning {
+export interface StatelessCleaning {
   name?: string;
   componentData?: Record<string, unknown>;
   state?: string | {};
   stateSnaphot?: Record<string, unknown>;
-  children?: StatelessCleanning[];
+  children?: StatelessCleaning[];
 }
 
 export interface Snapshots {
@@ -321,4 +321,4 @@ export interface Snapshots {
   component2: number;
   component3: number;
   'all others': number;
-}
+}

src/app/components/Diff.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { diff, formatters } from 'jsondiffpatch';
 import ReactHtmlParser from 'react-html-parser';
 import { useStoreContext } from '../store';
-import { DiffProps, StatelessCleanning } from '../FrontendTypes';
+import { DiffProps, StatelessCleaning } from '../FrontendTypes';
 
 /**
  * Displays tree showing specific two versions of tree
@@ -26,7 +26,7 @@ function Diff(props: DiffProps): JSX.Element {
   }
 
   // cleaning preview from stateless data
-  const statelessCleanning = (obj: StatelessCleanning) => {
+  const statelessCleaning = (obj: StatelessCleaning) => {
     const newObj = { ...obj };
     if (newObj.name === 'nameless') {
       delete newObj.name;
@@ -38,15 +38,15 @@ function Diff(props: DiffProps): JSX.Element {
       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?: Record<string, unknown> | string; children?: [] }) => {
             if (element.state !== 'stateless' || element.children.length > 0) {
-              const clean = statelessCleanning(element);
+              const clean = statelessCleaning(element);
               newObj.children.push(clean);
             }
           },
@@ -57,20 +57,21 @@ function Diff(props: DiffProps): JSX.Element {
   };
 
   // displays stateful data
-  const previousDisplay: StatelessCleanning = statelessCleanning(previous);
+  const previousDisplay: StatelessCleaning = statelessCleaning(previous);
   // diff function returns a comparison of two objects, one has an updated change
   // just displays stateful data
-  const delta: StatelessCleanning = diff(previousDisplay, snapshot);
+  const delta: StatelessCleaning = diff(previousDisplay, snapshot);
   // returns html in string
   // just displays stateful data
-  const html: StatelessCleanning = formatters.html.format(delta, previousDisplay);
+  const html: StatelessCleaning = formatters.html.format(delta, previousDisplay);
   if (show) formatters.html.showUnchanged();
   else formatters.html.hideUnchanged();
   if (previous === undefined || delta === undefined) {
     return (
       <div className='no-data-message'>
         {' '}
-        Make state changes and click on a Snapshot to see the difference between that snapshot and the previous one.{' '}
+        Make state changes and click on a Snapshot to see the difference between that snapshot and
+        the previous one.{' '}
       </div>
     );
   }