@nkzw/eslint-plugin-fbtee 0.1.3 → 0.1.4

package/lib/index.js

@@ -1,7 +1,7 @@
 // package.json
 var package_default = {
   name: "@nkzw/eslint-plugin-fbtee",
-  version: "0.1.3",
+  version: "0.1.4",
   description: "",
   keywords: [],
   repository: {
@@ -29,7 +29,7 @@ var package_default = {
 // src/utils.tsx
 import { ESLintUtils } from "@typescript-eslint/utils";
 var createRule = ESLintUtils.RuleCreator(
-  (name) => `https://github.com/nkzw-tech/fbtee/tree/main/packages/eslint-plugin-fbt/docs/rules/${name}`
+  (name) => `https://github.com/nkzw-tech/fbtee/blob/main/packages/eslint-plugin-fbtee/docs/rules/${name}.md`
 );
 function resolveMemberExpressions(object, property) {
   if (object.type === "JSXMemberExpression") {
@@ -95,13 +95,47 @@ function resolveNodeValue(node) {
   }
   return null;
 }
+function getPropName(prop) {
+  if (prop.name.type === "JSXNamespacedName") {
+    return `${prop.name.namespace.name}:${prop.name.name.name}`;
+  }
+  return prop.name.name;
+}
+function hasFbtParent(node) {
+  let current = node.parent;
+  while (current) {
+    if (isFbtNode(current)) {
+      return true;
+    }
+    current = current.parent;
+  }
+  return false;
+}
+function isFbtNode(node) {
+  if (!node) {
+    return null;
+  }
+  if (node.type === "JSXElement") {
+    const name = elementType(node);
+    return name === "fbt" || name === "fbs" || name?.startsWith("fbt:");
+  }
+  if (node.type === "CallExpression" && node.callee.type === "Identifier") {
+    const name = node.callee.name;
+    return name === "fbt" || name === "fbs";
+  }
+  if (node.type === "MemberExpression" && node.object.type === "CallExpression" && node.object.callee.type === "Identifier") {
+    const name = node.object.callee.name;
+    return name === "fbt" || name === "fbs";
+  }
+  return false;
+}
 
 // src/rules/no-empty-strings.tsx
 var no_empty_strings_default = createRule({
   create(context) {
     return {
       CallExpression(node) {
-        if (node.callee.type !== "Identifier" || !(node.callee.name === "fbt" || node.callee.name === "fbs")) {
+        if (!isFbtNode(node)) {
           return;
         }
         const [text] = node.arguments;
@@ -113,18 +147,18 @@ var no_empty_strings_default = createRule({
         }
       },
       JSXElement(node) {
-        if (elementType(node) !== "fbt") {
+        if (!isFbtNode(node)) {
           return;
         }
-        const nodesToReport = /* @__PURE__ */ new Set();
-        const hasTextContent = validateChildren(node, nodesToReport);
+        if (node.openingElement.name.type === "JSXNamespacedName") {
+          return;
+        }
+        const hasTextContent = validateChildren(node);
         if (!hasTextContent) {
-          for (const node2 of nodesToReport) {
-            context.report({
-              messageId: "jsxEmptyString",
-              node: node2
-            });
-          }
+          context.report({
+            messageId: "jsxEmptyString",
+            node
+          });
         }
       }
     };
@@ -135,30 +169,30 @@ var no_empty_strings_default = createRule({
       description: "Disallow empty strings in fbt elements or function calls."
     },
     messages: {
-      emptyString: "Empty strings are not allowed in fbt() or fbs() function arguments.",
-      jsxEmptyString: "Empty strings are not allowed as children of <fbt> tags."
+      emptyString: "Empty strings are not allowed in fbt() and fbs() function arguments.",
+      jsxEmptyString: "Empty strings are not allowed as children of `<fbt>` and `<fbs>` tags."
     },
     schema: [],
     type: "problem"
   },
   name: "no-empty-strings"
 });
-function validateChildren(node, nodesToReport) {
+function validateChildren(node) {
   let hasTextContent = false;
   for (const child of node.children) {
-    if (child.type === "JSXText" && node.children.length === 1) {
-      if (child.value.trim() === "") {
-        nodesToReport.add(child);
-      } else {
+    if (child.type === "JSXText" && child.value.trim() !== "") {
+      hasTextContent = true;
+    }
+    if (child.type === "JSXExpressionContainer") {
+      if (child.expression.type === "JSXEmptyExpression") {
+        continue;
+      }
+      if (child.expression.type === "Identifier" && child.expression.name !== "undefined") {
         hasTextContent = true;
+        continue;
       }
-    }
-    if (child.type === "JSXExpressionContainer" && child.expression.type !== "JSXEmptyExpression") {
-      if (isEmptyString(child.expression) && (node.children.length === 1 || node.children.every(
-        (otherChild) => child === otherChild || otherChild.type === "JSXText" && otherChild.value.trim() === ""
-      ))) {
-        nodesToReport.add(child.expression);
-      } else {
+      const value = resolveNodeValue(child.expression)?.trim();
+      if (value) {
         hasTextContent = true;
       }
     }
@@ -168,15 +202,12 @@ function validateChildren(node, nodesToReport) {
         hasTextContent = true;
         continue;
       }
-      hasTextContent ||= validateChildren(child, nodesToReport);
+      hasTextContent ||= validateChildren(child);
     }
     if (hasTextContent) {
       break;
     }
   }
-  if (!hasTextContent && nodesToReport.size === 0) {
-    nodesToReport.add(node);
-  }
   return hasTextContent;
 }
 function isEmptyString(node) {
@@ -188,7 +219,7 @@ var no_unhelpful_desc_default = createRule({
   create(context) {
     return {
       CallExpression(node) {
-        if (node.callee.type !== "Identifier" || !(node.callee.name === "fbt" || node.callee.name === "fbs")) {
+        if (!isFbtNode(node)) {
           return;
         }
         const [textArg, descArg] = node.arguments;
@@ -216,7 +247,7 @@ var no_unhelpful_desc_default = createRule({
         }
       },
       JSXAttribute(node) {
-        if (elementType(node.parent.parent) !== "fbt") {
+        if (!isFbtNode(node.parent.parent)) {
           return;
         }
         if (node.name.name !== "desc" || !node.value) {
@@ -267,6 +298,112 @@ var no_unhelpful_desc_default = createRule({
   name: "no-unhelpful-desc"
 });
 
+// src/rules/no-untranslated-strings.tsx
+var attributes = /* @__PURE__ */ new Set([
+  "title",
+  "placeholder",
+  "alt",
+  "label",
+  "aria-label",
+  "aria-errormessage"
+]);
+var no_untranslated_strings_default = createRule({
+  create(context, options) {
+    const ignoredWords = new Set(
+      options[0].ignoredWords.map((s) => s.trim().toLowerCase())
+    );
+    function isIgnoredWord(value) {
+      return ignoredWords.has(value.trim().toLowerCase());
+    }
+    return {
+      JSXAttribute(node) {
+        const propName = getPropName(node);
+        if (!attributes.has(propName)) {
+          return;
+        }
+        const value = node.value ? resolveNodeValue(node.value) : null;
+        if (!value) {
+          return;
+        }
+        if (isIgnoredWord(value)) {
+          return;
+        }
+        if (node.value?.type === "JSXExpressionContainer" && isFbtNode(node.value.expression)) {
+          return;
+        }
+        context.report({
+          messageId: "unwrappedString",
+          node
+        });
+      },
+      JSXExpressionContainer(node) {
+        if (node.parent.type === "JSXAttribute") {
+          return;
+        }
+        const value = resolveNodeValue(node.expression);
+        if (!value) {
+          return;
+        }
+        if (isIgnoredWord(value)) {
+          return;
+        }
+        if (!hasFbtParent(node)) {
+          context.report({
+            messageId: "unwrappedString",
+            node
+          });
+        }
+      },
+      JSXText(node) {
+        const value = node.value.trim();
+        if (!value) {
+          return;
+        }
+        if (isIgnoredWord(value)) {
+          return;
+        }
+        if (!hasFbtParent(node)) {
+          const startOffset = node.range[0] + node.value.indexOf(value);
+          const endOffset = startOffset + value.length;
+          context.report({
+            loc: {
+              end: context.sourceCode.getLocFromIndex(endOffset),
+              start: context.sourceCode.getLocFromIndex(startOffset)
+            },
+            messageId: "unwrappedString"
+          });
+        }
+      }
+    };
+  },
+  defaultOptions: [{ ignoredWords: [] }],
+  meta: {
+    docs: {
+      description: "Enforce text content to be wrapped with `<fbt>`, `fbt()` or `fbs()`"
+    },
+    messages: {
+      unwrappedString: "Text content must be wrapped in `<fbt>`, `fbt()` or `fbs()`"
+    },
+    schema: [
+      {
+        additionalProperties: false,
+        properties: {
+          ignoredWords: {
+            items: {
+              type: "string"
+            },
+            type: "array",
+            uniqueItems: true
+          }
+        },
+        type: "object"
+      }
+    ],
+    type: "problem"
+  },
+  name: "no-untranslated-strings"
+});
+
 // src/index.tsx
 var meta = {
   name: package_default.name,
@@ -274,14 +411,22 @@ var meta = {
 };
 var rules = {
   "no-empty-strings": no_empty_strings_default,
-  "no-unhelpful-desc": no_unhelpful_desc_default
+  "no-unhelpful-desc": no_unhelpful_desc_default,
+  "no-untranslated-strings": no_untranslated_strings_default
 };
 var configs = {
-  strict: {
+  recommended: {
     rules: {
       "@nkzw/fbtee/no-empty-strings": 2,
       "@nkzw/fbtee/no-unhelpful-desc": 2
     }
+  },
+  strict: {
+    rules: {
+      "@nkzw/fbtee/no-empty-strings": 2,
+      "@nkzw/fbtee/no-unhelpful-desc": 2,
+      "@nkzw/fbtee/no-untranslated-strings": 2
+    }
   }
 };
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nkzw/eslint-plugin-fbtee",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "",
   "keywords": [],
   "repository": {

package/src/__tests__/no-empty-strings-test.tsx

@@ -66,7 +66,70 @@ ruleTester.run('no-empty-strings', rule, {
       `,
       errors: [
         {
-          line: 3,
+          line: 2,
+          messageId: 'jsxEmptyString',
+        },
+      ],
+    },
+    {
+      code: `
+        <fbt desc="Greeting">{}</fbt>;
+      `,
+      errors: [
+        {
+          line: 2,
+          messageId: 'jsxEmptyString',
+        },
+      ],
+    },
+    {
+      code: `
+        <fbt desc="Greeting">
+          {}
+        </fbt>;
+      `,
+      errors: [
+        {
+          line: 2,
+          messageId: 'jsxEmptyString',
+        },
+      ],
+    },
+    {
+      code: `
+        <fbt desc="Greeting">
+          {null}
+        </fbt>;
+      `,
+      errors: [
+        {
+          line: 2,
+          messageId: 'jsxEmptyString',
+        },
+      ],
+    },
+    {
+      code: `
+        <fbt desc="Greeting">
+          {undefined}
+        </fbt>;
+      `,
+      errors: [
+        {
+          line: 2,
+          messageId: 'jsxEmptyString',
+        },
+      ],
+    },
+    {
+      code: `
+        <fbt desc="Greeting">
+          {/* This is a comment */}
+        </fbt>;
+      `,
+      errors: [
+        {
+          line: 2,
           messageId: 'jsxEmptyString',
         },
       ],
@@ -79,7 +142,7 @@ ruleTester.run('no-empty-strings', rule, {
       `,
       errors: [
         {
-          line: 3,
+          line: 2,
           messageId: 'jsxEmptyString',
         },
       ],
@@ -92,7 +155,20 @@ ruleTester.run('no-empty-strings', rule, {
       `,
       errors: [
         {
-          line: 3,
+          line: 2,
+          messageId: 'jsxEmptyString',
+        },
+      ],
+    },
+
+    // <fbs>
+    {
+      code: `
+        <fbs desc="Greeting"></fbs>;
+      `,
+      errors: [
+        {
+          line: 2,
           messageId: 'jsxEmptyString',
         },
       ],
@@ -164,6 +240,13 @@ ruleTester.run('no-empty-strings', rule, {
         <fbt desc="Greeting">Hello world</fbt>;
       `,
     },
+    {
+      code: `
+        <fbt desc="Greeting">
+          Hello <span>world</span>
+        </fbt>;
+      `,
+    },
     {
       code: `
         <fbt desc="Greeting">{dynamicValue}</fbt>;
@@ -240,6 +323,13 @@ ruleTester.run('no-empty-strings', rule, {
       `,
     },
 
+    // <fbs>
+    {
+      code: `
+        <fbs desc="Greeting">Hello world</fbs>;
+      `,
+    },
+
     // fbt()
     {
       code: `

package/src/__tests__/no-unhelpful-desc-test.tsx

@@ -114,6 +114,19 @@ ruleTester.run('unhelpful-desc', rule, {
       ],
     },
 
+    // <fbs>
+    {
+      code: `
+        <fbt desc="">Hello world</fbt>;
+      `,
+      errors: [
+        {
+          line: 2,
+          messageId: 'jsxEmptyDesc',
+        },
+      ],
+    },
+
     // fbt()
     {
       code: `
@@ -274,6 +287,13 @@ ruleTester.run('unhelpful-desc', rule, {
       `,
     },
 
+    // <fbs>
+    {
+      code: `
+        <fbs desc="Greeting">Hello world</fbs>;
+      `,
+    },
+
     // fbt()
     {
       code: `

package/src/__tests__/no-untranslated-strings-test.tsx

@@ -0,0 +1,223 @@
+import { RuleTester } from '@typescript-eslint/rule-tester';
+import rule from '../rules/no-untranslated-strings.tsx';
+
+const ruleTester = new RuleTester({
+  languageOptions: {
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
+    },
+  },
+});
+
+ruleTester.run('no-untranslated-strings', rule, {
+  invalid: [
+    {
+      code: `
+        <span>Hello world</span>;
+       `,
+      errors: [
+        {
+          messageId: 'unwrappedString',
+        },
+      ],
+    },
+    {
+      code: `
+        <span>{'Hello world'}</span>;
+       `,
+      errors: [
+        {
+          messageId: 'unwrappedString',
+        },
+      ],
+    },
+    {
+      code: `
+        <span>{'Hello world' + ''}</span>;
+       `,
+      errors: [
+        {
+          messageId: 'unwrappedString',
+        },
+      ],
+    },
+    {
+      code: `
+        <div>
+          <span>Hello world</span>
+        </div>;
+       `,
+      errors: [
+        {
+          line: 3,
+          messageId: 'unwrappedString',
+        },
+      ],
+    },
+    {
+      code: `
+        <div>
+          <div></div>
+          Hello world
+        </div>;
+       `,
+      errors: [
+        {
+          line: 4,
+          messageId: 'unwrappedString',
+        },
+      ],
+    },
+    {
+      code: `
+        <>Hello world</>
+       `,
+      errors: [
+        {
+          messageId: 'unwrappedString',
+        },
+      ],
+    },
+    {
+      code: `
+        <input placeholder="Enter name..." />;
+       `,
+      errors: [
+        {
+          messageId: 'unwrappedString',
+        },
+      ],
+    },
+    {
+      code: `
+          <div aria-label={'Label'}></div>
+         `,
+      errors: [
+        {
+          messageId: 'unwrappedString',
+        },
+      ],
+    },
+    {
+      code: `
+          <div aria-label={\`Label\`}></div>
+         `,
+      errors: [
+        {
+          messageId: 'unwrappedString',
+        },
+      ],
+    },
+  ],
+
+  valid: [
+    {
+      code: `
+        <fbt desc="Greeting">Hello world</fbt>
+       `,
+    },
+    {
+      code: `
+        <fbt desc="Greeting">
+          Hello world
+        </fbt>
+       `,
+    },
+    {
+      code: `
+        <fbt desc="Greeting">
+          <span>Hello world</span>
+        </fbt>
+       `,
+    },
+    {
+      code: `
+        <span>
+          {fbt('Hello', 'Greeting')}
+        </span>
+       `,
+    },
+    {
+      code: `
+        <fbt desc="Counter">
+          Count:
+          <fbt:plural count={1} showCount="yes" many="items">
+            item
+          </fbt:plural>
+        </fbt>
+       `,
+    },
+    {
+      code: `
+        <fbt desc="Greeting">
+          <>Hello</>
+        </fbt>
+       `,
+    },
+    {
+      code: `
+        <fbt desc="Greeting">
+          Hello <span>world</span>
+        </fbt>;
+       `,
+    },
+    {
+      code: `
+        <fbt desc="Welcome message">
+          Welcome <fbt:param name="name">Steve</fbt:param>
+        </fbt>
+       `,
+    },
+    {
+      code: `
+        <div>
+          <p>GitHub</p>
+          <p>{'GitHub'}</p>
+          <p>{\`GitHub\`}</p>
+        </div>
+       `,
+      options: [
+        {
+          ignoredWords: ['GitHub'],
+        },
+      ],
+    },
+    {
+      code: `
+        <textarea rows={2}></textarea>
+       `,
+    },
+    {
+      code: `
+        <a aria-current></a>
+       `,
+    },
+    {
+      code: `
+        <img src="" alt={fbs('A photo of a dog', 'Image description')} />
+       `,
+    },
+    {
+      code: `
+        <div aria-label={fbs('Hello', 'Greeting')}></div>
+       `,
+    },
+    {
+      code: `
+        <div aria-label={fbt('Hello', 'Greeting').toString()}></div>
+       `,
+    },
+    {
+      code: `
+       foo('Bar')
+       `,
+    },
+    {
+      code: `
+       foo.bar('Baz')
+       `,
+    },
+  ],
+});