[ML] Removing old angular directives (#48382) (#48435)

* [ML] Removing old angular directives

* reverts small change

* typescriptifying access denied page

* changing access denied text

* updating translations

x-pack/legacy/plugins/ml/public/access_denied/index.tsx

@@ -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 React from 'react';
+import ReactDOM from 'react-dom';
+import uiRoutes from 'ui/routes';
+import { I18nContext } from 'ui/i18n';
+// @ts-ignore
+import { uiModules } from 'ui/modules';
+import { AccessDeniedPage } from './page';
+
+const module = uiModules.get('apps/ml', ['react']);
+
+const template = `<access-denied />`;
+
+uiRoutes.when('/access-denied', {
+  template,
+});
+
+module.directive('accessDenied', function() {
+  return {
+    scope: {},
+    restrict: 'E',
+    link: async (scope: ng.IScope, element: ng.IAugmentedJQuery) => {
+      ReactDOM.render(
+        <I18nContext>{React.createElement(AccessDeniedPage)}</I18nContext>,
+        element[0]
+      );
+
+      element.on('$destroy', () => {
+        ReactDOM.unmountComponentAtNode(element[0]);
+        scope.$destroy();
+      });
+    },
+  };
+});

x-pack/legacy/plugins/ml/public/access_denied/page.tsx

@@ -0,0 +1,63 @@
+/*
+ * 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, { Fragment } from 'react';
+
+import { FormattedMessage } from '@kbn/i18n/react';
+import { i18n } from '@kbn/i18n';
+import {
+  EuiCallOut,
+  EuiPage,
+  EuiPageBody,
+  EuiPageContentBody,
+  EuiPageContentHeader,
+  EuiPageContentHeaderSection,
+  EuiSpacer,
+  EuiText,
+  EuiTitle,
+} from '@elastic/eui';
+import { NavigationMenu } from '../components/navigation_menu';
+
+export const AccessDeniedPage = () => (
+  <Fragment>
+    <NavigationMenu tabId="access-denied" />
+    <EuiPage>
+      <EuiPageBody>
+        <EuiPageContentHeader>
+          <EuiPageContentHeaderSection>
+            <EuiTitle>
+              <h1>
+                <FormattedMessage
+                  id="xpack.ml.management.jobsList.accessDeniedTitle"
+                  defaultMessage="Access denied"
+                />
+              </h1>
+            </EuiTitle>
+          </EuiPageContentHeaderSection>
+        </EuiPageContentHeader>
+        <EuiPageContentBody>
+          <EuiSpacer size="m" />
+          <EuiCallOut
+            title={i18n.translate('xpack.ml.accessDenied.label', {
+              defaultMessage: 'Insufficient permissions',
+            })}
+            color="danger"
+            iconType="cross"
+          >
+            <EuiText size="s">
+              <p>
+                <FormattedMessage
+                  id="xpack.ml.accessDenied.description"
+                  defaultMessage="You don’t have permission to access the ML plugin"
+                />
+              </p>
+            </EuiText>
+          </EuiCallOut>
+        </EuiPageContentBody>
+      </EuiPageBody>
+    </EuiPage>
+  </Fragment>
+);

x-pack/legacy/plugins/ml/public/app.js

@@ -16,7 +16,6 @@ import 'plugins/ml/access_denied';
 import 'plugins/ml/jobs';
 import 'plugins/ml/overview';
 import 'plugins/ml/services/calendar_service';
-import 'plugins/ml/components/messagebar';
 import 'plugins/ml/data_frame_analytics';
 import 'plugins/ml/datavisualizer';
 import 'plugins/ml/explorer';

x-pack/legacy/plugins/ml/public/components/data_recognizer/index.ts

@@ -4,6 +4,4 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import './data_recognizer_directive';
-
 export { DataRecognizer } from './data_recognizer';

x-pack/legacy/plugins/ml/public/components/field_title_bar/index.js

@@ -4,8 +4,4 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-
-
-import './field_title_bar_directive';
-
 export { FieldTitleBar } from './field_title_bar';

x-pack/legacy/plugins/ml/public/components/field_type_icon/index.js

@@ -5,7 +5,4 @@
  */
 
 
-
-import './field_type_icon_directive';
-
 export { FieldTypeIcon } from './field_type_icon';