Make tags hyperlinks to mitre attack web pages in detection rules (#692)

* made rule tags links to mitre attack webpage Signed-off-by: Amardeepsingh Siglani <[email protected]> * updated workflow file Signed-off-by: Amardeepsingh Siglani <[email protected]> --------- Signed-off-by: Amardeepsingh Siglani <[email protected]>
opensearch-project · Sep 5, 2023 · c26b693 · c26b693
1 parent bdb0573
commit c26b693
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 6 deletions.
diff --git a/.github/workflows/cypress-workflow.yml b/.github/workflows/cypress-workflow.yml
@@ -9,7 +9,7 @@ on:
 env:
   OPENSEARCH_DASHBOARDS_VERSION: '2.9.0'
   OPENSEARCH_VERSION: '2.9.0-SNAPSHOT'
-  SECURITY_ANALYTICS_BRANCH: '2.x'
+  SECURITY_ANALYTICS_BRANCH: '2.9'
   GRADLE_VERSION: '7.6.1'
 
   # If this variable is not empty, the package.json, opensearch_dashboards.json, and yarn.lock files will be replaced

diff --git a/public/pages/Rules/components/RuleContentViewer/RuleContentViewer.tsx b/public/pages/Rules/components/RuleContentViewer/RuleContentViewer.tsx
@@ -129,11 +129,29 @@ export const RuleContentViewer: React.FC<RuleContentViewerProps> = ({
               gutterSize="s"
               data-test-subj={'rule_flyout_rule_tags'}
             >
-              {ruleData.tags.map((tag: any, i: number) => (
-                <EuiFlexItem grow={false} key={i}>
-                  <EuiBadge color={'#DDD'}>{tag.value}</EuiBadge>
-                </EuiFlexItem>
-              ))}
+              {ruleData.tags.map((tag: { value: string }, i: number) => {
+                const isLinkable = !!tag.value.match(/attack\.t[0-9]+/);
+                let tagComponent: React.ReactNode = tag.value;
+
+                if (isLinkable) {
+                  const link = `https://attack.mitre.org/techniques/${tag.value
+                    .split('.')
+                    .slice(1)
+                    .join('/')
+                    .toUpperCase()}`;
+                  tagComponent = (
+                    <EuiLink href={link} target="_blank">
+                      {tag.value}
+                    </EuiLink>
+                  );
+                }
+
+                return (
+                  <EuiFlexItem grow={false} key={i}>
+                    <EuiBadge color={'#DDD'}>{tagComponent}</EuiBadge>
+                  </EuiFlexItem>
+                );
+              })}
             </EuiFlexGroup>
           ) : (
             <div>{DEFAULT_EMPTY_DATA}</div>