Skip to content

Commit

Permalink
[SecuritySolution] Align no indices state with Kibana dashboard (#155990
Browse files Browse the repository at this point in the history
)

## Summary

Steps to reproduce:
1. Make sure you have some data in Security Data View. Create a
dashboard that consumes Security Data View, save it and add a `Security
Solution` tag.
2. Delete the non-empty indices in Security Data View
3. Back to SecuritySolution > Dashboards, select the dashboard you
added.
4. This is the current indices not found UI you'd see:
<img width="2546" alt="dashboard_view_indices_notfound"
src="https://user-images.githubusercontent.com/6295984/234829440-842442e1-f09a-464e-a6c0-8761a3124791.png">

Expected:
- We should align the behaviour with Kibana dashboard when indices not
found:

<img width="2555" alt="Screenshot 2023-04-27 at 10 48 26"
src="https://user-images.githubusercontent.com/6295984/234829379-251fb621-e7cd-4788-a682-8a2bce25312a.png">

After:
<img width="2542" alt="Screenshot 2023-04-27 at 11 10 16"
src="https://user-images.githubusercontent.com/6295984/234832003-95f5c7e5-57d9-4424-b591-f512f365cda2.png">

(cherry picked from commit 12277ac)
  • Loading branch information
angorayc committed May 2, 2023
1 parent 9dda7ec commit ac651bd
Show file tree
Hide file tree
Showing 3 changed files with 6 additions and 33 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -38,20 +38,4 @@ describe('useDashboardViewPromptState', () => {
}
`);
});

it('returns IndicesNotFound state', () => {
const { result } = renderHook<
DashboardViewPromptState | null,
Partial<EuiEmptyPromptProps> | null
>(() => useDashboardViewPromptState(DashboardViewPromptState.IndicesNotFound));
expect(result.current).toMatchInlineSnapshot(`
Object {
"color": "danger",
"iconType": "error",
"title": <h2>
Indices not found
</h2>,
}
`);
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ import * as i18n from '../pages/details/translations';

export enum DashboardViewPromptState {
NoReadPermission = 'NoReadPermission',
IndicesNotFound = 'IndicesNotFound',
}

const dashboardViewPromptState: Record<DashboardViewPromptState, Partial<EuiEmptyPromptProps>> = {
Expand All @@ -21,11 +20,6 @@ const dashboardViewPromptState: Record<DashboardViewPromptState, Partial<EuiEmpt
title: <h2>{i18n.DASHBOARD_NO_READ_PERMISSION_TITLE}</h2>,
body: <p>{i18n.DASHBOARD_NO_READ_PERMISSION_DESCRIPTION}</p>,
},
[DashboardViewPromptState.IndicesNotFound]: {
color: 'danger',
iconType: 'error',
title: <h2>{i18n.DASHBOARD_INDICES_NOT_FOUND_TITLE}</h2>,
},
};

export const useDashboardViewPromptState = (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* 2.0.
*/

import React, { useState, useCallback, useEffect, useMemo } from 'react';
import React, { useState, useCallback, useMemo } from 'react';
import { LEGACY_DASHBOARD_APP_ID } from '@kbn/dashboard-plugin/public';
import type { DashboardAPI } from '@kbn/dashboard-plugin/public';

Expand Down Expand Up @@ -49,8 +49,9 @@ const DashboardViewComponent: React.FC = () => {

const { show: canReadDashboard, showWriteControls } =
useCapabilities<DashboardCapabilities>(LEGACY_DASHBOARD_APP_ID);
const [currentState, setCurrentState] = useState<DashboardViewPromptState | null>(
canReadDashboard ? null : DashboardViewPromptState.NoReadPermission
const errorState = useMemo(
() => (canReadDashboard ? null : DashboardViewPromptState.NoReadPermission),
[canReadDashboard]
);
const [dashboardDetails, setDashboardDetails] = useState<DashboardDetails | undefined>();
const onDashboardContainerLoaded = useCallback((dashboard: DashboardAPI) => {
Expand All @@ -67,12 +68,6 @@ const DashboardViewComponent: React.FC = () => {
const dashboardExists = useMemo(() => dashboardDetails != null, [dashboardDetails]);
const { detailName: savedObjectId } = useParams<{ detailName?: string }>();

useEffect(() => {
if (!indicesExist) {
setCurrentState(DashboardViewPromptState.IndicesNotFound);
}
}, [indicesExist]);

return (
<>
{indicesExist && (
Expand All @@ -92,7 +87,7 @@ const DashboardViewComponent: React.FC = () => {
)}
</HeaderPage>

{indicesExist && (
{!errorState && (
<DashboardRenderer
query={query}
filters={filters}
Expand All @@ -104,7 +99,7 @@ const DashboardViewComponent: React.FC = () => {
/>
)}

<StatusPropmpt currentState={currentState} />
<StatusPropmpt currentState={errorState} />
<SpyRoute
pageName={SecurityPageName.dashboards}
state={{ dashboardName: dashboardDetails?.title }}
Expand Down

0 comments on commit ac651bd

Please sign in to comment.