feat(dev-infra): enable formatting of //webui (#1429)

sudoforge created

This change enables prettier, and enables formatting of //webui.

Change-Id: I2516459649bf6c19a8dc495d3a4d915a6a881b39

Change summary

.github/workflows/build-and-test.yml |   4 
treefmt.nix                          |  18 ++-
webui/.eslintrc.js                   |   6 
webui/codegen.yaml                   |   3 
webui/package-lock.json              | 180 ------------------------------
webui/package.json                   |   3 
webui/packed_assets.go               |   6 
webui/public/index.html              |  30 ++--
webui/tsconfig.json                  |  10 -
9 files changed, 42 insertions(+), 218 deletions(-)

Detailed changes

.github/workflows/build-and-test.yml 🔗

@@ -53,6 +53,10 @@ jobs:
       - name: Check out code
         uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
 
+      - uses: DeterminateSystems/nix-installer-action@21a544727d0c62386e78b4befe52d19ad12692e3 # v17
+
+      - uses: nicknovitski/nix-develop@9be7cfb4b10451d3390a75dc18ad0465bed4932a # v1.2.1
+
       - name: Install
         run: make install
 

treefmt.nix 🔗

@@ -12,7 +12,7 @@
     };
 
     mdformat = {
-      enable = true;
+      enable = false;
 
       package = pkgs.mdformat.withPlugins (
         p: with p; [
@@ -42,11 +42,8 @@
       strict = true;
     };
 
-    # this is disabled due to `//webui` not yet being integrated with the flake.
-    # the entire package directory is ignored below in
-    # `settings.global.excludes`.
     prettier = {
-      enable = false;
+      enable = true;
 
       settings = {
         singleQuote = true;
@@ -79,8 +76,17 @@
       "doc/man/*.1" # generated via //doc:generate.go
       "doc/md/*" # generated via //doc:generate.go
       "misc/completion/*/*"
-      "webui/*" # not currently supported, //webui is not yet flakeified
       "Makefile"
     ]
     ++ excludes;
+
+  settings.formatter = {
+    prettier = {
+      excludes = [
+        "*.md"
+        "*.yaml"
+        "*.yml"
+      ];
+    };
+  };
 }

webui/.eslintrc.js 🔗

@@ -1,5 +1,5 @@
 module.exports = {
-  extends: ['react-app', 'prettier', 'plugin:prettier/recommended'],
+  extends: ['react-app'],
   rules: {
     'import/order': [
       'error',
@@ -42,8 +42,8 @@ module.exports = {
       },
       parserOptions: {
         schema: './src/schema.json',
-        operations: './src/**/*.graphql'
-      }
+        operations: './src/**/*.graphql',
+      },
     },
   ],
 };

webui/codegen.yaml 🔗

@@ -1,3 +1,4 @@
+---
 schema: '../api/graphql/schema/*.graphql'
 overwrite: true
 documents: src/**/*.graphql
@@ -31,4 +32,4 @@ generates:
 
 hooks:
   afterAllFileWrite:
-    - prettier --write
+    - nix fmt

webui/package-lock.json 🔗

@@ -44,9 +44,6 @@
         "@types/node": "^22.15.18",
         "@types/react": "^19.1.4",
         "@types/react-dom": "^19.1.5",
-        "eslint-config-prettier": "^9.1.0",
-        "eslint-plugin-prettier": "^5.4.0",
-        "prettier": "^3.5.3",
         "react-scripts": "^5.0.1",
         "typescript": "^4.9.5"
       }
@@ -5921,19 +5918,6 @@
         "node": ">=10.12.0"
       }
     },
-    "node_modules/@pkgr/core": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@pkgr/core/-/core-0.2.4.tgz",
-      "integrity": "sha512-ROFF39F6ZrnzSUEmQQZUar0Jt4xVoP9WnDRdWwF4NNcXs3xBTLgBUDoOwW141y1jP+S8nahIbdxbFC7IShw9Iw==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": "^12.20.0 || ^14.18.0 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/pkgr"
-      }
-    },
     "node_modules/@pmmmwh/react-refresh-webpack-plugin": {
       "version": "0.5.7",
       "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.7.tgz",
@@ -11215,19 +11199,6 @@
         "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/eslint-config-prettier": {
-      "version": "9.1.0",
-      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz",
-      "integrity": "sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==",
-      "dev": true,
-      "license": "MIT",
-      "bin": {
-        "eslint-config-prettier": "bin/cli.js"
-      },
-      "peerDependencies": {
-        "eslint": ">=7.0.0"
-      }
-    },
     "node_modules/eslint-config-react-app": {
       "version": "7.0.1",
       "resolved": "https://registry.npmjs.org/eslint-config-react-app/-/eslint-config-react-app-7.0.1.tgz",
@@ -11424,37 +11395,6 @@
         "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8"
       }
     },
-    "node_modules/eslint-plugin-prettier": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.4.0.tgz",
-      "integrity": "sha512-BvQOvUhkVQM1i63iMETK9Hjud9QhqBnbtT1Zc642p9ynzBuCe5pybkOnvqZIBypXmMlsGcnU4HZ8sCTPfpAexA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "prettier-linter-helpers": "^1.0.0",
-        "synckit": "^0.11.0"
-      },
-      "engines": {
-        "node": "^14.18.0 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/eslint-plugin-prettier"
-      },
-      "peerDependencies": {
-        "@types/eslint": ">=8.0.0",
-        "eslint": ">=8.0.0",
-        "eslint-config-prettier": ">= 7.0.0 <10.0.0 || >=10.1.0",
-        "prettier": ">=3.0.0"
-      },
-      "peerDependenciesMeta": {
-        "@types/eslint": {
-          "optional": true
-        },
-        "eslint-config-prettier": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/eslint-plugin-react": {
       "version": "7.31.8",
       "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.31.8.tgz",
@@ -12103,12 +12043,6 @@
       "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
       "dev": true
     },
-    "node_modules/fast-diff": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.2.0.tgz",
-      "integrity": "sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w==",
-      "dev": true
-    },
     "node_modules/fast-glob": {
       "version": "3.2.12",
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz",
@@ -20498,34 +20432,6 @@
         "node": ">= 0.8.0"
       }
     },
-    "node_modules/prettier": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.5.3.tgz",
-      "integrity": "sha512-QQtaxnoDJeAkDvDKWCLiwIXkTgRhwYDEQCghU9Z6q03iyek/rxRh/2lC3HB7P8sWT2xC/y5JDctPLBIGzHKbhw==",
-      "dev": true,
-      "license": "MIT",
-      "bin": {
-        "prettier": "bin/prettier.cjs"
-      },
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/prettier/prettier?sponsor=1"
-      }
-    },
-    "node_modules/prettier-linter-helpers": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz",
-      "integrity": "sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==",
-      "dev": true,
-      "dependencies": {
-        "fast-diff": "^1.1.2"
-      },
-      "engines": {
-        "node": ">=6.0.0"
-      }
-    },
     "node_modules/pretty-bytes": {
       "version": "5.6.0",
       "resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-5.6.0.tgz",
@@ -23063,30 +22969,6 @@
       "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
       "dev": true
     },
-    "node_modules/synckit": {
-      "version": "0.11.5",
-      "resolved": "https://registry.npmjs.org/synckit/-/synckit-0.11.5.tgz",
-      "integrity": "sha512-frqvfWyDA5VPVdrWfH24uM6SI/O8NLpVbIIJxb8t/a3YGsp4AW9CYgSKC0OaSEfexnp7Y1pVh2Y6IHO8ggGDmA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@pkgr/core": "^0.2.4",
-        "tslib": "^2.8.1"
-      },
-      "engines": {
-        "node": "^14.18.0 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/synckit"
-      }
-    },
-    "node_modules/synckit/node_modules/tslib": {
-      "version": "2.8.1",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
-      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
-      "dev": true,
-      "license": "0BSD"
-    },
     "node_modules/tailwindcss": {
       "version": "3.1.8",
       "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.1.8.tgz",
@@ -29475,12 +29357,6 @@
         "webcrypto-core": "^1.7.4"
       }
     },
-    "@pkgr/core": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@pkgr/core/-/core-0.2.4.tgz",
-      "integrity": "sha512-ROFF39F6ZrnzSUEmQQZUar0Jt4xVoP9WnDRdWwF4NNcXs3xBTLgBUDoOwW141y1jP+S8nahIbdxbFC7IShw9Iw==",
-      "dev": true
-    },
     "@pmmmwh/react-refresh-webpack-plugin": {
       "version": "0.5.7",
       "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.7.tgz",
@@ -33461,13 +33337,6 @@
         }
       }
     },
-    "eslint-config-prettier": {
-      "version": "9.1.0",
-      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz",
-      "integrity": "sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==",
-      "dev": true,
-      "requires": {}
-    },
     "eslint-config-react-app": {
       "version": "7.0.1",
       "resolved": "https://registry.npmjs.org/eslint-config-react-app/-/eslint-config-react-app-7.0.1.tgz",
@@ -33618,16 +33487,6 @@
         "semver": "^6.3.0"
       }
     },
-    "eslint-plugin-prettier": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.4.0.tgz",
-      "integrity": "sha512-BvQOvUhkVQM1i63iMETK9Hjud9QhqBnbtT1Zc642p9ynzBuCe5pybkOnvqZIBypXmMlsGcnU4HZ8sCTPfpAexA==",
-      "dev": true,
-      "requires": {
-        "prettier-linter-helpers": "^1.0.0",
-        "synckit": "^0.11.0"
-      }
-    },
     "eslint-plugin-react": {
       "version": "7.31.8",
       "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.31.8.tgz",
@@ -34015,12 +33874,6 @@
       "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
       "dev": true
     },
-    "fast-diff": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.2.0.tgz",
-      "integrity": "sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w==",
-      "dev": true
-    },
     "fast-glob": {
       "version": "3.2.12",
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz",
@@ -39886,21 +39739,6 @@
       "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
       "dev": true
     },
-    "prettier": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.5.3.tgz",
-      "integrity": "sha512-QQtaxnoDJeAkDvDKWCLiwIXkTgRhwYDEQCghU9Z6q03iyek/rxRh/2lC3HB7P8sWT2xC/y5JDctPLBIGzHKbhw==",
-      "dev": true
-    },
-    "prettier-linter-helpers": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz",
-      "integrity": "sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==",
-      "dev": true,
-      "requires": {
-        "fast-diff": "^1.1.2"
-      }
-    },
     "pretty-bytes": {
       "version": "5.6.0",
       "resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-5.6.0.tgz",
@@ -41828,24 +41666,6 @@
       "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
       "dev": true
     },
-    "synckit": {
-      "version": "0.11.5",
-      "resolved": "https://registry.npmjs.org/synckit/-/synckit-0.11.5.tgz",
-      "integrity": "sha512-frqvfWyDA5VPVdrWfH24uM6SI/O8NLpVbIIJxb8t/a3YGsp4AW9CYgSKC0OaSEfexnp7Y1pVh2Y6IHO8ggGDmA==",
-      "dev": true,
-      "requires": {
-        "@pkgr/core": "^0.2.4",
-        "tslib": "^2.8.1"
-      },
-      "dependencies": {
-        "tslib": {
-          "version": "2.8.1",
-          "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
-          "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
-          "dev": true
-        }
-      }
-    },
     "tailwindcss": {
       "version": "3.1.8",
       "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.1.8.tgz",

webui/package.json 🔗

@@ -39,9 +39,6 @@
     "@types/node": "^22.15.18",
     "@types/react": "^19.1.4",
     "@types/react-dom": "^19.1.5",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-prettier": "^5.4.0",
-    "prettier": "^3.5.3",
     "react-scripts": "^5.0.1",
     "typescript": "^4.9.5"
   },

webui/packed_assets.go 🔗

@@ -20,68 +20,68 @@ var WebUIAssets = func() http.FileSystem {
 	fs := vfsgen۰FS{
 		"/": &vfsgen۰DirInfo{
 			name:    "/",
-			modTime: time.Date(2025, 5, 16, 2, 36, 15, 104716522, time.UTC),
+			modTime: time.Date(2025, 5, 16, 4, 57, 25, 190751908, time.UTC),
 		},
 		"/asset-manifest.json": &vfsgen۰CompressedFileInfo{
 			name:             "asset-manifest.json",
-			modTime:          time.Date(2025, 5, 16, 2, 36, 15, 104716522, time.UTC),
+			modTime:          time.Date(2025, 5, 16, 4, 57, 25, 190751908, time.UTC),
 			uncompressedSize: 218,
 
 			compressedContent: []byte("\x1f\x8b\x08\x00\x00\x00\x00\x00\x02\xff\x84\x8e\x3d\x0e\xc2\x30\x0c\x85\xf7\x9c\xe2\xc9\x73\x95\x88\x95\xab\x20\x06\x43\x82\x70\xd5\x98\x8a\x78\x00\xa1\xde\x1d\x39\x5d\x32\xc1\xf8\xfe\x3e\xbd\x4f\x00\xe8\x26\x4b\x69\x74\x84\x0b\x80\x2a\x8b\xc6\xd9\x0d\x4a\xcd\xd8\xe4\x9a\xe6\x96\xba\x5b\x98\xf3\xe1\xc2\xd9\xe3\x69\x6f\x8b\xe6\xf2\x8a\x77\xab\x4b\x1f\x0c\x72\x1a\x70\xc3\x30\x56\x5e\xff\xb0\x7b\x25\x00\x9b\x23\xa8\xa8\x3d\xdf\xeb\x43\xd4\xfc\xd3\x69\xa7\xfe\x38\x16\x80\x73\xd8\xbe\x01\x00\x00\xff\xff\x8a\xc3\x33\x8a\xda\x00\x00\x00"),
 		},
 		"/favicon.ico": &vfsgen۰CompressedFileInfo{
 			name:             "favicon.ico",
-			modTime:          time.Date(2025, 5, 16, 2, 35, 53, 674548817, time.UTC),
+			modTime:          time.Date(2025, 5, 16, 4, 57, 4, 614533690, time.UTC),
 			uncompressedSize: 32988,
 

webui/public/index.html 🔗

@@ -1,16 +1,18 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <meta name="theme-color" content="#000000">
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
-    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
-    <title>git-bug webui</title>
-</head>
-<body>
-<noscript>You need to enable JavaScript to run this app.</noscript>
-<div id="root">
-</div>
-</body>
+    <head>
+        <meta charset="utf-8" />
+        <meta
+            name="viewport"
+            content="width=device-width, initial-scale=1, shrink-to-fit=no"
+        />
+        <meta name="theme-color" content="#000000" />
+        <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+        <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
+        <title>git-bug webui</title>
+    </head>
+    <body>
+        <noscript>You need to enable JavaScript to run this app.</noscript>
+        <div id="root"></div>
+    </body>
 </html>

webui/tsconfig.json 🔗

@@ -2,11 +2,7 @@
   "$schema": "https://json.schemastore.org/tsconfig",
   "compilerOptions": {
     "target": "es5",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
@@ -22,7 +18,5 @@
     "jsx": "react-jsx",
     "baseUrl": "."
   },
-  "include": [
-    "src"
-  ]
+  "include": ["src"]
 }