[7.x] [Component templates] Table view (#68031) (#68687)

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>

x-pack/plugins/index_management/common/index.ts

@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export { PLUGIN, API_BASE_PATH, CREATE_LEGACY_TEMPLATE_BY_DEFAULT } from './constants';
+export { PLUGIN, API_BASE_PATH, CREATE_LEGACY_TEMPLATE_BY_DEFAULT, BASE_PATH } from './constants';
 
 export { getTemplateParameter } from './lib';
 

x-pack/plugins/index_management/common/lib/component_template_serialization.test.ts

@@ -0,0 +1,94 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { deserializeComponentTemplate } from './component_template_serialization';
+
+describe('deserializeComponentTemplate', () => {
+ test('deserializes a component template', () => {
+ expect(
+ deserializeComponentTemplate(
+ {
+ name: 'my_component_template',
+ component_template: {
+ version: 1,
+ _meta: {
+ serialization: {
+ id: 10,
+ class: 'MyComponentTemplate',
+ },
+ description: 'set number of shards to one',
+ },
+ template: {
+ settings: {
+ number_of_shards: 1,
+ },
+ mappings: {
+ _source: {
+ enabled: false,
+ },
+ properties: {
+ host_name: {
+ type: 'keyword',
+ },
+ created_at: {
+ type: 'date',
+ format: 'EEE MMM dd HH:mm:ss Z yyyy',
+ },
+ },
+ },
+ },
+ },
+ },
+ [
+ {
+ name: 'my_index_template',
+ index_template: {
+ index_patterns: ['foo'],
+ template: {
+ settings: {
+ number_of_replicas: 2,
+ },
+ },
+ composed_of: ['my_component_template'],
+ },
+ },
+ ]
+ )
+ ).toEqual({
+ name: 'my_component_template',
+ version: 1,
+ _meta: {
+ serialization: {
+ id: 10,
+ class: 'MyComponentTemplate',
+ },
+ description: 'set number of shards to one',
+ },
+ template: {
+ settings: {
+ number_of_shards: 1,
+ },
+ mappings: {
+ _source: {
+ enabled: false,
+ },
+ properties: {
+ host_name: {
+ type: 'keyword',
+ },
+ created_at: {
+ type: 'date',
+ format: 'EEE MMM dd HH:mm:ss Z yyyy',
+ },
+ },
+ },
+ },
+ _kbnMeta: {
+ usedBy: ['my_index_template'],
+ },
+ });
+ });
+});

x-pack/plugins/index_management/common/lib/component_template_serialization.ts

@@ -0,0 +1,86 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+import {
+ TemplateFromEs,
+ ComponentTemplateFromEs,
+ ComponentTemplateDeserialized,
+ ComponentTemplateListItem,
+} from '../types';
+
+const hasEntries = (data: object = {}) => Object.entries(data).length > 0;
+
+/**
+ * Normalize a list of component templates to a map where each key
+ * is a component template name, and the value is an array of index templates name using it
+ *
+ * @example
+ *
+ {
+ "comp-1": [
+ "template-1",
+ "template-2"
+ ],
+ "comp2": [
+ "template-1",
+ "template-2"
+ ]
+ }
+ *
+ * @param indexTemplatesEs List of component templates
+ */
+
+const getIndexTemplatesToUsedBy = (indexTemplatesEs: TemplateFromEs[]) => {
+ return indexTemplatesEs.reduce((acc, item) => {
+ if (item.index_template.composed_of) {
+ item.index_template.composed_of.forEach((component) => {
+ acc[component] = acc[component] ? [...acc[component], item.name] : [item.name];
+ });
+ }
+ return acc;
+ }, {} as { [key: string]: string[] });
+};
+
+export function deserializeComponentTemplate(
+ componentTemplateEs: ComponentTemplateFromEs,
+ indexTemplatesEs: TemplateFromEs[]
+) {
+ const { name, component_template: componentTemplate } = componentTemplateEs;
+ const { template, _meta, version } = componentTemplate;
+
+ const indexTemplatesToUsedBy = getIndexTemplatesToUsedBy(indexTemplatesEs);
+
+ const deserializedComponentTemplate: ComponentTemplateDeserialized = {
+ name,
+ template,
+ version,
+ _meta,
+ _kbnMeta: {
+ usedBy: indexTemplatesToUsedBy[name] || [],
+ },
+ };
+
+ return deserializedComponentTemplate;
+}
+
+export function deserializeComponenTemplateList(
+ componentTemplateEs: ComponentTemplateFromEs,
+ indexTemplatesEs: TemplateFromEs[]
+) {
+ const { name, component_template: componentTemplate } = componentTemplateEs;
+ const { template } = componentTemplate;
+
+ const indexTemplatesToUsedBy = getIndexTemplatesToUsedBy(indexTemplatesEs);
+
+ const componentTemplateListItem: ComponentTemplateListItem = {
+ name,
+ usedBy: indexTemplatesToUsedBy[name] || [],
+ hasSettings: hasEntries(template.settings),
+ hasMappings: hasEntries(template.mappings),
+ hasAliases: hasEntries(template.aliases),
+ };
+
+ return componentTemplateListItem;
+}

x-pack/plugins/index_management/common/lib/index.ts

@@ -11,3 +11,8 @@ export {
 } from './template_serialization';
 
 export { getTemplateParameter } from './utils';
+
+export {
+ deserializeComponentTemplate,
+ deserializeComponenTemplateList,
+} from './component_template_serialization';

x-pack/plugins/index_management/common/types/component_templates.ts

@@ -0,0 +1,39 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { IndexSettings } from './indices';
+import { Aliases } from './aliases';
+import { Mappings } from './mappings';
+
+export interface ComponentTemplateSerialized {
+ template: {
+ settings?: IndexSettings;
+ aliases?: Aliases;
+ mappings?: Mappings;
+ };
+ version?: number;
+ _meta?: { [key: string]: any };
+}
+
+export interface ComponentTemplateDeserialized extends ComponentTemplateSerialized {
+ name: string;
+ _kbnMeta: {
+ usedBy: string[];
+ };
+}
+
+export interface ComponentTemplateFromEs {
+ name: string;
+ component_template: ComponentTemplateSerialized;
+}
+
+export interface ComponentTemplateListItem {
+ name: string;
+ usedBy: string[];
+ hasMappings: boolean;
+ hasAliases: boolean;
+ hasSettings: boolean;
+}

x-pack/plugins/index_management/common/types/index.ts

@@ -11,3 +11,5 @@ export * from './indices';
 export * from './mappings';
 
 export * from './templates';
+
+export * from './component_templates';

x-pack/plugins/index_management/common/types/templates.ts

@@ -49,6 +49,11 @@ export interface TemplateDeserialized {
  };
 }
 
+export interface TemplateFromEs {
+ name: string;
+ index_template: TemplateSerialized;
+}
+
 /**
  * Interface for the template list in our UI table
  * we don't include the mappings, settings and aliases

x-pack/plugins/index_management/public/application/app.tsx

@@ -5,10 +5,12 @@
  */
 
 import React, { useEffect } from 'react';
+
 import { Router, Switch, Route, Redirect } from 'react-router-dom';
 import { ScopedHistory } from 'kibana/public';
+
 import { UIM_APP_LOAD } from '../../common/constants';
-import { IndexManagementHome } from './sections/home';
+import { IndexManagementHome, homeSections } from './sections/home';
 import { TemplateCreate } from './sections/template_create';
 import { TemplateClone } from './sections/template_clone';
 import { TemplateEdit } from './sections/template_edit';
@@ -32,7 +34,7 @@ export const AppWithoutRouter = () => (
  <Route exact path={`/create_template`} component={TemplateCreate} />
  <Route exact path={`/clone_template/:name*`} component={TemplateClone} />
  <Route exact path={`/edit_template/:name*`} component={TemplateEdit} />
- <Route path={`/:section(indices|templates)`} component={IndexManagementHome} />
+ <Route path={`/:section(${homeSections.join('|')})`} component={IndexManagementHome} />
  <Redirect from={`/`} to={`/indices`} />
  </Switch>
 );