modularized version

Author: pawk3k

community/react/remove-default-props/input.tsx

@@ -0,0 +1,7 @@
+import React from 'react';
+
+export function Component() {
+  return <span>Hi {name}</span>;
+}
+
+Component.defaultProps = { name: 'Oleg' };

community/react/remove-default-props/input2.tsx

@@ -0,0 +1,7 @@
+import React from 'react';
+
+export const Component = () => {
+  return <span>Hi {name}</span>;
+};
+
+Component.defaultProps = { name: 'Oleg' };

community/react/remove-default-props/motions/moveDefaultPropsToFunctionDeclaration.ts

@@ -0,0 +1,58 @@
+import { JSCodeshift } from 'jscodeshift';
+import { Collection } from 'jscodeshift/src/Collection';
+
+export function moveDefaultPropsToFunctionDeclaration(
+  source: Collection<any>,
+  j: JSCodeshift,
+) {
+  source
+    .find(j.FunctionDeclaration, {
+      id: { name: 'Component' },
+    })
+    .forEach(component => {
+      // Find the defaultProps assignment expression
+      const defaultProps = source.find(j.AssignmentExpression, {
+        left: {
+          object: { name: 'Component' },
+          property: { name: 'defaultProps' },
+        },
+      });
+
+      if (defaultProps.length === 0) return;
+
+      // Extract the default props object
+      const defaultValues = defaultProps.get('right').value.properties;
+
+      // Generate a new function parameter for each default prop
+      const params = defaultValues.map((prop: any) => {
+        const key = prop.key.name;
+        const value = prop.value.value;
+        // return j.objectPattern(`${key}=${JSON.stringify(value)}`);
+        return j.objectPattern([
+          j.objectProperty(
+            j.identifier(key),
+            j.assignmentPattern(j.identifier(key), j.literal(value)),
+          ),
+        ]);
+      });
+
+      // Replace the original function declaration with a new one
+      j(component).replaceWith(nodePath =>
+        j.functionDeclaration(
+          nodePath.node.id,
+          params,
+          nodePath.node.body,
+          nodePath.node.generator,
+          nodePath.node.async,
+        ),
+      );
+      // Remove the
+    })
+    .find(j.AssignmentExpression, {
+      left: {
+        object: { name: 'Component' },
+        property: { name: 'defaultProps' },
+      },
+    })
+    .toSource();
+}

community/react/remove-default-props/motions/removeDefaultPropsAssignment.ts

@@ -0,0 +1,16 @@
+import { JSCodeshift } from 'jscodeshift';
+import { Collection } from 'jscodeshift/src/Collection';
+
+export function removeDefaultPropsAssignment(
+  source: Collection<any>,
+  j: JSCodeshift,
+) {
+  source
+    .find(j.AssignmentExpression, {
+      left: {
+        object: { name: 'Component' },
+        property: { name: 'defaultProps' },
+      },
+    })
+    .remove();
+}

community/react/remove-default-props/transform.spec.ts

@@ -1,22 +1,46 @@
 import { applyTransform } from '@codeshift/test-utils';
 import * as transformer from './transform';
+import fs from 'fs';
+import path from 'path';
+
+const input = fs.readFileSync(path.resolve(__dirname, 'input.tsx'), 'utf8');
+const input2 = fs.readFileSync(path.resolve(__dirname, 'input2.tsx'), 'utf8');
 
 describe('react#remove-default-props transform', () => {
-  it('should remove default props', async () => {
-    const result = await applyTransform(
-      transformer,
-      `
-import React from 'react';
-
-export const Greet = ({ name }) => <span>Hi {name}</span>;
-Greet.defaultProps = { name: 'Stranger' };
-      `,
-      { parser: 'tsx' },
-    );
+  //   it('should remove default props', async () => {
+  //     const result = await applyTransform(
+  //       transformer,
+  //       `
+  // import React from 'react';
+
+  // export const Greet = ({ name }) => <span>Hi {name}</span>;
+  // Greet.defaultProps = { name: 'Stranger' };
+  //       `,
+  //       { parser: 'tsx' },
+  //     );
+
+  //     expect(result).toMatchInlineSnapshot(`
+  //       import React from 'react'; export const Greet = ({ name }) =>
+  //       <span>Hi {name}</span>;
+  //     `);
+  //   });
+
+  it('should replace default props for function component', async () => {
+    const result = await applyTransform(transformer, input, { parser: 'tsx' });
+
+    expect(result).toMatchInlineSnapshot(`
+      import React from 'react'; export function Component( { name: name = "Oleg"
+      } ) { return
+      <span>Hi {name}</span>; }
+    `);
+  });
+
+  it('should replace default props for arrow function component', async () => {
+    const result = await applyTransform(transformer, input2, { parser: 'tsx' });
 
     expect(result).toMatchInlineSnapshot(`
-      import React from 'react'; export const Greet = ({ name }) =>
-      <span>Hi {name}</span>;
+      import React from 'react'; export const Component = () => { return
+      <span>Hi {name}</span>; };
     `);
   });
 });

community/react/remove-default-props/transform.ts

@@ -1,19 +1,16 @@
-import { API, FileInfo, Options } from 'jscodeshift';
+import { FileInfo, API } from 'jscodeshift';
+import { moveDefaultPropsToFunctionDeclaration } from './motions/moveDefaultPropsToFunctionDeclaration';
+import { removeDefaultPropsAssignment } from './motions/removeDefaultPropsAssignment';
 
-export default function transformer(
-  file: FileInfo,
-  { jscodeshift: j }: API,
-  options: Options,
-) {
-  const removePath = (path: any) => j(path).remove();
-  const isAssigningDefaultProps = (e: any) =>
-    e.node.left &&
-    e.node.left.property &&
-    e.node.left.property.name === 'defaultProps';
+export default function transformer(file: FileInfo, api: API) {
+  const j = api.jscodeshift;
 
-  return j(file.source)
-    .find(j.AssignmentExpression)
-    .filter(isAssigningDefaultProps)
-    .forEach(removePath)
-    .toSource(options.printOptions);
+  const source = j(file.source);
+
+  // Find all function declarations with name "Component"
+  moveDefaultPropsToFunctionDeclaration(source, j);
+
+  removeDefaultPropsAssignment(source, j);
+
+  return source.toSource();
 }