From 0ffa75979f9f8d718abb33e778cbf72293e401d1 Mon Sep 17 00:00:00 2001
From: Alf Eaton <alf.eaton@overleaf.com>
Date: Tue, 9 May 2023 15:45:37 +0100
Subject: [PATCH] Merge pull request #13001 from
 overleaf/td-history-version-hover-style

History migration: Use green selected style when hovering over selected version

GitOrigin-RevId: 7771ce64d719c3d0e5264dfd2fbbf52f5b519213
---
 .../components/change-list/history-version.tsx   |  2 +-
 .../components/change-list/labels-list.tsx       | 13 +++++++++++--
 .../stylesheets/app/editor/history-react.less    | 16 ++++++++++------
 3 files changed, 22 insertions(+), 9 deletions(-)

diff --git a/services/web/frontend/js/features/history/components/change-list/history-version.tsx b/services/web/frontend/js/features/history/components/change-list/history-version.tsx
index 63c4c0221a..64c30d165a 100644
--- a/services/web/frontend/js/features/history/components/change-list/history-version.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/history-version.tsx
@@ -42,7 +42,7 @@ function HistoryVersion({ update, faded }: HistoryEntryProps) {
         fromVTimestamp={update.meta.end_ts}
         toVTimestamp={update.meta.end_ts}
         selected={selected}
-        selectable={!faded}
+        selectable={!faded && (selection.comparing || !selected)}
       >
         <div className="history-version-main-details">
           <time className="history-version-metadata-time">
diff --git a/services/web/frontend/js/features/history/components/change-list/labels-list.tsx b/services/web/frontend/js/features/history/components/change-list/labels-list.tsx
index a9b1ff96f6..3d684c8ffd 100644
--- a/services/web/frontend/js/features/history/components/change-list/labels-list.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/labels-list.tsx
@@ -9,6 +9,7 @@ import { useUserContext } from '../../../../shared/context/user-context'
 import { isVersionSelected } from '../../utils/history-details'
 import { getVersionWithLabels, isPseudoLabel } from '../../utils/label'
 import { formatTime, isoToUnix } from '../../../utils/format-date'
+import { Version } from '../../services/types/update'
 
 function LabelsList() {
   const { t } = useTranslation()
@@ -20,10 +21,18 @@ function LabelsList() {
     [labels]
   )
 
+  const selectedVersions = new Set<Version>(
+    Array.from(versionWithLabels.values(), value => value.version).filter(
+      version => isVersionSelected(selection, version)
+    )
+  )
+
+  const singleVersionSelected = selectedVersions.size === 1
+
   return (
     <>
       {versionWithLabels.map(({ version, labels }) => {
-        const selected = isVersionSelected(selection, version)
+        const selected = selectedVersions.has(version)
 
         // first label
         const fromVTimestamp = isoToUnix(labels[labels.length - 1].created_at)
@@ -38,7 +47,7 @@ function LabelsList() {
             fromVTimestamp={fromVTimestamp}
             toVTimestamp={toVTimestamp}
             selected={selected}
-            selectable
+            selectable={!(singleVersionSelected && selected)}
           >
             <div className="history-version-main-details">
               {labels.map(label => (
diff --git a/services/web/frontend/stylesheets/app/editor/history-react.less b/services/web/frontend/stylesheets/app/editor/history-react.less
index 3a33b4bffe..09c11869dd 100644
--- a/services/web/frontend/stylesheets/app/editor/history-react.less
+++ b/services/web/frontend/stylesheets/app/editor/history-react.less
@@ -99,14 +99,18 @@ history-root {
     padding-top: 8px;
     padding-bottom: 8px;
 
-    &.history-version-selectable:hover {
+    &.history-version-selectable {
       cursor: pointer;
-      background-color: @neutral-10;
-    }
-  }
 
-  .history-version-selected {
-    background-color: @green-10;
+      &:hover {
+        background-color: @neutral-10;
+      }
+    }
+
+    &.history-version-selected,
+    &.history-version-selected.history-version-selectable:hover {
+      background-color: @green-10;
+    }
   }
 
   .history-version-metadata-time {