Merge pull request #237 from kreuzerk/feature/propsType

fix(tsx): use the correct type for tsx props
kreuzerk · Nov 14, 2023 · afde78d · afde78d
2 parents bab45f7 + 6a85dff
commit afde78d
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/src/lib/generators/code-snippet-generators.spec.ts b/src/lib/generators/code-snippet-generators.spec.ts
@@ -11,6 +11,7 @@ import {
   generateNamedImportStatement,
   generateObjectInterface,
   generateSvgConstant,
+  generateTSXConstant,
   generateTypeDefinition,
   generateTypeHelper,
   generateTypeHelperWithImport,
@@ -260,4 +261,13 @@ describe('Generators', () => {
       expect(unformatedString(generatedStatement)).toEqual(unformatedString(expectedStatement));
     });
   });
+
+  describe('TSX', () => {
+    it('should convert a svg to a React component', () => {
+      const expected = `export const Smile = (props: {[key: string]: any}) => (<svg class="my-awesome-svg" {...props}></svg>);`;
+
+      const actual = generateTSXConstant('smile', '<svg class="my-awesome-svg"></svg>');
+      expect(actual).toEqual(expected);
+    });
+  });
 });
diff --git a/src/lib/generators/code-snippet-generators.ts b/src/lib/generators/code-snippet-generators.ts
@@ -113,7 +113,7 @@ export const generateSvgConstant = (variableName: string, filenameWithoutEnding:
 export function generateTSXConstant(variableName: string, svg: string) {
   const variableNameCapitalized = variableName.charAt(0).toUpperCase() + variableName.slice(1);
   const svgStringWithProps = svg.replace('>', ' {...props}>');
-  return `export const ${variableNameCapitalized} = (props) => (${svgStringWithProps});`;
+  return `export const ${variableNameCapitalized} = (props: {[key: string]: any}) => (${svgStringWithProps});`;
 }
 
 export const generateExportStatement = (fileName: string, generatedIconsFolderName?: string): string => {