ui: display AlgorithmicDetection component if method_type is code

StamusNetworks · Jun 12, 2024 · dc805b2 · dc805b2
1 parent b2a3204
commit dc805b2
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 6 deletions.
diff --git a/ui/app/RulePage.js b/ui/app/RulePage.js
@@ -9,6 +9,7 @@ import styled from 'styled-components';
 
 import * as config from 'config/Api';
 import { buildQFilter } from 'ui/buildQFilter';
+import { AlgorithmicDetection } from 'ui/components/AlgorithmicDetection';
 import EventValue from 'ui/components/EventValue';
 import { MethodTitle } from 'ui/components/Flow/MethodTitle';
 import RuleEditKebab from 'ui/components/RuleEditKebab';
@@ -198,10 +199,14 @@ class RulePage extends React.Component {
               {!isEmpty(this.state.rule.method) && <MethodTitle method={this.state.rule.method} />}
 
               <div>
-                <div style={{ display: 'grid', gridTemplateColumns: '1fr max-content', gridGap: '10px', marginBottom: '10px' }}>
-                  {this.state.rule?.versions?.length === 1 && <Signature rule={this.state.rule.versions[0]} />}
-                  {this.state.rule?.versions?.length > 1 && <Tabs defaultActiveKey="1" items={items} />}
-                </div>
+                {this.state.rule?.method?.method_type === 'code' ? (
+                  <AlgorithmicDetection rule={this.state.rule} />
+                ) : (
+                  <div style={{ display: 'grid', gridTemplateColumns: '1fr max-content', gridGap: '10px', marginBottom: '10px' }}>
+                    {this.state.rule?.versions?.length === 1 && <Signature rule={this.state.rule.versions[0]} />}
+                    {this.state.rule?.versions?.length > 1 && <Tabs defaultActiveKey="1" items={items} />}
+                  </div>
+                )}
 
                 {this.state.rule.timeline && <SignatureTimeline sid={this.state.sid} />}
 

diff --git a/ui/app/components/ExpandedSignature/index.js b/ui/app/components/ExpandedSignature/index.js
@@ -4,6 +4,7 @@ import { Empty, Tabs } from 'antd';
 import PropTypes from 'prop-types';
 import styled from 'styled-components';
 
+import { AlgorithmicDetection } from 'ui/components/AlgorithmicDetection';
 import EventValue from 'ui/components/EventValue';
 import { Signature } from 'ui/components/Signature';
 import UICard from 'ui/components/UIElements/UICard';
@@ -97,8 +98,14 @@ export const ExpandedSignature = ({ rule, Flow, MethodTitle, additionalCards = [
   return (
     <div style={{ width: 'calc(100vw - 271px)' }}>
       {MethodTitle}
-      {rule.versions?.length === 1 && <Signature rule={rule.versions[0]} key={rule.versions[0].id} />}
-      {rule.versions?.length > 1 && <Tabs defaultActiveKey="1" items={items} />}
+      {rule.method?.method_type === 'code' ? (
+        <AlgorithmicDetection rule={rule} />
+      ) : (
+        <>
+          {rule.versions?.length === 1 && <Signature rule={rule.versions[0]} key={rule.versions[0].id} />}
+          {rule.versions?.length > 1 && <Tabs defaultActiveKey="1" items={items} />}
+        </>
+      )}
       <SignatureTimeline sid={rule.sid} />
       <Row>
         {cards.map(card => (