Restore terminal branch hover behaviour

Hovering on terminal branches incorrectly displayed tip-specific
information rather than branch-specific. This was first noticed in
<#1752> as the mutations are
summarised differently for branches vs nodes.

This bug was introduced in 86b8527 and
this commit reverts some of the changes introduced there.

Closes the original issue described in
<#1752>, but comments in
that issue also identified a separate bug related to the branch-click
modal.

CHANGELOG.md

@@ -1,8 +1,8 @@
 # Changelog
 
-## version 2.52.0 - 2024/02/09
-
+* Bugfix: hovering on terminal branches now shows branch-specific rather than tip-specific information (bug introduced in 2.52.0). See [issue #1752](https://github.com/nextstrain/auspice/issues/1752) for more.
 
+## version 2.52.0 - 2024/02/09
 
 * Sidebar filtering now contains all non-continuous metadata defined across the tree (i.e. all data within `node.node_attrs`). The traits listed in `meta.filters` are now only used to determine which filters to list in the footer of the page. ([#1743](https://github.com/nextstrain/auspice/pull/1743))
 * The interaction between strain-selected modals and the corresponding strain-filter has been improved. We now preserve the strain filter state present before the node was clicked. ([#1749](https://github.com/nextstrain/auspice/issues/1749))

src/components/tree/infoPanels/hover.js

@@ -402,11 +402,12 @@ const HoverInfoPanel = ({
   t
 }) => {
   if (!selectedNode) return null
-  const node = selectedNode.n;
+  const node = selectedNode.node.n; // want the redux node, not the phylo node
   const idxOfInViewRootNode = getIdxOfInViewRootNode(node);
+
   return (
     <Container node={node} panelDims={panelDims}>
-      {node.hasChildren===false ? (
+      {selectedNode.isBranch===false ? (
         <>
           <StrainName name={node.name}/>
           <VaccineInfo node={node} t={t}/>

src/components/tree/reactD3Interface/callbacks.js

@@ -13,7 +13,9 @@ export const onTipHover = function onTipHover(d) {
     this.state.treeToo;
   phylotree.svg.select("#"+getDomId("tip", d.n.name))
     .attr("r", (e) => e["r"] + 4);
-  this.setState({hoveredNode: d});
+  this.setState({
+    hoveredNode: {node: d, isBranch: false}
+  });
 };
 
 export const onTipClick = function onTipClick(d) {
@@ -46,7 +48,9 @@ export const onBranchHover = function onBranchHover(d) {
   }
 
   /* Set the hovered state so that an info box can be displayed */
-  this.setState({hoveredNode: d});
+  this.setState({
+    hoveredNode: {node: d, isBranch: true}
+  });
 };
 
 export const onBranchClick = function onBranchClick(d) {