move tab content to shared directory

Author: alisonelizabeth

x-pack/plugins/index_management/public/application/components/component_templates/__jest__/client_integration/component_template_details.test.ts

@@ -8,7 +8,7 @@ import { act } from 'react-dom/test-utils';
 
 import { setupEnvironment, pageHelpers } from './helpers';
 import { ComponentTemplateDetailsTestBed } from './helpers/component_template_details.helpers';
-import { ComponentTemplateDeserialized } from '../../types';
+import { ComponentTemplateDeserialized } from '../../shared_imports';
 
 const { setup } = pageHelpers.componentTemplateDetails;
 

x-pack/plugins/index_management/public/application/components/component_templates/__jest__/client_integration/component_template_list.test.ts

@@ -6,10 +6,12 @@
 
 import { act } from 'react-dom/test-utils';
 
+import { ComponentTemplateListItem } from '../../shared_imports';
+
 import { setupEnvironment, pageHelpers } from './helpers';
 import { ComponentTemplateListTestBed } from './helpers/component_template_list.helpers';
-import { API_BASE_PATH } from '../../../../../../common/constants';
-import { ComponentTemplateListItem } from '../../types';
+
+const API_BASE_PATH = '/api/index_management';
 
 const { setup } = pageHelpers.componentTemplateList;
 

x-pack/plugins/index_management/public/application/components/component_templates/__jest__/client_integration/helpers/http_requests.ts

@@ -5,11 +5,9 @@
  */
 
 import sinon, { SinonFakeServer } from 'sinon';
-import {
-  API_BASE_PATH,
-  ComponentTemplateListItem,
-  ComponentTemplateDeserialized,
-} from '../../../../../../../common';
+import { ComponentTemplateListItem, ComponentTemplateDeserialized } from '../../../shared_imports';
+
+const API_BASE_PATH = '/api/index_management';
 
 // Register helpers to mock HTTP Requests
 const registerHttpRequestMockHelpers = (server: SinonFakeServer) => {

x-pack/plugins/index_management/public/application/components/component_templates/component_template_details/component_template_details.tsx

@@ -19,24 +19,12 @@ import {
   EuiCallOut,
 } from '@elastic/eui';
 
-import { SectionLoading } from '../shared_imports';
-import { ComponentTemplateDeserialized } from '../types';
+import { SectionLoading, TabSettings, TabAliases, TabMappings } from '../shared_imports';
 import { useComponentTemplatesContext } from '../component_templates_context';
-import { TabSummary, TabSettings, TabAliases, TabMappings } from './tab_content';
+import { TabSummary } from './tab_summary';
 import { ComponentTemplateTabs, TabType, Tab } from './tabs';
 import { ManageButton, ManageAction } from './manage_button';
 
-const tabToComponentMap: {
-  [key: string]: React.FunctionComponent<{
-    componentTemplateDetails: ComponentTemplateDeserialized;
-  }>;
-} = {
-  [TabType.Summary]: TabSummary,
-  [TabType.Settings]: TabSettings,
-  [TabType.Mappings]: TabMappings,
-  [TabType.Aliases]: TabAliases,
-};
-
 interface Props {
   componentTemplateName: string;
   onClose: () => void;
@@ -85,15 +73,28 @@ export const ComponentTemplateDetailsFlyout: React.FunctionComponent<Props> = ({
       </EuiCallOut>
     );
   } else if (componentTemplateDetails) {
-    const TabContent = tabToComponentMap[activeTab];
+    const {
+      template: { settings, mappings, aliases },
+    } = componentTemplateDetails;
+
+    const tabToComponentMap: {
+      [key: string]: React.ReactNode;
+    } = {
+      [TabType.Summary]: <TabSummary componentTemplateDetails={componentTemplateDetails} />,
+      [TabType.Settings]: <TabSettings settings={settings} />,
+      [TabType.Mappings]: <TabMappings mappings={mappings} />,
+      [TabType.Aliases]: <TabAliases aliases={aliases} />,
+    };
+
+    const tabContent = tabToComponentMap[activeTab];
 
     content = (
       <>
         <ComponentTemplateTabs activeTab={activeTab} setActiveTab={setActiveTab} />
 
         <EuiSpacer size="l" />
 
-        <TabContent componentTemplateDetails={componentTemplateDetails} />
+        {tabContent}
       </>
     );
   }

x-pack/plugins/index_management/public/application/components/component_templates/component_template_details/manage_button.tsx

@@ -13,7 +13,7 @@ import {
   EuiContextMenu,
   EuiContextMenuPanelItemDescriptor,
 } from '@elastic/eui';
-import { ComponentTemplateDeserialized } from '../types';
+import { ComponentTemplateDeserialized } from '../shared_imports';
 
 export interface ManageAction {
   name: string;

x-pack/plugins/index_management/public/application/components/component_templates/component_template_details/tab_content/tab_summary.tsx renamed to x-pack/plugins/index_management/public/application/components/component_templates/component_template_details/tab_summary.tsx

@@ -16,7 +16,7 @@ import {
   EuiSpacer,
 } from '@elastic/eui';
 
-import { ComponentTemplateDeserialized } from '../../types';
+import { ComponentTemplateDeserialized } from '../shared_imports';
 
 interface Props {
   componentTemplateDetails: ComponentTemplateDeserialized;

x-pack/plugins/index_management/public/application/components/component_templates/component_template_list/component_template_list.tsx

@@ -12,22 +12,21 @@ import { ScopedHistory } from 'kibana/public';
 
 import { SectionLoading } from '../shared_imports';
 import { UIM_COMPONENT_TEMPLATE_LIST_LOAD } from '../constants';
-import { ComponentTemplateDeserialized } from '../types';
+import { ComponentTemplateDeserialized } from '../shared_imports';
 import { useComponentTemplatesContext } from '../component_templates_context';
 import { ComponentTemplateDetailsFlyout } from '../component_template_details';
 import { EmptyPrompt } from './empty_prompt';
 import { ComponentTable } from './table';
 import { LoadError } from './error';
 import { ComponentTemplatesDeleteModal } from './delete_modal';
 
-interface MatchParams {
+interface Props {
   componentTemplateName?: string;
+  history: RouteComponentProps['history'];
 }
 
-export const ComponentTemplateList: React.FunctionComponent<RouteComponentProps<MatchParams>> = ({
-  match: {
-    params: { componentTemplateName },
-  },
+export const ComponentTemplateList: React.FunctionComponent<Props> = ({
+  componentTemplateName,
   history,
 }) => {
   const { api, trackMetric } = useComponentTemplatesContext();

x-pack/plugins/index_management/public/application/components/component_templates/component_template_list/component_template_list_container.tsx

@@ -5,16 +5,28 @@
  */
 
 import React from 'react';
+import { RouteComponentProps } from 'react-router-dom';
 
 import { ComponentTemplatesAuthProvider } from './auth_provider';
 import { ComponentTemplatesWithPrivileges } from './with_privileges';
 import { ComponentTemplateList } from './component_template_list';
 
-export const ComponentTemplateListContainer: React.FunctionComponent = () => {
+interface MatchParams {
+  componentTemplateName?: string;
+}
+
+export const ComponentTemplateListContainer: React.FunctionComponent<RouteComponentProps<
+  MatchParams
+>> = ({
+  match: {
+    params: { componentTemplateName },
+  },
+  history,
+}) => {
   return (
     <ComponentTemplatesAuthProvider>
       <ComponentTemplatesWithPrivileges>
-        <ComponentTemplateList />
+        <ComponentTemplateList componentTemplateName={componentTemplateName} history={history} />
       </ComponentTemplatesWithPrivileges>
     </ComponentTemplatesAuthProvider>
   );

x-pack/plugins/index_management/public/application/components/component_templates/component_template_list/table.tsx

@@ -17,7 +17,7 @@ import {
 import { ScopedHistory } from 'kibana/public';
 
 import { reactRouterNavigate } from '../../../../../../../../src/plugins/kibana_react/public';
-import { ComponentTemplateListItem } from '../types';
+import { ComponentTemplateListItem } from '../shared_imports';
 import { UIM_COMPONENT_TEMPLATE_DETAILS } from '../constants';
 import { useComponentTemplatesContext } from '../component_templates_context';
 

x-pack/plugins/index_management/public/application/components/component_templates/index.ts

@@ -9,5 +9,3 @@ export { ComponentTemplatesProvider } from './component_templates_context';
 export { ComponentTemplateList } from './component_template_list';
 
 export { ComponentTemplateDetailsFlyout } from './component_template_details';
-
-export * from './types';