[Fit&Finish] Security analytics overview page (#1175) (#1179)

* fit&finish * add width for recent threat alerts card * fix typo --------- (cherry picked from commit 076d1ef) Signed-off-by: Hailong Cui <[email protected]> Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
opensearch-project · Oct 10, 2024 · 27ac0fa · 27ac0fa
1 parent c19e0ed
commit 27ac0fa
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 4 deletions.
diff --git a/public/pages/Overview/containers/Overview/Overview.tsx b/public/pages/Overview/containers/Overview/Overview.tsx
@@ -39,8 +39,10 @@ import { OverviewProps, OverviewState, OverviewViewModel } from '../../../../../
 import { setBreadcrumbs } from '../../../../utils/helpers';
 import { PageHeader } from '../../../../components/PageHeader/PageHeader';
 import { getOverviewStatsProps, getOverviewsCardsProps } from '../../utils/constants';
-import { getUseUpdatedUx } from '../../../../services/utils/constants';
+import { getChrome, getUseUpdatedUx } from '../../../../services/utils/constants';
 import { RecentThreatIntelFindingsWidget } from '../../components/Widgets/RecentThreatIntelFindingsWidget';
+import { useObservable } from 'react-use';
+import { SECURITY_ANALYTICS_USE_CASE_ID } from '../../../../../../../src/core/public';
 
 export const Overview: React.FC<OverviewProps> = (props) => {
   const {
@@ -101,15 +103,17 @@ export const Overview: React.FC<OverviewProps> = (props) => {
     () => new OverviewViewModelActor(saContext?.services, context?.notifications!),
     [saContext?.services, context]
   );
+  const currentNavGroup = useObservable(getChrome().navGroup.getCurrentNavGroup$());
+  const isSecurityAnalyticsUseCase = currentNavGroup?.id === SECURITY_ANALYTICS_USE_CASE_ID;
 
   useEffect(() => {
-    setBreadcrumbs([BREADCRUMBS.OVERVIEW]);
+    setBreadcrumbs(isSecurityAnalyticsUseCase ? [ BREADCRUMBS.OVERVIEW] : [{...BREADCRUMBS.OVERVIEW, text: 'Security Analytics overview'}]);
     overviewViewModelActor.registerRefreshHandler(updateState, true /* allowPartialResults */);
     overviewViewModelActor.registerRefreshHandler(
       onLoadingComplete,
       false /* allowPartialResults */
     );
-  }, []);
+  }, [isSecurityAnalyticsUseCase]);
 
   useEffect(() => {
     const abortController = new AbortController();
@@ -269,7 +273,7 @@ export const Overview: React.FC<OverviewProps> = (props) => {
             <EuiFlexGroup gutterSize="m">
               {getOverviewsCardsProps().map((p, idx) => (
                 <EuiFlexItem key={idx}>
-                  <EuiCard {...p} layout="vertical" textAlign="left" />
+                  <EuiCard {...p} layout="vertical" textAlign="left" titleElement='h4' titleSize='s'/>
                 </EuiFlexItem>
               ))}
             </EuiFlexGroup>

diff --git a/public/plugin.ts b/public/plugin.ts
@@ -42,6 +42,7 @@ import {
   setNavigationUI,
   setApplication,
   setBreadCrumbsSetter,
+  setChrome,
   setContentManagement,
   setDataSourceManagementPlugin,
   setNotifications,
@@ -261,6 +262,7 @@ export class SecurityAnalyticsPlugin
     setNavigationUI(navigation.ui);
     setApplication(core.application);
     setBreadCrumbsSetter(core.chrome.setBreadcrumbs);
+    setChrome(core.chrome);
     setContentManagement(contentManagement);
     setNotifications(core.notifications);
     setSavedObjectsClient(core.savedObjects.client);

diff --git a/public/services/utils/constants.ts b/public/services/utils/constants.ts
@@ -36,6 +36,10 @@ export const [getBreadCrumbsSetter, setBreadCrumbsSetter] = createGetterSetter<
   CoreStart['chrome']['setBreadcrumbs']
 >('breadCrumbSetter');
 
+export const [getChrome, setChrome] = createGetterSetter<
+  CoreStart['chrome']
+>('chrome');
+
 export const [getContentManagement, setContentManagement] = createGetterSetter<
   ContentManagementPluginStart
 >('contentManagement');

diff --git a/public/utils/helpers.tsx b/public/utils/helpers.tsx
@@ -701,6 +701,7 @@ export function registerThreatAlertsCard() {
           detectorService={getBrowserServices().detectorsService}
         />
       ),
+      width: 16,
     }),
   });
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -701,6 +701,7 @@ export function registerThreatAlertsCard() { @@
               detectorService={getBrowserServices().detectorsService}
             />
           ),
+          width: 16,
         }),
       });
     }
@@ Expand Down @@