$ Claude « Corrigez la dernière erreur Sentry et ouvrez une PR »

‍

Claude claude-sonnet-4-6 · ~/projects/acme-web

‍

● Récupération des derniers problèmes Sentry…

✔ liste des problèmes Sentry --projet acme-web --limit 1 --statut non résolu

‍

PROBLÈME-4821 Type d’erreur : Impossible de lire les propriétés de undefined (lecture de 'data')
Projet : acme-web · Environnement : production
Première apparition : 2026-06-15 22:14 UTC · Dernière apparition : 2026-06-16 07:03 UTC
Événements : 1 847 · Utilisateurs affectés : 312
Origine : src/components/Dashboard/MetricsPanel.tsx ligne 94

‍

● Récupération de la stacktrace complète pour PROBLÈME-4821…

‍

Type d’erreur : Lecture des propriétés en lecture de non définie impossible (lecture de 'données')
sur MetricsPanel.tsx:94:28 — processChartData(response)
at MetricsPanel.tsx:61:12 — useEffect(callback)
at react-dom/cjs/react-dom.development.js:22794

Fil d'Ariane le plus récent :
→ GET /API/v2/metrics?range=7d → 200 OK (response.metrics était nul)

‍

● Lecture de src/components/Dashboard/MetricsPanel.tsx…

‍

Ligne 90–98:
90 │ const processChartData = (réponse: ApiResponse) => {
91 │ const { metrics } = réponse
92 │ // métrique peut être nulle lorsqu'il n'y a pas de données pour la plage sélectionnée
93 │ return metrics.data.map((m: métrique) => ({
94 │ Étiquette : m.label,
95 │ valeur : m.valeur ?? 0,
96 │ }))
97 │ }

‍

● Cause racine identifiée.
L'API renvoie { metrics: null } lorsque la plage sélectionnée n'a pas de données. Ligne 93
déréférence metrics.data sans test de nullité, ce qui provoque une exception lors de l'exécution.

‍

● Vérification de l'état du service git…

Sur la branche main · rien à valider, l'arbre de travail est propre

‍

● Création de la branche de correction…

$ git checkout -b fix/metrics-panel-null-data-sentry-4821
Basculé sur une nouvelle branche 'fix/metrics-panel-null-data-sentry-4821'

‍

● Application d'un correctif à src/components/Dashboard/MetricsPanel.tsx…

@@ -90,8 +90,8 @@
const processChartData = (response: ApiResponse) => {
const { metrics } = réponse
- return metrics.data.map((m: Metric) => ({
+ if (! metrics?.data) retour []
+ return metrics.data.map((m: Metric) => ({
label: m.label,
value: m.value ?? 0,
}))

‍

● Mise à jour également de la condition de rendu de src/components/Dashboard/MetricsPanel.tsx…

@@ -61,6 +61,7 @@
useEffect(() => {
fetchMetrics(range).then((response) => {
+ if (! response?.metrics) { setChartData([]); return }
setChartData(processChartData(response))
})
}, [range])

‍

● Exécution de tests…

$ test pnpm --testPathPattern=MetricsPanel
PASS src/components/Dashboard/__tests__/MetricsPanel.test.tsx
✓ affiche l'état de chargement (12ms)
✓ affiche le graphique lorsque les données sont présentes (34ms)
✓ affiche l'état vide lorsque métrique est nulle (8 ms)
✓ affiche l'état vide lorsque metrics.data est un tableau vide (6 ms)

Suites de tests : 1 réussie, 1 au total
Tests : 4 réussis, 4 au total

‍

● Validation en cours…

$ git add src/components/Dashboard/MetricsPanel.tsx
$ git commit -m "fix(dashboard): protection contre null metrics.data dans MetricsPanel

Corrige Sentry ISSUE-4821 (1 847 événements, 312 utilisateurs).

Le point de terminaison /api/v2/metrics renvoie { metrics: null } lorsqu'aucune donnée
n'existe pour la plage demandée. processChartData() a déréférencé
metrics.data sans vérification de valeur nulle, provoquant une erreur TypeError lors de l'exécution.

- Ajouter une clause de garde avec retour anticipé dans processChartData() : if ! metrics?.data retourne []
- Ajouter une vérification de la réponse dans useEffect pour court-circuiter l'appel setChartData
- Les utilisateurs affectés voyaient un panneau vide qui plante ; l'état vide est désormais rendu

Sentry: ISSUE-4821"

[fix/metrics-panel-null-data-sentry-4821 a3f9c12] fix(dashboard) : protection contre null metrics.data null...
1 fichier modifié, 2 insertions(+), 1 suppression(-)

‍

● Pousser la branche et ouvrir une PR…

$ git push -u origin fix/metrics-panel-null-data-sentry-4821
Énumérer des objets : 9, terminé.
Comptage des objets : 100 % (9/9), terminé.
Écriture d'objets : 100 % (5/5), 1,02 Kio | 1,02 Mio/s, terminé.
La branche 'fix/metrics-panel-null-data-sentry-4821' a été configurée pour suivre la branche distante.

$ gh pr create \
--title "fix(dashboard): protection contre null metrics.data dans MetricsPanel" \
--body "..." \
--base main \
--label "bug,sentry"

✓ Pull request créée  :
https://github.com/acme-org/acme-web/pull/1138

‍

──────────────────────────────────────────────────

‍

C'est fait. PR #1138 ouverte · 2 lignes modifiées · 4 tests réussis
Sentry ISSUE-4821 se résoudra automatiquement une fois le déploiement effectué.

‍

$

‍