Timelion app deprecation warning (#74660) (#75260)

* wip deprecation notice on timelion app

* Add a deprecation notice on timelion app

* Minor, add visualize and timelion on the docLinks

* Chage the layout a bit

* Change the deprecation notice message

* Change the deprecation notice message

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

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

docs/development/core/public/kibana-plugin-core-public.doclinksstart.links.md

@@ -96,5 +96,6 @@ readonly links: {
             readonly dateMath: string;
         };
         readonly management: Record<string, string>;
+        readonly visualize: Record<string, string>;
     };
 ```

src/core/public/doc_links/doc_links_service.ts

@@ -128,6 +128,10 @@ export class DocLinksService {
           kibanaSearchSettings: `${ELASTIC_WEBSITE_URL}guide/en/kibana/${DOC_LINK_VERSION}/advanced-options.html#kibana-search-settings`,
           dashboardSettings: `${ELASTIC_WEBSITE_URL}guide/en/kibana/${DOC_LINK_VERSION}/advanced-options.html#kibana-dashboard-settings`,
         },
+        visualize: {
+          guide: `${ELASTIC_WEBSITE_URL}guide/en/kibana/${DOC_LINK_VERSION}/visualize.html`,
+          timelionDeprecation: `${ELASTIC_WEBSITE_URL}guide/en/kibana/${DOC_LINK_VERSION}/timelion.html#timelion-deprecation`,
+        },
       },
     });
   }
@@ -226,5 +230,6 @@ export interface DocLinksStart {
       readonly dateMath: string;
     };
     readonly management: Record<string, string>;
+    readonly visualize: Record<string, string>;
   };
 }

src/core/public/public.api.md

@@ -591,6 +591,7 @@ export interface DocLinksStart {
             readonly dateMath: string;
         };
         readonly management: Record<string, string>;
+        readonly visualize: Record<string, string>;
     };
 }
 

src/plugins/timelion/public/app.js

@@ -43,6 +43,7 @@ import { initTimelionOptionsSheetDirective } from './directives/timelion_options
 import { initSavedObjectSaveAsCheckBoxDirective } from './directives/saved_object_save_as_checkbox';
 import { initSavedObjectFinderDirective } from './directives/saved_object_finder';
 import { initTimelionTabsDirective } from './components/timelionhelp_tabs_directive';
+import { initTimelionTDeprecationDirective } from './components/timelion_deprecation_directive';
 import { initInputFocusDirective } from './directives/input_focus';
 import { Chart } from './directives/chart/chart';
 import { TimelionInterval } from './directives/timelion_interval/timelion_interval';
@@ -84,6 +85,7 @@ export function initTimelionApp(app, deps) {
   initTimelionHelpDirective(app);
   initInputFocusDirective(app);
   initTimelionTabsDirective(app, deps);
+  initTimelionTDeprecationDirective(app, deps);
   initSavedObjectFinderDirective(app, savedSheetLoader, deps.core.uiSettings);
   initSavedObjectSaveAsCheckBoxDirective(app);
   initCellsDirective(app);

src/plugins/timelion/public/components/timelion_deprecation.tsx

@@ -0,0 +1,52 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { FormattedMessage } from '@kbn/i18n/react';
+import { EuiSpacer, EuiCallOut, EuiLink } from '@elastic/eui';
+import React from 'react';
+import { DocLinksStart } from '../../../../core/public';
+
+export const TimelionDeprecation = ({ links }: DocLinksStart) => {
+  const timelionDeprecationLink = links.visualize.timelionDeprecation;
+  return (
+    <>
+      <EuiCallOut
+        title={
+          <FormattedMessage
+            id="timelion.deprecation.message"
+            defaultMessage="Deprecated since 7.0, the Timelion app will be removed in 8.0. To continue using your Timelion worksheets, {timeLionDeprecationLink}."
+            values={{
+              timeLionDeprecationLink: (
+                <EuiLink href={timelionDeprecationLink} target="_blank" external>
+                  <FormattedMessage
+                    id="timelion.deprecation.here"
+                    defaultMessage="migrate them to a dashboard."
+                  />
+                </EuiLink>
+              ),
+            }}
+          />
+        }
+        color="warning"
+        iconType="alert"
+        size="s"
+      />
+      <EuiSpacer size="s" />
+    </>
+  );
+};

src/plugins/timelion/public/components/timelion_deprecation_directive.js

@@ -0,0 +1,41 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from 'react';
+import { TimelionDeprecation } from './timelion_deprecation';
+
+export function initTimelionTDeprecationDirective(app, deps) {
+  app.directive('timelionDeprecation', function (reactDirective) {
+    return reactDirective(
+      () => {
+        return (
+          <deps.core.i18n.Context>
+            <TimelionDeprecation links={deps.core.docLinks.links} />
+          </deps.core.i18n.Context>
+        );
+      },
+      [],
+      {
+        restrict: 'E',
+        scope: {
+          docLinks: '=',
+        },
+      }
+    );
+  });
+}

src/plugins/timelion/public/index.html

@@ -28,6 +28,7 @@
 
 
   <div class="timApp__menus">
+    <timelion-deprecation></timelion-deprecation>
     <timelion-help ng-show="menus.showHelp"></timelion-help>
     <timelion-save ng-show="menus.showSave"></timelion-save>
     <timelion-load ng-show="menus.showLoad"></timelion-load>