fix: issue with eslint plugin not allowing useDefaultProps

.changeset/thirty-oranges-refuse.md

@@ -0,0 +1,5 @@
+---
+'@builder.io/eslint-plugin-mitosis': patch
+---
+
+Fix issue with plugin marking 'useDefaultProps' as an error

packages/eslint-plugin/src/constants/hooks.ts

@@ -4,4 +4,5 @@ export const HOOKS = {
   CONTEXT: 'useContext',
   REF: 'useRef',
   META_DATA: 'useMetadata',
+  DEFAULT_PROPS: 'useDefaultProps',
 } as const;

packages/eslint-plugin/src/rules/__tests__/only-default-function-and-imports.test.ts

@@ -1,5 +1,5 @@
 import { RuleTester } from 'eslint';
-import rule from '../only-default-function-and-imports';
+import rule, { onlyDefaultFunctionAndImportsMessage } from '../only-default-function-and-imports';
 
 const opts = {
   filename: 'component.lite.tsx',
@@ -76,6 +76,20 @@ ruleTester.run('only-default-function-and-imports', rule, {
       }
     `,
     },
+    {
+      ...opts,
+      code: `
+      useDefaultProps({
+        test: "XXX"
+      });
+      
+      export default function RenderComponent(props) {
+        return (
+      <div>{props.test}</div>
+        );
+      }
+    `,
+    },
     {
       ...opts,
       code: `
@@ -102,9 +116,7 @@ ruleTester.run('only-default-function-and-imports', rule, {
       }
       export const x = y;
     `,
-      errors: [
-        'Mitosis component files should only contain import declarations, the component itself (in a default export), and type declarations',
-      ],
+      errors: [onlyDefaultFunctionAndImportsMessage],
     },
     {
       ...opts,
@@ -123,9 +135,22 @@ ruleTester.run('only-default-function-and-imports', rule, {
         );
       }
     `,
-      errors: [
-        'Mitosis component files should only contain import declarations, the component itself (in a default export), and type declarations',
-      ],
+      errors: [onlyDefaultFunctionAndImportsMessage],
+    },
+    {
+      ...opts,
+      code: `
+      useDefault({
+        test: "XXX"
+      });
+      
+      export default function RenderComponent(props) {
+        return (
+      <div>{props.test}</div>
+        );
+      }
+    `,
+      errors: [onlyDefaultFunctionAndImportsMessage],
     },
   ],
 });

packages/eslint-plugin/src/rules/only-default-function-and-imports.ts

@@ -7,12 +7,15 @@ import isMitosisPath from '../helpers/isMitosisPath';
 // Rule Definition
 // ------------------------------------------------------------------------------
 
+export const onlyDefaultFunctionAndImportsMessage =
+  'Mitosis component files should only contain import declarations, the component itself (in a default export), and type declarations';
+
 const rule: Rule.RuleModule = {
   meta: {
     type: 'problem',
     docs: {
       description:
-        'disallow anything other than import declarations, the component itself (in a default export), and type declarations inside the component file.',
+        'disallow anything other than import declarations, the component itself (in a default export), module-scope hooks, and type declarations inside the component file.',
       recommended: true,
     },
   },
@@ -56,12 +59,12 @@ const rule: Rule.RuleModule = {
             (!types.isExpressionStatement(child) ||
               !types.isCallExpression(child.expression) ||
               !types.isIdentifier(child.expression.callee) ||
-              child.expression.callee.name !== HOOKS.META_DATA)
+              (child.expression.callee.name !== HOOKS.META_DATA &&
+                child.expression.callee.name !== HOOKS.DEFAULT_PROPS))
           ) {
             context.report({
               node: child as any,
-              message:
-                'Mitosis component files should only contain import declarations, the component itself (in a default export), and type declarations',
+              message: onlyDefaultFunctionAndImportsMessage,
             });
           }
         }