[ILM] Convert node allocation component to TS and use hooks (#72888) (#…

…74556)

* [ILM] Convert node allocation component to TS and use hooks

* [ILM] Fix jest tests

* [ILM] Fix i18n check

* [ILM] Implement code review suggestions

* [ILM] Fix type check, docs link and button maxWidth in NodeAllocation component

* Fix internaliation error

* [ILM] Change error message when unable to load node attributes

* [ILM] Delete a period in error callout

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

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

x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts

@@ -0,0 +1,48 @@
+/*
+ * 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 sinon, { SinonFakeServer } from 'sinon';
+
+type HttpResponse = Record<string, any> | any[];
+
+const registerHttpRequestMockHelpers = (server: SinonFakeServer) => {
+  const setPoliciesResponse = (response: HttpResponse = []) => {
+    server.respondWith('/api/index_lifecycle_management/policies', [
+      200,
+      { 'Content-Type': 'application/json' },
+      JSON.stringify(response),
+    ]);
+  };
+
+  const setNodesListResponse = (response: HttpResponse = []) => {
+    server.respondWith('/api/index_lifecycle_management/nodes/list', [
+      200,
+      { 'Content-Type': 'application/json' },
+      JSON.stringify(response),
+    ]);
+  };
+
+  return {
+    setPoliciesResponse,
+    setNodesListResponse,
+  };
+};
+
+export const init = () => {
+  const server = sinon.fakeServer.create();
+
+  // Define default response for unhandled requests.
+  // We make requests to APIs which don't impact the component under test, e.g. UI metric telemetry,
+  // and we can mock them all with a 200 instead of mocking each one individually.
+  server.respondWith([200, {}, 'DefaultSinonMockServerResponse']);
+
+  const httpRequestsMockHelpers = registerHttpRequestMockHelpers(server);
+
+  return {
+    server,
+    httpRequestsMockHelpers,
+  };
+};

x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.tsx

@@ -0,0 +1,29 @@
+/*
+ * 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, { ReactNode } from 'react';
+import { EuiLink } from '@elastic/eui';
+import { FormattedMessage } from '@kbn/i18n/react';
+
+import { createDocLink } from '../../services/documentation';
+
+interface Props {
+  docPath: string;
+  text?: ReactNode;
+}
+
+export const LearnMoreLink: React.FunctionComponent<Props> = ({ docPath, text }) => {
+  const content = text ? (
+    text
+  ) : (
+    <FormattedMessage id="xpack.indexLifecycleMgmt.learnMore" defaultMessage="Learn more" />
+  );
+  return (
+    <EuiLink href={createDocLink(docPath)} target="_blank" external={true}>
+      {content}
+    </EuiLink>
+  );
+};

x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/index.js → x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/index.ts

@@ -4,4 +4,4 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export { NodeAllocation } from './node_allocation.container';
+export { NodeAllocation } from './node_allocation';