@planningcenter/tapestry-migration-cli 3.1.0-rc.11 → 3.1.0-rc.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planningcenter/tapestry-migration-cli",
-  "version": "3.1.0-rc.11",
+  "version": "3.1.0-rc.13",
   "description": "CLI tool for Tapestry migrations",
   "type": "module",
   "main": "dist/index.js",
@@ -32,7 +32,7 @@
   },
   "devDependencies": {
     "@emotion/react": "^11.14.0",
-    "@planningcenter/tapestry": "^3.1.0-rc.11",
+    "@planningcenter/tapestry": "^3.1.0-rc.13",
     "@planningcenter/tapestry-react": "^4.11.5",
     "@types/jscodeshift": "^17.3.0",
     "@types/node": "^20.0.0",
@@ -52,5 +52,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "ee2eb63013ea632d013ebfe125311e91a230532d"
+  "gitHead": "422f12c83f2d17c0dc024d9513589934d7b1c6c8"
 }

package/src/components/input/transformableInput.ts

@@ -1,8 +1,49 @@
-import { hasAttribute } from "../shared/conditions/hasAttribute"
-import { notCondition } from "../shared/conditions/notCondition"
-import { orConditions } from "../shared/conditions/orConditions"
+import { JSXElement } from "jscodeshift"
+
+import { ACCEPTED_INPUT_TYPES } from "../shared/helpers/unsupportedPropsHelpers"
 import { TransformCondition } from "../shared/types"
 
-export const transformableInput: TransformCondition = notCondition(
-  orConditions(hasAttribute("renderLeft"), hasAttribute("renderRight"))
-)
+// Include legacy "input" value so removeTypeInput can strip it
+const acceptedTypes: readonly string[] = [...ACCEPTED_INPUT_TYPES, "input"]
+
+function hasUnsupportedType(element: JSXElement): boolean {
+  const attributes = element.openingElement.attributes || []
+  const typeAttr = attributes.find(
+    (attr) =>
+      attr.type === "JSXAttribute" &&
+      attr.name?.type === "JSXIdentifier" &&
+      attr.name.name === "type"
+  )
+
+  if (!typeAttr || typeAttr.type !== "JSXAttribute") {
+    return false
+  }
+
+  if (typeAttr.value?.type === "StringLiteral") {
+    return !acceptedTypes.includes(typeAttr.value.value)
+  }
+
+  if (typeAttr.value?.type === "JSXExpressionContainer") {
+    const { expression } = typeAttr.value
+    if (expression.type === "StringLiteral") {
+      return !acceptedTypes.includes(expression.value)
+    }
+  }
+
+  return true
+}
+
+function hasAttribute(element: JSXElement, attributeName: string): boolean {
+  const attributes = element.openingElement.attributes || []
+  return attributes.some(
+    (attr) =>
+      attr.type === "JSXAttribute" &&
+      attr.name?.type === "JSXIdentifier" &&
+      attr.name.name === attributeName
+  )
+}
+
+export const transformableInput: TransformCondition = (element) =>
+  !hasAttribute(element, "renderLeft") &&
+  !hasAttribute(element, "renderRight") &&
+  !hasUnsupportedType(element)

package/src/components/input/transforms/removeDuplicateKeys.test.ts

@@ -195,7 +195,7 @@ describe("removeDuplicateKeys transform", () => {
         export function TestComponent() {
           return (
             <form>
-              <Input type="submit" kind="primary" type="button">Submit</Input>
+              <Input type="email" kind="primary" type="text">Submit</Input>
               <Input disabled loading disabled>Loading</Input>
               <Input size="small">Small</Input>
             </form>
@@ -208,8 +208,8 @@ describe("removeDuplicateKeys transform", () => {
       expect(result).not.toBeNull()
 
       // First input: should keep first 'type'
-      expect(result).toContain('type="submit"')
-      expect(result).not.toContain('type="button"')
+      expect(result).toContain('type="email"')
+      expect(result).not.toContain('type="text"')
 
       expect(result).toContain("<Input disabled loading>")
 

package/src/components/input/transforms/removeTypeInput.ts

@@ -7,12 +7,12 @@ import { attributeTransformFactory } from "../../shared/transformFactories/attri
 import { transformableInput } from "../transformableInput"
 
 const transform: Transform = attributeTransformFactory({
-  condition: (element, context) =>
-    transformableInput(element, context) &&
+  condition: (element) =>
+    transformableInput(element) &&
     orConditions(
       hasAttributeValue("type", "input"),
       hasAttributeValue("type", "text")
-    )(element, context),
+    )(element),
   targetComponent: "Input",
   targetPackage: "@planningcenter/tapestry-react",
   transform: (element, { j, source }) =>

package/src/components/input/transforms/removeTypeText.ts

@@ -6,9 +6,8 @@ import { attributeTransformFactory } from "../../shared/transformFactories/attri
 import { transformableInput } from "../transformableInput"
 
 const transform: Transform = attributeTransformFactory({
-  condition: (element, context) =>
-    transformableInput(element, context) &&
-    hasAttributeValue("type", "text")(element, context),
+  condition: (element) =>
+    transformableInput(element) && hasAttributeValue("type", "text")(element),
   targetComponent: "Input",
   targetPackage: "@planningcenter/tapestry-react",
   transform: (element, { j, source }) =>

package/src/components/input/transforms/unsupportedProps.test.ts

@@ -276,7 +276,7 @@ function Test() {
       expect(result).not.toContain("TODO: tapestry-migration")
     })
 
-    it("should flag step on type='range' (not an accepted Input type)", () => {
+    it("should not transform Input with type='range' (unsupported type bails)", () => {
       const input = `
 import { Input } from "@planningcenter/tapestry-react"
 
@@ -286,10 +286,10 @@ function Test() {
       `.trim()
 
       const result = applyTransform(input)
-      expect(result).toContain("TODO: tapestry-migration (step)")
+      expect(result).toBe(input)
     })
 
-    it("should flag step on type={'range'} expression container (not an accepted Input type)", () => {
+    it("should not transform Input with type={'range'} expression container (unsupported type bails)", () => {
       const input = `
 import { Input } from "@planningcenter/tapestry-react"
 
@@ -299,11 +299,10 @@ function Test() {
       `.trim()
 
       const result = applyTransform(input)
-      expect(result).toContain("TODO: tapestry-migration (step)")
-      expect(result).toContain("TODO: tapestry-migration (type)")
+      expect(result).toBe(input)
     })
 
-    it("should be permissive with type-specific props when type is dynamic", () => {
+    it("should not transform Input with dynamic type in unsupported-types section (bails)", () => {
       const input = `
 import { Input } from "@planningcenter/tapestry-react"
 
@@ -313,11 +312,10 @@ function Test() {
       `.trim()
 
       const result = applyTransform(input)
-      expect(result).not.toContain("TODO: tapestry-migration (step)")
-      expect(result).not.toContain("TODO: tapestry-migration (type)")
+      expect(result).toBe(input)
     })
 
-    it("should flag accept on type='file' (not an accepted Input type)", () => {
+    it("should not transform Input with type='file' (unsupported type bails)", () => {
       const input = `
 import { Input } from "@planningcenter/tapestry-react"
 
@@ -327,7 +325,7 @@ function Test() {
       `.trim()
 
       const result = applyTransform(input)
-      expect(result).toContain("TODO: tapestry-migration (accept)")
+      expect(result).toBe(input)
     })
 
     it("should not flag pattern on type='text'", () => {
@@ -356,7 +354,7 @@ function Test() {
       expect(result).not.toContain("TODO: tapestry-migration")
     })
 
-    it("should not flag step when type is dynamic", () => {
+    it("should not transform Input when type prop is dynamic (bails)", () => {
       const input = `
 import { Input } from "@planningcenter/tapestry-react"
 
@@ -366,7 +364,7 @@ function Test() {
       `.trim()
 
       const result = applyTransform(input)
-      expect(result).not.toContain("TODO: tapestry-migration")
+      expect(result).toBe(input)
     })
 
     it("should flag step without a type attr", () => {
@@ -465,8 +463,10 @@ function Test() {
       "submit",
       "reset",
       "button",
-    ])("should flag type='%s' as unsupported", (type) => {
-      const input = `
+    ])(
+      "should not transform Input with type='%s' (unsupported type bails)",
+      (type) => {
+        const input = `
 import { Input } from "@planningcenter/tapestry-react"
 
 function Test() {
@@ -474,10 +474,10 @@ function Test() {
 }
       `.trim()
 
-      const result = applyTransform(input)
-      expect(result).toContain("TODO: tapestry-migration (type)")
-      expect(result).toContain("is not a supported Input type")
-    })
+        const result = applyTransform(input)
+        expect(result).toBe(input)
+      }
+    )
 
     it("should not flag accepted type values", () => {
       const types = [
@@ -503,7 +503,7 @@ function Test() {
       }
     })
 
-    it("should not flag dynamic type values", () => {
+    it("should not transform Input when type prop is dynamic (bails)", () => {
       const input = `
 import { Input } from "@planningcenter/tapestry-react"
 
@@ -513,7 +513,7 @@ function Test() {
       `.trim()
 
       const result = applyTransform(input)
-      expect(result).not.toContain("TODO: tapestry-migration")
+      expect(result).toBe(input)
     })
   })