From d27684cc18b0c967b18ee1808693d73b37902bbe Mon Sep 17 00:00:00 2001 From: Clint Andrew Hall Date: Fri, 11 Mar 2022 13:42:03 -0600 Subject: [PATCH] [shared-ux][packages] 1. Create Services Package --- package.json | 2 + packages/BUILD.bazel | 2 + packages/kbn-shared-ux-services/BUILD.bazel | 124 ++++++++++++++++++ packages/kbn-shared-ux-services/README.mdx | 10 ++ .../kbn-shared-ux-services/jest.config.js | 13 ++ packages/kbn-shared-ux-services/package.json | 8 ++ .../kbn-shared-ux-services/src/context.tsx | 54 ++++++++ packages/kbn-shared-ux-services/src/index.ts | 31 +++++ .../src/services/doc_links.ts | 14 ++ .../src/services/editors.ts | 32 +++++ .../src/services/index.ts | 15 +++ .../src/services/mock}/doc_links.mock.ts | 13 +- .../src/services/mock}/editors.mock.ts | 11 +- .../src/services/mock}/index.ts | 33 +++-- .../src/services/mock}/permissions.mock.ts | 12 +- .../src/services/mock}/platform.mock.ts | 10 +- .../src/services/permissions.ts | 14 ++ .../src/services/platform.ts | 23 ++++ .../src}/services/stub/doc_links.ts | 13 +- .../src}/services/stub/editors.ts | 10 +- .../src}/services/stub/index.ts | 18 ++- .../src}/services/stub/permissions.ts | 10 +- .../src}/services/stub/platform.ts | 10 +- packages/kbn-shared-ux-services/src/types.ts | 46 +++++++ packages/kbn-shared-ux-services/tsconfig.json | 17 +++ .../shared_ux/.storybook/decorators.tsx | 5 +- .../no_data_views/no_data_views.stories.tsx | 13 +- .../no_data_views/no_data_views.test.tsx | 20 ++- .../no_data_views/no_data_views.tsx | 13 +- .../exit_full_screen_button.test.tsx | 13 +- .../exit_full_screen_button.tsx | 3 +- .../shared_ux/public/components/index.ts | 4 +- .../solution_toolbar/button/primary.test.tsx | 14 +- src/plugins/shared_ux/public/index.ts | 8 +- src/plugins/shared_ux/public/plugin.tsx | 8 +- .../shared_ux/public/services/doc_links.ts | 20 ++- .../shared_ux/public/services/editors.ts | 25 ++-- .../public/services/{kibana => }/index.ts | 10 +- .../shared_ux/public/services/index.tsx | 62 --------- .../public/services/kibana/doc_links.ts | 23 ---- .../public/services/kibana/editors.ts | 23 ---- .../public/services/kibana/permissions.ts | 23 ---- .../public/services/kibana/platform.ts | 26 ---- .../shared_ux/public/services/permissions.ts | 18 ++- .../shared_ux/public/services/platform.ts | 29 ++-- .../public/services/storybook/doc_links.ts | 7 +- .../public/services/storybook/editors.ts | 9 +- .../public/services/storybook/index.ts | 5 +- .../public/services/storybook/permissions.ts | 6 +- .../public/services/storybook/platform.ts | 6 +- .../shared_ux/public/services/types.ts | 9 -- yarn.lock | 8 ++ 52 files changed, 637 insertions(+), 318 deletions(-) create mode 100755 packages/kbn-shared-ux-services/BUILD.bazel create mode 100755 packages/kbn-shared-ux-services/README.mdx create mode 100755 packages/kbn-shared-ux-services/jest.config.js create mode 100755 packages/kbn-shared-ux-services/package.json create mode 100644 packages/kbn-shared-ux-services/src/context.tsx create mode 100755 packages/kbn-shared-ux-services/src/index.ts create mode 100644 packages/kbn-shared-ux-services/src/services/doc_links.ts create mode 100644 packages/kbn-shared-ux-services/src/services/editors.ts create mode 100644 packages/kbn-shared-ux-services/src/services/index.ts rename {src/plugins/shared_ux/public/services/mocks => packages/kbn-shared-ux-services/src/services/mock}/doc_links.mock.ts (59%) rename {src/plugins/shared_ux/public/services/mocks => packages/kbn-shared-ux-services/src/services/mock}/editors.mock.ts (62%) rename {src/plugins/shared_ux/public/services/mocks => packages/kbn-shared-ux-services/src/services/mock}/index.ts (55%) rename {src/plugins/shared_ux/public/services/mocks => packages/kbn-shared-ux-services/src/services/mock}/permissions.mock.ts (60%) rename {src/plugins/shared_ux/public/services/mocks => packages/kbn-shared-ux-services/src/services/mock}/platform.mock.ts (70%) create mode 100644 packages/kbn-shared-ux-services/src/services/permissions.ts create mode 100644 packages/kbn-shared-ux-services/src/services/platform.ts rename {src/plugins/shared_ux/public => packages/kbn-shared-ux-services/src}/services/stub/doc_links.ts (52%) rename {src/plugins/shared_ux/public => packages/kbn-shared-ux-services/src}/services/stub/editors.ts (71%) rename {src/plugins/shared_ux/public => packages/kbn-shared-ux-services/src}/services/stub/index.ts (62%) rename {src/plugins/shared_ux/public => packages/kbn-shared-ux-services/src}/services/stub/permissions.ts (67%) rename {src/plugins/shared_ux/public => packages/kbn-shared-ux-services/src}/services/stub/platform.ts (70%) create mode 100755 packages/kbn-shared-ux-services/src/types.ts create mode 100755 packages/kbn-shared-ux-services/tsconfig.json rename src/plugins/shared_ux/public/services/{kibana => }/index.ts (82%) delete mode 100644 src/plugins/shared_ux/public/services/index.tsx delete mode 100644 src/plugins/shared_ux/public/services/kibana/doc_links.ts delete mode 100644 src/plugins/shared_ux/public/services/kibana/editors.ts delete mode 100644 src/plugins/shared_ux/public/services/kibana/permissions.ts delete mode 100644 src/plugins/shared_ux/public/services/kibana/platform.ts diff --git a/package.json b/package.json index 1859756cfe0a7..e1333c9530602 100644 --- a/package.json +++ b/package.json @@ -167,6 +167,7 @@ "@kbn/securitysolution-utils": "link:bazel-bin/packages/kbn-securitysolution-utils", "@kbn/server-http-tools": "link:bazel-bin/packages/kbn-server-http-tools", "@kbn/server-route-repository": "link:bazel-bin/packages/kbn-server-route-repository", + "@kbn/shared-ux-services": "link:bazel-bin/packages/kbn-shared-ux-services", "@kbn/std": "link:bazel-bin/packages/kbn-std", "@kbn/timelion-grammar": "link:bazel-bin/packages/kbn-timelion-grammar", "@kbn/tinymath": "link:bazel-bin/packages/kbn-tinymath", @@ -196,6 +197,7 @@ "@turf/helpers": "6.0.1", "@turf/length": "^6.0.2", "@types/jsonwebtoken": "^8.5.6", + "@types/kbn__shared-ux-services": "link:bazel-bin/packages/kbn-shared-ux-services/npm_module_types", "@types/moment-duration-format": "^2.2.3", "JSONStream": "1.3.5", "abort-controller": "^3.0.0", diff --git a/packages/BUILD.bazel b/packages/BUILD.bazel index 66361060f1ee6..a9fb72fb96b7c 100644 --- a/packages/BUILD.bazel +++ b/packages/BUILD.bazel @@ -65,6 +65,7 @@ filegroup( "//packages/kbn-securitysolution-utils:build", "//packages/kbn-server-http-tools:build", "//packages/kbn-server-route-repository:build", + "//packages/kbn-shared-ux-services:build", "//packages/kbn-spec-to-console:build", "//packages/kbn-std:build", "//packages/kbn-storybook:build", @@ -138,6 +139,7 @@ filegroup( "//packages/kbn-securitysolution-utils:build_types", "//packages/kbn-server-http-tools:build_types", "//packages/kbn-server-route-repository:build_types", + "//packages/kbn-shared-ux-services:build_types", "//packages/kbn-std:build_types", "//packages/kbn-storybook:build_types", "//packages/kbn-telemetry-tools:build_types", diff --git a/packages/kbn-shared-ux-services/BUILD.bazel b/packages/kbn-shared-ux-services/BUILD.bazel new file mode 100755 index 0000000000000..fc430e3a68c4c --- /dev/null +++ b/packages/kbn-shared-ux-services/BUILD.bazel @@ -0,0 +1,124 @@ +load("@npm//@bazel/typescript:index.bzl", "ts_config") +load("@build_bazel_rules_nodejs//:index.bzl", "js_library") +load("//src/dev/bazel:index.bzl", "jsts_transpiler", "pkg_npm", "pkg_npm_types", "ts_project") + +PKG_DIRNAME = "kbn-shared-ux-services" +PKG_REQUIRE_NAME = "@kbn/shared-ux-services" + +SOURCE_FILES = glob( + [ + "src/**/*.ts", + "src/**/*.tsx", + ], + exclude = [ + "**/*.test.*", + ], +) + +SRCS = SOURCE_FILES + +filegroup( + name = "srcs", + srcs = SRCS, +) + +NPM_MODULE_EXTRA_FILES = [ + "package.json", +] + +# In this array place runtime dependencies, including other packages and NPM packages +# which must be available for this code to run. +# +# To reference other packages use: +# "//repo/relative/path/to/package" +# eg. "//packages/kbn-utils" +# +# To reference a NPM package use: +# "@npm//name-of-package" +# eg. "@npm//lodash" +RUNTIME_DEPS = [ + "@npm//react", +] + +# In this array place dependencies necessary to build the types, which will include the +# :npm_module_types target of other packages and packages from NPM, including @types/* +# packages. +# +# To reference the types for another package use: +# "//repo/relative/path/to/package:npm_module_types" +# eg. "//packages/kbn-utils:npm_module_types" +# +# References to NPM packages work the same as RUNTIME_DEPS +TYPES_DEPS = [ + "@npm//@types/node", + "@npm//@types/jest", + "@npm//@types/react", +] + +jsts_transpiler( + name = "target_node", + srcs = SRCS, + build_pkg_name = package_name(), +) + +jsts_transpiler( + name = "target_web", + srcs = SRCS, + build_pkg_name = package_name(), + web = True, +) + +ts_config( + name = "tsconfig", + src = "tsconfig.json", + deps = [ + "//:tsconfig.base.json", + "//:tsconfig.bazel.json", + ], +) + +ts_project( + name = "tsc_types", + args = ['--pretty'], + srcs = SRCS, + deps = TYPES_DEPS, + declaration = True, + emit_declaration_only = True, + out_dir = "target_types", + root_dir = "src", + tsconfig = ":tsconfig", +) + +js_library( + name = PKG_DIRNAME, + srcs = NPM_MODULE_EXTRA_FILES, + deps = RUNTIME_DEPS + [":target_node", ":target_web"], + package_name = PKG_REQUIRE_NAME, + visibility = ["//visibility:public"], +) + +pkg_npm( + name = "npm_module", + deps = [":" + PKG_DIRNAME], +) + +filegroup( + name = "build", + srcs = [":npm_module"], + visibility = ["//visibility:public"], +) + +pkg_npm_types( + name = "npm_module_types", + srcs = SRCS, + deps = [":tsc_types"], + package_name = PKG_REQUIRE_NAME, + tsconfig = ":tsconfig", + visibility = ["//visibility:public"], +) + +filegroup( + name = "build_types", + srcs = [":npm_module_types"], + visibility = ["//visibility:public"], +) diff --git a/packages/kbn-shared-ux-services/README.mdx b/packages/kbn-shared-ux-services/README.mdx new file mode 100755 index 0000000000000..ac823c6359df0 --- /dev/null +++ b/packages/kbn-shared-ux-services/README.mdx @@ -0,0 +1,10 @@ +--- +id: kibSharedUXServices +slug: /kibana-dev-docs/shared-ux/packages/kbn-shared-ux-services +title: Shared UX Services +summary: +date: 2022-03-11 +tags: ['kibana', 'dev', 'sharedUX'] +--- + +> TODO diff --git a/packages/kbn-shared-ux-services/jest.config.js b/packages/kbn-shared-ux-services/jest.config.js new file mode 100755 index 0000000000000..f1ef008d0f62d --- /dev/null +++ b/packages/kbn-shared-ux-services/jest.config.js @@ -0,0 +1,13 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +module.exports = { + preset: '@kbn/test', + rootDir: '../..', + roots: ['/packages/kbn-shared-ux-services'], +}; diff --git a/packages/kbn-shared-ux-services/package.json b/packages/kbn-shared-ux-services/package.json new file mode 100755 index 0000000000000..7d7d999bf6961 --- /dev/null +++ b/packages/kbn-shared-ux-services/package.json @@ -0,0 +1,8 @@ +{ + "name": "@kbn/shared-ux-services", + "private": true, + "version": "1.0.0", + "main": "./target_node/index.js", + "browser": "./target_web/index.js", + "license": "SSPL-1.0 OR Elastic License 2.0" +} diff --git a/packages/kbn-shared-ux-services/src/context.tsx b/packages/kbn-shared-ux-services/src/context.tsx new file mode 100644 index 0000000000000..c28e0d2d299fb --- /dev/null +++ b/packages/kbn-shared-ux-services/src/context.tsx @@ -0,0 +1,54 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +import React, { FC, createContext, useContext } from 'react'; + +import type { SharedUxServices } from './types'; +import { stubServicesFactory } from './services'; + +// The React Context used to provide the services to the SharedUX components. +const SharedUxServicesContext = createContext(stubServicesFactory()); + +/** + * The `React.Context` Provider component for the `SharedUxServices` context. Any + * plugin or environment that consumes SharedUX components needs to wrap their React + * tree with this provider. + * + * Within a plugin, you can use use the Shared UX plugin and retrieve a fully-configured + * context from the `start` contract. + */ +export const SharedUxServicesProvider: FC = ({ children, ...services }) => ( + {children} +); + +/** + * React hook for accessing pre-wired `SharedUxServices`. + */ +export function useSharedUxServices() { + return useContext(SharedUxServicesContext); +} + +/** + * React hook for accessing the pre-wired `SharedUxPlatformService`. + */ +export const usePlatformService = () => useSharedUxServices().platform; + +/** + * React hook for accessing the pre-wired `SharedUxPermissionsService`. + */ +export const usePermissions = () => useSharedUxServices().permissions; + +/** + * React hook for accessing the pre-wired `SharedUxEditorsService`. + */ +export const useEditors = () => useSharedUxServices().editors; + +/** + * React hook for accessing the pre-wired `SharedUxDocLinksService`. + */ +export const useDocLinks = () => useSharedUxServices().docLinks; diff --git a/packages/kbn-shared-ux-services/src/index.ts b/packages/kbn-shared-ux-services/src/index.ts new file mode 100755 index 0000000000000..073209e8ba5de --- /dev/null +++ b/packages/kbn-shared-ux-services/src/index.ts @@ -0,0 +1,31 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +export type { ServiceFactory, SharedUxServices, SharedUxServicesContext } from './types'; +export type { + SharedUxDocLinksService, + SharedUxEditorsService, + SharedUxPlatformService, + SharedUxUserPermissionsService, +} from './services'; + +export { + SharedUxServicesProvider, + useDocLinks, + useEditors, + usePermissions, + usePlatformService, + useSharedUxServices, +} from './context'; + +export { + mockServiceFactories, + mockServicesFactory, + stubServiceFactories, + stubServicesFactory, +} from './services'; diff --git a/packages/kbn-shared-ux-services/src/services/doc_links.ts b/packages/kbn-shared-ux-services/src/services/doc_links.ts new file mode 100644 index 0000000000000..5de2d1a9e6ffe --- /dev/null +++ b/packages/kbn-shared-ux-services/src/services/doc_links.ts @@ -0,0 +1,14 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +/** + * A service providing links to documentation about various features in Kibana. + */ +export interface SharedUxDocLinksService { + dataViewsDocLink: string; +} diff --git a/packages/kbn-shared-ux-services/src/services/editors.ts b/packages/kbn-shared-ux-services/src/services/editors.ts new file mode 100644 index 0000000000000..146a6077232a1 --- /dev/null +++ b/packages/kbn-shared-ux-services/src/services/editors.ts @@ -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 + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +/** + * TODO: `DataView` is a class exported by `src/plugins/data_views/public`. Since this service + * is contained in this package-- and packages should be stateless and shouldn't depend on + * plugins-- we have to set this to `unknown`. If and when `DataView` is exported from a + * stateless package, we can remove this. + */ +type DataView = unknown; + +/** + * A subset of the `DataViewEditorOptions` interface relevant to our service and components. + * + * @see: src/plugins/data_view_editor/public/types.ts + */ +interface DataViewEditorOptions { + onSave: (dataView: DataView) => void; +} + +/** + * A service providing methods to invoke and interact with various editors provided + * in Kibana. + */ +export interface SharedUxEditorsService { + openDataViewEditor: (options: DataViewEditorOptions) => () => void; +} diff --git a/packages/kbn-shared-ux-services/src/services/index.ts b/packages/kbn-shared-ux-services/src/services/index.ts new file mode 100644 index 0000000000000..6156ebb1a2423 --- /dev/null +++ b/packages/kbn-shared-ux-services/src/services/index.ts @@ -0,0 +1,15 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +export type { SharedUxDocLinksService } from './doc_links'; +export type { SharedUxEditorsService } from './editors'; +export type { SharedUxUserPermissionsService } from './permissions'; +export type { SharedUxPlatformService } from './platform'; + +export { mockServicesFactory, mockServiceFactories } from './mock'; +export { stubServicesFactory, stubServiceFactories } from './stub'; diff --git a/src/plugins/shared_ux/public/services/mocks/doc_links.mock.ts b/packages/kbn-shared-ux-services/src/services/mock/doc_links.mock.ts similarity index 59% rename from src/plugins/shared_ux/public/services/mocks/doc_links.mock.ts rename to packages/kbn-shared-ux-services/src/services/mock/doc_links.mock.ts index 28cfa14c50d28..378ead63fbc9f 100644 --- a/src/plugins/shared_ux/public/services/mocks/doc_links.mock.ts +++ b/packages/kbn-shared-ux-services/src/services/mock/doc_links.mock.ts @@ -6,14 +6,17 @@ * Side Public License, v 1. */ -import { PluginServiceFactory } from '../types'; -import { SharedUXDocLinksService } from '../doc_links'; +import type { ServiceFactory } from '../../types'; +import type { SharedUxDocLinksService } from '../doc_links'; -export type MockDockLinksServiceFactory = PluginServiceFactory; +/** + * A factory function for creating a Jest implementation of `SharedUxDocLinksService`. + */ +export type MockDockLinksServiceFactory = ServiceFactory; /** - * A factory function for creating a Jest-based implementation of `SharedUXDocLinksService`. + * A factory function for creating a Jest-based implementation of `SharedUxDocLinksService`. */ export const docLinksServiceFactory: MockDockLinksServiceFactory = () => ({ - dataViewsDocsLink: 'dummy link', + dataViewsDocLink: 'dummy link', }); diff --git a/src/plugins/shared_ux/public/services/mocks/editors.mock.ts b/packages/kbn-shared-ux-services/src/services/mock/editors.mock.ts similarity index 62% rename from src/plugins/shared_ux/public/services/mocks/editors.mock.ts rename to packages/kbn-shared-ux-services/src/services/mock/editors.mock.ts index 28a89d5326d62..80742f15d93cd 100644 --- a/src/plugins/shared_ux/public/services/mocks/editors.mock.ts +++ b/packages/kbn-shared-ux-services/src/services/mock/editors.mock.ts @@ -6,13 +6,16 @@ * Side Public License, v 1. */ -import { PluginServiceFactory } from '../types'; -import { SharedUXEditorsService } from '../editors'; +import type { ServiceFactory } from '../../types'; +import type { SharedUxEditorsService } from '../editors'; -export type MockEditorsServiceFactory = PluginServiceFactory; +/** + * A factory function for creating a Jest-based implementation of `SharedUxEditorsService`. + */ +export type MockEditorsServiceFactory = ServiceFactory; /** - * A factory function for creating a Jest-based implementation of `SharedUXEditorsService`. + * A factory function for creating a Jest-based implementation of `SharedUxEditorsService`. */ export const editorsServiceFactory: MockEditorsServiceFactory = () => ({ openDataViewEditor: jest.fn(), diff --git a/src/plugins/shared_ux/public/services/mocks/index.ts b/packages/kbn-shared-ux-services/src/services/mock/index.ts similarity index 55% rename from src/plugins/shared_ux/public/services/mocks/index.ts rename to packages/kbn-shared-ux-services/src/services/mock/index.ts index 9fce633c52539..35c5c0f4335ed 100644 --- a/src/plugins/shared_ux/public/services/mocks/index.ts +++ b/packages/kbn-shared-ux-services/src/services/mock/index.ts @@ -5,23 +5,40 @@ * in compliance with, at your election, the Elastic License 2.0 or the Server * Side Public License, v 1. */ -import { docLinksServiceFactory } from './doc_links.mock'; -export type { MockPlatformServiceFactory } from './platform.mock'; -export { platformServiceFactory } from './platform.mock'; +import type { SharedUxServices, ServiceFactory } from '../../types'; -import type { SharedUXServices } from '../.'; -import { PluginServiceFactory } from '../types'; +import { docLinksServiceFactory } from './doc_links.mock'; +import { editorsServiceFactory } from './editors.mock'; import { platformServiceFactory } from './platform.mock'; import { userPermissionsServiceFactory } from './permissions.mock'; -import { editorsServiceFactory } from './editors.mock'; + +export type { MockDockLinksServiceFactory } from './doc_links.mock'; +export type { MockEditorsServiceFactory } from './editors.mock'; +export type { MockPlatformServiceFactory } from './platform.mock'; +export type { MockUserPermissionsServiceFactory } from './permissions.mock'; + +export { docLinksServiceFactory } from './doc_links.mock'; +export { editorsServiceFactory } from './editors.mock'; +export { userPermissionsServiceFactory } from './permissions.mock'; +export { platformServiceFactory } from './platform.mock'; /** - * A factory function for creating a Jest-based implementation of `SharedUXServices`. + * A factory function for creating a Jest-based implementation of `SharedUxServices`. */ -export const servicesFactory: PluginServiceFactory = () => ({ +export const mockServicesFactory: ServiceFactory = () => ({ platform: platformServiceFactory(), permissions: userPermissionsServiceFactory(), editors: editorsServiceFactory(), docLinks: docLinksServiceFactory(), }); + +/** + * A collection of mock Service Factories. + */ +export const mockServiceFactories = { + docLinksServiceFactory, + editorsServiceFactory, + platformServiceFactory, + userPermissionsServiceFactory, +}; diff --git a/src/plugins/shared_ux/public/services/mocks/permissions.mock.ts b/packages/kbn-shared-ux-services/src/services/mock/permissions.mock.ts similarity index 60% rename from src/plugins/shared_ux/public/services/mocks/permissions.mock.ts rename to packages/kbn-shared-ux-services/src/services/mock/permissions.mock.ts index ff65d2393248a..7f719cab7f31c 100644 --- a/src/plugins/shared_ux/public/services/mocks/permissions.mock.ts +++ b/packages/kbn-shared-ux-services/src/services/mock/permissions.mock.ts @@ -6,14 +6,16 @@ * Side Public License, v 1. */ -import { PluginServiceFactory } from '../types'; -import { SharedUXUserPermissionsService } from '../permissions'; +import type { ServiceFactory } from '../../types'; +import type { SharedUxUserPermissionsService } from '../permissions'; -export type MockUserPermissionsServiceFactory = - PluginServiceFactory; +/** + * A factory function for creating a Jest-based implementation of `SharedUxUserPermissionsService`. + */ +export type MockUserPermissionsServiceFactory = ServiceFactory; /** - * A factory function for creating a Jest-based implementation of `SharedUXUserPermissionsService`. + * A factory function for creating a Jest-based implementation of `SharedUxUserPermissionsService`. */ export const userPermissionsServiceFactory: MockUserPermissionsServiceFactory = () => ({ canCreateNewDataView: true, diff --git a/src/plugins/shared_ux/public/services/mocks/platform.mock.ts b/packages/kbn-shared-ux-services/src/services/mock/platform.mock.ts similarity index 70% rename from src/plugins/shared_ux/public/services/mocks/platform.mock.ts rename to packages/kbn-shared-ux-services/src/services/mock/platform.mock.ts index c36d63cfcacbe..8e6ec205d2856 100644 --- a/src/plugins/shared_ux/public/services/mocks/platform.mock.ts +++ b/packages/kbn-shared-ux-services/src/services/mock/platform.mock.ts @@ -6,16 +6,16 @@ * Side Public License, v 1. */ -import type { PluginServiceFactory } from '../types'; -import type { SharedUXPlatformService } from '../platform'; +import type { ServiceFactory } from '../../types'; +import type { SharedUxPlatformService } from '../platform'; /** - * A factory function for creating a Jest-based implementation of `SharedUXPlatformService`. + * A factory function for creating a Jest-based implementation of `SharedUxPlatformService`. */ -export type MockPlatformServiceFactory = PluginServiceFactory; +export type MockPlatformServiceFactory = ServiceFactory; /** - * A factory function for creating a Jest-based implementation of `SharedUXPlatformService`. + * A factory function for creating a Jest-based implementation of `SharedUxPlatformService`. */ export const platformServiceFactory: MockPlatformServiceFactory = () => ({ setIsFullscreen: jest.fn(), diff --git a/packages/kbn-shared-ux-services/src/services/permissions.ts b/packages/kbn-shared-ux-services/src/services/permissions.ts new file mode 100644 index 0000000000000..f4d327343dd4d --- /dev/null +++ b/packages/kbn-shared-ux-services/src/services/permissions.ts @@ -0,0 +1,14 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +/** + * A service providing permissions information, typically for the current user. + */ +export interface SharedUxUserPermissionsService { + canCreateNewDataView: boolean; +} diff --git a/packages/kbn-shared-ux-services/src/services/platform.ts b/packages/kbn-shared-ux-services/src/services/platform.ts new file mode 100644 index 0000000000000..f71776bcfa446 --- /dev/null +++ b/packages/kbn-shared-ux-services/src/services/platform.ts @@ -0,0 +1,23 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +/** + * A service providing methods to interact with the platform in which this code is + * running, (almost always Kibana). + * + * Rather than provide the entire `CoreStart` contract to components, we provide simplified + * abstractions around a use case specific to Shared UX. This way, we know exactly how the + * `CoreStart` and other plugins are used. This makes mocking and refactoring easier when + * upstream dependencies change. + */ +export interface SharedUxPlatformService { + /** + * Sets the fullscreen state of the chrome. + */ + setIsFullscreen: (isFullscreen: boolean) => void; +} diff --git a/src/plugins/shared_ux/public/services/stub/doc_links.ts b/packages/kbn-shared-ux-services/src/services/stub/doc_links.ts similarity index 52% rename from src/plugins/shared_ux/public/services/stub/doc_links.ts rename to packages/kbn-shared-ux-services/src/services/stub/doc_links.ts index 424a24c578539..6d22eed944521 100644 --- a/src/plugins/shared_ux/public/services/stub/doc_links.ts +++ b/packages/kbn-shared-ux-services/src/services/stub/doc_links.ts @@ -6,14 +6,17 @@ * Side Public License, v 1. */ -import { PluginServiceFactory } from '../types'; -import { SharedUXDocLinksService } from '../doc_links'; +import type { ServiceFactory } from '../../types'; +import type { SharedUxDocLinksService } from '../doc_links'; -export type DockLinksServiceFactory = PluginServiceFactory; +/** + * A factory function for creating a stubbed implementation of `SharedUxDocLinksService`. + */ +export type DockLinksServiceFactory = ServiceFactory; /** - * A factory function for creating a Jest-based implementation of `SharedUXDocLinksService`. + * A factory function for creating a stubbed implementation of `SharedUxDocLinksService`. */ export const docLinksServiceFactory: DockLinksServiceFactory = () => ({ - dataViewsDocsLink: 'docs', + dataViewsDocLink: 'docs', }); diff --git a/src/plugins/shared_ux/public/services/stub/editors.ts b/packages/kbn-shared-ux-services/src/services/stub/editors.ts similarity index 71% rename from src/plugins/shared_ux/public/services/stub/editors.ts rename to packages/kbn-shared-ux-services/src/services/stub/editors.ts index 03fea5e6c98b5..545539d873941 100644 --- a/src/plugins/shared_ux/public/services/stub/editors.ts +++ b/packages/kbn-shared-ux-services/src/services/stub/editors.ts @@ -6,16 +6,16 @@ * Side Public License, v 1. */ -import { PluginServiceFactory } from '../types'; -import { SharedUXEditorsService } from '../editors'; +import type { ServiceFactory } from '../../types'; +import type { SharedUxEditorsService } from '../editors'; /** - * A factory function for creating a simple stubbed implementation of `SharedUXEditorsService`. + * A factory function for creating a simple stubbed implementation of `SharedUxEditorsService`. */ -export type EditorsServiceFactory = PluginServiceFactory; +export type EditorsServiceFactory = ServiceFactory; /** - * A factory function for creating a simple stubbed implementation of `SharedUXEditorsService`. + * A factory function for creating a simple stubbed implementation of `SharedUxEditorsService`. */ export const editorsServiceFactory: EditorsServiceFactory = () => ({ openDataViewEditor: () => () => {}, diff --git a/src/plugins/shared_ux/public/services/stub/index.ts b/packages/kbn-shared-ux-services/src/services/stub/index.ts similarity index 62% rename from src/plugins/shared_ux/public/services/stub/index.ts rename to packages/kbn-shared-ux-services/src/services/stub/index.ts index 9e4fa8f03133a..ed9deecd5097c 100644 --- a/src/plugins/shared_ux/public/services/stub/index.ts +++ b/packages/kbn-shared-ux-services/src/services/stub/index.ts @@ -6,19 +6,29 @@ * Side Public License, v 1. */ -import type { SharedUXServices } from '../.'; -import { PluginServiceFactory } from '../types'; +import type { SharedUxServices, ServiceFactory } from '../../types'; + import { platformServiceFactory } from './platform'; import { userPermissionsServiceFactory } from './permissions'; import { editorsServiceFactory } from './editors'; import { docLinksServiceFactory } from './doc_links'; /** - * A factory function for creating a simple stubbed implemetation of `SharedUXServices`. + * A factory function for creating simple stubbed implementations of all `SharedUxServices`. */ -export const servicesFactory: PluginServiceFactory = () => ({ +export const stubServicesFactory: ServiceFactory = () => ({ platform: platformServiceFactory(), permissions: userPermissionsServiceFactory(), editors: editorsServiceFactory(), docLinks: docLinksServiceFactory(), }); + +/** + * A collection of stubbed service factories. + */ +export const stubServiceFactories = { + docLinksServiceFactory, + editorsServiceFactory, + platformServiceFactory, + userPermissionsServiceFactory, +}; diff --git a/src/plugins/shared_ux/public/services/stub/permissions.ts b/packages/kbn-shared-ux-services/src/services/stub/permissions.ts similarity index 67% rename from src/plugins/shared_ux/public/services/stub/permissions.ts rename to packages/kbn-shared-ux-services/src/services/stub/permissions.ts index c51abf41e2842..60b59d19b703a 100644 --- a/src/plugins/shared_ux/public/services/stub/permissions.ts +++ b/packages/kbn-shared-ux-services/src/services/stub/permissions.ts @@ -6,16 +6,16 @@ * Side Public License, v 1. */ -import { PluginServiceFactory } from '../types'; -import { SharedUXUserPermissionsService } from '../permissions'; +import type { ServiceFactory } from '../../types'; +import type { SharedUxUserPermissionsService } from '../permissions'; /** - * A factory function for creating a simple stubbed implementation of `SharedUXUserPermissionsService`. + * A factory function for creating a simple stubbed implementation of `SharedUxUserPermissionsService`. */ -export type UserPermissionsServiceFactory = PluginServiceFactory; +export type UserPermissionsServiceFactory = ServiceFactory; /** - * A factory function for creating a simple stubbed implementation of `SharedUXUserPermissionsService`. + * A factory function for creating a simple stubbed implementation of `SharedUxUserPermissionsService`. */ export const userPermissionsServiceFactory: UserPermissionsServiceFactory = () => ({ canCreateNewDataView: true, diff --git a/src/plugins/shared_ux/public/services/stub/platform.ts b/packages/kbn-shared-ux-services/src/services/stub/platform.ts similarity index 70% rename from src/plugins/shared_ux/public/services/stub/platform.ts rename to packages/kbn-shared-ux-services/src/services/stub/platform.ts index 90fa8edb3e06e..2e31238347307 100644 --- a/src/plugins/shared_ux/public/services/stub/platform.ts +++ b/packages/kbn-shared-ux-services/src/services/stub/platform.ts @@ -6,16 +6,16 @@ * Side Public License, v 1. */ -import { PluginServiceFactory } from '../types'; -import { SharedUXPlatformService } from '../platform'; +import type { ServiceFactory } from '../../types'; +import type { SharedUxPlatformService } from '../platform'; /** - * A factory function for creating a simple stubbed implementation of `SharedUXPlatformService`. + * A factory function for creating a simple stubbed implementation of `SharedUxPlatformService`. */ -export type PlatformServiceFactory = PluginServiceFactory; +export type PlatformServiceFactory = ServiceFactory; /** - * A factory function for creating a simple stubbed implementation of `SharedUXPlatformService`. + * A factory function for creating a simple stubbed implementation of `SharedUxPlatformService`. */ export const platformServiceFactory: PlatformServiceFactory = () => ({ setIsFullscreen: (_isFullscreen) => {}, diff --git a/packages/kbn-shared-ux-services/src/types.ts b/packages/kbn-shared-ux-services/src/types.ts new file mode 100755 index 0000000000000..57854290b16ec --- /dev/null +++ b/packages/kbn-shared-ux-services/src/types.ts @@ -0,0 +1,46 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +import { FC } from 'react'; + +import { + SharedUxPlatformService, + SharedUxUserPermissionsService, + SharedUxEditorsService, + SharedUxDocLinksService, +} from './services'; + +/** + * A collection of services utilized by SharedUX. This serves as a thin + * abstraction layer between services provided by Kibana and other plugins + * while allowing this plugin to be developed independently of those contracts. + * + * It also allows us to "swap out" differenct implementations of these services + * for different environments, (e.g. Jest, Storybook, etc.) + */ +export interface SharedUxServices { + platform: SharedUxPlatformService; + permissions: SharedUxUserPermissionsService; + editors: SharedUxEditorsService; + docLinks: SharedUxDocLinksService; +} + +/** + * A type representing a component that provides the `SharedUxServices` through a + * React Context. + */ +export type SharedUxServicesContext = FC<{}>; + +/** + * A factory function for creating one or more services. + * + * The `S` generic determines the shape of the API being produced. + * The `Parameters` generic determines what parameters are expected to + * create the service. + */ +export type ServiceFactory = (params: Parameters) => S; diff --git a/packages/kbn-shared-ux-services/tsconfig.json b/packages/kbn-shared-ux-services/tsconfig.json new file mode 100755 index 0000000000000..a8cfc2cceb08b --- /dev/null +++ b/packages/kbn-shared-ux-services/tsconfig.json @@ -0,0 +1,17 @@ +{ + "extends": "../../tsconfig.bazel.json", + "compilerOptions": { + "declaration": true, + "emitDeclarationOnly": true, + "outDir": "target_types", + "rootDir": "src", + "stripInternal": false, + "types": [ + "jest", + "node" + ] + }, + "include": [ + "src/**/*" + ] +} diff --git a/src/plugins/shared_ux/.storybook/decorators.tsx b/src/plugins/shared_ux/.storybook/decorators.tsx index c17af2cda0406..1d1f8fa9f932a 100644 --- a/src/plugins/shared_ux/.storybook/decorators.tsx +++ b/src/plugins/shared_ux/.storybook/decorators.tsx @@ -8,7 +8,8 @@ import React from 'react'; import { DecoratorFn } from '@storybook/react'; -import { ServicesProvider } from '../public/services'; +import { SharedUxServicesProvider } from '@kbn/shared-ux-services'; + import { servicesFactory } from '../public/services/storybook'; /** @@ -16,5 +17,5 @@ import { servicesFactory } from '../public/services/storybook'; * implementations to stories. */ export const servicesDecorator: DecoratorFn = (storyFn) => ( - {storyFn()} + {storyFn()} ); diff --git a/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.stories.tsx b/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.stories.tsx index 3f9ae1958cad7..ced409430f87c 100644 --- a/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.stories.tsx +++ b/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.stories.tsx @@ -8,8 +8,6 @@ import React from 'react'; import { action } from '@storybook/addon-actions'; -import { docLinksServiceFactory } from '../../../services/storybook/doc_links'; - import { NoDataViews as NoDataViewsComponent, Props } from './no_data_views.component'; import { NoDataViews } from './no_data_views'; @@ -26,12 +24,7 @@ export default { }; export const ConnectedComponent = () => { - return ( - - ); + return ; }; type Params = Pick; @@ -45,8 +38,4 @@ PureComponent.argTypes = { control: 'boolean', defaultValue: true, }, - dataViewsDocLink: { - options: [docLinksServiceFactory().dataViewsDocsLink, undefined], - control: { type: 'radio' }, - }, }; diff --git a/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.test.tsx b/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.test.tsx index 650d78fa64a03..bb067544013c8 100644 --- a/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.test.tsx +++ b/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.test.tsx @@ -12,18 +12,21 @@ import { ReactWrapper } from 'enzyme'; import { mountWithIntl } from '@kbn/test-jest-helpers'; import { EuiButton } from '@elastic/eui'; -import { ServicesProvider, SharedUXServices } from '../../../services'; -import { servicesFactory } from '../../../services/mocks'; +import { + SharedUxServicesProvider, + SharedUxServices, + mockServicesFactory, +} from '@kbn/shared-ux-services'; import { NoDataViews } from './no_data_views'; describe('', () => { - let services: SharedUXServices; + let services: SharedUxServices; let mount: (element: JSX.Element) => ReactWrapper; beforeEach(() => { - services = servicesFactory(); + services = mockServicesFactory(); mount = (element: JSX.Element) => - mountWithIntl({element}); + mountWithIntl({element}); }); afterEach(() => { @@ -31,12 +34,7 @@ describe('', () => { }); test('on dataView created', () => { - const component = mount( - - ); + const component = mount(); expect(services.editors.openDataViewEditor).not.toHaveBeenCalled(); component.find(EuiButton).simulate('click'); diff --git a/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.tsx b/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.tsx index 01494d2c8a5b3..c7a0bd1a6e9c7 100644 --- a/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.tsx +++ b/src/plugins/shared_ux/public/components/empty_state/no_data_views/no_data_views.tsx @@ -8,18 +8,18 @@ import React, { useCallback, useEffect, useRef } from 'react'; +import { useEditors, usePermissions, useDocLinks } from '@kbn/shared-ux-services'; +import type { SharedUxEditorsService } from '@kbn/shared-ux-services'; + import { DataView } from '../../../../../data_views/public'; -import { useEditors, usePermissions } from '../../../services'; -import type { SharedUXEditorsService } from '../../../services/editors'; import { NoDataViews as NoDataViewsComponent } from './no_data_views.component'; export interface Props { onDataViewCreated: (dataView: DataView) => void; - dataViewsDocLink: string; } -type CloseDataViewEditorFn = ReturnType; +type CloseDataViewEditorFn = ReturnType; /** * A service-enabled component that provides Kibana-specific functionality to the `NoDataViews` @@ -30,9 +30,10 @@ type CloseDataViewEditorFn = ReturnType { +export const NoDataViews = ({ onDataViewCreated }: Props) => { const { canCreateNewDataView } = usePermissions(); const { openDataViewEditor } = useEditors(); + const { dataViewsDocLink } = useDocLinks(); const closeDataViewEditor = useRef(); useEffect(() => { @@ -59,7 +60,7 @@ export const NoDataViews = ({ onDataViewCreated, dataViewsDocLink }: Props) => { const ref = openDataViewEditor({ onSave: (dataView) => { - onDataViewCreated(dataView); + onDataViewCreated(dataView as DataView); }, }); diff --git a/src/plugins/shared_ux/public/components/exit_full_screen_button/exit_full_screen_button.test.tsx b/src/plugins/shared_ux/public/components/exit_full_screen_button/exit_full_screen_button.test.tsx index dc634810a5794..da205ddfbe377 100644 --- a/src/plugins/shared_ux/public/components/exit_full_screen_button/exit_full_screen_button.test.tsx +++ b/src/plugins/shared_ux/public/components/exit_full_screen_button/exit_full_screen_button.test.tsx @@ -10,18 +10,21 @@ import React from 'react'; import { mount as enzymeMount, ReactWrapper } from 'enzyme'; import { keys } from '@elastic/eui'; -import { ServicesProvider, SharedUXServices } from '../../services'; -import { servicesFactory } from '../../services/mocks'; +import { + SharedUxServicesProvider, + SharedUxServices, + mockServicesFactory, +} from '@kbn/shared-ux-services'; import { ExitFullScreenButton } from './exit_full_screen_button'; describe('', () => { - let services: SharedUXServices; + let services: SharedUxServices; let mount: (element: JSX.Element) => ReactWrapper; beforeEach(() => { - services = servicesFactory(); + services = mockServicesFactory(); mount = (element: JSX.Element) => - enzymeMount({element}); + enzymeMount({element}); }); afterEach(() => { diff --git a/src/plugins/shared_ux/public/components/exit_full_screen_button/exit_full_screen_button.tsx b/src/plugins/shared_ux/public/components/exit_full_screen_button/exit_full_screen_button.tsx index 1f0b2f43a6b25..30deaaa86f4c5 100644 --- a/src/plugins/shared_ux/public/components/exit_full_screen_button/exit_full_screen_button.tsx +++ b/src/plugins/shared_ux/public/components/exit_full_screen_button/exit_full_screen_button.tsx @@ -10,8 +10,9 @@ import React, { useCallback, useEffect } from 'react'; import { useEuiTheme, keys } from '@elastic/eui'; import { css } from '@emotion/react'; +import { usePlatformService } from '@kbn/shared-ux-services'; + import { ExitFullScreenButton as Component } from './exit_full_screen_button.component'; -import { usePlatformService } from '../../services'; /** * Props for the service-enabled Exit Full Screen button component. diff --git a/src/plugins/shared_ux/public/components/index.ts b/src/plugins/shared_ux/public/components/index.ts index c2f835b97ebde..1fa96c83a98f0 100644 --- a/src/plugins/shared_ux/public/components/index.ts +++ b/src/plugins/shared_ux/public/components/index.ts @@ -43,7 +43,7 @@ export const SolutionToolbarButton = withSuspense(LazySolutionToolbarButton); * The Lazily-loaded `NoDataViews` component. Consumers should use `React.Suspennse` or the * `withSuspense` HOC to load this component. */ -export const LazyNoDataViewsPage = React.lazy(() => +export const LazyNoDataViews = React.lazy(() => import('./empty_state/no_data_views').then(({ NoDataViews }) => ({ default: NoDataViews, })) @@ -54,4 +54,4 @@ export const LazyNoDataViewsPage = React.lazy(() => * be used directly by consumers and will load the `LazyNoDataViewsPage` component lazily with * a predefined fallback and error boundary. */ -export const NoDataViewsPage = withSuspense(LazyNoDataViewsPage); +export const NoDataViews = withSuspense(LazyNoDataViews); diff --git a/src/plugins/shared_ux/public/components/toolbar/solution_toolbar/button/primary.test.tsx b/src/plugins/shared_ux/public/components/toolbar/solution_toolbar/button/primary.test.tsx index c2e5fd1ce7ab8..aec209489dd6e 100644 --- a/src/plugins/shared_ux/public/components/toolbar/solution_toolbar/button/primary.test.tsx +++ b/src/plugins/shared_ux/public/components/toolbar/solution_toolbar/button/primary.test.tsx @@ -8,19 +8,23 @@ import { mount as enzymeMount, ReactWrapper } from 'enzyme'; import React from 'react'; -import { ServicesProvider, SharedUXServices } from '../../../../services'; -import { servicesFactory } from '../../../../services/mocks'; + +import { + SharedUxServicesProvider, + SharedUxServices, + mockServicesFactory, +} from '@kbn/shared-ux-services'; import { SolutionToolbarButton } from './primary'; describe('', () => { - let services: SharedUXServices; + let services: SharedUxServices; let mount: (element: JSX.Element) => ReactWrapper; beforeEach(() => { - services = servicesFactory(); + services = mockServicesFactory(); mount = (element: JSX.Element) => - enzymeMount({element}); + enzymeMount({element}); }); afterEach(() => { diff --git a/src/plugins/shared_ux/public/index.ts b/src/plugins/shared_ux/public/index.ts index a196a60db847b..1ccdc1dab8bea 100755 --- a/src/plugins/shared_ux/public/index.ts +++ b/src/plugins/shared_ux/public/index.ts @@ -16,5 +16,9 @@ export function plugin() { } export type { SharedUXPluginSetup, SharedUXPluginStart } from './types'; -export { ExitFullScreenButton, LazyExitFullScreenButton } from './components'; -export { NoDataViewsPage, LazyNoDataViewsPage } from './components'; +export { + ExitFullScreenButton, + LazyExitFullScreenButton, + NoDataViews, + LazyNoDataViews, +} from './components'; diff --git a/src/plugins/shared_ux/public/plugin.tsx b/src/plugins/shared_ux/public/plugin.tsx index 1d2840566d4d9..b91675fd88f5b 100755 --- a/src/plugins/shared_ux/public/plugin.tsx +++ b/src/plugins/shared_ux/public/plugin.tsx @@ -7,6 +7,9 @@ */ import React from 'react'; + +import { SharedUxServicesProvider } from '@kbn/shared-ux-services'; + import { CoreSetup, CoreStart, Plugin } from '../../../core/public'; import { SharedUXPluginSetup, @@ -15,8 +18,7 @@ import { SharedUXPluginSetupDeps, } from './types'; -import { ServicesProvider } from './services'; -import { servicesFactory } from './services/kibana'; +import { servicesFactory } from './services'; /** * The Kibana plugin for Shared User Experience (Shared UX). @@ -34,7 +36,7 @@ export class SharedUXPlugin implements Plugin ( - {children} + {children} ), }; } diff --git a/src/plugins/shared_ux/public/services/doc_links.ts b/src/plugins/shared_ux/public/services/doc_links.ts index 3c6d23bd33ae4..b457cddb7c3bc 100644 --- a/src/plugins/shared_ux/public/services/doc_links.ts +++ b/src/plugins/shared_ux/public/services/doc_links.ts @@ -5,6 +5,20 @@ * in compliance with, at your election, the Elastic License 2.0 or the Server * Side Public License, v 1. */ -export interface SharedUXDocLinksService { - dataViewsDocsLink: string; -} + +import { SharedUxDocLinksService } from '@kbn/shared-ux-services'; + +import { KibanaPluginServiceFactory } from './types'; +import { SharedUXPluginStartDeps } from '../types'; + +export type DocLinksServiceFactory = KibanaPluginServiceFactory< + SharedUxDocLinksService, + SharedUXPluginStartDeps +>; + +/** + * A factory function for creating a Kibana-based implementation of `SharedUXEditorsService`. + */ +export const docLinksServiceFactory: DocLinksServiceFactory = ({ coreStart }) => ({ + dataViewsDocLink: coreStart.docLinks.links.indexPatterns?.introduction, +}); diff --git a/src/plugins/shared_ux/public/services/editors.ts b/src/plugins/shared_ux/public/services/editors.ts index 176b22a6006e1..498b42954091c 100644 --- a/src/plugins/shared_ux/public/services/editors.ts +++ b/src/plugins/shared_ux/public/services/editors.ts @@ -5,11 +5,20 @@ * in compliance with, at your election, the Elastic License 2.0 or the Server * Side Public License, v 1. */ -import { DataView } from '../../../data_views/common'; - -export interface SharedUxDataViewEditorProps { - onSave: (dataView: DataView) => void; -} -export interface SharedUXEditorsService { - openDataViewEditor: (options: SharedUxDataViewEditorProps) => () => void; -} + +import { SharedUxEditorsService } from '@kbn/shared-ux-services'; + +import { KibanaPluginServiceFactory } from './types'; +import { SharedUXPluginStartDeps } from '../types'; + +export type EditorsServiceFactory = KibanaPluginServiceFactory< + SharedUxEditorsService, + SharedUXPluginStartDeps +>; + +/** + * A factory function for creating a Kibana-based implementation of `SharedUXEditorsService`. + */ +export const editorsServiceFactory: EditorsServiceFactory = ({ startPlugins }) => ({ + openDataViewEditor: startPlugins.dataViewEditor.openEditor, +}); diff --git a/src/plugins/shared_ux/public/services/kibana/index.ts b/src/plugins/shared_ux/public/services/index.ts similarity index 82% rename from src/plugins/shared_ux/public/services/kibana/index.ts rename to src/plugins/shared_ux/public/services/index.ts index 506176cffbc45..218ca72852f55 100644 --- a/src/plugins/shared_ux/public/services/kibana/index.ts +++ b/src/plugins/shared_ux/public/services/index.ts @@ -6,9 +6,11 @@ * Side Public License, v 1. */ -import type { SharedUXServices } from '..'; -import type { SharedUXPluginStartDeps } from '../../types'; -import type { KibanaPluginServiceFactory } from '../types'; +import { SharedUxServices } from '@kbn/shared-ux-services'; + +import type { SharedUXPluginStartDeps } from '../types'; +import type { KibanaPluginServiceFactory } from './types'; + import { platformServiceFactory } from './platform'; import { userPermissionsServiceFactory } from './permissions'; import { editorsServiceFactory } from './editors'; @@ -18,7 +20,7 @@ import { docLinksServiceFactory } from './doc_links'; * A factory function for creating a Kibana-based implementation of `SharedUXServices`. */ export const servicesFactory: KibanaPluginServiceFactory< - SharedUXServices, + SharedUxServices, SharedUXPluginStartDeps > = (params) => ({ platform: platformServiceFactory(params), diff --git a/src/plugins/shared_ux/public/services/index.tsx b/src/plugins/shared_ux/public/services/index.tsx deleted file mode 100644 index bdca90c725858..0000000000000 --- a/src/plugins/shared_ux/public/services/index.tsx +++ /dev/null @@ -1,62 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0 and the Server Side Public License, v 1; you may not use this file except - * in compliance with, at your election, the Elastic License 2.0 or the Server - * Side Public License, v 1. - */ - -import React, { FC, createContext, useContext } from 'react'; -import { SharedUXPlatformService } from './platform'; -import { servicesFactory } from './stub'; -import { SharedUXUserPermissionsService } from './permissions'; -import { SharedUXEditorsService } from './editors'; -import { SharedUXDocLinksService } from './doc_links'; - -/** - * A collection of services utilized by SharedUX. This serves as a thin - * abstraction layer between services provided by Kibana and other plugins - * while allowing this plugin to be developed independently of those contracts. - * - * It also allows us to "swap out" differenct implementations of these services - * for different environments, (e.g. Jest, Storybook, etc.) - */ -export interface SharedUXServices { - platform: SharedUXPlatformService; - permissions: SharedUXUserPermissionsService; - editors: SharedUXEditorsService; - docLinks: SharedUXDocLinksService; -} - -// The React Context used to provide the services to the SharedUX components. -const ServicesContext = createContext(servicesFactory()); - -/** - * The `React.Context` Provider component for the `SharedUXServices` context. Any - * plugin or environment that consumes SharedUX components needs to wrap their React - * tree with this provider. - * - * Within a plugin, you can use the `ServicesContext` provided by the SharedUX plugin start - * lifeycle method. - */ -export const ServicesProvider: FC = ({ children, ...services }) => ( - {children} -); - -/** - * React hook for accessing the pre-wired `SharedUXServices`. - */ -export function useServices() { - return useContext(ServicesContext); -} - -/** - * React hook for accessing the pre-wired `SharedUXPlatformService`. - */ -export const usePlatformService = () => useServices().platform; - -export const usePermissions = () => useServices().permissions; - -export const useEditors = () => useServices().editors; - -export const useDocLinks = () => useServices().docLinks; diff --git a/src/plugins/shared_ux/public/services/kibana/doc_links.ts b/src/plugins/shared_ux/public/services/kibana/doc_links.ts deleted file mode 100644 index eb25114a188a2..0000000000000 --- a/src/plugins/shared_ux/public/services/kibana/doc_links.ts +++ /dev/null @@ -1,23 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0 and the Server Side Public License, v 1; you may not use this file except - * in compliance with, at your election, the Elastic License 2.0 or the Server - * Side Public License, v 1. - */ - -import { KibanaPluginServiceFactory } from '../types'; -import { SharedUXPluginStartDeps } from '../../types'; -import { SharedUXDocLinksService } from '../doc_links'; - -export type DocLinksServiceFactory = KibanaPluginServiceFactory< - SharedUXDocLinksService, - SharedUXPluginStartDeps ->; - -/** - * A factory function for creating a Kibana-based implementation of `SharedUXEditorsService`. - */ -export const docLinksServiceFactory: DocLinksServiceFactory = ({ coreStart }) => ({ - dataViewsDocsLink: coreStart.docLinks.links.indexPatterns?.introduction, -}); diff --git a/src/plugins/shared_ux/public/services/kibana/editors.ts b/src/plugins/shared_ux/public/services/kibana/editors.ts deleted file mode 100644 index 0f8082d7d00e2..0000000000000 --- a/src/plugins/shared_ux/public/services/kibana/editors.ts +++ /dev/null @@ -1,23 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0 and the Server Side Public License, v 1; you may not use this file except - * in compliance with, at your election, the Elastic License 2.0 or the Server - * Side Public License, v 1. - */ - -import { KibanaPluginServiceFactory } from '../types'; -import { SharedUXEditorsService } from '../editors'; -import { SharedUXPluginStartDeps } from '../../types'; - -export type EditorsServiceFactory = KibanaPluginServiceFactory< - SharedUXEditorsService, - SharedUXPluginStartDeps ->; - -/** - * A factory function for creating a Kibana-based implementation of `SharedUXEditorsService`. - */ -export const editorsServiceFactory: EditorsServiceFactory = ({ startPlugins }) => ({ - openDataViewEditor: startPlugins.dataViewEditor.openEditor, -}); diff --git a/src/plugins/shared_ux/public/services/kibana/permissions.ts b/src/plugins/shared_ux/public/services/kibana/permissions.ts deleted file mode 100644 index caaeccdccbccd..0000000000000 --- a/src/plugins/shared_ux/public/services/kibana/permissions.ts +++ /dev/null @@ -1,23 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0 and the Server Side Public License, v 1; you may not use this file except - * in compliance with, at your election, the Elastic License 2.0 or the Server - * Side Public License, v 1. - */ - -import { KibanaPluginServiceFactory } from '../types'; -import { SharedUXPluginStartDeps } from '../../types'; -import { SharedUXUserPermissionsService } from '../permissions'; - -export type UserPermissionsServiceFactory = KibanaPluginServiceFactory< - SharedUXUserPermissionsService, - SharedUXPluginStartDeps ->; - -/** - * A factory function for creating a Kibana-based implementation of `SharedUXPermissionsService`. - */ -export const userPermissionsServiceFactory: UserPermissionsServiceFactory = ({ startPlugins }) => ({ - canCreateNewDataView: startPlugins.dataViewEditor.userPermissions.editDataView(), -}); diff --git a/src/plugins/shared_ux/public/services/kibana/platform.ts b/src/plugins/shared_ux/public/services/kibana/platform.ts deleted file mode 100644 index 9872149ee02f2..0000000000000 --- a/src/plugins/shared_ux/public/services/kibana/platform.ts +++ /dev/null @@ -1,26 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0 and the Server Side Public License, v 1; you may not use this file except - * in compliance with, at your election, the Elastic License 2.0 or the Server - * Side Public License, v 1. - */ - -import { SharedUXPluginStartDeps } from '../../types'; -import { KibanaPluginServiceFactory } from '../types'; -import { SharedUXPlatformService } from '../platform'; - -/** - * A factory function for creating a Kibana-based implementation of `SharedUXPlatformService`. - */ -export type PlatformServiceFactory = KibanaPluginServiceFactory< - SharedUXPlatformService, - SharedUXPluginStartDeps ->; - -/** - * A factory function for creating a Kibana-based implementation of `SharedUXPlatformService`. - */ -export const platformServiceFactory: PlatformServiceFactory = ({ coreStart }) => ({ - setIsFullscreen: (isVisible: boolean) => coreStart.chrome.setIsVisible(isVisible), -}); diff --git a/src/plugins/shared_ux/public/services/permissions.ts b/src/plugins/shared_ux/public/services/permissions.ts index 009f497e35706..0e78a8b4e022e 100644 --- a/src/plugins/shared_ux/public/services/permissions.ts +++ b/src/plugins/shared_ux/public/services/permissions.ts @@ -6,6 +6,18 @@ * Side Public License, v 1. */ -export interface SharedUXUserPermissionsService { - canCreateNewDataView: boolean; -} +import { SharedUxUserPermissionsService } from '@kbn/shared-ux-services'; +import { KibanaPluginServiceFactory } from './types'; +import { SharedUXPluginStartDeps } from '../types'; + +export type UserPermissionsServiceFactory = KibanaPluginServiceFactory< + SharedUxUserPermissionsService, + SharedUXPluginStartDeps +>; + +/** + * A factory function for creating a Kibana-based implementation of `SharedUXPermissionsService`. + */ +export const userPermissionsServiceFactory: UserPermissionsServiceFactory = ({ startPlugins }) => ({ + canCreateNewDataView: startPlugins.dataViewEditor.userPermissions.editDataView(), +}); diff --git a/src/plugins/shared_ux/public/services/platform.ts b/src/plugins/shared_ux/public/services/platform.ts index 52f88a1133c8b..b0ee61583dd8d 100644 --- a/src/plugins/shared_ux/public/services/platform.ts +++ b/src/plugins/shared_ux/public/services/platform.ts @@ -6,18 +6,21 @@ * Side Public License, v 1. */ +import { SharedUxPlatformService } from '@kbn/shared-ux-services'; +import { SharedUXPluginStartDeps } from '../types'; +import { KibanaPluginServiceFactory } from './types'; + +/** + * A factory function for creating a Kibana-based implementation of `SharedUXPlatformService`. + */ +export type PlatformServiceFactory = KibanaPluginServiceFactory< + SharedUxPlatformService, + SharedUXPluginStartDeps +>; + /** - * A services providing methods to interact with the Platform in which this plugin is - * running, (almost always Kibana). - * - * Rather than provide the entire `CoreStart` contract to components, we provide simplified - * abstractions around a use case specific to Shared UX. This way, we know exactly how the - * `CoreStart` and other plugins are used, like specifically which methods. This makes - * mocking and refactoring easier when upstream dependencies change. + * A factory function for creating a Kibana-based implementation of `SharedUXPlatformService`. */ -export interface SharedUXPlatformService { - /** - * Sets the fullscreen state of the chrome. - */ - setIsFullscreen: (isFullscreen: boolean) => void; -} +export const platformServiceFactory: PlatformServiceFactory = ({ coreStart }) => ({ + setIsFullscreen: (isVisible: boolean) => coreStart.chrome.setIsVisible(isVisible), +}); diff --git a/src/plugins/shared_ux/public/services/storybook/doc_links.ts b/src/plugins/shared_ux/public/services/storybook/doc_links.ts index 548d504336108..1bdcd4436014d 100644 --- a/src/plugins/shared_ux/public/services/storybook/doc_links.ts +++ b/src/plugins/shared_ux/public/services/storybook/doc_links.ts @@ -6,14 +6,13 @@ * Side Public License, v 1. */ -import { PluginServiceFactory } from '../types'; -import { SharedUXDocLinksService } from '../doc_links'; +import { SharedUxDocLinksService, ServiceFactory } from '@kbn/shared-ux-services'; -export type SharedUXDockLinksServiceFactory = PluginServiceFactory; +export type SharedUXDockLinksServiceFactory = ServiceFactory; /** * A factory function for creating a Jest-based implementation of `SharedUXDocLinksService`. */ export const docLinksServiceFactory: SharedUXDockLinksServiceFactory = () => ({ - dataViewsDocsLink: 'https://www.elastic.co/guide/en/kibana/master/data-views.html', + dataViewsDocLink: 'https://www.elastic.co/guide/en/kibana/master/data-views.html', }); diff --git a/src/plugins/shared_ux/public/services/storybook/editors.ts b/src/plugins/shared_ux/public/services/storybook/editors.ts index 248699d5beb95..24c82a5a169a1 100644 --- a/src/plugins/shared_ux/public/services/storybook/editors.ts +++ b/src/plugins/shared_ux/public/services/storybook/editors.ts @@ -6,17 +6,14 @@ * Side Public License, v 1. */ +import { SharedUxEditorsService, ServiceFactory } from '@kbn/shared-ux-services'; import { action } from '@storybook/addon-actions'; -import { PluginServiceFactory } from '../types'; -import { SharedUxDataViewEditorProps, SharedUXEditorsService } from '../editors'; -export type SharedUXEditorsServiceFactory = PluginServiceFactory; +export type SharedUXEditorsServiceFactory = ServiceFactory; /** * A factory function for creating a storybook implementation of `SharedUXEditorsService`. */ export const editorsServiceFactory: SharedUXEditorsServiceFactory = () => ({ - openDataViewEditor: action('openEditor') as SharedUXEditorsService['openDataViewEditor'] as ( - options: SharedUxDataViewEditorProps - ) => () => void, + openDataViewEditor: action('openEditor') as SharedUxEditorsService['openDataViewEditor'], }); diff --git a/src/plugins/shared_ux/public/services/storybook/index.ts b/src/plugins/shared_ux/public/services/storybook/index.ts index c915b1a463365..857cd8ee4300f 100644 --- a/src/plugins/shared_ux/public/services/storybook/index.ts +++ b/src/plugins/shared_ux/public/services/storybook/index.ts @@ -6,8 +6,7 @@ * Side Public License, v 1. */ -import type { SharedUXServices } from '../.'; -import { PluginServiceFactory } from '../types'; +import { SharedUxServices, ServiceFactory } from '@kbn/shared-ux-services'; import { platformServiceFactory } from './platform'; import { editorsServiceFactory } from './editors'; import { userPermissionsServiceFactory } from './permissions'; @@ -16,7 +15,7 @@ import { docLinksServiceFactory } from './doc_links'; /** * A factory function for creating a Storybook-based implementation of `SharedUXServices`. */ -export const servicesFactory: PluginServiceFactory = (params) => ({ +export const servicesFactory: ServiceFactory = (params) => ({ platform: platformServiceFactory(params), permissions: userPermissionsServiceFactory(), editors: editorsServiceFactory(), diff --git a/src/plugins/shared_ux/public/services/storybook/permissions.ts b/src/plugins/shared_ux/public/services/storybook/permissions.ts index c7110fccf7eea..d6e1d235de5b0 100644 --- a/src/plugins/shared_ux/public/services/storybook/permissions.ts +++ b/src/plugins/shared_ux/public/services/storybook/permissions.ts @@ -6,11 +6,9 @@ * Side Public License, v 1. */ -import { PluginServiceFactory } from '../types'; -import { SharedUXUserPermissionsService } from '../permissions'; +import { SharedUxUserPermissionsService, ServiceFactory } from '@kbn/shared-ux-services'; -export type SharedUXUserPermissionsServiceFactory = - PluginServiceFactory; +export type SharedUXUserPermissionsServiceFactory = ServiceFactory; /** * A factory function for creating a storybook implementation of `SharedUXUserPermissionsService`. diff --git a/src/plugins/shared_ux/public/services/storybook/platform.ts b/src/plugins/shared_ux/public/services/storybook/platform.ts index 8d7645ee441ca..6e81f5d851df3 100644 --- a/src/plugins/shared_ux/public/services/storybook/platform.ts +++ b/src/plugins/shared_ux/public/services/storybook/platform.ts @@ -6,15 +6,13 @@ * Side Public License, v 1. */ +import { SharedUxPlatformService, ServiceFactory } from '@kbn/shared-ux-services'; import { action } from '@storybook/addon-actions'; -import { PluginServiceFactory } from '../types'; -import { SharedUXPlatformService } from '../platform'; - /** * A factory function for creating a Storybook-based implementation of `SharedUXPlatformService`. */ -export type PlatformServiceFactory = PluginServiceFactory; +export type PlatformServiceFactory = ServiceFactory; /** * A factory function for creating a Storybook-based implementation of `SharedUXPlatformService`. diff --git a/src/plugins/shared_ux/public/services/types.ts b/src/plugins/shared_ux/public/services/types.ts index 2645d5303a33b..15191a493d378 100644 --- a/src/plugins/shared_ux/public/services/types.ts +++ b/src/plugins/shared_ux/public/services/types.ts @@ -9,15 +9,6 @@ import { BehaviorSubject } from 'rxjs'; import { CoreStart, AppUpdater, PluginInitializerContext } from 'src/core/public'; -/** - * A factory function for creating one or more services. - * - * The `S` generic determines the shape of the API being produced. - * The `Parameters` generic determines what parameters are expected to - * create the service. - */ -export type PluginServiceFactory = (params: Parameters) => S; - /** * Parameters necessary to create a Kibana-based service, (e.g. during Plugin * startup or setup). diff --git a/yarn.lock b/yarn.lock index f74eab57c56a8..42a6870c550f9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3117,6 +3117,10 @@ version "0.0.0" uid "" +"@kbn/shared-ux-services@link:bazel-bin/packages/kbn-shared-ux-services": + version "0.0.0" + uid "" + "@kbn/spec-to-console@link:bazel-bin/packages/kbn-spec-to-console": version "0.0.0" uid "" @@ -6086,6 +6090,10 @@ version "0.0.0" uid "" +"@types/kbn__shared-ux-services@link:bazel-bin/packages/kbn-shared-ux-services/npm_module_types": + version "0.0.0" + uid "" + "@types/kbn__std@link:bazel-bin/packages/kbn-std/npm_module_types": version "0.0.0" uid ""