feat(lint): Additional CI workflow to enforce a threshold of the amount of frontend lint issues#163
Conversation
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
📝 WalkthroughWalkthroughAdds a new GitHub Actions workflow that runs on push/PR to develop/main and manually; it sets up Node.js 24, installs frontend deps, runs TypeScript check, performs an Angular production build (capturing warnings), runs ng lint in JSON, aggregates warning/error counts, and fails if configured thresholds are exceeded. Changes
Sequence Diagram(s)sequenceDiagram
participant GH as GitHub Actions
participant Runner as ubuntu-latest
participant Repo as Repository (./booklore-ui)
participant Node as Node.js (24)
participant TS as TypeScript compiler
participant Build as Angular build
participant Lint as ng lint
participant Checker as Threshold Checker
GH->>Runner: workflow trigger (push/PR/dispatch)
Runner->>Repo: checkout code
Runner->>Node: setup Node.js 24
Runner->>Repo: npm ci (./booklore-ui)
Runner->>TS: npx tsc --noEmit -p tsconfig.app.json
Runner->>Build: npx ng build --configuration production -> build-output.log
Build-->>Runner: build output (stdout/stderr)
Runner->>Lint: npx ng lint --format json --output-file lint-results.json
Lint-->>Runner: lint-results.json (warnings/errors)
Runner->>Checker: parse logs & JSON -> compute counts, compare to thresholds
alt any count > threshold
Checker->>GH: fail job (exit 1) and write summary
else
Checker->>GH: succeed and write summary
end
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
.github/workflows/angular-lint-threshold.yml (1)
21-23: Consider making the threshold externally configurable.Hard-coding
725means every threshold ratchet needs a workflow code change. Prefer repo/org variable (with fallback) to lower it progressively without workflow edits.Suggested patch
env: - LINT_THRESHOLD: 725 + LINT_THRESHOLD: ${{ vars.FRONTEND_LINT_THRESHOLD || '725' }}🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In @.github/workflows/angular-lint-threshold.yml around lines 21 - 23, Replace the hard-coded env value LINT_THRESHOLD: 725 with a lookup that reads a repository/org variable or secret with a fallback to 725 so the threshold can be changed without editing the workflow; update the env entry that sets LINT_THRESHOLD to use a GitHub Actions expression like reading vars or secrets (e.g., use the LINT_THRESHOLD variable name in the env block and default to 725 if not set) so the workflow references the external config rather than the literal 725.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In @.github/workflows/angular-lint-threshold.yml:
- Around line 8-10: The workflow's push trigger only lists the develop branch
under the push -> branches key, so add "main" to that branches list so the
lint-threshold job also runs on direct commits to main; update the push trigger
(the branches array under the push block) to include both "develop" and "main"
so the policy is enforced for direct main commits.
---
Nitpick comments:
In @.github/workflows/angular-lint-threshold.yml:
- Around line 21-23: Replace the hard-coded env value LINT_THRESHOLD: 725 with a
lookup that reads a repository/org variable or secret with a fallback to 725 so
the threshold can be changed without editing the workflow; update the env entry
that sets LINT_THRESHOLD to use a GitHub Actions expression like reading vars or
secrets (e.g., use the LINT_THRESHOLD variable name in the env block and default
to 725 if not set) so the workflow references the external config rather than
the literal 725.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 35beb518-6d76-4bb5-a8b0-ca6b601b278b
📒 Files selected for processing (1)
.github/workflows/angular-lint-threshold.yml
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
|
I like this! For completeness sake, perhaps can you update this PR to check for build warnings/errors as well as typechecking? Or I can just merge this, it is good, but that would the complete frontend CI package, imho. |
* develop: fix(entrypoint): ensure books directory exists and is writable by the target user (grimmory-tools#119) fix(metadata): fix metadata fetching relying for filename "first" instead of better fields like ISBN in Goodreads/Bookdrop (grimmory-tools#85) chore(build): migrate Gradle build scripts from Groovy to Kotlin DSL (grimmory-tools#100) perf(ui): captures some low hanging fruit around excessive re-renders in the app (grimmory-tools#158) fix(api): check legacy tools path for binaries (grimmory-tools#146)
I'm going to look into it. |
…for accurate warning count
I made some adjustments. Build warning are now also counted and has it own threshold. Build errors will fail the build. |
There was a problem hiding this comment.
🧹 Nitpick comments (1)
.github/workflows/angular-lint-threshold.yml (1)
95-96: Unnecessaryworking-directoryon this step.This step only uses environment variables and writes to
GITHUB_STEP_SUMMARY; it doesn't access any files in./booklore-ui. Removing theworking-directorydirective would simplify the step.♻️ Suggested simplification
- name: Enforce Quality Thresholds - working-directory: ./booklore-ui run: |🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In @.github/workflows/angular-lint-threshold.yml around lines 95 - 96, The "Enforce Quality Thresholds" step currently sets a working-directory of ./booklore-ui even though it only uses environment variables and writes to GITHUB_STEP_SUMMARY; remove the unnecessary working-directory key from that step (the step block with name "Enforce Quality Thresholds") so the step runs in the default workspace and the workflow is simplified.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In @.github/workflows/angular-lint-threshold.yml:
- Around line 95-96: The "Enforce Quality Thresholds" step currently sets a
working-directory of ./booklore-ui even though it only uses environment
variables and writes to GITHUB_STEP_SUMMARY; remove the unnecessary
working-directory key from that step (the step block with name "Enforce Quality
Thresholds") so the step runs in the default workspace and the workflow is
simplified.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 3506a159-3fa2-41fe-9f58-7a440452a573
📒 Files selected for processing (1)
.github/workflows/angular-lint-threshold.yml
…r quality thresholds step
There was a problem hiding this comment.
🧹 Nitpick comments (2)
.github/workflows/angular-lint-threshold.yml (2)
15-17: Consider adding a job timeout for runner safety.A
timeout-minuteson the job helps prevent hung builds from consuming runners indefinitely.Optional patch
jobs: lint-threshold: name: Frontend Lint Threshold Check runs-on: ubuntu-latest + timeout-minutes: 20🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In @.github/workflows/angular-lint-threshold.yml around lines 15 - 17, The GitHub Actions job "lint-threshold" (name: Frontend Lint Threshold Check) lacks a job timeout; add a timeout-minutes field under the job definition to prevent hung builds from consuming runners (e.g., add timeout-minutes: 30 beneath the lint-threshold job declaration), ensuring the workflow will cancel long-running runs safely.
42-44: Using local binaries instead ofnpxcan improve CI explicitness.Lines 44, 50, and 77 use
npx, which works correctly afternpm ciinstalls pinned dependencies. However, directly referencing binaries from./node_modules/.bin/makes the reliance on installed tools more explicit and avoids any runtime package-registry lookups, even as a fallback.Consider updating these three lines to use
./node_modules/.bin/tsc,./node_modules/.bin/ng, etc., for clearer intent and deterministic tool invocation.Suggested updates
- - name: Typecheck Frontend + - name: Typecheck Frontend working-directory: ./booklore-ui - run: npx tsc --noEmit -p tsconfig.app.json + run: ./node_modules/.bin/tsc --noEmit -p tsconfig.app.json @@ - name: Run Frontend Build working-directory: ./booklore-ui run: | set +e - npx ng build --configuration production --progress=false 2>&1 | tee build-output.log + ./node_modules/.bin/ng build --configuration production --progress=false 2>&1 | tee build-output.log BUILD_EXIT_CODE=${PIPESTATUS[0]} set -e @@ - name: Run Frontend Linter working-directory: ./booklore-ui run: | # Lint output is written to JSON for threshold evaluation. - npx ng lint --format json --output-file lint-results.json || true + ./node_modules/.bin/ng lint --format json --output-file lint-results.json || trueAlso applies to: 46–51, 73–77
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In @.github/workflows/angular-lint-threshold.yml around lines 42 - 44, Replace the npx invocations with explicit local binaries to make CI tool usage deterministic: update the "Typecheck Frontend" run command that currently uses "npx tsc --noEmit -p tsconfig.app.json" to "./node_modules/.bin/tsc --noEmit -p tsconfig.app.json", and likewise replace the other two npx uses (the Angular CLI invocations using "npx ng ...") with "./node_modules/.bin/ng ..." so all three occurrences call the binaries under ./node_modules/.bin instead of via npx.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In @.github/workflows/angular-lint-threshold.yml:
- Around line 15-17: The GitHub Actions job "lint-threshold" (name: Frontend
Lint Threshold Check) lacks a job timeout; add a timeout-minutes field under the
job definition to prevent hung builds from consuming runners (e.g., add
timeout-minutes: 30 beneath the lint-threshold job declaration), ensuring the
workflow will cancel long-running runs safely.
- Around line 42-44: Replace the npx invocations with explicit local binaries to
make CI tool usage deterministic: update the "Typecheck Frontend" run command
that currently uses "npx tsc --noEmit -p tsconfig.app.json" to
"./node_modules/.bin/tsc --noEmit -p tsconfig.app.json", and likewise replace
the other two npx uses (the Angular CLI invocations using "npx ng ...") with
"./node_modules/.bin/ng ..." so all three occurrences call the binaries under
./node_modules/.bin instead of via npx.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 4346b218-7bf4-4c8c-af55-0d85d070e512
📒 Files selected for processing (1)
.github/workflows/angular-lint-threshold.yml
I don't personally believe it does. BUT; that is not necessary at this time, I think. For now wisest is to move forward with this. |
…nt of frontend lint issues (grimmory-tools#163) * feat(lint): add Angular Lint Threshold workflow for CI integration * Update workflow name for clarity in CI integration * fix(lint): update LINT_THRESHOLD to 725 in CI checks * Also run workflow on main branch Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * fix(lint): simplify lint problem count calculation using jq * feat(lint): enhance quality threshold checks and reporting in CI workflow * refactor(lint): rename lint step for clarity in CI workflow * fix(lint): swap lint warning and error thresholds for correct configuration * fix(lint): update build warning threshold and correct log processing for accurate warning count * refactor(lint): remove unnecessary working-directory specification for quality thresholds step --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
…nt of frontend lint issues (grimmory-tools#163) * feat(lint): add Angular Lint Threshold workflow for CI integration * Update workflow name for clarity in CI integration * fix(lint): update LINT_THRESHOLD to 725 in CI checks * Also run workflow on main branch Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * fix(lint): simplify lint problem count calculation using jq * feat(lint): enhance quality threshold checks and reporting in CI workflow * refactor(lint): rename lint step for clarity in CI workflow * fix(lint): swap lint warning and error thresholds for correct configuration * fix(lint): update build warning threshold and correct log processing for accurate warning count * refactor(lint): remove unnecessary working-directory specification for quality thresholds step --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
…nt of frontend lint issues (#163) * feat(lint): add Angular Lint Threshold workflow for CI integration * Update workflow name for clarity in CI integration * fix(lint): update LINT_THRESHOLD to 725 in CI checks * Also run workflow on main branch Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * fix(lint): simplify lint problem count calculation using jq * feat(lint): enhance quality threshold checks and reporting in CI workflow * refactor(lint): rename lint step for clarity in CI workflow * fix(lint): swap lint warning and error thresholds for correct configuration * fix(lint): update build warning threshold and correct log processing for accurate warning count * refactor(lint): remove unnecessary working-directory specification for quality thresholds step --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
…nt of frontend lint issues (#163) * feat(lint): add Angular Lint Threshold workflow for CI integration * Update workflow name for clarity in CI integration * fix(lint): update LINT_THRESHOLD to 725 in CI checks * Also run workflow on main branch Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * fix(lint): simplify lint problem count calculation using jq * feat(lint): enhance quality threshold checks and reporting in CI workflow * refactor(lint): rename lint step for clarity in CI workflow * fix(lint): swap lint warning and error thresholds for correct configuration * fix(lint): update build warning threshold and correct log processing for accurate warning count * refactor(lint): remove unnecessary working-directory specification for quality thresholds step --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Description
We need to get the amount of lint issues down for the frontend. That's why I created this new workflow, so that it's not possible to introduce new lint issues. And when we solve lint issues, we can lower the threshold. It's the idea that this threshold will be worked down to zero.
Linked Issue: #133
Changes
This pull request introduces a new GitHub Actions workflow to enforce a lint problem threshold for the frontend codebase. The workflow automatically runs on pull requests and pushes to the main development branches, ensuring that the number of linting issues does not exceed a specified limit.
Continuous Integration and Lint Enforcement:
.github/workflows/angular-lint-threshold.ymlthat runs on pull requests and pushes todevelopandmainbranches, as well as via manual dispatch.LINT_THRESHOLD, default 725). If the threshold is exceeded, the workflow fails the check.Summary by CodeRabbit