HDDS-14770. [Website] Integrate eslint and run it in github actions

CONTRIBUTING.md

@@ -12,7 +12,7 @@ This document summarizes the contribution process.
     - Your local branch containing changes for the website should be based off of the [master](https://github.com/apache/ozone-site/tree/master) branch.
 
 2. Use your favorite editor to write markdown content under the [docs/](docs/) and [src/pages/](src/pages/) directories.
-    - A good option is [Visual Studio Code](https://code.visualstudio.com/) with [markdownlint](https://marketplace.visualstudio.com/items?itemName=DavidAnson.vscode-markdownlint) and [cspell](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) plugins, which will automatically detect the website's configuration files and give feedback as you type.
+    - A good option is [Visual Studio Code](https://code.visualstudio.com/) with [eslint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) [markdownlint](https://marketplace.visualstudio.com/items?itemName=DavidAnson.vscode-markdownlint) and [cspell](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) plugins, which will automatically detect the website's configuration files and give feedback as you type.
 
 3. Preview your changes locally by running `docker compose up` and opening `localhost:3001` in your browser.
     - Make sure [Docker](https://docs.docker.com/engine/install/) and [Docker Compose](https://docs.docker.com/compose/install/) are installed on your system.
@@ -52,8 +52,8 @@ pnpm run lint
 pnpm run lint:fix
 ```
 
-- `pnpm run lint` runs checks only from markdownlint and yamllint (no files are modified).
-- `pnpm run lint:fix` applies auto-fixes from markdownlint.
+- `pnpm run lint` runs checks only from eslint, markdownlint and yamllint (no files are modified).
+- `pnpm run lint:fix` applies auto-fixes from eslint and markdownlint.
 
 **Prerequisites**: The lint scripts require `yamllint`, which is not a Node.js package and must be installed separately. Install it via pip (`pip install yamllint`) or your system package manager (e.g. `brew install yamllint` on macOS).
 

docusaurus.config.js

@@ -269,7 +269,7 @@ const config = {
             const items = await defaultCreateSitemapItems(rest);
 
             const validUrlRegex = /^https:\/\/ozone\.apache\.org\/([a-z0-9][a-z0-9./-]*[a-z0-9/])?$/;
-            items.forEach((item, index) => {
+            items.forEach((item) => {
               if (!validUrlRegex.test(item.url)) {
                   console.error('Generated URL', item.url, 'does not match the allowed RegEx:', validUrlRegex);
                   console.error('All URLs should use kebab case and lowercase letters.');

eslint.config.mjs

@@ -0,0 +1,118 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import pluginDocusaurus from "@docusaurus/eslint-plugin";
+import css from "@eslint/css";
+import js from "@eslint/js";
+import { defineConfig } from "eslint/config";
+import pluginImport from "eslint-plugin-import-x";
+import pluginReact from "eslint-plugin-react";
+import pluginUnusedImports from "eslint-plugin-unused-imports";
+import globals from "globals";
+
+export default defineConfig([
+  // General
+  {
+    ignores: [
+      "static/**",
+      "node_modules/**",
+      "build/**",
+      ".docusaurus/**",
+      ".github/**",
+    ],
+  },
+
+  // JS
+  {
+    files: ["**/*.{js,mjs,cjs,jsx}"],
+    ...js.configs.recommended,
+    languageOptions: { globals: { ...globals.browser, ...globals.node } },
+    plugins: {
+      "unused-imports": pluginUnusedImports,
+      import: pluginImport,
+    },
+    rules: {
+      "unused-imports/no-unused-imports": "error",
+      // unused vars (but ignore underscore-prefixed)
+      "unused-imports/no-unused-vars": [
+        "error",
+        {
+          vars: "all",
+          varsIgnorePattern: "^_",
+          args: "after-used",
+          argsIgnorePattern: "^_",
+        },
+      ],
+      "import/no-duplicates": "error",
+      "import/order": [
+        "error",
+        {
+          groups: [
+            "builtin", // Node built-ins (path, fs, etc.)
+            "external", // npm packages (react, @docusaurus/*, etc.)
+            "internal", // paths configured as internal (e.g. @site/*)
+            ["parent", "sibling", "index"], // relative imports
+          ],
+          alphabetize: { order: "asc", caseInsensitive: true },
+        },
+      ],
+      "no-unused-vars": "off",
+    },
+  },
+
+  // React
+  {
+    files: ["**/*.{js,jsx}"],
+    ...pluginReact.configs.flat.recommended,
+    settings: {
+      react: { version: "detect" },
+    },
+    rules: {
+      "react/prop-types": "off",
+      "react/react-in-jsx-scope": "off",
+      "react/jsx-uses-vars": "error",
+    },
+  },
+
+  // CSS
+  {
+    files: ["**/*.css"],
+    plugins: { css },
+    language: "css/css",
+    extends: ["css/recommended"],
+    rules: {
+      "css/no-invalid-properties": "off",
+      "css/no-important": "off",
+      "css/use-baseline": "off",
+    },
+  },
+
+  // Docusaurus
+  {
+    files: ["**/*.{js,mjs,cjs,jsx}"],
+    plugins: { "@docusaurus": pluginDocusaurus },
+    rules: {
+      ...pluginDocusaurus.configs.recommended.rules,
+      "@docusaurus/no-html-links": "error",
+      "@docusaurus/prefer-docusaurus-heading": "error",
+      // for i18n
+      // "@docusaurus/no-untranslated-text": ["warn", { ignoredStrings: [] }]
+    },
+  },
+]);

package.json

@@ -13,8 +13,8 @@
     "serve": "docusaurus serve --port 3001",
     "write-translations": "docusaurus write-translations",
     "write-heading-ids": "docusaurus write-heading-ids",
-    "lint": "markdownlint \"$(git rev-parse --show-toplevel)\" && yamllint --format=colored \"$(git rev-parse --show-toplevel)\"",
-    "lint:fix": "markdownlint --fix \"$(git rev-parse --show-toplevel)\" && yamllint --format=colored \"$(git rev-parse --show-toplevel)\""
+    "lint": "eslint . ; markdownlint . ; yamllint --format=colored .",
+    "lint:fix": "eslint --fix . ; markdownlint --fix . ; yamllint --format=colored ."
   },
   "dependencies": {
     "@docusaurus/core": "3.7.0",
@@ -35,9 +35,17 @@
     "@cspell/dict-java": "^5.0.11",
     "@cspell/dict-markdown": "^2.0.9",
     "@cspell/dict-shell": "^1.1.0",
+    "@docusaurus/eslint-plugin": "^3.9.2",
     "@docusaurus/module-type-aliases": "3.7.0",
+    "@eslint/css": "^0.14.1",
+    "@eslint/js": "^10.0.1",
     "ajv-cli": "^5.0.0",
     "cspell": "^8.17.5",
+    "eslint": "^10.0.2",
+    "eslint-plugin-import-x": "^4.16.2",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-unused-imports": "^4.4.1",
+    "globals": "^17.4.0",
     "markdownlint-cli": "^0.39.0"
   },
   "browserslist": {