From 7da2c66200e78bc41ffe099b899b4f19f1452cfb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= <l.mierzwa@gmail.com>
Date: Sat, 8 Sep 2018 23:28:10 +0100
Subject: [PATCH 1/2] feat(ui): add source links in the alert action menu

---
 .../Grid/AlertGrid/AlertGroup/Alert/AlertMenu.js    | 13 +++++++++++++
 .../AlertGrid/AlertGroup/Alert/AlertMenu.test.js    |  6 ++++++
 2 files changed, 19 insertions(+)

diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.js b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.js
index 54338edc4..a2bcf5871 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.js
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.js
@@ -42,6 +42,19 @@ const MenuContent = onClickOutside(
         >
           <FontAwesomeIcon icon={faBellSlash} /> Silence this alert
         </div>
+        <h6 className="dropdown-header">Alert source links:</h6>
+        {alert.alertmanager.map(am => (
+          <a
+            key={am.name}
+            className="dropdown-item"
+            href={am.source}
+            target="_blank"
+            rel="noopener noreferrer"
+            onClick={afterClick}
+          >
+            {am.name}
+          </a>
+        ))}
       </div>
     );
   }
diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.test.js b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.test.js
index fe1d72076..963e67be6 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.test.js
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.test.js
@@ -74,4 +74,10 @@ describe("<MenuContent />", () => {
     button.simulate("click");
     expect(silenceFormStore.toggle.visible).toBe(true);
   });
+
+  it("source link points at alert source", () => {
+    const tree = MountedMenuContent(group);
+    const link = tree.find("a.dropdown-item[href='localhost/prometheus']");
+    expect(link.text()).toBe("default");
+  });
 });

From 26abcc632b86f1ece351005ed48c2c8408d88340 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= <l.mierzwa@gmail.com>
Date: Sat, 8 Sep 2018 23:35:21 +0100
Subject: [PATCH 2/2] fix(ui): pass unique class to alert action button, so
 clicking it doesn't trigger click outside handler

---
 .../Grid/AlertGrid/AlertGroup/Alert/AlertMenu.js         | 9 ++++++++-
 .../AlertGroup/Alert/__snapshots__/index.test.js.snap    | 2 +-
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.js b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.js
index a2bcf5871..eadb02bdd 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.js
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.js
@@ -4,6 +4,8 @@ import PropTypes from "prop-types";
 import { action, observable } from "mobx";
 import { observer } from "mobx-react";
 
+import hash from "object-hash";
+
 import { Manager, Reference, Popper } from "react-popper";
 import onClickOutside from "react-onclickoutside";
 
@@ -97,12 +99,16 @@ const AlertMenu = observer(
     render() {
       const { group, alert, silenceFormStore } = this.props;
 
+      const uniqueClass = `components-grid-alert-${group.id}-${hash(
+        alert.labels
+      )}`;
+
       return (
         <Manager>
           <Reference>
             {({ ref }) => (
               <span
-                className="components-label-with-hover text-nowrap text-truncate px-1 mr-1 badge badge-secondary cursor-pointer"
+                className={`components-label-with-hover text-nowrap text-truncate px-1 mr-1 badge badge-secondary cursor-pointer ${uniqueClass}`}
                 ref={ref}
                 onClick={this.collapse.toggle}
                 data-toggle="dropdown"
@@ -134,6 +140,7 @@ const AlertMenu = observer(
                   silenceFormStore={silenceFormStore}
                   afterClick={this.collapse.hide}
                   handleClickOutside={this.collapse.hide}
+                  outsideClickIgnoreClass={uniqueClass}
                 />
               )}
             </Popper>
diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/__snapshots__/index.test.js.snap b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/__snapshots__/index.test.js.snap
index cb879ad25..22eb955a9 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/__snapshots__/index.test.js.snap
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/__snapshots__/index.test.js.snap
@@ -42,7 +42,7 @@ exports[`<Alert /> matches snapshot with showAlertmanagers=false showReceiver=fa
       hidden
     </div>
   </div>
-  <span class=\\"components-label-with-hover text-nowrap text-truncate px-1 mr-1 badge badge-secondary cursor-pointer\\"
+  <span class=\\"components-label-with-hover text-nowrap text-truncate px-1 mr-1 badge badge-secondary cursor-pointer components-grid-alert-undefined-0988cb349635341c67d91bfe3454d2b3178c443c\\"
         data-toggle=\\"dropdown\\"
   >
     <svg aria-hidden=\\"true\\"