SONAR-21467 Fix see details link to correctly scroll to upgrade analysis event

diff --git a/server/sonar-web/src/main/js/apps/overview/branches/Analysis.tsx b/server/sonar-web/src/main/js/apps/overview/branches/Analysis.tsx
index 4904ffd5b55bbf546d52d42af50d12aff505f651..1f734266d96acbb47df3602128cb72a3b45cb9d1 100644 (file)
--- a/server/sonar-web/src/main/js/apps/overview/branches/Analysis.tsx
+++ b/server/sonar-web/src/main/js/apps/overview/branches/Analysis.tsx
@@ -72,7 +72,7 @@ export function Analysis(props: Readonly<AnalysisProps>) {
   );
 
   return (
-    <div className="sw-body-sm">
+    <div data-analysis-key={analysis.key} className="sw-body-sm">
       <div className="sw-flex sw-justify-between sw-mb-1">
         <div className="sw-body-sm-highlight">
           <DateTimeFormatter date={analysis.date} />

diff --git a/server/sonar-web/src/main/js/apps/overview/branches/TabsPanel.tsx b/server/sonar-web/src/main/js/apps/overview/branches/TabsPanel.tsx
index 0f0ace130a23246b1a7f2c33ebee990024e58641..7734ff7952d33e14db85e0d5fa5c5ab24c608c0e 100644 (file)
--- a/server/sonar-web/src/main/js/apps/overview/branches/TabsPanel.tsx
+++ b/server/sonar-web/src/main/js/apps/overview/branches/TabsPanel.tsx
@@ -75,7 +75,7 @@ export function TabsPanel(props: React.PropsWithChildren<MeasuresPanelProps>) {
   const { failingConditionsOnNewCode, failingConditionsOnOverallCode } =
     countFailingConditions(qgStatuses);
 
-  const recentSqUpgradeEvent = React.useMemo(() => {
+  const recentSqUpgrade = React.useMemo(() => {
     if (!analyses || analyses.length === 0) {
       return undefined;
     }
@@ -96,7 +96,7 @@ export function TabsPanel(props: React.PropsWithChildren<MeasuresPanelProps>) {
           hasQpUpdateEvent || event.category === ProjectAnalysisEventCategory.QualityProfile;
 
         if (sqUpgradeEvent !== undefined && hasQpUpdateEvent) {
-          return sqUpgradeEvent;
+          return { analysis, event: sqUpgradeEvent };
         }
       }
     }
@@ -105,11 +105,15 @@ export function TabsPanel(props: React.PropsWithChildren<MeasuresPanelProps>) {
   }, [analyses]);
 
   const scrollToLatestSqUpgradeEvent = () => {
-    document.querySelector(`#${recentSqUpgradeEvent?.key}`)?.scrollIntoView({
-      behavior: 'smooth',
-      block: 'center',
-      inline: 'center',
-    });
+    if (recentSqUpgrade) {
+      document
+        .querySelector(`[data-analysis-key="${recentSqUpgrade.analysis.key}"]`)
+        ?.scrollIntoView({
+          behavior: 'smooth',
+          block: 'center',
+          inline: 'center',
+        });
+    }
   };
 
   const tabs = [
@@ -139,7 +143,7 @@ export function TabsPanel(props: React.PropsWithChildren<MeasuresPanelProps>) {
         </div>
       ) : (
         <>
-          {recentSqUpgradeEvent && (
+          {recentSqUpgrade && (
             <div>
               <FlagMessage className="sw-mb-4" variant="info">
                 <FormattedMessage
@@ -151,7 +155,7 @@ export function TabsPanel(props: React.PropsWithChildren<MeasuresPanelProps>) {
                         <FormattedMessage id="overview.quality_profiles_update_after_sq_upgrade.link" />
                       </ButtonLink>
                     ),
-                    sqVersion: recentSqUpgradeEvent.name,
+                    sqVersion: recentSqUpgrade.event.name,
                   }}
                 />
               </FlagMessage>