Skip to content

Commit 37afbb5

Browse files
Share modal re-architecture (elastic#211665)
## Summary This PR attempts to rework the internals for how the share plugin works, and brings with it a slight modification to how configs are registered to the share plugin, with this PR the share plugin now defines the following share types i.e. `links`, `embeds` and `integrations`. As such native implementations (i.e. copy link and embed) provided by sharedUX remain internal to the share plugin. One might then ask what happens to the existing export functionality provided by the reporting plugin, in this PR the export functionality is now modelled as an integration that's simply grouped as an export, see the type definition for the Export type. Accompanying this change, a new method has been introduced `registerShareIntegration` that's similar to the previous method `register`, with a slight difference, in that now registered integrations can be scoped to a specific object type like so. ```ts share.registerShareIntegration('lens', { ... config: () => ({ someValue: 'This integration value can only be retrieved within the lens objectType scope' }) }) ``` The expected return type for config is defined by the user, as such the export integration type defines it's own expected type that suits the current implementation of the share modal. <!-- These aforementioned configs would then be automatically be made available under the property `shareMenuItems` by providing the object type value to the `useShareTabsContext`, like so; ```ts const { objectTypeMeta, shareMenuItems } = useShareTabsContext('integration', 'export') ``` because the share type of `integration` is provided alongside its `groupId`, `useShareTabsContext` will only provide data and config that applies specifically to the specific share type. The same would apply for `link` and `embed` with passing in the second option. --> Furthermore there's been a clean up with the config options that typically would be passed to the `toggleShareMenu` method, properties that are specific to a specific share type are now expected to be provided within the config property for that specific share type. ## How to test - This change is transparent to the user with all share functionality working as should, regardless respective teams should verify that all share behaviour work as expected. <!-- ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [ ] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md) - [ ] [Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html) was added for features that require explanation or tutorials - [ ] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [ ] If a plugin configuration key changed, check if it needs to be allowlisted in the cloud and added to the [docker list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker) - [ ] This was checked for breaking HTTP API changes, and any breaking changes have been approved by the breaking-change committee. The `release_note:breaking` label should be applied in these situations. - [ ] [Flaky Test Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was used on any tests changed - [ ] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) ### Identify risks Does this PR introduce any risks? For example, consider risks like hard to test bugs, performance regression, potential of data loss. Describe the risk, its severity, and mitigation for each identified risk. Invite stakeholders and evaluate how to proceed before merging. - [ ] [See some risk examples](https://github.com/elastic/kibana/blob/main/RISK_MATRIX.mdx) - [ ] ... --> --------- Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
1 parent 2210960 commit 37afbb5

34 files changed

Lines changed: 1169 additions & 611 deletions

File tree

src/platform/packages/private/kbn-reporting/public/share/index.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,11 @@
77
* License v3.0 only", or the "Server Side Public License, v 1".
88
*/
99

10-
export { reportingExportModalProvider } from './share_context_menu/register_pdf_png_modal_reporting';
11-
export { reportingCsvShareProvider as reportingCsvShareModalProvider } from './share_context_menu/register_csv_modal_reporting';
10+
export {
11+
reportingPDFExportProvider,
12+
reportingPNGExportProvider,
13+
} from './share_context_menu/register_pdf_png_modal_reporting';
14+
export { reportingCsvExportProvider } from './share_context_menu/register_csv_modal_reporting';
1215
export type { JobParamsProviderOptions, StartServices } from './share_context_menu';
1316
export { getSharedComponents } from './shared';
1417
export type { ReportingPublicComponents } from './shared';

src/platform/packages/private/kbn-reporting/public/share/share_context_menu/register_csv_modal_reporting.tsx

Lines changed: 58 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -13,21 +13,32 @@ import React from 'react';
1313
import { firstValueFrom } from 'rxjs';
1414
import type { SerializedSearchSourceFields } from '@kbn/data-plugin/common';
1515
import { FormattedMessage, InjectedIntl } from '@kbn/i18n-react';
16-
import { ShareContext, ShareMenuItemV2 } from '@kbn/share-plugin/public';
16+
import { ShareContext, type ExportShare } from '@kbn/share-plugin/public';
1717
import { LocatorParams } from '@kbn/reporting-common/types';
1818
import { getSearchCsvJobParams, CsvSearchModeParams } from '../shared/get_search_csv_job_params';
1919
import type { ExportModalShareOpts } from '.';
2020
import { checkLicense } from '../..';
2121

22-
export const reportingCsvShareProvider = ({
22+
export const reportingCsvExportProvider = ({
2323
apiClient,
2424
application,
2525
license,
2626
startServices$,
27-
}: ExportModalShareOpts) => {
28-
const getShareMenuItems = ({ objectType, sharingData, toasts }: ShareContext) => {
29-
if ('search' !== objectType) {
30-
return [];
27+
}: ExportModalShareOpts): ExportShare => {
28+
const getShareMenuItems = ({
29+
objectType,
30+
sharingData,
31+
toasts,
32+
}: ShareContext): ReturnType<ExportShare['config']> => {
33+
const licenseCheck = checkLicense(license.check('reporting', 'basic'));
34+
const licenseToolTipContent = licenseCheck.message;
35+
const licenseHasCsvReporting = licenseCheck.showLinks;
36+
const licenseDisabled = !licenseCheck.enableLinks;
37+
38+
const capabilityHasCsvReporting = application.capabilities.discover_v2?.generateCsv === true;
39+
40+
if (!(licenseHasCsvReporting && capabilityHasCsvReporting)) {
41+
return null;
3142
}
3243

3344
const getSearchSource = sharingData.getSearchSource as ({
@@ -58,15 +69,6 @@ export const reportingCsvShareProvider = ({
5869
};
5970
};
6071

61-
const shareActions: ShareMenuItemV2[] = [];
62-
63-
const licenseCheck = checkLicense(license.check('reporting', 'basic'));
64-
const licenseToolTipContent = licenseCheck.message;
65-
const licenseHasCsvReporting = licenseCheck.showLinks;
66-
const licenseDisabled = !licenseCheck.enableLinks;
67-
68-
const capabilityHasCsvReporting = application.capabilities.discover_v2?.generateCsv === true;
69-
7072
const generateReportingJobCSV = ({ intl }: { intl: InjectedIntl }) => {
7173
const { reportType, decoratedJobParams } = getSearchCsvJobParams({
7274
apiClient,
@@ -120,66 +122,50 @@ export const reportingCsvShareProvider = ({
120122
});
121123
};
122124

123-
if (licenseHasCsvReporting && capabilityHasCsvReporting) {
124-
const panelTitle = i18n.translate(
125-
'reporting.share.contextMenu.export.csvReportsButtonLabel',
126-
{
127-
defaultMessage: 'Export',
128-
}
129-
);
130-
131-
const reportingUrl = new URL(window.location.origin);
132-
133-
const { reportType, decoratedJobParams } = getSearchCsvJobParams({
134-
apiClient,
135-
searchModeParams: getSearchModeParams(true),
136-
title: sharingData.title as string,
137-
});
138-
139-
const relativePath = apiClient.getReportingPublicJobPath(reportType, decoratedJobParams);
140-
141-
const absoluteUrl = new URL(relativePath, window.location.href).toString();
142-
143-
shareActions.push({
144-
shareMenuItem: {
145-
name: panelTitle,
146-
toolTipContent: licenseToolTipContent,
147-
disabled: licenseDisabled,
148-
['data-test-subj']: 'Export',
149-
},
150-
helpText: (
151-
<FormattedMessage
152-
id="reporting.share.csv.reporting.helpTextCSV"
153-
defaultMessage="Export a CSV of this {objectType}."
154-
values={{ objectType }}
155-
/>
156-
),
157-
reportType,
158-
label: 'CSV',
159-
copyURLButton: {
160-
id: 'reporting.share.modalContent.csv.copyUrlButtonLabel',
161-
dataTestSubj: 'shareReportingCopyURL',
162-
label: 'Post URL',
163-
},
164-
generateExportButton: (
165-
<FormattedMessage
166-
id="reporting.share.generateButtonLabelCSV"
167-
data-test-subj="generateReportButton"
168-
defaultMessage="Generate CSV"
169-
/>
170-
),
171-
generateExport: generateReportingJobCSV,
172-
generateExportUrl: () => absoluteUrl,
173-
generateCopyUrl: reportingUrl,
174-
renderCopyURLButton: true,
175-
});
176-
}
177-
178-
return shareActions;
125+
const panelTitle = i18n.translate('reporting.share.contextMenu.export.csvReportsButtonLabel', {
126+
defaultMessage: 'Export',
127+
});
128+
129+
const { reportType, decoratedJobParams } = getSearchCsvJobParams({
130+
apiClient,
131+
searchModeParams: getSearchModeParams(true),
132+
title: sharingData.title as string,
133+
});
134+
135+
const relativePath = apiClient.getReportingPublicJobPath(reportType, decoratedJobParams);
136+
137+
const absoluteUrl = new URL(relativePath, window.location.href).toString();
138+
139+
return {
140+
name: panelTitle,
141+
toolTipContent: licenseToolTipContent,
142+
exportType: reportType,
143+
label: 'CSV',
144+
disabled: licenseDisabled,
145+
generateAssetExport: generateReportingJobCSV,
146+
generateAssetURIValue: () => absoluteUrl,
147+
helpText: (
148+
<FormattedMessage
149+
id="reporting.share.csv.reporting.helpTextCSV"
150+
defaultMessage="Export a CSV of this {objectType}."
151+
values={{ objectType }}
152+
/>
153+
),
154+
generateExportButton: (
155+
<FormattedMessage
156+
id="reporting.share.generateButtonLabelCSV"
157+
data-test-subj="generateReportButton"
158+
defaultMessage="Generate CSV"
159+
/>
160+
),
161+
renderCopyURIButton: true,
162+
};
179163
};
180164

181165
return {
166+
shareType: 'integration',
182167
id: 'csvReportsModal',
183-
getShareMenuItems,
168+
groupId: 'export',
169+
config: getShareMenuItems,
184170
};
185171
};

0 commit comments

Comments
 (0)