Converted old angular context decorators and to signals - #709
Merged
Conversation
… to new changes in this new version
Contributor
There was a problem hiding this comment.
Pull request overview
This PR migrates the Angular frontend away from legacy decorator-based inputs/outputs, mutable component/service state, and some RxJS-driven UI state toward Angular Signals (signal, computed, input, output, model, viewChild) and rxjs-interop helpers, aligning the codebase with the updated Angular ESLint rules.
Changes:
- Refactors multiple services (e.g., auth/graph state/tooltip) to expose readonly
Signal<T>APIs with internalWritableSignal<T>state. - Converts many standalone components to signal-based
input()/output()/model()and derivedcomputed()state; updates templates and specs accordingly. - Updates frontend ESLint rules to enforce signals-related patterns (and enables OnPush preference rule).
Reviewed changes
Copilot reviewed 120 out of 120 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| src/main/frontend/src/app/services/graph-state.service.ts | Exposes graph UI state via readonly signals and computed query params |
| src/main/frontend/src/app/services/graph-state.service.spec.ts | Updates tests to assert signal values instead of getters |
| src/main/frontend/src/app/services/auth.service.ts | Refactors auth state to private writable + public readonly signals |
| src/main/frontend/src/app/services/auth.service.spec.ts | Removes manual signal resets and relies on per-test service instantiation |
| src/main/frontend/src/app/pages/release-roadmap/timeline-header/timeline-header.component.ts | Converts @Input setters to input() and derives grid style via computed() |
| src/main/frontend/src/app/pages/release-roadmap/timeline-header/timeline-header.component.spec.ts | Updates inputs/tests for signal-based inputs and computed access |
| src/main/frontend/src/app/pages/release-roadmap/timeline-header/timeline-header.component.html | Updates template to invoke signal inputs/computed values |
| src/main/frontend/src/app/pages/release-roadmap/roadmap-toolbar/roadmap-toolbar.component.ts | Migrates toolbar inputs/outputs to input()/output() |
| src/main/frontend/src/app/pages/release-roadmap/roadmap-toolbar/roadmap-toolbar.component.spec.ts | Updates tests to set inputs via componentRef.setInput |
| src/main/frontend/src/app/pages/release-roadmap/roadmap-toolbar/roadmap-toolbar.component.html | Updates bindings to call signal inputs |
| src/main/frontend/src/app/pages/release-roadmap/roadmap-legend/roadmap-legend.component.ts | Simplifies legend initialization to a static constant list |
| src/main/frontend/src/app/pages/release-roadmap/release-roadmap.component.spec.ts | Updates assertions for signal-based component state |
| src/main/frontend/src/app/pages/release-roadmap/release-roadmap.component.html | Updates roadmap template to call signals/computed values |
| src/main/frontend/src/app/pages/release-roadmap/milestone-row/milestone-row.component.html | Updates bindings to call signal inputs/computed values |
| src/main/frontend/src/app/pages/release-roadmap/issue-bar/issue-bar.component.ts | Converts inputs/viewchild to signal APIs; replaces OnInit fields with computed() |
| src/main/frontend/src/app/pages/release-roadmap/issue-bar/issue-bar.component.html | Updates issue bar template to call signal inputs and computed styles |
| src/main/frontend/src/app/pages/release-manage/vulnerability-impact-manage/vulnerability-impact-panel/vulnerability-impact-panel.component.ts | Replaces OnChanges with effect()-driven UI reactions and signal inputs |
| src/main/frontend/src/app/pages/release-manage/vulnerability-impact-manage/vulnerability-impact-panel/vulnerability-impact-panel.component.html | Updates template to call computed activeFilterCount() |
| src/main/frontend/src/app/pages/release-manage/vulnerability-impact-manage/vulnerability-impact-manage.component.ts | Refactors search/debounce + teardown using toObservable + takeUntilDestroyed and input-bound route params |
| src/main/frontend/src/app/pages/release-manage/vulnerability-impact-manage/vulnerability-impact-manage.component.spec.ts | Updates deep-link test to set cveId via component input |
| src/main/frontend/src/app/pages/release-manage/vulnerability-impact-manage/vulnerability-impact-details/vulnerability-impact-details.component.ts | Replaces lifecycle hooks with effect(); introduces form value tracking via toSignal and computed() |
| src/main/frontend/src/app/pages/release-manage/release-manage.component.ts | Switches route param access to input-bound id signal |
| src/main/frontend/src/app/pages/release-manage/release-manage.component.spec.ts | Updates mocks to use signal input() and sets id via setInput |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-panel/business-value-panel.component.ts | Migrates inputs/outputs to signals; simplifies filtering and sorting |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-manage.component.ts | Uses input-bound route params and signal state throughout |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-manage.component.spec.ts | Updates mocks to input()/output() and sets id via setInput |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-issue-panel/business-value-issue-panel.component.ts | Refactors sorting logic to a static comparator and signal inputs/outputs |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-edit/business-value-edit.component.ts | Migrates to input + linked signals for form fields; updates save to read from signal input |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-edit/business-value-edit.component.spec.ts | Updates tests to set businessValue via setInput and read signal input |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-duplicate/business-value-duplicate.component.ts | Migrates to signal inputs/outputs and computed filtering |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-duplicate/business-value-duplicate.component.html | Updates template to call signal inputs |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-delete/business-value-delete.component.ts | Migrates input/output to signals; updates delete logic to read signal input |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-delete/business-value-delete.component.spec.ts | Updates tests for signal input + setInput usage |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-delete/business-value-delete.component.html | Updates template to call signal input for title |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-add/business-value-add.component.ts | Migrates releaseId to signal input and updates API call accordingly |
| src/main/frontend/src/app/pages/release-manage/business-value-manage/business-value-add/business-value-add.component.spec.ts | Updates test to set releaseId via setInput |
| src/main/frontend/src/app/pages/release-graph/release-skipped-versions/release-skipped-versions.spec.ts | Updates tests for signal inputs and signal-based computed state |
| src/main/frontend/src/app/pages/release-graph/release-skipped-versions/release-skipped-versions.html | Updates template to call signal inputs and signal state |
| src/main/frontend/src/app/pages/release-graph/release-graph.component.html | Updates template bindings to invoke signals/computed values |
| src/main/frontend/src/app/pages/release-graph/release-catalogus/release-catalogus.component.ts | Converts input to signal; replaces async observable with toSignal |
| src/main/frontend/src/app/pages/release-graph/release-catalogus/release-catalogus.component.spec.ts | Updates tests to assert signal state and set inputs via setInput |
| src/main/frontend/src/app/pages/release-graph/release-catalogus/release-catalogus.component.html | Updates template to use signal state instead of async pipe |
| src/main/frontend/src/app/pages/release-details/vulnerability-details-off-canvas/vulnerability-details-off-canvas.ts | Migrates vulnerability input to signal; replaces OnChanges with render effects and linked signals |
| src/main/frontend/src/app/pages/release-details/vulnerability-details-off-canvas/vulnerability-details-off-canvas.html | Updates bindings to call signal state |
| src/main/frontend/src/app/pages/release-details/release-vulnerabilities/release-vulnerabilities.ts | Refactors vulnerability list into computed sorting + linked signal selection/reset behavior |
| src/main/frontend/src/app/pages/release-details/release-vulnerabilities/release-vulnerabilities.spec.ts | Updates tests for signal inputs and signal-derived state |
| src/main/frontend/src/app/pages/release-details/release-vulnerabilities/release-vulnerabilities.html | Updates template to call signals and computed values |
| src/main/frontend/src/app/pages/release-details/release-important-issues/release-important-issues.component.ts | Converts releaseIssues to signal input; replaces OnChanges with computed/linked signal state |
| src/main/frontend/src/app/pages/release-details/release-important-issues/release-important-issues.component.spec.ts | Updates tests to use setInput and validate computed signal state |
| src/main/frontend/src/app/pages/release-details/release-important-issues/issue-tree-branch/issue-tree-branch.component.ts | Migrates inputs to signals; derives indent via computed signal |
| src/main/frontend/src/app/pages/release-details/release-important-issues/issue-tree-branch/issue-tree-branch.component.spec.ts | Updates tests for signal inputs and signal-backed expanded state |
| src/main/frontend/src/app/pages/release-details/release-important-issues/issue-tree-branch/issue-tree-branch.component.html | Updates template to call signals/computed values |
| src/main/frontend/src/app/pages/release-details/release-highlights/release-highlights.component.spec.ts | Updates tests to reflect signal-driven rebuild on input changes |
| src/main/frontend/src/app/pages/release-details/release-highlights/release-highlights.component.html | Updates template to call computed/signal chart inputs |
| src/main/frontend/src/app/pages/release-details/release-details.component.ts | Converts page data to signals; adds takeUntilDestroyed; exposes graph query params as computed signal |
| src/main/frontend/src/app/pages/release-details/release-details.component.spec.ts | Updates tests to use signals and adjusts GraphStateService mocking to readonly signal |
| src/main/frontend/src/app/pages/release-details/release-details.component.html | Updates template logic for signal-based loading/data state |
| src/main/frontend/src/app/pages/release-details/release-business-value/release-business-value.component.ts | Migrates businessValues input to signal and keeps selected state as signal |
| src/main/frontend/src/app/pages/release-details/release-business-value/release-business-value.component.spec.ts | Updates tests to set input via setInput |
| src/main/frontend/src/app/pages/release-details/release-business-value/release-business-value.component.html | Updates template to call signal input safely |
| src/main/frontend/src/app/pages/release-details/release-business-value-modal/release-business-value-modal.component.ts | Replaces input setter + internal signal with a signal input |
| src/main/frontend/src/app/pages/release-details/release-business-value-modal/release-business-value-modal.component.spec.ts | Updates mock components to input()/output() signals |
| src/main/frontend/src/app/pages/header/header.component.ts | Migrates menu state to signal and uses host event binding for document clicks |
| src/main/frontend/src/app/pages/header/header.component.spec.ts | Updates mocks and assertions to use signal state |
| src/main/frontend/src/app/pages/header/header.component.html | Updates template to use graphQueryParams signal and showUserMenu signal |
| src/main/frontend/src/app/pages/cve-overview/cve-overview.component.ts | Refactors search/debounce to signal+rxjs-interop; route param becomes input-bound cveId |
| src/main/frontend/src/app/pages/cve-overview/cve-overview.component.spec.ts | Updates tests to use service API (setAuthenticated) and signal-based search updates |
| src/main/frontend/src/app/pages/cve-overview/cve-overview.component.html | Switches to two-way binding for searchQuery model |
| src/main/frontend/src/app/pages/cve-overview/cve-overview-right-panel/cve-overview-right-panel.component.ts | Replaces OnChanges + writable signals with computed signal projections of the selected CVE detail |
| src/main/frontend/src/app/pages/cve-overview/cve-overview-right-panel/cve-overview-right-panel.component.html | Updates template to use as detail and signal inputs |
| src/main/frontend/src/app/pages/cve-overview/cve-overview-left-panel/cve-overview-left-panel.component.ts | Converts inputs to signals and searchQuery to model(); replaces OnChanges with effect() |
| src/main/frontend/src/app/pages/cve-overview/cve-overview-left-panel/cve-overview-left-panel.component.spec.ts | Updates tests for signal inputs and model-based search state |
| src/main/frontend/src/app/pages/cve-overview/cve-overview-left-panel/cve-overview-left-panel.component.html | Updates template bindings to call signals and use model two-way binding |
| src/main/frontend/src/app/pages/cve-overview/cve-overview-left-panel/cve-overview-item/cve-overview-item.component.ts | Migrates to signal inputs/outputs; derives display fields via computed signals |
| src/main/frontend/src/app/pages/cve-overview/cve-overview-left-panel/cve-overview-item/cve-overview-item.component.html | Updates item template to call computed/signal fields |
| src/main/frontend/src/app/guards/frankframework-member.guard.spec.ts | Updates AuthService mocking to use readonly signal + separate writable state |
| src/main/frontend/src/app/directives/infinite-scroll.directive.ts | Migrates directive inputs/outputs to signals and updates usage sites |
| src/main/frontend/src/app/components/vulnerability-stats/vulnerability-stats.component.ts | Migrates input to signal input |
| src/main/frontend/src/app/components/tooltip/tooltip.service.ts | Replaces BehaviorSubject-based API with a readonly tooltip signal |
| src/main/frontend/src/app/components/tooltip/tooltip.component.ts | Consumes tooltip service via signal instead of observable |
| src/main/frontend/src/app/components/tooltip/tooltip.component.spec.ts | Updates service/component tests for signal-based tooltip state |
| src/main/frontend/src/app/components/tooltip/tooltip.component.html | Updates template to use signal instead of async pipe |
| src/main/frontend/src/app/components/stat-card/stat-card.component.ts | Migrates inputs to signal inputs |
| src/main/frontend/src/app/components/pill-button/pill-button.component.ts | Migrates inputs/outputs to signal APIs |
| src/main/frontend/src/app/components/pill-button/pill-button.component.html | Updates bindings to invoke signal inputs |
| src/main/frontend/src/app/components/off-canvas/off-canvas.component.ts | Migrates title/output to input()/output() |
| src/main/frontend/src/app/components/off-canvas/off-canvas.component.html | Updates template to call signal input |
| src/main/frontend/src/app/components/not-found/not-found.component.ts | Removes explicit change detection config (now default) |
| src/main/frontend/src/app/components/modal/modal.component.ts | Migrates inputs/outputs/viewChild to signals and focuses after render via afterNextRender |
| src/main/frontend/src/app/components/modal/modal.component.html | Updates template bindings to call signal inputs |
| src/main/frontend/src/app/components/loader/loader.component.ts | Removes explicit change detection config (now default) |
| src/main/frontend/src/app/components/issue-type-tag/issue-type-tag.component.ts | Migrates input to signal; derives text color via computed signal |
| src/main/frontend/src/app/components/issue-type-tag/issue-type-tag.component.spec.ts | Updates tests to set input via setInput |
| src/main/frontend/src/app/components/issue-type-tag/issue-type-tag.component.html | Updates template to call signal and computed color |
| src/main/frontend/src/app/components/gesture/gesture.component.ts | Migrates inputs to signal inputs |
| src/main/frontend/src/app/components/gesture/gesture.component.html | Updates template to call signal inputs |
| src/main/frontend/src/app/components/filter-icon/filter-icon.component.ts | Removes explicit change detection config (now default) |
| src/main/frontend/src/app/components/feedback/feedback.component.ts | Replaces HostListener with host binding; tracks build info/selection with signals + toSignal |
| src/main/frontend/src/app/components/cvss-calculator/cvss-calculator.component.ts | Migrates inputs/outputs to signals; uses linked signals for reference vector and input state |
| src/main/frontend/src/app/components/cvss-calculator/cvss-calculator.component.spec.ts | Updates tests for signal-based input state and reference vector setup |
| src/main/frontend/src/app/components/cvss-calculator/cvss-calculator.component.html | Updates template to bind ngModel to signal state explicitly |
| src/main/frontend/src/app/components/cve-search-input/cve-search-input.component.ts | Converts to model-based two-way binding for search query |
| src/main/frontend/src/app/components/cve-search-input/cve-search-input.component.html | Updates template to call signal/model values |
| src/main/frontend/src/app/components/cve-filter-panel/cve-filter-panel.component.ts | Converts filters to model() and derives UI state via computed signals |
| src/main/frontend/src/app/components/cve-filter-panel/cve-filter-panel.component.html | Updates template to call signals and work with model-driven filters |
| src/main/frontend/src/app/app.component.ts | Tracks navigation loading state via toSignal(router.events) instead of imperative subscription |
| src/main/frontend/src/app/app.component.spec.ts | Updates tests to assert loading via signal |
| src/main/frontend/src/app/app.component.html | Updates loader visibility to call loading signal |
| src/main/frontend/eslint.config.mjs | Enables additional Angular ESLint rules (signals, outputs) and turns OnPush preference on |
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
… to warn in eslint configuration
|
Matthbo
approved these changes
Aug 10, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.



No description provided.