fix(eslint-plugin-internal): consistent-deprecated-stories not removing tags prop [AR-54233] (#304)

Author: StyleShit

packages/eslint-plugin-internal/src/rules/__tests__/consistent-deprecated-stories.test.ts

@@ -605,7 +605,7 @@ ruleTester.run('consistent-deprecated-stories', consistentDeprecatedStories, {
 		},
 
 		{
-			name: 'non-deprecated component with deprecated tag - removes tag',
+			name: 'non-deprecated component with only deprecated tag - removes the whole tags prop',
 			code: `
 				function DsButton() { return null; }
 
@@ -623,7 +623,7 @@ ruleTester.run('consistent-deprecated-stories', consistentDeprecatedStories, {
 				const meta = {
 					title: 'Design System/Button',
 					component: DsButton,
-					tags: [],
+					
 				};
 
 				export default meta;
@@ -640,6 +640,42 @@ ruleTester.run('consistent-deprecated-stories', consistentDeprecatedStories, {
 			],
 		},
 
+		{
+			name: 'non-deprecated component with deprecated tag and other tags - removes only the deprecated tag',
+			code: `
+				function DsButton() { return null; }
+
+				const meta = {
+					title: 'Design System/Button',
+					component: DsButton,
+					tags: ['!dev', 'deprecated', 'autodocs'],
+				};
+
+				export default meta;
+			`,
+			output: `
+				function DsButton() { return null; }
+
+				const meta = {
+					title: 'Design System/Button',
+					component: DsButton,
+					tags: ['!dev',  'autodocs'],
+				};
+
+				export default meta;
+			`,
+			errors: [
+				{
+					messageId: 'noUnusedDeprecatedTag',
+					data: { component: 'DsButton' },
+					line: 7,
+					column: 21,
+					endLine: 7,
+					endColumn: 33,
+				},
+			],
+		},
+
 		{
 			name: 'imported deprecated namespaced component',
 			code: `
@@ -701,7 +737,7 @@ ruleTester.run('consistent-deprecated-stories', consistentDeprecatedStories, {
 				const meta = {
 					title: 'Design System/ActiveNamespacedComponent',
 					component: DsActiveNamespacedComponent,
-					tags: [],
+					
 				};
 
 				export default meta;
@@ -787,7 +823,7 @@ ruleTester.run('consistent-deprecated-stories', consistentDeprecatedStories, {
 				const meta = {
 					title: 'Design System/SubComponents.Active',
 					component: DsSubComponents.Active,
-					tags: [],
+					
 				};
 
 				export default meta;

packages/eslint-plugin-internal/src/rules/consistent-deprecated-stories.ts

@@ -4,6 +4,7 @@ import { resolveStoryMeta } from './utils/resolve-story-meta';
 import { AST_NODE_TYPES, ESLintUtils, type TSESTree } from '@typescript-eslint/utils';
 import { getStoryMetaProps } from './utils/get-story-meta-props';
 import { getComponentParts } from './utils/get-component-parts';
+import { removeWithTrailingComma } from './utils/remove-with-trailing-comma';
 
 type MessageId =
 	| 'missingDeprecatedSuffix'
@@ -100,7 +101,14 @@ export const consistentDeprecatedStories = createRule<[], MessageId>({
 						messageId: 'noUnusedDeprecatedTag',
 						data: { component: componentDisplayName },
 						fix: (fixer) => {
-							return fixer.remove(deprecatedTag);
+							const hasOnlyOneTag = tagsArray?.elements.length === 1;
+							const nodeToRemove = hasOnlyOneTag ? tagsProp : deprecatedTag;
+
+							if (!nodeToRemove) {
+								return null;
+							}
+
+							return removeWithTrailingComma(context.sourceCode, fixer, nodeToRemove);
 						},
 					});
 				}

packages/eslint-plugin-internal/src/rules/no-autodocs-tag.ts

@@ -1,8 +1,8 @@
 import { createRule } from '../create-rule';
 import { getObjectProperty } from './utils/get-object-property';
+import { removeWithTrailingComma } from './utils/remove-with-trailing-comma';
 import { resolveStoryMeta } from './utils/resolve-story-meta';
-import { AST_NODE_TYPES, type TSESTree } from '@typescript-eslint/utils';
-import type { RuleFixer, SourceCode } from '@typescript-eslint/utils/ts-eslint';
+import { AST_NODE_TYPES } from '@typescript-eslint/utils';
 
 type MessageId = 'noAutodocsTag';
 
@@ -65,10 +65,3 @@ export const noAutodocsTag = createRule<[], MessageId>({
 		};
 	},
 });
-
-function removeWithTrailingComma(sourceCode: SourceCode, fixer: RuleFixer, node: TSESTree.Node) {
-	const trailingComma = sourceCode.getTokenAfter(node);
-	const rangeEnd = trailingComma?.value === ',' ? trailingComma.range[1] : node.range[1];
-
-	return fixer.removeRange([node.range[0], rangeEnd]);
-}

packages/eslint-plugin-internal/src/rules/utils/remove-with-trailing-comma.ts

@@ -0,0 +1,9 @@
+import type { TSESTree } from '@typescript-eslint/utils';
+import type { RuleFixer, SourceCode } from '@typescript-eslint/utils/ts-eslint';
+
+export function removeWithTrailingComma(sourceCode: SourceCode, fixer: RuleFixer, node: TSESTree.Node) {
+	const trailingComma = sourceCode.getTokenAfter(node);
+	const rangeEnd = trailingComma?.value === ',' ? trailingComma.range[1] : node.range[1];
+
+	return fixer.removeRange([node.range[0], rangeEnd]);
+}