Migrate Reporting job completion notifier to New Platform

[joshdover]

Now that UI applications can be built in the New Platform. We need to move any features provided by uiExport hacks to the New Platform so that they continue to work when no legacy code is on the page.

Reporting's mechanism for polling for completed reporting jobs is one feature that needs to be removed. In a quick audit, I do not see any explicit legacy dependencies other than some config values that should be trivial to move.

Related #42984

[elasticmachine]

Pinging @elastic/kibana-platform

[elasticmachine]

Pinging @elastic/kibana-stack-services

[tsullivan]

In regard to the code you linked, it seems to be relevant because there won't be any uiModules.get('xyz').run() to leverage.

Is there anything else about the code that would be incompatible with the new platform, such as any code in the callback?

We need to move any features provided by uiExport hacks

Sorry I'm not sure 100% what that means

What's our recommendation for going forward?

Thanks for the head's up!

[joshdover]

In regard to the code you linked, it seems to be relevant because there won't be any uiModules.get('xyz').run() to leverage.

Is there anything else about the code that would be incompatible with the new platform, such as any code in the callback?

Sorry the link to the specific line may be confusing. This entire file needs to be moved to the New Platform. Some background:

In the legacy platform we have a uiExport type that is called "hacks". Any files that are specified as "hacks" (via the uiExport.hacks property in the plugin's new kibana.Plugin() definition) are loaded into every plugin bundle in the Legacy Platform. This allows us to make sure code is run on every single page in Kibana.

In the New Platform, there is a bigger distinction between plugins & applications. All plugins are setup & started when any page loads, so any plugin can start running code, regardless of whether or not their application is currently rendered on the page.

This polling code needs to be moved out of the "hacks" mechanism into a New Platform plugin so that this polling continues to work when a New Platform application is being run (in this case, no legacy code is running on the page).

Let me know if this answers all the questions! Thanks.

[tsullivan]

Hi Josh, I want to get started on this task soon.

This polling code needs to be moved out of the "hacks" mechanism into a New Platform plugin so that this polling continues to work when a New Platform application is being run (in this case, no legacy code is running on the page).

This makes sense and I found an example in our existing code that was possible to base a new simple plugin that console.logs to the browser:

import {
  CoreSetup,
  CoreStart,
  Plugin,
  PluginInitializerContext,
} from '../../../../src/core/public';

export class ReportingNotifierPublicPlugin implements Plugin<any, any> {
  constructor(initializerContext: PluginInitializerContext) {}

  public setup(core: CoreSetup) {}

  public start(core: CoreStart) {
    core.notifications.toasts.addSuccess('hello world');
  }

  public stop() {}
}

export type Setup = ReturnType<ReportingNotifierPublicPlugin['setup']>;
export type Start = ReturnType<ReportingNotifierPublicPlugin['start']>;

To go from hello world, to showing a rich message with a download button, it looks like we'll want to use this module: https://github.com/elastic/kibana/tree/master/src/plugins/kibana_react

I don't see imports working the way as documented in that README.

    ERROR in ./x-pack/plugins/reporting_notifier/public/plugin.tsx
    Module not found: Error: Can't resolve 'kibana-react' in '/Users/tsullivan/elastic/kibana/x-pack/plugins/reporting_notifier/public'

Is there something extra I would need to do, if the ReportingNotifierPublicPlugin code above is in: x-pack/plugins/reporting_notifier/public/plugin.tsx?

[tsullivan]

#45427 (comment) is resolved. I got a pretty nice looking "Hello world" type toast working with:

import React, { Fragment } from 'react';
import { EuiButton } from '@elastic/eui';
import {
  CoreSetup,
  CoreStart,
  Plugin,
  PluginInitializerContext,
} from '../../../../src/core/public';

export class ReportingNotifierPublicPlugin implements Plugin<any, any> {
  constructor(initializerContext: PluginInitializerContext) {}

  public setup(core: CoreSetup) {}

  public start(core: CoreStart) {
    core.notifications.toasts.add({
      title: 'Your PDF is complete!',
      color: 'success',
      text: (
        <Fragment>
          <p>Thanks for your patience! Your download is ready.</p>
          <EuiButton type="submit" fill>
            Delete report
          </EuiButton>
        </Fragment>
      ),
    });
  }

  public stop() {}
}

export type Setup = ReturnType<ReportingNotifierPublicPlugin['setup']>;
export type Start = ReturnType<ReportingNotifierPublicPlugin['start']>;

[joshdover]

Great! Anything else blocking this, that I can help with?

I believe this was answered outside Github, but wanted to leave it here for others to find too. If you want to use utilities from the kibana_react plugin, you'll need to do a relative import to the src/plugins/kibana_react/public directory.