fix: 'no-missing-context-display-name' correctly handles semicolons in autofix (#1130)

Author: Rel1cx

packages/plugins/eslint-plugin-react-x/src/rules/no-missing-context-display-name.spec.ts

@@ -13,7 +13,7 @@ ruleTester.run(RULE_NAME, rule, {
       code: tsx`const ctx = createContext();`,
       errors: [{ messageId: "noMissingContextDisplayName" }],
       output: tsx`
-        const ctx = createContext()
+        const ctx = createContext();
         ctx.displayName = "ctx";
       `,
     },
@@ -26,7 +26,7 @@ ruleTester.run(RULE_NAME, rule, {
       errors: [{ messageId: "noMissingContextDisplayName" }],
       output: tsx`
         const ctx1 = createContext();
-        const ctx2 = createContext()
+        const ctx2 = createContext();
         ctx2.displayName = "ctx2";
         ctx1.displayName = "ctx";
       `,
@@ -38,7 +38,7 @@ ruleTester.run(RULE_NAME, rule, {
       `,
       errors: [{ messageId: "noMissingContextDisplayName" }],
       output: tsx`
-        const ctx = createContext()
+        const ctx = createContext();
         ctx.displayName = "ctx";
         ctx.displayname = "ctx";
       `,

packages/plugins/eslint-plugin-react-x/src/rules/no-missing-context-display-name.ts

@@ -2,7 +2,7 @@ import type { TSESTree } from "@typescript-eslint/types";
 import type { RuleListener } from "@typescript-eslint/utils/ts-eslint";
 import type { CamelCase } from "string-ts";
 import * as ER from "@eslint-react/core";
-import { type RuleContext, type RuleFeature, Selector as SEL } from "@eslint-react/kit";
+import { LanguagePreference, type RuleContext, type RuleFeature, Selector as SEL } from "@eslint-react/kit";
 import { AST_NODE_TYPES as T } from "@typescript-eslint/types";
 
 import { createRule } from "../utils";
@@ -62,12 +62,29 @@ export function create(context: RuleContext<MessageID, []>): RuleListener {
             return ER.isInstanceIdEqual(context, id, object);
           });
         if (!hasDisplayNameAssignment) {
+          const semi = LanguagePreference.defaultLanguagePreference.semicolons === "always"
+            ? ";"
+            : "";
           context.report({
             messageId: "noMissingContextDisplayName",
             node: id,
-            fix: id.type === T.Identifier && id.parent === call.parent
-              ? ((fixer) => fixer.insertTextAfter(call, `\n${id.name}.displayName = ${JSON.stringify(id.name)}`))
-              : null,
+            fix(fixer) {
+              if (id.type !== T.Identifier || id.parent !== call.parent) return [];
+              return fixer.insertTextAfter(
+                context.sourceCode.getTokenAfter(call) ?? call,
+                [
+                  "\n",
+                  id.name,
+                  ".",
+                  "displayName",
+                  " ",
+                  "=",
+                  " ",
+                  JSON.stringify(id.name),
+                  semi,
+                ].join(""),
+              );
+            },
           });
         }
       }

packages/utilities/kit/src/LanguagePreference/LanguagePreference.ts

@@ -21,6 +21,11 @@ export function make(): LanguagePreference {
   };
 }
 
+/**
+ * A default LanguagePreference object.
+ */
+export const defaultLanguagePreference = make();
+
 export function getFromContext() {
   throw new Error("getFromContext is not implemented");
 }