Nav fixes

Author: ssalinas

SingularityService/src/main/java/com/hubspot/singularity/config/UIConfiguration.java

@@ -43,6 +43,9 @@ public static RootUrlMode parse(String value) {
   @JsonProperty
   private Optional<String> navColor = Optional.empty();
 
+  @JsonProperty
+  private List<UINavLinkConfiguration> formattedNavLinks = Collections.emptyList();
+
   @JsonProperty
   private String baseUrl;
 
@@ -109,6 +112,7 @@ public static RootUrlMode parse(String value) {
 
   // e.g. {"QA": "https://singularity-qa.my-paas.net", "Production": "https://singularity-prod.my-paas.net"}
   @JsonProperty
+  @Deprecated
   private Map<String, String> navTitleLinks = Collections.emptyMap();
 
   @JsonProperty
@@ -351,4 +355,12 @@ public Optional<String> getCostsApiUrlFormat() {
   public void setCostsApiUrlFormat(Optional<String> costsApiUrlFormat) {
     this.costsApiUrlFormat = costsApiUrlFormat;
   }
+
+  public List<UINavLinkConfiguration> getFormattedNavLinks() {
+    return formattedNavLinks;
+  }
+
+  public void setFormattedNavLinks(List<UINavLinkConfiguration> formattedNavLinks) {
+    this.formattedNavLinks = formattedNavLinks;
+  }
 }

SingularityService/src/main/java/com/hubspot/singularity/config/UINavLinkConfiguration.java

@@ -0,0 +1,46 @@
+package com.hubspot.singularity.config;
+
+import com.fasterxml.jackson.annotation.JsonIgnoreProperties;
+import javax.annotation.Nullable;
+import javax.validation.constraints.NotNull;
+
+@JsonIgnoreProperties(ignoreUnknown = true)
+public class UINavLinkConfiguration {
+  private String title;
+  private String linkFormat;
+  private Boolean divider = false;
+  private String tooltip;
+
+  public String getTitle() {
+    return title;
+  }
+
+  public void setTitle(String title) {
+    this.title = title;
+  }
+
+  public String getLinkFormat() {
+    return linkFormat;
+  }
+
+  public void setLinkFormat(String linkFormat) {
+    this.linkFormat = linkFormat;
+  }
+
+  public Boolean getDivider() {
+    return divider;
+  }
+
+  public void setDivider(Boolean divider) {
+    this.divider = divider;
+  }
+
+  @Nullable
+  public String getTooltip() {
+    return tooltip;
+  }
+
+  public void setTooltip(@Nullable String tooltip) {
+    this.tooltip = tooltip;
+  }
+}

SingularityService/src/main/java/com/hubspot/singularity/views/IndexView.java

@@ -171,7 +171,7 @@ public IndexView(
     }
 
     try {
-      this.navTitleLinks = ow.writeValueAsString(uiConfiguration.getNavTitleLinks());
+      this.navTitleLinks = ow.writeValueAsString(uiConfiguration.getFormattedNavLinks());
     } catch (JsonProcessingException e) {
       throw new RuntimeException(e);
     }

SingularityUI/app/components/common/Navigation.jsx

@@ -6,6 +6,8 @@ import classnames from 'classnames';
 import Utils from '../../utils';
 
 import { Glyphicon } from 'react-bootstrap';
+import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger';
+import ToolTip from 'react-bootstrap/lib/Tooltip';
 
 function handleSearchClick(event, toggleGlobalSearch) {
   event.preventDefault();
@@ -58,11 +60,29 @@ const Navigation = (props) => {
             {config.title} <span className="caret" />
           </a>
           <ul className="dropdown-menu">
-            {Object.keys(config.navTitleLinks).map((linkTitle, index) =>
-              <li key={index}>
-                <a href={config.navTitleLinks[linkTitle].replace('{CURRENT_PATH}', currentPathForLink(props.location.pathname))}>{linkTitle}</a>
-              </li>
-            )}
+            {config.navTitleLinks.map((linkConfig, index) => {
+              if (linkConfig['divider']) {
+                return (<li key={index} role="separator" className="divider"></li>);
+              }
+              let link = (<a href={linkConfig['linkFormat'].replace('{CURRENT_PATH}', currentPathForLink(props.location.pathname))}>{linkConfig['title']}</a>);
+              if ('tooltip' in linkConfig) {
+                const tooltip = (
+                  <ToolTip id="view-nav-tip">
+                    {linkConfig['tooltip']}
+                  </ToolTip>
+                );
+                link = (
+                  <OverlayTrigger  placement="right" id="view-nav-tip-overlay" overlay={tooltip}>
+                    {link}
+                  </OverlayTrigger>
+                );
+              }
+              return (
+                <li key={index}>
+                  {link}
+                </li>
+              );
+            })}
           </ul>
         </li>
       </ul>