[Ingest Manager][Endpoint] Add Endpoint Create Policy flow with Ingest (

elastic#68955)

* Ingest: add data-test-subj prop support to Ingest components
* Ingest: Add Context Provider to bridge History from Kibana to Hash router
* Ingest: Added support for route state in Create Datasource page
* Endpoint: Add Create button to Polices List header
* Endpoint: Added support for passing of state from endpoint to ingest on policy
* Endpoint: additional functional test cases

x-pack/plugins/ingest_manager/public/applications/ingest_manager/components/header.tsx

@@ -36,6 +36,7 @@ export interface HeaderProps {
  rightColumn?: JSX.Element;
  rightColumnGrow?: EuiFlexItemProps['grow'];
  tabs?: EuiTabProps[];
+ 'data-test-subj'?: string;
 }
 
 const HeaderColumns: React.FC<Omit<HeaderProps, 'tabs'>> = memo(
@@ -53,8 +54,9 @@ export const Header: React.FC<HeaderProps> = ({
  rightColumnGrow,
  tabs,
  maxWidth,
+ 'data-test-subj': dataTestSubj,
 }) => (
- <Container>
+ <Container data-test-subj={dataTestSubj}>
  <Wrapper maxWidth={maxWidth}>
  <HeaderColumns
  leftColumn={leftColumn}

x-pack/plugins/ingest_manager/public/applications/ingest_manager/hooks/use_intra_app_state.tsx

@@ -0,0 +1,65 @@
+/*
+ * 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 React, { memo, useContext, useMemo } from 'react';
+import { AppMountParameters } from 'kibana/public';
+import { useLocation } from 'react-router-dom';
+import { AnyIntraAppRouteState } from '../types';
+
+interface IntraAppState<S extends AnyIntraAppRouteState = AnyIntraAppRouteState> {
+ forRoute: string;
+ routeState?: S;
+}
+
+const IntraAppStateContext = React.createContext<IntraAppState>({ forRoute: '' });
+const wasHandled = new WeakSet<IntraAppState>();
+
+/**
+ * Provides a bridget between Kibana's ScopedHistory instance (normally used with BrowserRouter)
+ * and the Hash router used within the app in order to enable state to be used between kibana
+ * apps
+ */
+export const IntraAppStateProvider = memo<{
+ kibanaScopedHistory: AppMountParameters['history'];
+ children: React.ReactNode;
+}>(({ kibanaScopedHistory, children }) => {
+ const internalAppToAppState = useMemo<IntraAppState>(() => {
+ return {
+ forRoute: kibanaScopedHistory.location.hash.substr(1),
+ routeState: kibanaScopedHistory.location.state as AnyIntraAppRouteState,
+ };
+ }, [kibanaScopedHistory.location.hash, kibanaScopedHistory.location.state]);
+ return (
+ <IntraAppStateContext.Provider value={internalAppToAppState}>
+ {children}
+ </IntraAppStateContext.Provider>
+ );
+});
+
+/**
+ * Retrieve UI Route state from the React Router History for the current URL location.
+ * This state can be used by other Kibana Apps to influence certain behaviours in Ingest, for example,
+ * redirecting back to an given Application after a craete action.
+ */
+export function useIntraAppState<S = AnyIntraAppRouteState>():
+ | IntraAppState<S>['routeState']
+ | undefined {
+ const location = useLocation();
+ const intraAppState = useContext(IntraAppStateContext);
+ if (!intraAppState) {
+ throw new Error('Hook called outside of IntraAppStateContext');
+ }
+ return useMemo(() => {
+ // Due to the use of HashRouter in Ingest, we only want state to be returned
+ // once so that it does not impact navigation to the page from within the
+ // ingest app. side affect is that the browser back button would not work
+ // consistently either.
+ if (location.pathname === intraAppState.forRoute && !wasHandled.has(intraAppState)) {
+ wasHandled.add(intraAppState);
+ return intraAppState.routeState as S;
+ }
+ }, [intraAppState, location.pathname]);
+}