Warn on export expressions that are not React component (array, objec…

…t, logical expression, ...) (fixes #26)
ArnaudBarre · Oct 24, 2023 · 05379a0 · 05379a0
1 parent 8763332
commit 05379a0
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 12 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -3,6 +3,7 @@
 ## Unreleased
 
 - Support memo default export function components (fixes #27)
+- Warn on export expressions that are not React component (array, object, logical expression, ...) (fixes #26)
 
 ## 0.4.3
 

diff --git a/src/only-export-components.test.ts b/src/only-export-components.test.ts
@@ -135,6 +135,11 @@ const invalid = [
     code: "export const foo = 4; export const Bar = () => {};",
     errorId: "namedExport",
   },
+  {
+    name: "Component and PascalCase variable",
+    code: "export function Component() {}; export const Aa = 'a'",
+    errorId: "namedExport",
+  },
   {
     name: "Component and variable",
     code: "const foo = 4; const Bar = () => {}; export { foo, Bar };",

diff --git a/src/only-export-components.ts b/src/only-export-components.ts
@@ -86,12 +86,6 @@ export const onlyExportComponents: TSESLint.RuleModule<
             nonComponentExports.push(identifierNode);
             return;
           }
-          if (
-            !mayHaveReactExport &&
-            possibleReactExportRE.test(identifierNode.name)
-          ) {
-            mayHaveReactExport = true;
-          }
           if (
             allowConstantExport &&
             init &&
@@ -101,12 +95,30 @@ export const onlyExportComponents: TSESLint.RuleModule<
           ) {
             return;
           }
-          if (
-            !(isFunction ? possibleReactExportRE : strictReactExportRE).test(
-              identifierNode.name,
-            )
-          ) {
-            nonComponentExports.push(identifierNode);
+          if (isFunction) {
+            if (possibleReactExportRE.test(identifierNode.name)) {
+              mayHaveReactExport = true;
+            } else {
+              nonComponentExports.push(identifierNode);
+            }
+          } else {
+            if (
+              init &&
+              // Switch to allowList?
+              notReactComponentExpression.includes(init.type)
+            ) {
+              nonComponentExports.push(identifierNode);
+              return;
+            }
+            if (
+              !mayHaveReactExport &&
+              possibleReactExportRE.test(identifierNode.name)
+            ) {
+              mayHaveReactExport = true;
+            }
+            if (!strictReactExportRE.test(identifierNode.name)) {
+              nonComponentExports.push(identifierNode);
+            }
           }
         };
 
@@ -216,3 +228,20 @@ const canBeReactFunctionComponent = (init: TSESTree.Expression | null) => {
   }
   return false;
 };
+
+type ToString<T> = T extends `${infer V}` ? V : never;
+const notReactComponentExpression: ToString<TSESTree.Expression["type"]>[] = [
+  "ArrayExpression",
+  "AwaitExpression",
+  "BinaryExpression",
+  "ChainExpression",
+  "ConditionalExpression",
+  "Literal",
+  "LogicalExpression",
+  "ObjectExpression",
+  "TaggedTemplateExpression",
+  "TemplateLiteral",
+  "ThisExpression",
+  "UnaryExpression",
+  "UpdateExpression",
+];