Rename 'setStateDebounced' to 'setStateDelayedFlush'

Author: CompuIves

packages/app/src/app/components/Preview/DevTools/Tests/index.tsx

@@ -186,7 +186,7 @@ class Tests extends React.Component<DevToolProps, State> {
    * Every setState call will have to go through this, otherwise we get race conditions
    * where the underlying state has changed, but the draftState didn't change.
    */
-  setStateDebounced = (
+  setStateDelayedFlush = (
     setStateFunc:
       | Partial<State>
       | ((state: State, props: DevToolProps) => Partial<State>),
@@ -222,7 +222,7 @@ class Tests extends React.Component<DevToolProps, State> {
 
   UNSAFE_componentWillReceiveProps(nextProps: DevToolProps) {
     if (nextProps.sandboxId !== this.props.sandboxId) {
-      this.setStateDebounced(
+      this.setStateDelayedFlush(
         {
           files: {},
           selectedFilePath: null,
@@ -238,7 +238,7 @@ class Tests extends React.Component<DevToolProps, State> {
   }
 
   selectFile = (file: File) => {
-    this.setStateDebounced(
+    this.setStateDelayedFlush(
       state => ({
         selectedFilePath:
           file.fileName === state.selectedFilePath ? null : file.fileName,
@@ -248,7 +248,7 @@ class Tests extends React.Component<DevToolProps, State> {
   };
 
   toggleFileExpansion = (file: File) => {
-    this.setStateDebounced(
+    this.setStateDelayedFlush(
       oldState =>
         immer(oldState, state => {
           state.fileExpansionState[file.fileName] = !state.fileExpansionState[
@@ -283,7 +283,7 @@ class Tests extends React.Component<DevToolProps, State> {
           if (this.props.updateStatus) {
             this.props.updateStatus('clear');
           }
-          this.setStateDebounced(INITIAL_STATE, 0);
+          this.setStateDelayedFlush(INITIAL_STATE, 0);
           break;
         }
         case 'test_count': {
@@ -299,7 +299,7 @@ class Tests extends React.Component<DevToolProps, State> {
           if (this.props.updateStatus) {
             this.props.updateStatus('clear');
           }
-          this.setStateDebounced(
+          this.setStateDelayedFlush(
             {
               running: true,
             },
@@ -308,7 +308,7 @@ class Tests extends React.Component<DevToolProps, State> {
           break;
         }
         case messages.TOTAL_TEST_END: {
-          this.setStateDebounced(
+          this.setStateDelayedFlush(
             {
               running: false,
             },
@@ -338,7 +338,7 @@ class Tests extends React.Component<DevToolProps, State> {
         }
 
         case messages.ADD_FILE: {
-          this.setStateDebounced(oldState =>
+          this.setStateDelayedFlush(oldState =>
             immer(oldState, state => {
               state.files[data.path] = {
                 tests: {},
@@ -351,7 +351,7 @@ class Tests extends React.Component<DevToolProps, State> {
           break;
         }
         case 'remove_file': {
-          this.setStateDebounced(oldState =>
+          this.setStateDelayedFlush(oldState =>
             immer(oldState, state => {
               if (state.files[data.path]) {
                 delete state.files[data.path];
@@ -363,7 +363,7 @@ class Tests extends React.Component<DevToolProps, State> {
           break;
         }
         case messages.FILE_ERROR: {
-          this.setStateDebounced(oldState =>
+          this.setStateDelayedFlush(oldState =>
             immer(oldState, state => {
               if (state.files[data.path]) {
                 state.files[data.path].fileError = data.error;
@@ -383,7 +383,7 @@ class Tests extends React.Component<DevToolProps, State> {
         case messages.ADD_TEST: {
           const testName = [...this.currentDescribeBlocks, data.testName];
 
-          this.setStateDebounced(oldState =>
+          this.setStateDelayedFlush(oldState =>
             immer(oldState, state => {
               if (!state.files[data.path]) {
                 state.files[data.path] = {
@@ -409,7 +409,7 @@ class Tests extends React.Component<DevToolProps, State> {
           const { test } = data;
           const testName = [...test.blocks, test.name];
 
-          this.setStateDebounced(oldState =>
+          this.setStateDelayedFlush(oldState =>
             immer(oldState, state => {
               if (!state.files[test.path]) {
                 state.files[test.path] = {
@@ -440,7 +440,7 @@ class Tests extends React.Component<DevToolProps, State> {
           const { test } = data;
           const testName = [...test.blocks, test.name];
 
-          this.setStateDebounced(oldState =>
+          this.setStateDelayedFlush(oldState =>
             immer(oldState, state => {
               if (!state.files[test.path]) {
                 return;
@@ -529,22 +529,22 @@ class Tests extends React.Component<DevToolProps, State> {
   };
 
   toggleWatching = () => {
-    this.setStateDebounced(state => ({ watching: !state.watching }), 0);
+    this.setStateDelayedFlush(state => ({ watching: !state.watching }), 0);
     dispatch({
       type: 'set-test-watching',
       watching: !this.state.watching,
     });
   };
 
   runAllTests = () => {
-    this.setStateDebounced({ files: {} }, 0);
+    this.setStateDelayedFlush({ files: {} }, 0);
     dispatch({
       type: 'run-all-tests',
     });
   };
 
   runTests = (file: File) => {
-    this.setStateDebounced(
+    this.setStateDelayedFlush(
       oldState =>
         immer(oldState, state => {
           if (state.files[file.fileName]) {

packages/app/src/app/components/Preview/DevTools/index.tsx

@@ -149,7 +149,7 @@ export class DevTools extends React.PureComponent<Props, State> {
    * Every setState call will have to go through this, otherwise we get race conditions
    * where the underlying state has changed, but the draftState didn't change.
    */
-  setStateDebounced = (
+  setStateDelayedFlush = (
     setStateFunc:
       | Partial<State>
       | ((state: State, props: Props) => Partial<State>),
@@ -188,7 +188,7 @@ export class DevTools extends React.PureComponent<Props, State> {
     if (typeof this.state.height === 'string') {
       const { height } = el.getBoundingClientRect();
 
-      this.setStateDebounced({ height }, 0);
+      this.setStateDelayedFlush({ height }, 0);
     }
   };
 
@@ -249,7 +249,7 @@ export class DevTools extends React.PureComponent<Props, State> {
 
   setHidden = (hidden: boolean) => {
     if (!hidden) {
-      return this.setStateDebounced(
+      return this.setStateDelayedFlush(
         state => ({
           status: {
             ...state.status,
@@ -261,7 +261,7 @@ export class DevTools extends React.PureComponent<Props, State> {
       );
     }
 
-    return this.setStateDebounced({ hidden }, 0, () => {
+    return this.setStateDelayedFlush({ hidden }, 0, () => {
       if (this.props.setDevToolsOpen) {
         const { setDevToolsOpen } = this.props;
         setTimeout(() => setDevToolsOpen(!this.state.hidden), 100);
@@ -276,7 +276,7 @@ export class DevTools extends React.PureComponent<Props, State> {
     status: 'success' | 'warning' | 'error' | 'info' | 'clear',
     count?: number
   ) => {
-    this.setStateDebounced(state => {
+    this.setStateDelayedFlush(state => {
       const currentStatus = (status !== 'clear' && state.status[id]) || {
         unread: 0,
         type: 'info',
@@ -324,7 +324,7 @@ export class DevTools extends React.PureComponent<Props, State> {
     if (!this.state.mouseDown && typeof this.state.height === 'number') {
       const { clientY } = event;
       unFocus(document, window);
-      this.setStateDebounced(
+      this.setStateDelayedFlush(
         // @ts-ignore
         state => ({
           startY: clientY,
@@ -345,7 +345,7 @@ export class DevTools extends React.PureComponent<Props, State> {
 
   handleMouseUp = (e: Event) => {
     if (this.state.mouseDown) {
-      this.setStateDebounced({ mouseDown: false }, 0);
+      this.setStateDelayedFlush({ mouseDown: false }, 0);
       if (this.props.setDragging) {
         this.props.setDragging(false);
       }
@@ -389,7 +389,7 @@ export class DevTools extends React.PureComponent<Props, State> {
         this.state.startHeight - (event.clientY - this.state.startY)
       );
 
-      this.setStateDebounced(
+      this.setStateDelayedFlush(
         {
           height: Math.max(this.closedHeight() - 2, newHeight),
         },
@@ -422,7 +422,7 @@ export class DevTools extends React.PureComponent<Props, State> {
     TweenMax.to(heightObject, 0.3, {
       height: store.get('devtools.height') || 300,
       onUpdate: () => {
-        this.setStateDebounced(heightObject, 0);
+        this.setStateDelayedFlush(heightObject, 0);
       },
       ease: Elastic.easeOut.config(0.25, 1),
     });
@@ -437,7 +437,7 @@ export class DevTools extends React.PureComponent<Props, State> {
     TweenMax.to(heightObject, 0.3, {
       height: this.closedHeight(),
       onUpdate: () => {
-        this.setStateDebounced(heightObject, 0);
+        this.setStateDelayedFlush(heightObject, 0);
       },
       ease: Elastic.easeOut.config(0.25, 1),
     });