[IM] Use EPM in variables & types (#48453)

* IntegrationsManager -> EPM

* integrationsManager -> epm

* [iI]ntegration -> [pP]ackage. Update tests.

* Don't rename integrations registry URL.

* Update i18n key in x-pack/.i18nrc.json

* Update path to functional test config

* Add epm to recently re-enabled privileges test

* Update two values recently added in main feature branch

* Move/update screenshot tests

x-pack/.i18nrc.json

@@ -10,14 +10,14 @@
     "xpack.code": ["legacy/plugins/code", "plugins/code"],
     "xpack.crossClusterReplication": "legacy/plugins/cross_cluster_replication",
     "xpack.dashboardMode": "legacy/plugins/dashboard_mode",
+    "xpack.epm":"legacy/plugins/integrations_manager",
     "xpack.features": "plugins/features",
     "xpack.fileUpload": "legacy/plugins/file_upload",
     "xpack.graph": "legacy/plugins/graph",
     "xpack.grokDebugger": "legacy/plugins/grokdebugger",
     "xpack.idxMgmt": "legacy/plugins/index_management",
     "xpack.indexLifecycleMgmt": "legacy/plugins/index_lifecycle_management",
     "xpack.infra": "legacy/plugins/infra",
-    "xpack.integrationsManager":"legacy/plugins/integrations_manager",
     "xpack.kueryAutocomplete": "legacy/plugins/kuery_autocomplete",
     "xpack.lens": "legacy/plugins/lens",
     "xpack.licensing": "plugins/licensing",

x-pack/index.js

@@ -43,7 +43,7 @@ import { snapshotRestore } from './legacy/plugins/snapshot_restore';
 import { transform } from './legacy/plugins/transform';
 import { actions } from './legacy/plugins/actions';
 import { alerting } from './legacy/plugins/alerting';
-import { integrationsManager } from './legacy/plugins/integrations_manager';
+import { epm } from './legacy/plugins/integrations_manager';
 import { lens } from './legacy/plugins/lens';
 
 module.exports = function (kibana) {
@@ -88,6 +88,6 @@ module.exports = function (kibana) {
     snapshotRestore(kibana),
     actions(kibana),
     alerting(kibana),
-    integrationsManager(kibana),
+    epm(kibana),
   ];
 };

x-pack/legacy/plugins/integrations_manager/common/constants.ts

@@ -9,12 +9,12 @@ import manifest from '../kibana.json';
 
 export const PLUGIN = {
   ID: manifest.id,
-  TITLE: i18n.translate('xpack.integrationsManager.pluginTitle', {
-    defaultMessage: 'Integrations Manager',
+  TITLE: i18n.translate('xpack.epm.pluginTitle', {
+    defaultMessage: 'Elastic Package Manager',
   }),
-  DESCRIPTION: 'Install and manage your elastic data ingest integrations',
+  DESCRIPTION: 'Install and manage your Elastic data ingest packages',
   ICON: 'merge',
-  CONFIG_PREFIX: 'xpack.integrationsManager',
+  CONFIG_PREFIX: 'xpack.epm',
 };
 
-export const SAVED_OBJECT_TYPE = 'integrations-manager';
+export const SAVED_OBJECT_TYPE = 'epm';

x-pack/legacy/plugins/integrations_manager/common/type_utils.ts

@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-// Calling Object.entries(IntegrationsGroupedByStatus) gave `status: string`
+// Calling Object.entries(PackagesGroupedByStatus) gave `status: string`
 // which causes a "string is not assignable to type InstallationStatus` error
 // see https://github.com/Microsoft/TypeScript/issues/20322
 // and https://github.com/Microsoft/TypeScript/pull/12253#issuecomment-263132208

x-pack/legacy/plugins/integrations_manager/common/types.ts

@@ -76,14 +76,14 @@ export interface RegistryPackage {
 
 // Managers public HTTP response types
 // from API_LIST_PATTERN
-export type IntegrationList = IntegrationListItem[];
+export type PackageList = PackageListItem[];
 // add title here until it's a part of registry response
-export type IntegrationListItem = Installable<Required<RegistryListItem>>;
-export type IntegrationsGroupedByStatus = Record<InstallationStatus, IntegrationList>;
+export type PackageListItem = Installable<Required<RegistryListItem>>;
+export type PackagesGroupedByStatus = Record<InstallationStatus, PackageList>;
 
 // from API_INFO_PATTERN
 // add title here until it's a part of registry response
-export type IntegrationInfo = Installable<
+export type PackageInfo = Installable<
   Required<RegistryPackage> & { assets: AssetsGroupedByServiceByType }
 >;
 

x-pack/legacy/plugins/integrations_manager/index.ts

@@ -11,11 +11,7 @@ import { LegacyPluginInitializer, LegacyPluginOptions } from 'src/legacy/types';
 import { Feature } from '../../../plugins/features/server/feature';
 import { PLUGIN } from './common/constants';
 import manifest from './kibana.json';
-import {
-  CoreSetup,
-  Plugin as ServerPlugin,
-  IntegrationsManagerPluginInitializerContext,
-} from './server/plugin';
+import { CoreSetup, Plugin as ServerPlugin, EPMPluginInitializerContext } from './server/plugin';
 import { mappings, savedObjectSchemas } from './server/saved_objects';
 import { getConfigSchema } from './server/config';
 
@@ -83,7 +79,7 @@ const pluginOptions: LegacyPluginOptions = {
     const getConfig$ = () =>
       new BehaviorSubject(server.config().get(PLUGIN.CONFIG_PREFIX)).asObservable();
 
-    const initializerContext: IntegrationsManagerPluginInitializerContext = {
+    const initializerContext: EPMPluginInitializerContext = {
       config: {
         create: getConfig$,
         createIfExists: getConfig$,
@@ -101,5 +97,4 @@ const pluginOptions: LegacyPluginOptions = {
   isEnabled: false,
 };
 
-export const integrationsManager: LegacyPluginInitializer = kibana =>
-  new kibana.Plugin(pluginOptions);
+export const epm: LegacyPluginInitializer = kibana => new kibana.Plugin(pluginOptions);

x-pack/legacy/plugins/integrations_manager/kibana.json

@@ -1,5 +1,5 @@
 {
-  "id": "integrations_manager",
+  "id": "epm",
   "version": "0.0.2",
   "kibanaVersion": "kibana",
   "requiredPlugins": ["kibana", "elasticsearch", "xpack_main"],

x-pack/legacy/plugins/integrations_manager/public/components/integration_card.tsx → x-pack/legacy/plugins/integrations_manager/public/components/package_card.tsx

@@ -7,29 +7,29 @@ import React from 'react';
 import { EuiCard, EuiIcon, ICON_TYPES } from '@elastic/eui';
 import styled from 'styled-components';
 import { useLinks } from '../hooks';
-import { IntegrationListItem, IntegrationInfo } from '../../common/types';
+import { PackageListItem, PackageInfo } from '../../common/types';
 
 export interface BadgeProps {
   showInstalledBadge?: boolean;
 }
 
-type IntegrationCardProps = (IntegrationListItem | IntegrationInfo) & BadgeProps;
+type PackageCardProps = (PackageListItem | PackageInfo) & BadgeProps;
 
 // adding the `href` causes EuiCard to use a `a` instead of a `button`
 // `a` tags use `euiLinkColor` which results in blueish Badge text
 const Card = styled(EuiCard)`
   color: inherit;
 `;
 
-export function IntegrationCard({
+export function PackageCard({
   description,
   name,
   title,
   version,
   icon: iconUrl,
   showInstalledBadge,
   status,
-}: IntegrationCardProps) {
+}: PackageCardProps) {
   const { toDetailView } = useLinks();
   const url = toDetailView({ name, version });
 

x-pack/legacy/plugins/integrations_manager/public/components/integration_list_grid.tsx → x-pack/legacy/plugins/integrations_manager/public/components/package_list_grid.tsx

@@ -5,16 +5,16 @@
  */
 import React, { Fragment, ReactNode } from 'react';
 import { EuiFlexGrid, EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText } from '@elastic/eui';
-import { IntegrationList, IntegrationListItem } from '../../common/types';
-import { IntegrationCard, BadgeProps } from './integration_card';
+import { PackageList, PackageListItem } from '../../common/types';
+import { PackageCard, BadgeProps } from './package_card';
 
 type ListProps = {
   controls?: ReactNode;
   title: string;
-  list: IntegrationList;
+  list: PackageList;
 } & BadgeProps;
 
-export function IntegrationListGrid({ controls, title, list, showInstalledBadge }: ListProps) {
+export function PackageListGrid({ controls, title, list, showInstalledBadge }: ListProps) {
   const controlsContent = <ControlsColumn title={title} controls={controls} />;
   const gridContent = <GridColumn list={list} showInstalledBadge={showInstalledBadge} />;
 
@@ -30,12 +30,12 @@ export function IntegrationListGrid({ controls, title, list, showInstalledBadge
   );
 }
 
-type GridItemProps = IntegrationListItem & BadgeProps;
+type GridItemProps = PackageListItem & BadgeProps;
 
 function GridItem(item: GridItemProps) {
   return (
     <EuiFlexItem>
-      <IntegrationCard {...item} showInstalledBadge={item.showInstalledBadge} />
+      <PackageCard {...item} showInstalledBadge={item.showInstalledBadge} />
     </EuiFlexItem>
   );
 }
@@ -61,7 +61,7 @@ function ControlsColumn({ controls, title }: ControlsColumnProps) {
 }
 
 type GridColumnProps = {
-  list: IntegrationList;
+  list: PackageList;
 } & BadgeProps;
 
 function GridColumn({ list, showInstalledBadge }: GridColumnProps) {

x-pack/legacy/plugins/integrations_manager/public/data.ts

@@ -15,9 +15,9 @@ import {
 } from '../common/routes';
 import {
   CategorySummaryList,
-  IntegrationInfo,
-  IntegrationList,
-  IntegrationsGroupedByStatus,
+  PackageInfo,
+  PackageList,
+  PackagesGroupedByStatus,
 } from '../common/types';
 
 const defaultClient: HttpHandler = (path, options?) => fetch(path, options).then(res => res.json());
@@ -35,18 +35,18 @@ export async function getCategories(): Promise<CategorySummaryList> {
   return list;
 }
 
-export async function getIntegrations(params?: ListParams): Promise<IntegrationList> {
+export async function getPackages(params?: ListParams): Promise<PackageList> {
   const path = getListPath();
   const options = params ? { query: { ...params } } : undefined;
-  const list: IntegrationList = await _fetch(path, options);
+  const list: PackageList = await _fetch(path, options);
 
   return list;
 }
 
-export async function getIntegrationsGroupedByStatus() {
+export async function getPackagesGroupedByStatus() {
   const path = getListPath();
-  const list: IntegrationList = await _fetch(path);
-  const initialValue: IntegrationsGroupedByStatus = {
+  const list: PackageList = await _fetch(path);
+  const initialValue: PackagesGroupedByStatus = {
     installed: [],
     not_installed: [],
   };
@@ -63,19 +63,19 @@ export async function getIntegrationsGroupedByStatus() {
   return groupedByStatus;
 }
 
-export async function getIntegrationInfoByKey(pkgkey: string): Promise<IntegrationInfo> {
+export async function getPackageInfoByKey(pkgkey: string): Promise<PackageInfo> {
   const path = getInfoPath(pkgkey);
-  const info: IntegrationInfo = await _fetch(path);
+  const info: PackageInfo = await _fetch(path);
 
   return info;
 }
 
-export async function installIntegration(pkgkey: string) {
+export async function installPackage(pkgkey: string) {
   const path = getInstallPath(pkgkey);
   return await _fetch(path);
 }
 
-export async function removeIntegration(pkgkey: string) {
+export async function removePackage(pkgkey: string) {
   const path = getRemovePath(pkgkey);
   return await _fetch(path);
 }

x-pack/legacy/plugins/integrations_manager/public/hooks/use_links.tsx

@@ -11,7 +11,7 @@ import { patterns } from '../routes';
 import { useCore } from '.';
 import { DetailViewPanelName } from '..';
 
-// TODO: get this from server/integrations/handlers.ts (move elsewhere?)
+// TODO: get this from server/packages/handlers.ts (move elsewhere?)
 // seems like part of the name@version change
 interface DetailParams {
   name: string;

x-pack/legacy/plugins/integrations_manager/public/index.ts

@@ -16,7 +16,7 @@ import { routes } from './routes';
 // create './types' later and move there?
 export type DetailViewPanelName = 'overview' | 'assets' | 'data-sources';
 
-const REACT_APP_ROOT_ID = 'integrationsManager__root';
+const REACT_APP_ROOT_ID = 'epm__root';
 const template = `<div id="${REACT_APP_ROOT_ID}"></div>`;
 const getRootEl = () => document.getElementById(REACT_APP_ROOT_ID);
 

x-pack/legacy/plugins/integrations_manager/public/screens/detail/content.tsx

@@ -15,7 +15,7 @@ import {
   EuiTitle,
 } from '@elastic/eui';
 import { SideNavLinks } from './side_nav_links';
-import { IntegrationInfo } from '../../../common/types';
+import { PackageInfo } from '../../../common/types';
 import { AssetAccordion } from '../../components/asset_accordion';
 import { AssetsFacetGroup } from '../../components/assets_facet_group';
 import { Requirements } from '../../components/requirements';
@@ -24,7 +24,7 @@ import { OverviewPanel } from './overview_panel';
 import { useCore } from '../../hooks/use_core';
 import { DEFAULT_PANEL, DetailProps } from '.';
 
-type ContentProps = IntegrationInfo & Pick<DetailProps, 'panel'> & { hasIconPanel: boolean };
+type ContentProps = PackageInfo & Pick<DetailProps, 'panel'> & { hasIconPanel: boolean };
 export function Content(props: ContentProps) {
   const { hasIconPanel, name, panel, version } = props;
   const { theme } = useCore();
@@ -56,7 +56,7 @@ export function Content(props: ContentProps) {
   );
 }
 
-type ContentPanelProps = IntegrationInfo & Pick<DetailProps, 'panel'>;
+type ContentPanelProps = PackageInfo & Pick<DetailProps, 'panel'>;
 export function ContentPanel(props: ContentPanelProps) {
   const { assets, panel } = props;
   switch (panel) {
@@ -76,7 +76,7 @@ export function ContentPanel(props: ContentPanelProps) {
   }
 }
 
-type RightColumnContentProps = IntegrationInfo & Pick<DetailProps, 'panel'>;
+type RightColumnContentProps = PackageInfo & Pick<DetailProps, 'panel'>;
 function RightColumnContent(props: RightColumnContentProps) {
   const { assets, requirement, panel } = props;
   switch (panel) {

x-pack/legacy/plugins/integrations_manager/public/screens/detail/header.tsx

@@ -17,13 +17,13 @@ import {
 } from '@elastic/eui';
 import styled from 'styled-components';
 import { PLUGIN } from '../../../common/constants';
-import { IntegrationInfo } from '../../../common/types';
+import { PackageInfo } from '../../../common/types';
 import { VersionBadge } from '../../components/version_badge';
 import { IconPanel } from '../../components/icon_panel';
 import { useBreadcrumbs, useCore, useLinks } from '../../hooks';
 import { CenterColumn, LeftColumn, RightColumn } from './layout';
 
-type HeaderProps = IntegrationInfo & { iconType?: IconType };
+type HeaderProps = PackageInfo & { iconType?: IconType };
 
 export function Header(props: HeaderProps) {
   const { iconType, title, version } = props;
@@ -83,15 +83,15 @@ function NavButtonBack() {
 
   return (
     <ButtonEmpty iconType="arrowLeft" size="xs" flush="left">
-      Browse Integrations
+      Browse Packages
     </ButtonEmpty>
   );
 }
 
-function InstallationButton({ status }: IntegrationInfo) {
+function InstallationButton({ status }: PackageInfo) {
   const isInstalled = status === 'installed';
   const iconType = isInstalled ? '' : 'plusInCircle';
-  const buttonText = isInstalled ? 'Installed' : 'Add Integration';
+  const buttonText = isInstalled ? 'Installed' : 'Add Package';
 
   return (
     <EuiButton fill={!isInstalled} iconType={iconType}>

x-pack/legacy/plugins/integrations_manager/public/screens/detail/index.tsx

@@ -6,9 +6,9 @@
 import React, { Fragment, useState, useEffect } from 'react';
 import { EuiPage, EuiPageBody, EuiPageWidthProps, ICON_TYPES } from '@elastic/eui';
 import styled from 'styled-components';
-import { IntegrationInfo } from '../../../common/types';
+import { PackageInfo } from '../../../common/types';
 import { DetailViewPanelName } from '../../';
-import { getIntegrationInfoByKey } from '../../data';
+import { getPackageInfoByKey } from '../../data';
 import { useCore } from '../../hooks/use_core';
 import { Header } from './header';
 import { Content } from './content';
@@ -21,9 +21,9 @@ export interface DetailProps {
 }
 
 export function Detail({ pkgkey, panel = DEFAULT_PANEL }: DetailProps) {
-  const [info, setInfo] = useState<IntegrationInfo | null>(null);
+  const [info, setInfo] = useState<PackageInfo | null>(null);
   useEffect(() => {
-    getIntegrationInfoByKey(pkgkey).then(response => {
+    getPackageInfoByKey(pkgkey).then(response => {
       const { title } = response;
       setInfo({ ...response, title });
     });
@@ -35,7 +35,7 @@ export function Detail({ pkgkey, panel = DEFAULT_PANEL }: DetailProps) {
   return <DetailLayout restrictWidth={1200} {...info} panel={panel} />;
 }
 
-type LayoutProps = IntegrationInfo & Pick<DetailProps, 'panel'> & EuiPageWidthProps;
+type LayoutProps = PackageInfo & Pick<DetailProps, 'panel'> & EuiPageWidthProps;
 export function DetailLayout(props: LayoutProps) {
   const { name, restrictWidth, panel } = props;
   const { theme } = useCore();

x-pack/legacy/plugins/integrations_manager/public/screens/detail/overview_panel.tsx

@@ -5,10 +5,10 @@
  */
 import React, { Fragment } from 'react';
 import { EuiSpacer, EuiText, EuiTitle } from '@elastic/eui';
-import { IntegrationInfo } from '../../../common/types';
+import { PackageInfo } from '../../../common/types';
 import { Screenshots } from './screenshots';
 
-export function OverviewPanel(props: IntegrationInfo) {
+export function OverviewPanel(props: PackageInfo) {
   const { description, screenshots } = props;
   return (
     <Fragment>