feat(plugin-eslint): convert rule ids to slugs, add basic description to audits

Author: matejchalk

packages/plugin-eslint/src/lib/meta/audits.ts

@@ -1,5 +1,5 @@
 import type { Audit } from '@quality-metrics/models';
-import { distinct, toArray } from '@quality-metrics/utils';
+import { distinct, slugify, toArray } from '@quality-metrics/utils';
 import type { ESLint, Linter, Rule } from 'eslint';
 
 export async function listAudits(
@@ -28,9 +28,16 @@ export async function listAudits(
 }
 
 function ruleToAudit(ruleId: string, meta: Rule.RuleMetaData): Audit {
+  const name = ruleId.split('/').at(-1) ?? ruleId;
+  const plugin =
+    name === ruleId ? null : ruleId.slice(0, ruleId.lastIndexOf('/'));
+  // TODO: add custom options hash to slug, copy to description
   return {
-    slug: ruleId, // TODO: slugify
-    title: meta.docs?.description ?? ruleId,
+    slug: slugify(ruleId),
+    title: meta.docs?.description ?? name,
+    description: `ESLint rule **${name}**${
+      plugin ? `, from _${plugin}_ plugin` : ''
+    }.`,
     docsUrl: meta.docs?.url,
   };
 }

packages/utils/src/index.ts

@@ -9,4 +9,10 @@ export {
 export { importModule } from './lib/load-file';
 export { reportToMd } from './lib/report-to-md';
 export { reportToStdout } from './lib/report-to-stdout';
-export { calcDuration, formatBytes, toArray, distinct } from './lib/utils';
+export {
+  calcDuration,
+  formatBytes,
+  toArray,
+  distinct,
+  slugify,
+} from './lib/utils';

packages/utils/src/lib/utils.spec.ts

@@ -5,6 +5,7 @@ import {
   countWeightedRefs,
   distinct,
   formatBytes,
+  slugify,
   sumRefs,
   toArray,
 } from './utils';
@@ -141,3 +142,16 @@ describe('toArray', () => {
     expect(toArray(['*.ts', '*.js'])).toEqual(['*.ts', '*.js']);
   });
 });
+
+describe('slugify', () => {
+  it.each([
+    ['Largest Contentful Paint', 'largest-contentful-paint'],
+    ['cumulative-layout-shift', 'cumulative-layout-shift'],
+    ['max-lines-200', 'max-lines-200'],
+    ['rxjs/finnish', 'rxjs-finnish'],
+    ['@typescript-eslint/no-explicit-any', 'typescript-eslint-no-explicit-any'],
+    ['Code  PushUp ', 'code-pushup'],
+  ])('should transform "%s" to valid slug "%s"', (text, slug) => {
+    expect(slugify(text)).toBe(slug);
+  });
+});

packages/utils/src/lib/utils.ts

@@ -38,3 +38,11 @@ export function distinct<T extends string | number | boolean>(array: T[]): T[] {
 export function toArray<T>(val: T | T[]): T[] {
   return Array.isArray(val) ? val : [val];
 }
+
+export function slugify(text: string): string {
+  return text
+    .trim()
+    .toLowerCase()
+    .replace(/\s+|\//g, '-')
+    .replace(/[^a-z0-9-]/g, '');
+}