eslint-plugin-react-server-components - npm Package Compare versions

Comparing version 1.1.2 to 1.2.0

dist/index.js

@@ -172,11 +172,8 @@ // src/rules/use-client.ts
 var useClientRegex = /^('|")use client('|")/;
-var browserOnlyGlobals = Object.keys(globals.browser).reduce(
-  (acc, curr) => {
-    if (curr in globals.browser && !(curr in globals.node)) {
-      acc.add(curr);
-    }
-    return acc;
-  },
-  /* @__PURE__ */ new Set()
-);
+var browserOnlyGlobals = Object.keys(globals.browser).reduce((acc, curr) => {
+  if (curr in globals.browser && !(curr in globals.node)) {
+    acc.add(curr);
+  }
+  return acc;
+}, /* @__PURE__ */ new Set());
 var meta = {
@@ -190,2 +187,11 @@ docs: {
   fixable: "code",
+  schema: [
+    {
+      type: "object",
+      properties: {
+        allowedServerHooks: { type: "array", items: { type: "string" } }
+      },
+      additionalProperties: false
+    }
+  ],
   messages: {
@@ -205,3 +211,10 @@ addUseClientHooks: '{{hook}} only works in Client Components. Add the "use client" directive at the top of the file to use it.',
     const sourceCode = context.getSourceCode();
+    const options = context.options?.[0] || {};
     let parentNode;
+    function isClientOnlyHook(name) {
+      return (
+        // `useId` is the only hook that's allowed in server components
+        name !== "useId" && !(options.allowedServerHooks || []).includes(name) && /^use[A-Z]/.test(name)
+      );
+    }
     function reportMissingDirective(messageId, expression, data) {
@@ -370,5 +383,2 @@ if (isClientComponent || hasReported) {
 }
-function isClientOnlyHook(name) {
-  return /^use[A-Z]/.test(name) && name !== "useId";
-}
 var ClientComponents = { meta, create };
@@ -375,0 +385,0 @@

package.json

 {
   "name": "eslint-plugin-react-server-components",
-  "version": "1.1.2",
+  "version": "1.2.0",
   "description": "Rules for React server components",
@@ -43,3 +43,2 @@ "type": "module",
   },
-  "packageManager": "pnpm@8.6.0",
   "dependencies": {
@@ -46,0 +45,0 @@ "eslint-plugin-react": "^7.32.2",

src/rules/use-client.test.ts

@@ -166,2 +166,10 @@ "use strict";
         },
+        {
+          code: `import {useTranslations} from 'next-intl';
+export function Foo() {
+  const t = useTranslations();
+  return <div />;
+}`,
+          options: [{ allowedServerHooks: ["useTranslations"] }],
+        },
       ],
@@ -168,0 +176,0 @@ invalid: [

src/rules/use-client.ts

@@ -20,13 +20,17 @@ import type { Rule } from "eslint";
 const useClientRegex = /^('|")use client('|")/;
-const browserOnlyGlobals = Object.keys(globals.browser)
-  .reduce<Set<Exclude<keyof typeof globals.browser, keyof typeof globals.node>>>(
-  (acc, curr) => {
-    if (curr in globals.browser && !(curr in globals.node)) {
-      acc.add(curr as any);
-    }
-    return acc;
-  },
-  new Set()
-);
+const browserOnlyGlobals = Object.keys(globals.browser).reduce<
+  Set<Exclude<keyof typeof globals.browser, keyof typeof globals.node>>
+>((acc, curr) => {
+  if (curr in globals.browser && !(curr in globals.node)) {
+    acc.add(curr as any);
+  }
+  return acc;
+}, new Set());
 
+type Options = [
+  {
+    allowedServerHooks?: string[];
+  }
+];
+
 const meta: Rule.RuleModule["meta"] = {
@@ -41,2 +45,11 @@ docs: {
   fixable: "code",
+  schema: [
+    {
+      type: "object",
+      properties: {
+        allowedServerHooks: { type: "array", items: { type: "string" } },
+      },
+      additionalProperties: false,
+    },
+  ],
   messages: {
@@ -66,5 +79,15 @@ addUseClientHooks:
     const sourceCode = context.getSourceCode();
+    const options = (context.options?.[0] || {}) as Options[0];
 
     let parentNode: Program;
 
+    function isClientOnlyHook(name: string) {
+      return (
+        // `useId` is the only hook that's allowed in server components
+        name !== "useId" &&
+        !(options.allowedServerHooks || []).includes(name) &&
+        /^use[A-Z]/.test(name)
+      );
+    }
+
     function reportMissingDirective(
@@ -299,7 +322,2 @@ messageId: string,
 
-function isClientOnlyHook(name: string) {
-  // `useId` is the only hook that's allowed in server components
-  return /^use[A-Z]/.test(name) && name !== 'useId'
-}
-
 export const ClientComponents = { meta, create };

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

49299

increased by2.82%

Lines of code

1624

increased by2.85%

No dependency changes