Bugfix/prop types

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ng2react/core",
-  "version": "1.6.1",
+  "version": "1.7.0",
   "description": "Convert AngularJS 1.x components to React components",
   "main": "./dist/cjs/api/main.js",
   "module": "./dist/esm/api/main.js",

src/assets/prompt_base.md

@@ -7,7 +7,7 @@ I want you to convert an AngularJS component into a functional React component.
 - The code:
   - So that I can programmatically find your code, please top and tail it with `// ___NG2R_START___`
   and `// ___NG2R_END___`,
-  - Your code should be written in ${LANGUAGE}
+  - Your code should be written in ${LANGUAGE}${ADDITIONA_CODE_INSTRUCTIONS}
 - Below the code:
   - list any potential issues you have identified
 
@@ -49,5 +49,7 @@ const MyComponent = ({myProp, children}) => {
     )
 }
 
+export default MyComponent
+
 // ___NG2R_END___
 ```

src/assets/prompt_patterns.md

@@ -10,8 +10,12 @@ I want you to deal with certain code patterns in a specific way. Here are the pa
 
 ### Example Response:
 
-```jsx
-const StateBindingExample = ({twoWayBinding, onTwoWayBindingChange}) => {
+```tsx
+type Props = {
+    twoWayBinding: boolean
+    onTwoWayBindingChange: (newValue: boolean) => void
+}
+const StateBindingExample = ({twoWayBinding, onTwoWayBindingChange}: Props) => {
     const handleTwoWayBindingChange = (e) => {
         onTwoWayBindingChange(e.target.checked)
     }
@@ -24,6 +28,7 @@ const StateBindingExample = ({twoWayBinding, onTwoWayBindingChange}) => {
         </div>
     )
 }
+export default StateBindingExample
 ```
 
 ## Pattern 2: One-way bindings / String Bindings
@@ -62,6 +67,7 @@ const StateBindingExample = ({oneWayBinding: initialOneWayBinding, readOnlyOneWa
         </div>
     )
 }
+export default StateBindingExample
 ```
 
 ## Pattern 3: Service Injection
@@ -84,6 +90,7 @@ const ServiceInjectionExample = ({}) => {
 
     return <>...</>
 }
+export default ServiceInjectionExample
 ```
 
 ## Pattern 4: Require Controller
@@ -103,6 +110,7 @@ angular.module('myApp').component('myComponent', {
 const RequireControllerExample = ({myController}) => {
     return <>...</>
 }
+export default RequireControllerExample
 ```
 
 ## Any other patterns

src/lib/modules/openai-conversion/prompt-construction/gpt-prompt-builder.ts

@@ -32,10 +32,19 @@ export function buildGptMessage(
     const [code, sourceLanguage] = buildCode('component', component, sourceRoot, template, controller)
 
     const language = (targetLanguage ?? sourceLanguage) === 'typescript' ? 'Typescript' : 'JavaScript'
+    const additionalCodeInstructions =
+        language === 'Typescript' ? '\n  - If props are used, please define the prop types' : ''
+
     return [
         {
             role: 'user',
-            content: preparePrompt(PROMPT_BASE.replace('${LANGUAGE}', language), { language }),
+            content: preparePrompt(
+                PROMPT_BASE.replace('${LANGUAGE}', language).replace(
+                    '${ADDITIONA_CODE_INSTRUCTIONS}',
+                    additionalCodeInstructions
+                ),
+                { language }
+            ),
         },
         {
             role: 'user',

src/test/openai-conversion/gpt-prompt-builder.spec.ts

@@ -65,9 +65,9 @@ describe('Given a source file that has a JavaScript extension', () => {
         expect(prompt).toContain('- Your code should be written in JavaScript')
     })
 
-    it('Then the prompt should contain tsx examples', () => {
+    it('Then the prompt should contain tsx and jsx examples', () => {
         expect(prompt).toContain('```jsx')
-        expect(prompt).not.toContain('```tsx')
+        expect(prompt).toContain('```tsx')
     })
 })
 
@@ -112,8 +112,8 @@ describe('Given a source file that has a Typescript extension But JavaScript was
         expect(prompt).toContain('- Your code should be written in JavaScript')
     })
 
-    it('Then the prompt should contain tsx examples', () => {
+    it('Then the prompt should contain tsx and jsx examples', () => {
         expect(prompt).toContain('```jsx')
-        expect(prompt).not.toContain('```tsx')
+        expect(prompt).toContain('```tsx')
     })
 })