chore: Enable and lint-fix TiCS CS rules MAASENG-4719 (#5689)

Author: abuyukyi101198

.github/workflows/coverage.yaml

@@ -1,37 +1,34 @@
 name: Test coverage and TiCS Report
 on:
-  schedule:  # uses last commit on default branch (main)
-    - cron: "30 0 * * 6" # At 0:30 on Saturday
+  schedule:
+    - cron: "30 0 * * 6" # Weekly full analysis
   push:
     branches:
       - "tics-debug-*"
-  # temporarily disabling client mode due to quota
-  # pull_request:
-  #   types: [opened, synchronize, reopened]
+#  We cannot run the TiCS job on pull requests because TiCS
+#  requires us to use secret tokens, and that cannot be done
+#  on PRs from forked repositories.
+#  pull_request:
+#    types: [ opened, synchronize, reopened ]
 
 jobs:
   test-coverage-tics:
     name: Run tests with coverage and generate TiCS report
-    runs-on: ubuntu-22.04
-    timeout-minutes: 720
+    runs-on: [ self-hosted, linux, amd64, tiobe, jammy ]
+    timeout-minutes: 180
     steps:
       - uses: actions/checkout@v4
-
-      - name: Restore node_modules from cache
-        id: yarn-cache
-        uses: actions/cache@v4
         with:
-          path: "**/node_modules"
-          key: ${{ runner.os }}-modules-${{ hashFiles('**/yarn.lock') }}
+          fetch-depth: 0  # Important for TICS to analyze history
 
       - name: Setup Node.js from .nvmrc
         uses: actions/setup-node@v4
         with:
           node-version-file: ".nvmrc"
+          cache: 'yarn'
 
-      - name: Install packages if cache is outdated
-        if: steps.yarn-cache.outputs.cache-hit != 'true'
-        run: CYPRESS_INSTALL_BINARY=0 yarn install
+      - name: Install packages
+        run: CYPRESS_INSTALL_BINARY=0 yarn install --frozen-lockfile
 
       - name: Run tests with coverage
         run: yarn test-coverage
@@ -44,22 +41,34 @@ jobs:
           path: coverage
           retention-days: 1
 
+      # Generate a file list for TICS to analyze
+      - name: Generate file list for TICS
+        run: |
+          # Create a list of files to analyze
+          if [ "${{ github.event_name }}" == "pull_request" ]; then
+            # For PRs, analyze only changed files
+            git diff --name-only origin/${{ github.base_ref }} > tics-file-list.txt
+          else
+            # For scheduled runs and pushes, analyze the whole project
+            echo "." > tics-file-list.txt
+          fi
+          echo "Files to analyze:"
+          cat tics-file-list.txt
+
       - name: Run TICS Analyzer
         uses: tiobe/tics-github-action@v3
+        env:
+          # Add environment variables to optimize TICS performance
+          TICS_NUM_THREADS: 4  # Adjust based on your runner's capabilities
         with:
-          # Use 'qserver' mode for weekly runs and on push to ci-tics-main to
-          #    generate reference points
-          # Use 'client' mode for runs on PRs. Client is a quality gate comparing
-          #    changed files to the reference points and can fail if quality degrades
-          # See:
-          # https://github.com/tiobe/tics-github-action?tab=readme-ov-file#tics-github-action
           mode: ${{ github.event_name == 'pull_request' && 'client' || 'qserver' }}
           project: maas-ui
           viewerUrl: https://canonical.tiobe.com/tiobeweb/TICS/api/cfg?name=default
           ticsAuthToken: ${{ secrets.TICSAUTHTOKEN }}
           installTics: true
           tmpdir: /tmp/tics
           branchdir: ${{ github.workspace }}
+          filelist: ${{ github.workspace }}/tics-file-list.txt
 
       - name: Upload TICS Report
         uses: actions/upload-artifact@v4
@@ -70,15 +79,12 @@ jobs:
 
   publish-coverage-report:
     name: Publish Coverage Report
-    # if: github.ref == 'refs/heads/main'
-    runs-on: ubuntu-latest
+    if: github.ref == 'refs/heads/main' || github.event_name == 'schedule'
+    runs-on: [ self-hosted, linux, amd64, tiobe, jammy ]
     needs: test-coverage-tics
-    continue-on-error: true
-
     permissions:
       id-token: write
       pages: write
-
     steps:
       - uses: actions/checkout@v4
 
@@ -98,4 +104,4 @@ jobs:
 
       - name: Deploy to GitHub Pages
         id: deployment
-        uses: actions/deploy-pages@v4
+        uses: actions/deploy-pages@v4

eslint.config.js

@@ -216,6 +216,85 @@ export default tseslint.config(
       "react/no-multi-comp": ["off"],
     },
   },
+  {
+    files: ["src/app/**/*.ts?(x)"],
+
+    languageOptions: {
+      parserOptions: {
+        project: "./tsconfig.json",
+      },
+    },
+
+    // The commented-out rules below are checked for code quality by TiCS.
+    // Currently, these rules have errors that are challenging to fix;
+    // therefore, they should only be enabled after all corresponding errors
+    // are resolved.
+    rules: {
+      "@typescript-eslint/array-type": "error",
+      // "@typescript-eslint/class-methods-use-this": "error",
+      "@typescript-eslint/consistent-indexed-object-style": "error",
+      // "@typescript-eslint/consistent-return": "error",
+      // "@typescript-eslint/consistent-type-definitions": "error",
+      // "@typescript-eslint/consistent-type-exports": "error",
+      "@typescript-eslint/dot-notation": "error",
+      // "@typescript-eslint/explicit-function-return-type": "error",
+      // "@typescript-eslint/explicit-member-accessibility": "error",
+      // "@typescript-eslint/explicit-module-boundary-types": "error",
+      // "@typescript-eslint/init-declarations": "error",
+      // "@typescript-eslint/max-params": [
+      //   "error",
+      //   {
+      //     max: 3,
+      //   },
+      // ],
+      // "@typescript-eslint/no-confusing-void-expression": "error",
+      "@typescript-eslint/no-duplicate-type-constituents": "error",
+      // "@typescript-eslint/no-dynamic-delete": "error",
+      // "@typescript-eslint/no-empty-function": "error",
+      "@typescript-eslint/no-explicit-any": "error",
+      // "@typescript-eslint/no-floating-promises": "error",
+      "@typescript-eslint/no-for-in-array": "error",
+      "@typescript-eslint/no-import-type-side-effects": "error",
+      "@typescript-eslint/no-inferrable-types": "error",
+      // "@typescript-eslint/no-invalid-void-type": "error",
+      // "@typescript-eslint/no-non-null-assertion": "error",
+      // "@typescript-eslint/no-redeclare": "error",
+      // "@typescript-eslint/no-redundant-type-constituents": "error",
+      // "@typescript-eslint/no-shadow": "error",
+      // "@typescript-eslint/no-unnecessary-boolean-literal-compare": "error",
+      // "@typescript-eslint/no-unnecessary-condition": "error",
+      "@typescript-eslint/no-unnecessary-type-arguments": "error",
+      // "@typescript-eslint/no-unnecessary-type-assertion": "error",
+      // "@typescript-eslint/no-unsafe-argument": "error",
+      // "@typescript-eslint/no-unsafe-assignment": "error",
+      // "@typescript-eslint/no-unsafe-call": "error",
+      // "@typescript-eslint/no-unsafe-enum-comparison": "error",
+      // "@typescript-eslint/no-unsafe-member-access": "error",
+      // "@typescript-eslint/no-unsafe-return": "error",
+      "@typescript-eslint/no-unused-expressions": "error",
+      // "@typescript-eslint/no-use-before-define": "error",
+      // "@typescript-eslint/non-nullable-type-assertion-style": "error",
+      // "@typescript-eslint/prefer-destructuring": "error",
+      // "@typescript-eslint/prefer-enum-initializers": "error",
+      // "@typescript-eslint/prefer-find": "error",
+      // "@typescript-eslint/prefer-for-of": "error",
+      "@typescript-eslint/prefer-includes": "error",
+      // "@typescript-eslint/prefer-literal-enum-member": "error",
+      // "@typescript-eslint/prefer-nullish-coalescing": "error",
+      // "@typescript-eslint/prefer-optional-chain": "error",
+      // "@typescript-eslint/prefer-promise-reject-errors": "error",
+      "@typescript-eslint/prefer-reduce-type-parameter": "error",
+      "@typescript-eslint/prefer-regexp-exec": "error",
+      // "@typescript-eslint/prefer-ts-expect-error": "error",
+      // "@typescript-eslint/promise-function-async": "error",
+      // "@typescript-eslint/require-array-sort-compare": "error",
+      "@typescript-eslint/restrict-plus-operands": "error",
+      // "@typescript-eslint/restrict-template-expressions": "error",
+      "@typescript-eslint/sort-type-constituents": "error",
+      // "@typescript-eslint/strict-boolean-expressions": "error",
+      // "@typescript-eslint/switch-exhaustiveness-check": "error",
+    },
+  },
   {
     files: ["src/app/apiclient/**/*.[jt]s?(x)"],
     rules: {

package.json

@@ -23,6 +23,7 @@
     "cypress-run": "yarn cypress run",
     "generate-api-client": "openapi-ts",
     "lint": "npmPkgJsonLint . && eslint src cypress && tsc --project tsconfig.json --noEmit && tsc --project cypress/tsconfig.json --noEmit",
+    "lint-fix": "npmPkgJsonLint . && eslint src cypress --fix && tsc --project tsconfig.json --noEmit && tsc --project cypress/tsconfig.json --noEmit",
     "link-components": "yarn link \"@canonical/react-components\" && yarn link \"react\" && yarn install",
     "percy": "./cypress/percy.sh",
     "release": "yarn clean && yarn install && CI=true yarn test && yarn build && yarn version --new-version",

src/app/api/base.ts

@@ -10,7 +10,7 @@ export const DEFAULT_HEADERS = {
   Accept: "application/json",
 };
 
-export const handleErrors = (response: Response) => {
+export const handleErrors = (response: Response): Response => {
   if (!response.ok) {
     throw Error(response.statusText);
   }

src/app/api/query-client.ts

@@ -28,7 +28,7 @@ export const realTimeQueryOptions = {
   cacheTime: 60 * 1000, // 1 minute
 } as const;
 
-export const createQueryClient = () =>
+export const createQueryClient = (): QueryClient =>
   new QueryClient({
     defaultOptions: {
       queries: defaultQueryOptions,

src/app/api/query/pools.test.ts

@@ -26,22 +26,28 @@ const mockServer = setupMockServer(
 describe("usePools", () => {
   it("should return resource pools data", async () => {
     const { result } = renderHookWithProviders(() => usePools());
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
     expect(result.current.data?.items).toEqual(mockPools.items);
   });
 });
 
 describe("usePoolCount", () => {
   it("should return correct count", async () => {
     const { result } = renderHookWithProviders(() => usePoolCount());
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
     expect(result.current.data).toBe(3);
   });
 
   it("should return 0 when no pools exist", async () => {
     mockServer.use(poolsResolvers.listPools.handler({ items: [], total: 0 }));
     const { result } = renderHookWithProviders(() => usePoolCount());
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
     expect(result.current.data).toBe(0);
   });
 });
@@ -54,7 +60,9 @@ describe("useCreatePool", () => {
     };
     const { result } = renderHookWithProviders(() => useCreatePool());
     result.current.mutate({ body: newPool });
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
   });
 });
 
@@ -64,15 +72,19 @@ describe("useGetPool", () => {
     const { result } = renderHookWithProviders(() =>
       useGetPool({ path: { resource_pool_id: expectedPool.id } })
     );
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
     expect(result.current.data).toEqual(expectedPool);
   });
 
   it("should return error if zone does not exist", async () => {
     const { result } = renderHookWithProviders(() =>
       useGetPool({ path: { resource_pool_id: 99 } })
     );
-    await waitFor(() => expect(result.current.isError).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isError).toBe(true);
+    });
   });
 });
 
@@ -84,14 +96,18 @@ describe("useUpdatePool", () => {
     };
     const { result } = renderHookWithProviders(() => useUpdatePool());
     result.current.mutate({ body: newPool, path: { resource_pool_id: 1 } });
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
   });
 });
 
 describe("useDeletePool", () => {
   it("should delete a pool", async () => {
     const { result } = renderHookWithProviders(() => useDeletePool());
     result.current.mutate({ path: { resource_pool_id: 1 } });
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
   });
 });

src/app/api/query/sshKeys.test.ts

@@ -26,7 +26,9 @@ setupMockServer(
 describe("useListSshKeys", () => {
   it("should return SSH keys data", async () => {
     const { result } = renderHookWithProviders(() => useListSshKeys());
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
     expect(result.current.data).toEqual(mockSshKeys);
   });
 });
@@ -38,7 +40,9 @@ describe("useCreateSshKeys", () => {
     };
     const { result } = renderHookWithProviders(() => useCreateSshKeys());
     result.current.mutate({ body: newSshKey });
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
   });
 });
 
@@ -50,14 +54,18 @@ describe("useImportSshKeys", () => {
     };
     const { result } = renderHookWithProviders(() => useImportSshKeys());
     result.current.mutate({ body: newSshKey });
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
   });
 });
 
 describe("useDeleteSshKey", () => {
   it("should delete an SSH key", async () => {
     const { result } = renderHookWithProviders(() => useDeleteSshKey());
     result.current.mutate({ path: { id: 1 } });
-    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    await waitFor(() => {
+      expect(result.current.isSuccess).toBe(true);
+    });
   });
 });

src/app/api/query/utils.ts

@@ -4,7 +4,7 @@
  * @returns {function(T[] | undefined): number} A function that takes an array of items and returns the count of items.
  */
 export const selectItemsCount = <T>() => {
-  return (data: T[] | undefined) => data?.length ?? 0;
+  return (data: T[] | undefined): number => data?.length ?? 0;
 };
 
 /**
@@ -16,5 +16,5 @@ export const selectItemsCount = <T>() => {
 export const selectById = <T extends { id: number | null }>(
   id: number | null
 ) => {
-  return (data: T[]) => data.find((item) => item.id === id) || null;
+  return (data: T[]): T | null => data.find((item) => item.id === id) || null;
 };