Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[SLO] use generic edit actions in the SLO embeddables #186374

Merged
merged 11 commits into from
Jun 21, 2024
Merged

[SLO] use generic edit actions in the SLO embeddables #186374

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
56db7f8
use generic edit actions for the overview embeddable
mgiota Jun 18, 2024
4e78980
use generic edit actions in the alerts embeddable
mgiota Jun 18, 2024
b2af9c8
Merge branch 'main' into generic_edit_actions
mgiota Jun 19, 2024
59f24da
fix types
mgiota Jun 19, 2024
a6f7b6a
Merge branch 'main' into generic_edit_actions
mgiota Jun 19, 2024
23735df
Merge branch 'main' of github.com:elastic/kibana into generic_edit_ac…
mgiota Jun 20, 2024
88ab22a
remove inline edit criteria link from the overview embeddable
mgiota Jun 20, 2024
f5ebb19
removed unused stuff
mgiota Jun 20, 2024
7d5892a
Merge branch 'main' into generic_edit_actions
kibanamachine Jun 21, 2024
8aa6e81
fix e2e tests
mgiota Jun 21, 2024
9b778d1
Merge branch 'main' into generic_edit_actions
kibanamachine Jun 21, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
35 changes: 33 additions & 2 deletions ...observability_solution/slo/public/embeddable/slo/alerts/slo_alerts_embeddable_factory.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,10 @@ import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { createBrowserHistory } from 'history';
import { Storage } from '@kbn/kibana-utils-plugin/public';
import type { StartServicesAccessor } from '@kbn/core-lifecycle-browser';
import { SLO_ALERTS_EMBEDDABLE_ID } from './constants';
import { SloEmbeddableDeps, SloAlertsEmbeddableState, SloAlertsApi } from './types';
import { SloAlertsEmbeddableState, SloAlertsApi } from './types';
import { SloPublicPluginsStart, SloPublicStart } from '../../../types';
import { SloAlertsWrapper } from './slo_alerts_wrapper';
const history = createBrowserHistory();
const queryClient = new QueryClient();
Expand All @@ -32,13 +34,33 @@ export const getAlertsPanelTitle = () =>
defaultMessage: 'SLO Alerts',
});

export function getAlertsEmbeddableFactory(deps: SloEmbeddableDeps, kibanaVersion: string) {
export function getAlertsEmbeddableFactory(
getStartServices: StartServicesAccessor<SloPublicPluginsStart, SloPublicStart>,
kibanaVersion: string
) {
const factory: ReactEmbeddableFactory<SloAlertsEmbeddableState, SloAlertsApi> = {
type: SLO_ALERTS_EMBEDDABLE_ID,
deserializeState: (state) => {
return state.rawState as SloAlertsEmbeddableState;
},
buildEmbeddable: async (state, buildApi, uuid, parentApi) => {
const [coreStart, pluginStart] = await getStartServices();
const deps = { ...coreStart, ...pluginStart };
async function onEdit() {
try {
const { openSloConfiguration } = await import('./slo_alerts_open_configuration');

const result = await openSloConfiguration(
coreStart,
pluginStart,
api.getSloAlertsConfig()
);
api.updateSloAlertsConfig(result);
} catch (e) {
return Promise.reject();
}
}

const { titlesApi, titleComparators, serializeTitles } = initializeTitles(state);
const defaultTitle$ = new BehaviorSubject<string | undefined>(getAlertsPanelTitle());
const slos$ = new BehaviorSubject(state.slos);
Expand All @@ -48,6 +70,14 @@ export function getAlertsEmbeddableFactory(deps: SloEmbeddableDeps, kibanaVersio
{
...titlesApi,
defaultPanelTitle: defaultTitle$,
getTypeDisplayName: () =>
i18n.translate('xpack.slo.editSloAlertswEmbeddable.typeDisplayName', {
defaultMessage: 'configuration',
}),
isEditingEnabled: () => true,
onEdit: async () => {
onEdit();
},
serializeState: () => {
return {
rawState: {
Expand Down Expand Up @@ -112,6 +142,7 @@ export function getAlertsEmbeddableFactory(deps: SloEmbeddableDeps, kibanaVersio
<Router history={history}>
<QueryClientProvider client={queryClient}>
<SloAlertsWrapper
onEdit={onEdit}
embeddable={api}
deps={deps}
slos={slos}
Expand Down
12 changes: 3 additions & 9 deletions ...ck/plugins/observability_solution/slo/public/embeddable/slo/alerts/slo_alerts_wrapper.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,6 @@ import { FormattedMessage } from '@kbn/i18n-react';
import { i18n } from '@kbn/i18n';
import { EuiFlexGroup, EuiFlexItem, EuiLink } from '@elastic/eui';
import type { TimeRange } from '@kbn/es-query';
import { CONTEXT_MENU_TRIGGER } from '@kbn/embeddable-plugin/public';
import { ActionExecutionContext } from '@kbn/ui-actions-plugin/public';
import { Subject } from 'rxjs';
import styled from 'styled-components';
import { observabilityPaths } from '@kbn/observability-plugin/common';
Expand All @@ -19,16 +17,15 @@ import { SloIncludedCount } from './components/slo_included_count';
import { SloAlertsSummary } from './components/slo_alerts_summary';
import { SloAlertsTable } from './components/slo_alerts_table';
import type { SloItem, SloEmbeddableDeps } from './types';
import { EDIT_SLO_ALERTS_ACTION } from '../../../ui_actions/edit_slo_alerts_panel';

interface Props {
deps: SloEmbeddableDeps;
slos: SloItem[];
timeRange: TimeRange;
embeddable: any;
onRenderComplete?: () => void;
reloadSubject: Subject<FetchContext>;
showAllGroupByInstances?: boolean;
onEdit: () => void;
}

export function SloAlertsWrapper({
Expand All @@ -39,6 +36,7 @@ export function SloAlertsWrapper({
onRenderComplete,
reloadSubject,
showAllGroupByInstances,
onEdit,
}: Props) {
const {
application: { navigateToUrl },
Expand Down Expand Up @@ -102,11 +100,7 @@ export function SloAlertsWrapper({
<EuiFlexItem grow={false}>
<EuiLink
onClick={() => {
const trigger = deps.uiActions.getTrigger(CONTEXT_MENU_TRIGGER);
deps.uiActions.getAction(EDIT_SLO_ALERTS_ACTION).execute({
trigger,
embeddable,
} as ActionExecutionContext);
onEdit();
}}
data-test-subj="o11ySloAlertsWrapperSlOsIncludedLink"
>
Expand Down
4 changes: 3 additions & 1 deletion x-pack/plugins/observability_solution/slo/public/embeddable/slo/alerts/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ import {
PublishesWritablePanelTitle,
PublishesPanelTitle,
EmbeddableApiContext,
HasEditCapabilities,
} from '@kbn/presentation-publishing';

export interface SloItem {
Expand All @@ -45,7 +46,8 @@ export type SloAlertsEmbeddableState = SerializedTitles & EmbeddableSloProps;
export type SloAlertsApi = DefaultEmbeddableApi<SloAlertsEmbeddableState> &
PublishesWritablePanelTitle &
PublishesPanelTitle &
HasSloAlertsConfig;
HasSloAlertsConfig &
HasEditCapabilities;

export interface HasSloAlertsConfig {
getSloAlertsConfig: () => EmbeddableSloProps;
Expand Down
46 changes: 31 additions & 15 deletions ...gins/observability_solution/slo/public/embeddable/slo/overview/slo_embeddable_factory.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,32 +16,44 @@ import {
fetch$,
} from '@kbn/presentation-publishing';
import { BehaviorSubject, Subject } from 'rxjs';
import { CONTEXT_MENU_TRIGGER } from '@kbn/embeddable-plugin/public';
import { ActionExecutionContext } from '@kbn/ui-actions-plugin/public';
import type { StartServicesAccessor } from '@kbn/core-lifecycle-browser';
import { SLO_OVERVIEW_EMBEDDABLE_ID } from './constants';
import { SloCardChartList } from './slo_overview_grid';
import { SloOverview } from './slo_overview';
import { GroupSloView } from './group_view/group_view';
import {
SloOverviewEmbeddableState,
SloEmbeddableDeps,
SloOverviewApi,
GroupSloCustomInput,
} from './types';
import { EDIT_SLO_OVERVIEW_ACTION } from '../../../ui_actions/edit_slo_overview_panel';
import { SloOverviewEmbeddableState, SloOverviewApi, GroupSloCustomInput } from './types';
import { SloPublicPluginsStart, SloPublicStart } from '../../../types';
import { SloEmbeddableContext } from '../common/slo_embeddable_context';

export const getOverviewPanelTitle = () =>
i18n.translate('xpack.slo.sloEmbeddable.displayName', {
defaultMessage: 'SLO Overview',
});
export const getOverviewEmbeddableFactory = (deps: SloEmbeddableDeps) => {
export const getOverviewEmbeddableFactory = (
getStartServices: StartServicesAccessor<SloPublicPluginsStart, SloPublicStart>
) => {
const factory: ReactEmbeddableFactory<SloOverviewEmbeddableState, SloOverviewApi> = {
type: SLO_OVERVIEW_EMBEDDABLE_ID,
deserializeState: (state) => {
return state.rawState as SloOverviewEmbeddableState;
},
buildEmbeddable: async (state, buildApi, uuid, parentApi) => {
const [coreStart, pluginStart] = await getStartServices();
const deps = { ...coreStart, ...pluginStart };
async function onEdit() {
try {
const { openSloConfiguration } = await import('./slo_overview_open_configuration');

const result = await openSloConfiguration(
coreStart,
pluginStart,
api.getSloGroupOverviewConfig()
);
api.updateSloGroupOverviewConfig(result as GroupSloCustomInput);
} catch (e) {
return Promise.reject();
}
}
const { titlesApi, titleComparators, serializeTitles } = initializeTitles(state);
const defaultTitle$ = new BehaviorSubject<string | undefined>(getOverviewPanelTitle());
const sloId$ = new BehaviorSubject(state.sloId);
Expand All @@ -56,6 +68,14 @@ export const getOverviewEmbeddableFactory = (deps: SloEmbeddableDeps) => {
{
...titlesApi,
defaultPanelTitle: defaultTitle$,
getTypeDisplayName: () =>
i18n.translate('xpack.slo.editSloOverviewEmbeddableTitle.typeDisplayName', {
defaultMessage: 'criteria',
}),
isEditingEnabled: () => api.getSloGroupOverviewConfig().overviewMode === 'groups',
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ThomThomson Before I was using a custom action with an isCompatible method. Now that I removed the custom action I check only for the overviewMode to decide if editing is enabled, which is specific to the logic of the embeddable.

Do I need to do the rest checks I was doing here as well?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No you don't need to do those checks anymore! Those checks were there to prevent other embeddables from ending up with the edit SLO overview action, but now that it's using a generic action that isn't a risk.

onEdit: async () => {
onEdit();
},
serializeState: () => {
return {
rawState: {
Expand Down Expand Up @@ -142,11 +162,7 @@ export const getOverviewEmbeddableFactory = (deps: SloEmbeddableDeps) => {
<EuiFlexItem grow={false}>
<EuiLink
onClick={() => {
const trigger = deps.uiActions.getTrigger(CONTEXT_MENU_TRIGGER);
deps.uiActions.getAction(EDIT_SLO_OVERVIEW_ACTION).execute({
trigger,
embeddable: api,
} as ActionExecutionContext);
onEdit();
}}
data-test-subj="o11ySloOverviewEditCriteriaLink"
>
Expand Down
4 changes: 3 additions & 1 deletion x-pack/plugins/observability_solution/slo/public/embeddable/slo/overview/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import {
SerializedTitles,
PublishesWritablePanelTitle,
PublishesPanelTitle,
HasEditCapabilities,
} from '@kbn/presentation-publishing';
import type { EmbeddableApiContext } from '@kbn/presentation-publishing';
import { DefaultEmbeddableApi } from '@kbn/embeddable-plugin/public';
Expand Down Expand Up @@ -53,7 +54,8 @@ export type SloOverviewEmbeddableState = SerializedTitles &
export type SloOverviewApi = DefaultEmbeddableApi<SloOverviewEmbeddableState> &
PublishesWritablePanelTitle &
PublishesPanelTitle &
HasSloGroupOverviewConfig;
HasSloGroupOverviewConfig &
HasEditCapabilities;

export interface HasSloGroupOverviewConfig {
getSloGroupOverviewConfig: () => GroupSloCustomInput;
Expand Down
4 changes: 2 additions & 2 deletions x-pack/plugins/observability_solution/slo/public/plugin.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -112,7 +112,7 @@ export class SloPlugin
const { getOverviewEmbeddableFactory } = await import(
'./embeddable/slo/overview/slo_embeddable_factory'
);
return getOverviewEmbeddableFactory(deps);
return getOverviewEmbeddableFactory(coreSetup.getStartServices);
}
);

Expand All @@ -125,7 +125,7 @@ export class SloPlugin
'./embeddable/slo/alerts/slo_alerts_embeddable_factory'
);

return getAlertsEmbeddableFactory(deps, kibanaVersion);
return getAlertsEmbeddableFactory(coreSetup.getStartServices, kibanaVersion);
}
);

Expand Down
75 changes: 0 additions & 75 deletions x-pack/plugins/observability_solution/slo/public/ui_actions/edit_slo_alerts_panel.tsx
View file
Open in desktop

This file was deleted.

Loading