Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Enterprise Search] Remove all instances of KibanaContext to Kea store #78513

Merged
merged 9 commits into from
Sep 28, 2020
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@

export { mockHistory, mockLocation } from './react_router_history.mock';
export { mockKibanaContext } from './kibana_context.mock';
export { mockKibanaValues } from './kibana_logic.mock';
export { mockLicensingValues } from './licensing_logic.mock';
export { mockHttpValues } from './http_logic.mock';
export { mockFlashMessagesValues, mockFlashMessagesActions } from './flash_messages_logic.mock';
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
/*
* 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.
*/

export const mockKibanaValues = {
config: { host: 'http://localhost:3002' },
navigateToUrl: jest.fn(),
setBreadcrumbs: jest.fn(),
setDocTitle: jest.fn(),
};
10 changes: 10 additions & 0 deletions x-pack/plugins/enterprise_search/public/applications/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,8 @@ import { getContext, resetContext } from 'kea';
import { I18nProvider } from '@kbn/i18n/react';
import { AppMountParameters, CoreStart, ApplicationStart, ChromeBreadcrumb } from 'src/core/public';
import { PluginsStart, ClientConfigType, ClientData } from '../plugin';

import { mountKibanaLogic } from './shared/kibana';
import { mountLicensingLogic } from './shared/licensing';
import { mountHttpLogic } from './shared/http';
import { mountFlashMessagesLogic } from './shared/flash_messages';
Expand Down Expand Up @@ -47,6 +49,13 @@ export const renderApp = (
resetContext({ createStore: true });
const store = getContext().store as Store;

const unmountKibanaLogic = mountKibanaLogic({
config,
navigateToUrl: core.application.navigateToUrl,
setBreadcrumbs: core.chrome.setBreadcrumbs,
setDocTitle: core.chrome.docTitle.change,
});

const unmountLicensingLogic = mountLicensingLogic({
license$: plugins.licensing.license$,
});
Expand Down Expand Up @@ -80,6 +89,7 @@ export const renderApp = (
);
return () => {
ReactDOM.unmountComponentAtNode(params.element);
unmountKibanaLogic();
unmountLicensingLogic();
unmountHttpLogic();
unmountFlashMessagesLogic();
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
/*
* 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.
*/

export { KibanaLogic, mountKibanaLogic } from './kibana_logic';
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
/*
* 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 { resetContext } from 'kea';

import { mockKibanaValues } from '../../__mocks__';

import { KibanaLogic, mountKibanaLogic } from './kibana_logic';

describe('KibanaLogic', () => {
beforeEach(() => {
jest.clearAllMocks();
resetContext({});
});

describe('mounts', () => {
it('sets values from props', () => {
mountKibanaLogic(mockKibanaValues);

expect(KibanaLogic.values).toEqual(mockKibanaValues);
});

it('gracefully handles missing configs', () => {
mountKibanaLogic({ ...mockKibanaValues, config: undefined } as any);

expect(KibanaLogic.values.config).toEqual({});
});
});
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
/*
* 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 { kea, MakeLogicType } from 'kea';

import { ApplicationStart, ChromeBreadcrumb } from 'src/core/public';

export interface IKibanaValues {
config: { host?: string };
navigateToUrl: ApplicationStart['navigateToUrl'];
setBreadcrumbs(crumbs: ChromeBreadcrumb[]): void;
setDocTitle(title: string): void;
}

export const KibanaLogic = kea<MakeLogicType<IKibanaValues>>({
path: ['enterprise_search', 'kibana_logic'],
reducers: ({ props }) => ({
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice. I didn't realize you could initialize logic with props like this.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah! https://kea.js.org/docs/guide/additional/#props

Although as a warning (I think I mentioned this a few PRs back, but repeating it just as an fyi) if you set a value default to a passed prop without any fallbacks (e.g. someVar: [props.someVar, {}],), if you ever mount without passing a someVar prop the entire Kea/redux instance will error/crash. It's a good way of making sure you always have the data you need I guess? 😄

config: [props.config || {}, {}],
navigateToUrl: [props.navigateToUrl, {}],
setBreadcrumbs: [props.setBreadcrumbs, {}],
setDocTitle: [props.setDocTitle, {}],
}),
});
Comment on lines +18 to +26
Copy link
Contributor Author

@cee-chen cee-chen Sep 24, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Similar to the previous externalUrl PR, I also felt kinda weird that this store essentially just holds some variables that never update or require state, but in the end I decided to stay with a Kea logic file here because:

  1. It's familiar
  2. It's way easier to mock in tests since we already have the mocks/architecture set up

Admittedly those aren't like, super strong reasons heh, so if I'm definitely open to better paradigms if we think of them or if they come up down the road.


export const mountKibanaLogic = (props: IKibanaValues) => {
KibanaLogic(props);
const unmount = KibanaLogic.mount();
return unmount;
};