[core/public/banners] migrate ui/notify/banners by spalger · Pull Request #23215 · elastic/kibana

spalger · 2018-09-15T06:15:40Z

Part of #19992, in order for the banners to be rendered above the navigation when we move the chrome out of the legacy platform the banners need to also be rendered by the new platform. The API hasn't changed at all.

elasticmachine · 2018-09-15T07:54:11Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

azasypkin · 2018-09-17T07:07:23Z

ack: on community duty today, will take a look today or tomorrow at the latest.

epixa

Code looks good. I did a pass on the implementation and found some things that I left comments on. I haven't tested it locally yet.

src/core/public/notifications/banners/banners_service.tsx

src/core/public/notifications/banners/global_banner_list.test.tsx

epixa · 2018-09-17T19:58:30Z

src/core/public/notifications/banners/global_banner_list.tsx

+    return (
+      <div className="globalBanner__list">
+        {banners.map(({ id, component, priority, ...rest }) => (
+          <div key={id} className="globalBanner__item" {...rest}>


question: Is there a plan to add this stuff to EUI?

I don't think so, the banners themselves are really what I think we should focus on moving to EUI, but as you see here they are passed in fully styled. I tried moving the divs here to use <EuiFlexGroup />, but since we need refs we have issues there, so I didn't think it was worth the effort right now.

…latform/global-banners

…ve tests

elasticmachine · 2018-09-18T12:34:22Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

azasypkin · 2018-09-18T13:09:53Z

CI is failing because of failed i18n check that is caused by the outdated @babel/parser beta package (see this 🙈), bumping it up solves the problem. @maryia-lapata created #23268 for that.

elasticmachine · 2018-09-18T17:53:18Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

azasypkin · 2018-09-18T13:30:08Z

src/ui/public/notify/banners.tsx

  /**
   * Add a new banner.
   *
   * @param {Object} component The React component to display.


optional nit: JSDoc here and in set is completely invalid, there is a banner argument with component property, optional priority argument, no need in JSDoc types etc., but since it was here before feel free to keep it as is.

azasypkin · 2018-09-18T13:55:15Z

src/ui/public/notify/banners/BANNERS.md

@@ -1,360 +0,0 @@
-# Banners


question: is this README completely irrelevant now so that we remove it?

azasypkin · 2018-09-18T14:08:18Z

src/core/public/notifications/notifications_service.test.ts

+  notifications.start();
+  notifications.stop();
+
+  expect(BannersService.prototype.stop).toHaveBeenCalledTimes(1);


question: what is the value in these two toHaveBeenCalled.... asserts? It seems what you want to check will be enforced by the expect.assertions(...); anyway?

azasypkin · 2018-09-18T14:10:36Z

src/core/public/notifications/banners/index.ts


-export { GlobalBannerList } from './global_banner_list';
-export { banners } from './banners';
+export { Banners, Banner, BannersService, BannersStartContract } from './banners_service';


question: do you really need to re-export anything except for BannersService and BannersStartContract?

azasypkin · 2018-09-18T14:31:21Z

src/core/public/notifications/banners/components/global_banner_item.tsx

+  private unrenderBanner?: () => void;
+
+  public componentDidMount() {
+    if (!this.ref.current) {


optional nit: we repeat very similar piece of code twice, would it make sense to move some logic into, let's say, renderBanner and reuse it in both componentDidMount and componentDidUpdate?

private renderBanner() { if (this.unrenderBanner) { this.unrenderBanner(); } if (!this.ref.current) { throw new Error('<GlobalBanner /> mounted without ref'); } this.unrenderBanner = this.props.banner.render(this.ref.current) || undefined; }

azasypkin · 2018-09-18T14:39:32Z

src/core/public/notifications/banners/components/global_banner_item.css

-  padding: 16px;
-}
-
 .globalBanner__item + .globalBanner__item {


note: wondering how bad is just .globalBanner__item { margin-botton: 16px; } so that we resort to +...

src/core/public/notifications/banners/containers/global_banners_container.tsx

+
+import { Banners } from '../banners_service';
+import { GlobalBannerList } from '../components/global_banner_list';
+import './global_banner_list.css';


azasypkin · 2018-09-18T18:37:07Z

src/core/public/notifications/banners/components/global_banner_list.test.tsx

+  const component = shallow(<GlobalBannerList banners={[]} />);
+  expect(component).toMatchInlineSnapshot(`
+<div
+  className="globalBanner__list"


question: className looks weird, should it be class?

Not yet facebook/react#13525

Huh, thanks for the link!

azasypkin · 2018-09-18T18:48:30Z

Code looks good, I want to test it locally though. Also CI failures look legit this time, could you please check?

elasticmachine · 2018-09-18T20:27:51Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

spalger · 2018-09-19T12:13:44Z

Okay, I was totally wrong about the need to do this right now. Banners are actually shown inside the app container (not outside the chrome) so we can't even do this until we start rendering the chrome via the new platform. Because of that I'm going to close this for now so I'm closing this until later.

[core/public/banners] migrate ui/notify/banners

4965576

spalger added Team:Core Platform Core services: plugins, logging, config, saved objects, http, ES client, i18n, etc t// Feature:New Platform v7.0.0 v6.5.0 labels Sep 15, 2018

spalger requested a review from azasypkin September 15, 2018 21:37

spalger added the review label Sep 15, 2018

spalger requested a review from epixa September 15, 2018 21:37

epixa suggested changes Sep 17, 2018

View reviewed changes

spalger added 2 commits September 18, 2018 03:24

Merge branch 'master' of github.com:elastic/kibana into migrate-new-p…

39799e1

…latform/global-banners

[core/public/banners] refactor to not expose react in contract, impro…

fc52d56

…ve tests

spalger force-pushed the migrate-new-platform/global-banners branch from 9956a17 to fc52d56 Compare September 18, 2018 12:12

[core/public/banners] remove react/component verbiage from docs

d90a6e7

spalger force-pushed the migrate-new-platform/global-banners branch from 7b9f49b to d90a6e7 Compare September 18, 2018 12:15

spalger added 2 commits September 18, 2018 08:06

[core/public/banners] remove old import

ba227e2

exclude banners from i18n until elastic#23268 is resolved

16cdfff

azasypkin reviewed Sep 18, 2018

View reviewed changes

spalger closed this Sep 19, 2018

spalger deleted the migrate-new-platform/global-banners branch August 18, 2020 17:55

Conversation

spalger commented Sep 15, 2018

Uh oh!

elasticmachine commented Sep 15, 2018

💚 Build Succeeded

Uh oh!

azasypkin commented Sep 17, 2018

Uh oh!

epixa left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

elasticmachine commented Sep 18, 2018

💔 Build Failed

Uh oh!

azasypkin commented Sep 18, 2018 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

elasticmachine commented Sep 18, 2018

💔 Build Failed

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

This comment was marked as resolved.

Uh oh!

This comment was marked as resolved.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

azasypkin commented Sep 18, 2018

Uh oh!

elasticmachine commented Sep 18, 2018

💔 Build Failed

Uh oh!

spalger commented Sep 19, 2018

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

azasypkin commented Sep 18, 2018 •

edited

Loading