From 88474751d66edd13eb969c2feeb78ddedbfc748c Mon Sep 17 00:00:00 2001 From: Seokmin Hong Date: Fri, 25 Oct 2024 10:43:01 +0900 Subject: [PATCH 1/5] Add createContextMethods option --- src/only-export-components.test.ts | 25 +++++++++++++++++++++++++ src/only-export-components.ts | 12 ++++++++++-- 2 files changed, 35 insertions(+), 2 deletions(-) diff --git a/src/only-export-components.test.ts b/src/only-export-components.test.ts index b5accd9..f57df28 100755 --- a/src/only-export-components.test.ts +++ b/src/only-export-components.test.ts @@ -189,6 +189,21 @@ const valid = [ name: "Only React context", code: "export const MyContext = createContext('test');", }, + { + name: "Component and local React Context from other module", + code: "export const MyComponent = () => {}; const MyContext = createMyContext('test');", + errorId: "reactContext", + options: [ + { + createContextMethods: ["createMyContext"], + }, + ], + }, + { + name: "Component and React Context from other module without options", + code: "export const MyComponent = () => {}; export const MyContext = createMyContext('test');", + errorId: "reactContext", + }, ]; const invalid = [ @@ -295,6 +310,16 @@ const invalid = [ code: "export const MyComponent = () => {}; export const MyContext = React.createContext('test');", errorId: "reactContext", }, + { + name: "Component and React Context from other module", + code: "export const MyComponent = () => {}; export const MyContext = createMyContext('test');", + errorId: "reactContext", + options: [ + { + createContextMethods: ["createMyContext"], + }, + ], + }, ]; const it = (name: string, cases: Parameters[2]) => { diff --git a/src/only-export-components.ts b/src/only-export-components.ts index b74a285..f322715 100644 --- a/src/only-export-components.ts +++ b/src/only-export-components.ts @@ -21,6 +21,7 @@ export const onlyExportComponents: TSESLint.RuleModule< allowConstantExport?: boolean; checkJS?: boolean; allowExportNames?: string[]; + createContextMethods?: string[]; }, ] > = { @@ -47,6 +48,7 @@ export const onlyExportComponents: TSESLint.RuleModule< allowConstantExport: { type: "boolean" }, checkJS: { type: "boolean" }, allowExportNames: { type: "array", items: { type: "string" } }, + createContextMethods: { type: "array", items: { type: "string" } }, }, additionalProperties: false, }, @@ -58,6 +60,7 @@ export const onlyExportComponents: TSESLint.RuleModule< allowConstantExport = false, checkJS = false, allowExportNames, + createContextMethods = [], } = context.options[0] ?? {}; const filename = context.filename; // Skip tests & stories files @@ -79,6 +82,11 @@ export const onlyExportComponents: TSESLint.RuleModule< ? new Set(allowExportNames) : undefined; + const createContextMethodsSet = new Set([ + ...createContextMethods, + "createContext", + ]); + return { Program(program) { let hasExports = false; @@ -133,10 +141,10 @@ export const onlyExportComponents: TSESLint.RuleModule< init.type === "CallExpression" && // createContext || React.createContext ((init.callee.type === "Identifier" && - init.callee.name === "createContext") || + createContextMethodsSet.has(init.callee.name)) || (init.callee.type === "MemberExpression" && init.callee.property.type === "Identifier" && - init.callee.property.name === "createContext")) + createContextMethodsSet.has(init.callee.property.name))) ) { reactContextExports.push(identifierNode); return; From 91ce6e0754d3ad4c55d64ed715554a53212acba8 Mon Sep 17 00:00:00 2001 From: Seokmin Hong Date: Fri, 25 Oct 2024 11:13:22 +0900 Subject: [PATCH 2/5] Add README for createContextMethods --- README.md | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/README.md b/README.md index ea4e0ec..d45dc99 100644 --- a/README.md +++ b/README.md @@ -140,3 +140,22 @@ If your using JSX inside `.js` files (which I don't recommend because it forces "react-refresh/only-export-components": ["warn", { "checkJS": true }] } ``` + +### createContextMethods + +The `createContextMethods` option allows you to specify custom context-creating functions for detection by the rule. By default, it only detects `createContext`, but you can add methods like `createMyContext` in your configuration. + +```json +{ + "react-refresh/only-export-components": [ + "error", + { "createContextMethods": ["createMyContext"] } + ] +} +``` + +```jsx +export const MyComponent = () =>
; +// ESLint error +export const MyContext = createMyContext(); +``` From d598307aed78d01f71fe6f156cdaef1fe9691b5d Mon Sep 17 00:00:00 2001 From: Seokmin Hong Date: Sat, 2 Nov 2024 18:41:16 +0900 Subject: [PATCH 3/5] Use just array MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Arnaud Barré --- src/only-export-components.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/only-export-components.ts b/src/only-export-components.ts index f322715..b37b527 100644 --- a/src/only-export-components.ts +++ b/src/only-export-components.ts @@ -82,10 +82,10 @@ export const onlyExportComponents: TSESLint.RuleModule< ? new Set(allowExportNames) : undefined; - const createContextMethodsSet = new Set([ + const createContextMethods = [ ...createContextMethods, "createContext", - ]); + ]; return { Program(program) { From 6f1cdd995950b32e780d46fc480322f7d1fd2a61 Mon Sep 17 00:00:00 2001 From: Seokmin Hong Date: Sat, 2 Nov 2024 18:41:25 +0900 Subject: [PATCH 4/5] Format MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Arnaud Barré --- src/only-export-components.test.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/only-export-components.test.ts b/src/only-export-components.test.ts index f57df28..677067e 100755 --- a/src/only-export-components.test.ts +++ b/src/only-export-components.test.ts @@ -315,9 +315,7 @@ const invalid = [ code: "export const MyComponent = () => {}; export const MyContext = createMyContext('test');", errorId: "reactContext", options: [ - { - createContextMethods: ["createMyContext"], - }, + { createContextMethods: ["createMyContext"] }, ], }, ]; From d116ea6304cc6e68313ddb0b32bebe1b06ef5f3f Mon Sep 17 00:00:00 2001 From: Seokmin Date: Sat, 2 Nov 2024 18:43:01 +0900 Subject: [PATCH 5/5] Apply comments --- src/only-export-components.test.ts | 11 ----------- 1 file changed, 11 deletions(-) diff --git a/src/only-export-components.test.ts b/src/only-export-components.test.ts index 677067e..fd42deb 100755 --- a/src/only-export-components.test.ts +++ b/src/only-export-components.test.ts @@ -189,20 +189,9 @@ const valid = [ name: "Only React context", code: "export const MyContext = createContext('test');", }, - { - name: "Component and local React Context from other module", - code: "export const MyComponent = () => {}; const MyContext = createMyContext('test');", - errorId: "reactContext", - options: [ - { - createContextMethods: ["createMyContext"], - }, - ], - }, { name: "Component and React Context from other module without options", code: "export const MyComponent = () => {}; export const MyContext = createMyContext('test');", - errorId: "reactContext", }, ];