fix(function-to-class): Fix for wrap with useEffect refactoring relev…

…ancy detection. Closes #113

src/ast-helpers.ts

@@ -28,6 +28,30 @@ export function findPathInContext(ast, identifierName) {
   return foundPath;
 }
 
+export function findFirstPathInRange(ast, start, end) {
+  let foundPath = null;
+  const visitor = {
+    enter(path) {
+      if (!foundPath && pathInRange(path, start, end)) {
+        foundPath = path;
+        path.stop();
+      }
+    }
+  };
+
+  traverse(ast, visitor);
+  return foundPath;
+}
+
+
+export function pathInRange(path, start, end) {
+  if (!path.node) return false;
+  const pathStart = path.node.loc.start;
+  const pathEnd = path.node.loc.end;
+  return (pathStart.line >= start.line && pathStart.column >= start.character)
+
+}
+
 export function pathContains(path, start, end) {
   if (!path.node) return false;
   const pathStart = path.node.loc.start;
@@ -38,4 +62,4 @@ export function pathContains(path, start, end) {
     (
       (pathEnd.line >= end.line && pathEnd.column >= end.character))
   );
-}
+}

src/extension.ts

@@ -10,7 +10,7 @@ import { extractToFile } from './modules/extract-to-file';
 import { extractJSXToComponentToFile, extractJSXToComponent } from './modules/extract-to-component';
 import { wrapJSXWithCondition } from './modules/wrap-with-conditional';
 import { renameState, isStateVariable } from './modules/rename-state';
-import { wrapWithUseEffect, isInsideOfFunctionBody } from './modules/wrap-with-useeffect';
+import { wrapWithUseEffect, isWrappableByEffect } from './modules/wrap-with-useeffect';
 import { isFunctionInsideAFunction, wrapWithUseCallback } from './modules/wrap-with-usecallback';
 import { isVariableDeclarationWithNonFunctionInit, wrapWithUseMemo } from './modules/wrap-with-usememo';
 
@@ -44,7 +44,7 @@ export class CompleteActionProvider implements vscode.CodeActionProvider {
       }];
     }
 
-    if (isInsideOfFunctionBody(text) && !isJSX(text)) {
+    if (isWrappableByEffect(text) && !isJSX(text)) {
       return [{
         command: 'extension.glean.react.wrap-with-useeffect',
         title: 'Wrap with useEffect'

src/modules/wrap-with-useeffect.ts

@@ -1,19 +1,17 @@
-import { selectedText, importMissingDependencies, activeFileName, allText } from "../editor";
+import { selectedText, importMissingDependencies, activeFileName, allText, selectedTextStart, selectedTextEnd } from "../editor";
 import { replaceSelectionWith } from "../code-actions";
 import { buildEffectHook } from "../snippet-builder";
 import { codeToAst, astToCode } from "../parsing";
 import { persistFileSystemChanges } from "../file-system";
 import * as t from '@babel/types';
-import { findPathInContext } from "../ast-helpers";
+import { findPathInContext, pathContains, findFirstPathInRange } from "../ast-helpers";
 
 
-export async function isInsideOfFunctionBody(text) {
+export function isWrappableByEffect(text) {
     try {
         const allAST = codeToAst(allText());
-        const containerPath = findPathInContext(allAST, text);
-        return !!containerPath.findParent(parent => {
-            return t.isFunctionExpression(parent)
-        });
+        const containerPath = findFirstPathInRange(allAST, selectedTextStart(), selectedTextEnd());
+        return !t.isProgram(containerPath.parent);
     } catch (e) {
         return false;
     }