Skip to content

feat(service-monitoring-alerts): add view#2428

Merged
RemiBonnet merged 8 commits intonew-navigationfrom
feat/new-navigation/service-alerting
Mar 3, 2026
Merged

feat(service-monitoring-alerts): add view#2428
RemiBonnet merged 8 commits intonew-navigationfrom
feat/new-navigation/service-alerting

Conversation

@RemiBonnet
Copy link
Member

@RemiBonnet RemiBonnet commented Feb 27, 2026

Summary

  • Add Alerting view for Services

Screenshots / Recordings

https://www.loom.com/share/9f6e53a32c2f474eb1dcf8b0767da185

Testing

  • Changes tested locally in the relevant Console's pages and Storybooks
  • yarn test or yarn test -u (if you need to regenerate snapshots)
  • yarn format
  • yarn lint

PR Checklist

  • I followed naming, styling, and TypeScript rules (see .cursor/rules)
  • I performed a self-review (diff inspected, dead code removed)
  • I titled the PR using Conventional Commits with a scope when possible (e.g. feat(service): add new Terraform service) - required for semantic-release
  • I only kept necessary comments, written in English (watch for useless AI comments)
  • I involved a designer to validate UI changes if I am not a designer
  • I covered new business logic with tests (unit)
  • I confirmed CI is green (Codecov red can be accepted)
  • I reviewed and executed locally any AI-assisted code

@RemiBonnet
Copy link
Member Author

Qovery Preview

Qovery can create a Preview Environment for this PR.
To trigger its creation, please post a comment with one of the following command.

Command Blueprint environment
/qovery preview 15d69f24-9bc1-4a8d-80fe-d1bb1b2bcd00 New Navigation
/qovery preview {all|UUID1,UUID2,...} To preview multiple environments

This comment has been generated from Qovery AI 🤖.
Below, a word from its wisdom :

Help yourself at 2AM by putting some metrics to help observability

@RemiBonnet RemiBonnet marked this pull request as ready for review February 27, 2026 16:16
@codecov
Copy link

codecov bot commented Feb 27, 2026

Codecov Report

❌ Patch coverage is 17.54386% with 47 lines in your changes missing coverage. Please review.
⚠️ Please upload report for BASE (new-navigation@e102b71). Learn more about missing BASE report.

Files with missing lines Patch % Lines
.../alerting-creation-flow/alerting-creation-flow.tsx 0.00% 27 Missing ⚠️
...reate-key-alerts-modal/create-key-alerts-modal.tsx 0.00% 5 Missing and 2 partials ⚠️
...erting-creation-flow/summary-step/summary-step.tsx 37.50% 5 Missing ⚠️
...src/lib/alerting/issue-overview/issue-overview.tsx 0.00% 1 Missing and 3 partials ⚠️
...ting/alert-rules-overview/alert-rules-overview.tsx 80.00% 1 Missing ⚠️
...e/src/lib/hooks/use-environment/use-environment.ts 0.00% 1 Missing ⚠️
.../lib/service/service-alerting/service-alerting.tsx 50.00% 1 Missing ⚠️
...ib/service/service-dashboard/service-dashboard.tsx 0.00% 1 Missing ⚠️
Additional details and impacted files
@@                Coverage Diff                @@
##             new-navigation    #2428   +/-   ##
=================================================
  Coverage                  ?   44.27%           
=================================================
  Files                     ?      984           
  Lines                     ?    18899           
  Branches                  ?     5483           
=================================================
  Hits                      ?     8367           
  Misses                    ?     9034           
  Partials                  ?     1498           
Flag Coverage Δ
unittests 44.27% <17.54%> (?)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@RemiBonnet RemiBonnet added the V5 label Mar 3, 2026
- Introduced routes for creating and editing alert metrics within the service monitoring section.
- Enhanced the organization of alert-related components and improved navigation flow.
- Updated the monitoring dashboard to handle new alert routes and provide better user feedback during alert management.
- Refactored existing components to support the new alerting features and ensure a cohesive user experience.
- Deleted PageAlertingCreateFeature and PageAlertingEditFeature components to streamline the codebase.
- Updated routing to remove references to the deleted components, enhancing clarity and maintainability.
- Minor style adjustment in SummaryStep component for improved consistency.
…ted monitoring features

- Refactored IssueOverview to use `useParams` from `@tanstack/react-router` for improved routing.
- Updated alert navigation links to utilize parameterized routes for better clarity and maintainability.
- Deleted obsolete monitoring dashboard and placeholder components to streamline the codebase and enhance overall organization.
- Removed related routing references to deprecated components, improving clarity in the routing structure.
… constant

- Deleted APPLICATION_MONITORING_ALERTS_URL from application.router.ts to streamline routing and eliminate references to obsolete monitoring features.
…onents

- Replaced `react-router-dom` with `@tanstack/react-router` for improved routing consistency across alerting components.
- Simplified context usage in `SummaryStep` and `MetricConfigurationStep` by directly providing necessary values.
- Removed mock implementations of routing hooks in tests to align with the new routing structure.
- Enhanced test setups to reflect updated context and routing dependencies.
@RemiBonnet RemiBonnet force-pushed the feat/new-navigation/service-alerting branch from 1a3aeec to 3e5c0af Compare March 3, 2026 14:13
Comment on lines +120 to +121
const pathname = useRouterState({ select: (state) => state.location.pathname })
const searchStr = useRouterState({ select: (state) => state.location.searchStr })
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you please use useLocation and useSearch here?

https://tanstack.com/router/latest/docs/api/router/useSearchHook

navigate(`${basePath}${ALERTING_CREATION_METRIC(selectedMetrics[currentStepIndex - 1])}${queryString}`)
const basePath = pathname.replace(/\/summary$/, '')
const queryString = searchStr ?? ''
navigate({ to: `${basePath}/metric/${selectedMetrics[currentStepIndex - 1]}${queryString}` })
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you refactor this line for it to use the search param instead of concatenating the queryString ?
That way the params will be type-safe 🙏

@RemiBonnet RemiBonnet requested a review from rmnbrd March 3, 2026 14:42
@RemiBonnet RemiBonnet merged commit 18297bb into new-navigation Mar 3, 2026
11 checks passed
@RemiBonnet RemiBonnet deleted the feat/new-navigation/service-alerting branch March 3, 2026 15:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants