From da8bc416c2aa42bbda62c46d500a1b028b9efd97 Mon Sep 17 00:00:00 2001
From: Alexander Zobnin <alexanderzobnin@gmail.com>
Date: Thu, 27 Dec 2018 19:19:17 +0300
Subject: [PATCH] problems: handle tag click in table view

---
 src/panel-triggers/components/Problems.tsx | 26 +++++++++++++++++-----
 1 file changed, 20 insertions(+), 6 deletions(-)

diff --git a/src/panel-triggers/components/Problems.tsx b/src/panel-triggers/components/Problems.tsx
index bc2fe22..a25b752 100644
--- a/src/panel-triggers/components/Problems.tsx
+++ b/src/panel-triggers/components/Problems.tsx
@@ -71,7 +71,9 @@ export class ProblemList extends PureComponent<ProblemListProps, ProblemListStat
       },
       { Header: 'Status', accessor: 'value', show: options.statusField, width: 100, Cell: statusCell },
       { Header: 'Problem', accessor: 'description', minWidth: 200, Cell: ProblemCell},
-      { Header: 'Tags', accessor: 'tags', show: options.showTags, className: 'problem-tags', Cell: TagCell },
+      { Header: 'Tags', accessor: 'tags', show: options.showTags, className: 'problem-tags',
+        Cell: props => <TagCell {...props} onTagClick={this.handleTagClick} />
+      },
       { Header: 'Time', className: 'last-change', width: timeColWidth,
         accessor: 'lastchangeUnix',
         id: 'lastchange',
@@ -192,11 +194,23 @@ function ProblemCell(props: RTCell<Trigger>) {
   );
 }
 
-function TagCell(props: RTCell<Trigger>) {
-  const tags = props.value || [];
-  return [
-    tags.map(tag => <EventTag key={tag.tag + tag.value} tag={tag} />)
-  ];
+interface TagCellProps extends RTCell<Trigger> {
+  onTagClick: (tag: ZBXTag, datasource: string) => void;
+}
+
+class TagCell extends PureComponent<TagCellProps> {
+  handleTagClick = (tag: ZBXTag) => {
+    if (this.props.onTagClick) {
+      this.props.onTagClick(tag, this.props.original.datasource);
+    }
+  }
+
+  render() {
+    const tags = this.props.value || [];
+    return [
+      tags.map(tag => <EventTag key={tag.tag + tag.value} tag={tag} onClick={this.handleTagClick} /> )
+    ];
+  }
 }
 
 function CustomExpander(props: RTCell<any>) {