@atlaskit/popper 7.0.0 → 7.0.1

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/popper
 
+## 7.0.1
+
+### Patch Changes
+
+- [#117686](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/117686)
+  [`6b9372e48276d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6b9372e48276d) -
+  Remove old codemod and update dependencies.
+
 ## 7.0.0
 
 ### Major Changes

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/popper",
-	"version": "7.0.0",
+	"version": "7.0.1",
 	"description": "A wrapper for React Popper for situations which require a bespoke popup where other ADS components are deemed unsuitable",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -36,16 +36,18 @@
 		"@af/accessibility-testing": "*",
 		"@af/integration-testing": "*",
 		"@af/visual-regression": "*",
+		"@atlaskit/button": "^21.1.0",
+		"@atlaskit/docs": "*",
 		"@atlaskit/ds-lib": "^4.0.0",
+		"@atlaskit/link": "*",
+		"@atlaskit/section-message": "*",
 		"@atlaskit/ssr": "*",
-		"@atlaskit/visual-regression": "*",
+		"@atlaskit/theme": "^17.0.0",
+		"@atlaskit/tokens": "^4.1.0",
 		"@emotion/react": "^11.7.1",
 		"@emotion/styled": "^11.0.0",
 		"@testing-library/react": "^13.4.0",
 		"@testing-library/user-event": "^14.4.3",
-		"@types/jscodeshift": "^0.11.0",
-		"ast-types": "^0.13.3",
-		"jscodeshift": "^0.13.0",
 		"react-dom": "^18.2.0",
 		"react-lorem-component": "^0.13.0",
 		"typescript": "~5.4.2"

package/codemods/5.0.0-lite-mode.tsx

@@ -1,152 +0,0 @@
-import {
-	type API,
-	type ASTPath,
-	type default as core,
-	type FileInfo,
-	type JSXElement,
-	JSXExpressionContainer,
-	type Literal,
-	type Options,
-	StringLiteral,
-} from 'jscodeshift';
-import { type Collection } from 'jscodeshift/src/Collection';
-
-import {
-	messageForModifierProps,
-	messageForUsingExpression,
-	messageForUsingVariable,
-} from './utils/constants';
-import {
-	addCommentToStartOfFile,
-	getJSXAttributesByName,
-	getSpecifierName,
-	hasImportDeclaration,
-	isUsingProp,
-	updateRenderProps,
-} from './utils/helpers';
-
-const updateOffsetNumbers = (value: string, j: core.JSCodeshift, attribute: ASTPath<any>) => {
-	if (value.includes(',')) {
-		// Split by comma
-		const offsetArray: Literal[] = value
-			.split(',')
-			//@ts-ignore
-			.map((elem) => j.literal(parseInt(elem.replace(/\D/g, ''))));
-		if (offsetArray.length === 2) {
-			j(attribute).replaceWith(j.jsxExpressionContainer(j.arrayExpression(offsetArray)));
-		}
-	} else {
-		// Split by space but check if it is a single number
-		const offsetArray: Literal[] = value
-			.split(' ')
-			.filter((elem) => elem.length)
-			.map((elem) => j.literal(parseInt(elem.replace(/\D/g, ''))));
-		if (offsetArray.length === 2) {
-			j(attribute).replaceWith(j.jsxExpressionContainer(j.arrayExpression(offsetArray)));
-		} else if (offsetArray.length === 1) {
-			j(attribute).replaceWith(
-				j.jsxExpressionContainer(j.arrayExpression([offsetArray[0], j.literal(0)])),
-			);
-		}
-	}
-};
-
-const isJSExpression = (value: string) =>
-	value.includes('%') || value.includes('vw') || value.includes('vh');
-
-function updateOffset(j: core.JSCodeshift, source: Collection<any>, specifier: string) {
-	source.findJSXElements(specifier).forEach((path: ASTPath<JSXElement>) => {
-		const offsetExpr = getJSXAttributesByName({
-			j,
-			element: path,
-			attributeName: 'offset',
-		});
-
-		const stringLiteral = offsetExpr.filter((attr) => {
-			return attr.value!.value!.type === 'StringLiteral';
-		});
-
-		const expression = offsetExpr.filter((attr) => {
-			return attr.value!.value!.type === 'JSXExpressionContainer';
-		});
-
-		if (stringLiteral.length > 0) {
-			stringLiteral.find(StringLiteral).forEach((attribute) => {
-				const expression = attribute.value;
-				updateOffsetNumbers(expression.value, j, attribute);
-			});
-		} else {
-			expression.find(JSXExpressionContainer).forEach((attribute) => {
-				const expression = attribute.value.expression;
-				if (expression.type === 'StringLiteral') {
-					const value = expression.value;
-					// Not testing for cases like '10 + 10%' because I assume if you're
-					// adding or taking numbers it's with units that are not supported
-					// and will be picked up by the first case
-					if (isJSExpression(value)) {
-						addCommentToStartOfFile({
-							j,
-							base: source,
-							message: messageForUsingExpression,
-						});
-					} else {
-						updateOffsetNumbers(value, j, attribute);
-					}
-				} else if (expression.type === 'NumericLiteral') {
-					// If it is a single number convert to [number, 0]
-					j(attribute).replaceWith(
-						j.jsxExpressionContainer(j.arrayExpression([expression, j.literal(0)])),
-					);
-				} else if (expression.type === 'Identifier') {
-					// If there is a variable add this comment
-					addCommentToStartOfFile({
-						j,
-						base: source,
-						message: messageForUsingVariable,
-					});
-				}
-			});
-		}
-	});
-}
-
-function updateModifierProp(j: core.JSCodeshift, source: Collection<any>, specifier: string) {
-	source.findJSXElements(specifier).forEach((element) => {
-		if (isUsingProp({ j, base: source, element, propName: 'modifiers' })) {
-			addCommentToStartOfFile({
-				j,
-				base: source,
-				message: messageForModifierProps,
-			});
-		}
-	});
-}
-
-export default function transformer(file: FileInfo, { jscodeshift: j }: API, options: Options) {
-	const source = j(file.source);
-
-	// Exit early if not relevant
-	// We are doing this so we don't touch the formatting of unrelated files
-	if (!hasImportDeclaration(j, file.source, '@atlaskit/popper')) {
-		return file.source;
-	}
-
-	const specifier = getSpecifierName({
-		j,
-		base: source,
-		packageName: '@atlaskit/popper',
-		component: 'Popper',
-	});
-
-	if (!specifier) {
-		return file.source;
-	}
-
-	updateRenderProps(j, source, specifier, 'outOfBoundaries', 'isReferenceHidden');
-	updateRenderProps(j, source, specifier, 'scheduleUpdate', 'update');
-	updateOffset(j, source, specifier);
-	updateModifierProp(j, source, specifier);
-
-	// const base: Collection<any> = j(file.source);
-	return source.toSource(options.printOptions || { quote: 'single' });
-}

package/codemods/__tests__/update-modifier.tsx

@@ -1,72 +0,0 @@
-jest.autoMockOff();
-
-import transformer from '../5.0.0-lite-mode';
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-describe('Changing popper usage', () => {
-	// TODO this probably isn't worth including, as they still have to do some major work to
-	//  re-work these modifiers.
-
-	/**
-	 * Modifiers:
-	 * - format has been changed from object of objects, to array of objects, with the key for each
-	 *   modifier replaced with a name key:value pair inside the modifier object
-	 * - modifier-specific options have been moved inside an options: key:value pair
-	 * - modifier options have been changed significantly: check the popper.js docs for more info
-	 */
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import { Popper } from '@atlaskit/popper';
-
-    export default () => {
-      customModifiers = {flip: {enabled: true}};
-      return (
-        <Popper modifiers={customModifiers}>
-          {({
-            ref,
-            style,
-            outOfBoundaries,
-            scheduleUpdate,
-          }) => (
-            <>
-              {outOfBoundaries && (
-                <div ref={ref} style={style} onClick={scheduleUpdate} />
-              )}
-            </>
-          )}
-        </Popper>
-    )};
-  `,
-		`
-    /* TODO: (from codemod) Popper.js has been upgraded from 1.14.1 to 2.4.2,
-    and as a result the modifier prop has changed significantly. The format has been
-    changed from object of objects, to array of objects, with the key for each modifier
-    replaced with a name key:value pair inside the modifier object, and an options:object
-    pair for configuration and other changes unique to each modifier.
-    Further details can be found in the popper docs: https://popper.js.org/docs/v2/modifiers/ */
-    import { Popper } from '@atlaskit/popper';
-
-    export default () => {
-      customModifiers = {flip: {enabled: true}};
-      return (
-        <Popper modifiers={customModifiers}>
-          {({
-            ref,
-            style,
-            isReferenceHidden: outOfBoundaries,
-            update: scheduleUpdate
-          }) => (
-            <>
-              {outOfBoundaries && (
-                <div ref={ref} style={style} onClick={scheduleUpdate} />
-              )}
-            </>
-          )}
-        </Popper>
-      );};
-  `,
-	);
-});

package/codemods/__tests__/update-offset-prop.tsx

@@ -1,346 +0,0 @@
-jest.autoMockOff();
-
-import transformer from '../5.0.0-lite-mode';
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-describe('Update offset prop', () => {
-	describe('offset as a string', () => {
-		defineInlineTest(
-			{ default: transformer, parser: 'tsx' },
-			{},
-			`
-      import { Popper } from '@atlaskit/popper';
-
-      export default () => (
-        <Popper offset='5px 8px'>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-      `,
-			`
-      import { Popper } from '@atlaskit/popper';
-
-      export default () => (
-        <Popper offset={[5, 8]}>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-      `,
-			'should convert string literal to array notation',
-		);
-
-		defineInlineTest(
-			{ default: transformer, parser: 'tsx' },
-			{},
-			`
-      import { Popper } from '@atlaskit/popper';
-
-      export default () => (
-        <Popper offset='5px, 8px'>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-      `,
-			`
-      import { Popper } from '@atlaskit/popper';
-
-      export default () => (
-        <Popper offset={[5, 8]}>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-      `,
-			'should convert string literal to array notation - with comma',
-		);
-	});
-
-	describe('offset as object expression', () => {
-		defineInlineTest(
-			{ default: transformer, parser: 'tsx' },
-			{},
-			`
-      import { Popper } from '@atlaskit/popper';
-
-      export default () => (
-        <Popper offset={'5px 8px'}>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-      `,
-			`
-      import { Popper } from '@atlaskit/popper';
-
-      export default () => (
-        <Popper offset={[5, 8]}>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-      `,
-			`should convert object to array notation`,
-		);
-
-		defineInlineTest(
-			{ default: transformer, parser: 'tsx' },
-			{},
-			`
-      import { Popper } from '@atlaskit/popper';
-
-      function numCommaOffset() {
-        return (
-          <Popper offset={'5px, 8px'}>
-            {({ ref, style }) => (
-              <div
-                ref={ref}
-                style={style}
-              />
-            )}
-          </Popper>
-        );
-      }
-    `,
-			`
-      import { Popper } from '@atlaskit/popper';
-
-      function numCommaOffset() {
-        return (
-          <Popper offset={[5, 8]}>
-            {({ ref, style }) => (
-              <div
-                ref={ref}
-                style={style}
-              />
-            )}
-          </Popper>
-        );
-      }
-      `,
-			`should convert number with comma as offset`,
-		);
-
-		defineInlineTest(
-			{ default: transformer, parser: 'tsx' },
-			{},
-			`
-    import { Popper } from '@atlaskit/popper';
-
-    function numStringOffset() {
-      return (
-        <Popper offset={'10'}>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-    }
-  `,
-			`
-    import { Popper } from '@atlaskit/popper';
-
-    function numStringOffset() {
-      return (
-        <Popper offset={[10, 0]}>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-    }
-    `,
-			`should add default value as 0 when one offset is missing - string`,
-		);
-
-		defineInlineTest(
-			{ default: transformer, parser: 'tsx' },
-			{},
-			`
-    import { Popper } from '@atlaskit/popper';
-
-    function numOffset() {
-      return (
-        <Popper offset={10}>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-    }
-  `,
-			`
-    import { Popper } from '@atlaskit/popper';
-
-    function numOffset() {
-      return (
-        <Popper offset={[10, 0]}>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-    }
-    `,
-			`should add default value as 0 when one offset is missing - number`,
-		);
-	});
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-  import { Popper } from '@atlaskit/popper';
-
-  export default () => (
-    <Popper offset={'5px + 7vh, 8px'}>
-      {({ ref, style }) => (
-        <div
-          ref={ref}
-          style={style}
-        />
-      )}
-    </Popper>
-  );
-  `,
-		`
-  /* TODO: (from codemod) Popper.js has been upgraded from 1.14.1 to 2.4.2,
-  and as a result the offset prop has changed to be an array. e.g '0px 8px' -> [0, 8]
-  Along with this change you cannot use vw, vh or % units or addition or multiplication
-  Change the offset value to use pixel values
-  Further details can be found in the popper docs https://popper.js.org/docs/v2/modifiers/offset/ */
-  import { Popper } from '@atlaskit/popper';
-
-  export default () => (
-    <Popper offset={'5px + 7vh, 8px'}>
-      {({ ref, style }) => (
-        <div
-          ref={ref}
-          style={style}
-        />
-      )}
-    </Popper>
-  );
-  `,
-		`should add correct document string for vh, vw and %`,
-	);
-
-	/**
-	 * If a user is passing in a variable for offset then we should leave a comment to
-	 * update it themselves
-	 */
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import { Popper } from '@atlaskit/popper';
-
-    function directOffset({offset}) {
-      return (
-        <Popper offset={offset}>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-    }
-    `,
-		`
-    /* TODO: (from codemod) Popper.js has been upgraded from 1.14.1 to 2.4.2, and as a result the offset
-    prop has changed to be an array. e.g '0px 8px' -> [0, 8]
-    As you are using a variable, you will have change the offset prop manually
-    Further details can be found in the popper docs https://popper.js.org/docs/v2/modifiers/offset/ */
-    import { Popper } from '@atlaskit/popper';
-
-    function directOffset({offset}) {
-      return (
-        <Popper offset={offset}>
-          {({ ref, style }) => (
-            <div
-              ref={ref}
-              style={style}
-            />
-          )}
-        </Popper>
-      );
-    }
-    `,
-		`should add correct document string for variable`,
-	);
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import { Manager, Popper as Popeye } from '@atlaskit/popper';
-
-    export default () => (
-      <Popeye offset={'5px 8px'}>
-        {({ ref, style }) => (
-          <div
-            ref={ref}
-            style={style}
-          />
-        )}
-      </Popeye>
-    );
-    `,
-		`
-    import { Manager, Popper as Popeye } from '@atlaskit/popper';
-
-    export default () => (
-      <Popeye offset={[5, 8]}>
-        {({ ref, style }) => (
-          <div
-            ref={ref}
-            style={style}
-          />
-        )}
-      </Popeye>
-    );
-  `,
-		`should works with an aliased import and other imports`,
-	);
-});

package/codemods/__tests__/update-render-props.tsx

@@ -1,59 +0,0 @@
-jest.autoMockOff();
-
-import transformer from '../5.0.0-lite-mode';
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-describe('Update props', () => {
-	/**
-	 * It should rename outOfBoundaries and scheduleUpdate props
-	 * Render Props:
-	 * - `outOfBoundaries` has been replaced with `isReferenceHidden`, and is now true when the popper is hidden (i.e. by a
-	 * scroll container)
-	 * - `scheduleUpdate`, for async updates, has been renamed to `update`, and now returns a Promise.
-	 */
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import { Popper } from '@atlaskit/popper';
-
-    export default () => (
-      <Popper>
-        {({
-          ref,
-          style,
-          outOfBoundaries,
-          scheduleUpdate
-        }) => (
-          <>
-            {outOfBoundaries && (
-              <div ref={ref} style={style} onClick={scheduleUpdate} />
-            )}
-          </>
-        )}
-      </Popper>
-    )
-  `,
-		`
-    import { Popper } from '@atlaskit/popper';
-
-    export default () => (
-      <Popper>
-        {({
-          ref,
-          style,
-          isReferenceHidden: outOfBoundaries,
-          update: scheduleUpdate
-        }) => (
-          <>
-            {outOfBoundaries && (
-              <div ref={ref} style={style} onClick={scheduleUpdate} />
-            )}
-          </>
-        )}
-      </Popper>
-    )
-  `,
-	);
-});

package/codemods/utils/constants.tsx

@@ -1,23 +0,0 @@
-export const messageForUsingExpression = `
-Popper.js has been upgraded from 1.14.1 to 2.4.2,
-and as a result the offset prop has changed to be an array. e.g '0px 8px' -> [0, 8]
-Along with this change you cannot use vw, vh or % units or addition or multiplication
-Change the offset value to use pixel values
-Further details can be found in the popper docs https://popper.js.org/docs/v2/modifiers/offset/
-`;
-
-export const messageForUsingVariable = `
-Popper.js has been upgraded from 1.14.1 to 2.4.2, and as a result the offset
-prop has changed to be an array. e.g '0px 8px' -> [0, 8]
-As you are using a variable, you will have change the offset prop manually
-Further details can be found in the popper docs https://popper.js.org/docs/v2/modifiers/offset/
-`;
-
-export const messageForModifierProps = `
-Popper.js has been upgraded from 1.14.1 to 2.4.2,
-and as a result the modifier prop has changed significantly. The format has been
-changed from object of objects, to array of objects, with the key for each modifier
-replaced with a name key:value pair inside the modifier object, and an options:object
-pair for configuration and other changes unique to each modifier.
-Further details can be found in the popper docs: https://popper.js.org/docs/v2/modifiers/
-`;

package/codemods/utils/helpers.tsx

@@ -1,333 +0,0 @@
-import { type NodePath } from 'ast-types/lib/node-path';
-import {
-	type ASTPath,
-	type default as core,
-	type ImportDeclaration,
-	type JSXAttribute,
-	type JSXElement,
-	type Node,
-} from 'jscodeshift';
-import { type Collection } from 'jscodeshift/src/Collection';
-
-export type Nullable<T> = T | null;
-
-export function hasImportDeclaration(
-	j: core.JSCodeshift,
-	source: string,
-	importPath: string,
-): boolean {
-	return (
-		j(source)
-			.find(j.ImportDeclaration)
-			.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === importPath).length >
-		0
-	);
-}
-
-export function getDefaultSpecifierName({
-	j,
-	base,
-	packageName,
-}: {
-	j: core.JSCodeshift;
-	base: Collection<any>;
-	packageName: string;
-}): Nullable<string> {
-	const specifiers = base
-		.find(j.ImportDeclaration)
-		.filter((path) => path.node.source.value === packageName)
-		.find(j.ImportDefaultSpecifier);
-
-	if (!specifiers.length) {
-		return null;
-	}
-	return specifiers.nodes()[0]!.local!.name;
-}
-
-export function getSpecifierName({
-	j,
-	base,
-	packageName,
-	component,
-}: {
-	j: core.JSCodeshift;
-	base: Collection<any>;
-	packageName: string;
-	component: string;
-}): Nullable<string> {
-	const specifiers = base
-		.find(j.ImportDeclaration)
-		.filter((path) => path.node.source.value === packageName)
-		.find(j.ImportSpecifier);
-
-	if (!specifiers.length) {
-		return null;
-	}
-	const specifierNode = specifiers.nodes().find((node) => node.imported.name === component);
-	if (!specifierNode) {
-		return null;
-	}
-	// @ts-ignore
-	return specifierNode.local.name;
-}
-
-export function getJSXAttributesByName({
-	j,
-	element,
-	attributeName,
-}: {
-	j: core.JSCodeshift;
-	element: JSXElement | ASTPath<JSXElement>;
-	attributeName: string;
-}): Collection<JSXAttribute> {
-	return j(element)
-		.find(j.JSXOpeningElement)
-		.find(j.JSXAttribute)
-		.filter((attribute) => {
-			const matches = j(attribute)
-				.find(j.JSXIdentifier)
-				.filter((identifier) => identifier.value.name === attributeName);
-			return Boolean(matches.length);
-		});
-}
-
-export function hasJSXAttributesByName({
-	j,
-	element,
-	attributeName,
-}: {
-	j: core.JSCodeshift;
-	element: JSXElement;
-	attributeName: string;
-}): boolean {
-	return getJSXAttributesByName({ j, element, attributeName }).length > 0;
-}
-
-export function isUsingSupportedSpread({
-	j,
-	base,
-	element,
-}: {
-	j: core.JSCodeshift;
-	base: Collection<any>;
-	element: NodePath<JSXElement, JSXElement>;
-}): boolean {
-	const isUsingSpread: boolean = j(element).find(j.JSXSpreadAttribute).length > 0;
-
-	if (!isUsingSpread) {
-		return true;
-	}
-
-	return (
-		j(element)
-			.find(j.JSXSpreadAttribute)
-			.filter((spread) => {
-				const argument = spread.value.argument;
-				// in place expression is supported
-				if (argument.type === 'ObjectExpression') {
-					return true;
-				}
-
-				// Supporting identifiers that point to an a local object expression
-				if (argument.type === 'Identifier') {
-					return (
-						base.find(j.VariableDeclarator).filter((declarator): boolean => {
-							return (
-								declarator.value.id.type === 'Identifier' &&
-								// @ts-ignore
-								declarator.value.init.type === 'ObjectExpression'
-							);
-						}).length > 0
-					);
-				}
-
-				// We don't support anything else
-				return false;
-			}).length > 0
-	);
-}
-
-export function isUsingThroughSpread({
-	j,
-	base,
-	element,
-	propName,
-}: {
-	j: core.JSCodeshift;
-	base: Collection<any>;
-	element: NodePath<JSXElement, JSXElement>;
-	propName: string;
-}): boolean {
-	if (!isUsingSupportedSpread({ j, base, element })) {
-		return false;
-	}
-
-	const isUsedThroughExpression: boolean =
-		j(element)
-			.find(j.JSXSpreadAttribute)
-			.find(j.ObjectExpression)
-			.filter((item) => {
-				const match: boolean =
-					item.value.properties.filter(
-						(property) =>
-							property.type === 'ObjectProperty' &&
-							property.key.type === 'Identifier' &&
-							property.key.name === propName,
-					).length > 0;
-
-				return match;
-			}).length > 0;
-
-	if (isUsedThroughExpression) {
-		return true;
-	}
-
-	const isUsedThroughIdentifier: boolean =
-		j(element)
-			.find(j.JSXSpreadAttribute)
-			.find(j.Identifier)
-			.filter((identifier): boolean => {
-				return (
-					base
-						.find(j.VariableDeclarator)
-						.filter(
-							(declarator) =>
-								declarator.value.id.type === 'Identifier' &&
-								declarator.value.id.name === identifier.value.name,
-						)
-						.filter((declarator) => {
-							const value = declarator.value;
-							if (value.id.type !== 'Identifier') {
-								return false;
-							}
-
-							if (value.id.name !== identifier.value.name) {
-								return false;
-							}
-							// @ts-ignore
-							if (value.init.type !== 'ObjectExpression') {
-								return false;
-							}
-
-							const match: boolean =
-								// @ts-ignore
-								value.init.properties.filter(
-									// @ts-ignore
-									(property) =>
-										property.type === 'ObjectProperty' &&
-										property.key.type === 'Identifier' &&
-										property.key.name === propName,
-								).length > 0;
-
-							return match;
-						}).length > 0
-				);
-			}).length > 0;
-
-	return isUsedThroughIdentifier;
-}
-
-export function isUsingProp({
-	j,
-	base,
-	element,
-	propName,
-}: {
-	j: core.JSCodeshift;
-	base: Collection<any>;
-	element: NodePath<JSXElement, JSXElement>;
-	propName: string;
-}): boolean {
-	return (
-		hasJSXAttributesByName({
-			j,
-			element: element.value,
-			attributeName: propName,
-		}) ||
-		isUsingThroughSpread({
-			j,
-			base,
-			element,
-			propName,
-		})
-	);
-}
-
-// not replacing newlines (which \s does)
-const spacesAndTabs: RegExp = /[ \t]{2,}/g;
-const lineStartWithSpaces: RegExp = /^[ \t]*/gm;
-
-function clean(value: string): string {
-	return (
-		value
-			.replace(spacesAndTabs, ' ')
-			.replace(lineStartWithSpaces, '')
-			// using .trim() to clear the any newlines before the first text and after last text
-			.trim()
-	);
-}
-
-export function addCommentToStartOfFile({
-	j,
-	base,
-	message,
-}: {
-	j: core.JSCodeshift;
-	base: Collection<Node>;
-	message: string;
-}) {
-	addCommentBefore({
-		j,
-		// @ts-ignore
-		target: base.find(j.Program),
-		message,
-	});
-}
-
-export function addCommentBefore({
-	j,
-	target,
-	message,
-}: {
-	j: core.JSCodeshift;
-	target: Collection<Node>;
-	message: string;
-}) {
-	const content: string = ` TODO: (from codemod) ${clean(message)} `;
-	target.forEach((path) => {
-		path.value.comments = path.value.comments || [];
-
-		const exists = path.value.comments.find((comment) => comment.value === content);
-
-		// avoiding duplicates of the same comment
-		if (exists) {
-			return;
-		}
-
-		path.value.comments.push(j.commentBlock(content));
-	});
-}
-
-export function updateRenderProps(
-	j: core.JSCodeshift,
-	source: Collection<any>,
-	specifier: string,
-	oldProperty: string,
-	newProperty: string,
-) {
-	source.findJSXElements(specifier).forEach((element: ASTPath<JSXElement>) => {
-		j(element)
-			.find(j.ArrowFunctionExpression)
-			.find(j.ObjectPattern)
-			.find(j.ObjectProperty)
-			.filter(
-				// @ts-ignore
-				(path: ASTPath<ObjectProperty>) => path.value.key.name === oldProperty,
-			)
-			.forEach((path) => {
-				j(path).replaceWith(
-					j.property('init', j.identifier(newProperty), j.identifier(oldProperty)),
-				);
-			});
-	});
-}