diff --git a/.changeset/heavy-plants-doubt.md b/.changeset/heavy-plants-doubt.md new file mode 100644 index 0000000000..3988a16752 --- /dev/null +++ b/.changeset/heavy-plants-doubt.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-user-settings': patch +--- + +Added experimental support for declarative integration via the `/alpha` subpath. diff --git a/.changeset/long-owls-complain.md b/.changeset/long-owls-complain.md new file mode 100644 index 0000000000..f96b0f0987 --- /dev/null +++ b/.changeset/long-owls-complain.md @@ -0,0 +1,5 @@ +--- +'@backstage/frontend-app-api': patch +--- + +Fixed an issue preventing the routing system to match subroutes diff --git a/packages/app-next/src/App.tsx b/packages/app-next/src/App.tsx index 01353feb4f..2ab447c68f 100644 --- a/packages/app-next/src/App.tsx +++ b/packages/app-next/src/App.tsx @@ -14,10 +14,17 @@ * limitations under the License. */ +import React from 'react'; import { createApp } from '@backstage/frontend-app-api'; import { pagesPlugin } from './examples/pagesPlugin'; import graphiqlPlugin from '@backstage/plugin-graphiql/alpha'; import techRadarPlugin from '@backstage/plugin-tech-radar/alpha'; +import userSettingsPlugin from '@backstage/plugin-user-settings/alpha'; +import { + createExtensionOverrides, + createPageExtension, +} from '@backstage/frontend-plugin-api'; +import { entityRouteRef } from '@backstage/plugin-catalog-react'; /* @@ -48,8 +55,23 @@ TODO: /* app.tsx */ +const entityPageExtension = createPageExtension({ + id: 'catalog:entity', + defaultPath: '/catalog/:namespace/:kind/:name', + routeRef: entityRouteRef, + loader: async () =>
Just a temporary mocked entity page
, +}); + const app = createApp({ - features: [graphiqlPlugin, pagesPlugin, techRadarPlugin], + features: [ + graphiqlPlugin, + pagesPlugin, + techRadarPlugin, + userSettingsPlugin, + createExtensionOverrides({ + extensions: [entityPageExtension], + }), + ], // bindRoutes({ bind }) { // bind(catalogPlugin.externalRoutes, { // createComponent: scaffolderPlugin.routes.root, diff --git a/packages/app-next/src/examples/pagesPlugin.tsx b/packages/app-next/src/examples/pagesPlugin.tsx index 1ec1cfa5a1..5ae1029769 100644 --- a/packages/app-next/src/examples/pagesPlugin.tsx +++ b/packages/app-next/src/examples/pagesPlugin.tsx @@ -50,6 +50,9 @@ const IndexPage = createPageExtension({
Search
+
+ Settings +
); }; diff --git a/packages/frontend-app-api/src/extensions/CoreRoutes.tsx b/packages/frontend-app-api/src/extensions/CoreRoutes.tsx index 5006a87cac..8d22b40eec 100644 --- a/packages/frontend-app-api/src/extensions/CoreRoutes.tsx +++ b/packages/frontend-app-api/src/extensions/CoreRoutes.tsx @@ -39,7 +39,7 @@ export const CoreRoutes = createExtension({ const Routes = () => { const element = useRoutes( inputs.routes.map(route => ({ - path: route.path, + path: `${route.path}/*`, element: route.element, })), ); diff --git a/packages/frontend-app-api/src/wiring/createApp.tsx b/packages/frontend-app-api/src/wiring/createApp.tsx index 3999cad738..044eedfefd 100644 --- a/packages/frontend-app-api/src/wiring/createApp.tsx +++ b/packages/frontend-app-api/src/wiring/createApp.tsx @@ -76,6 +76,10 @@ import { overrideBaseUrlConfigs } from '../../../core-app-api/src/app/overrideBa // eslint-disable-next-line @backstage/no-relative-monorepo-imports import { RoutingProvider } from '../../../core-app-api/src/routing/RoutingProvider'; // eslint-disable-next-line @backstage/no-relative-monorepo-imports +import { AppLanguageSelector } from '../../../core-app-api/src/apis/implementations/AppLanguageApi/AppLanguageSelector'; +// eslint-disable-next-line @backstage/no-relative-monorepo-imports +import { I18nextTranslationApi } from '../../../core-app-api/src/apis/implementations/TranslationApi/I18nextTranslationApi'; +// eslint-disable-next-line @backstage/no-relative-monorepo-imports import { apis as defaultApis, components as defaultComponents, @@ -86,6 +90,10 @@ import { SidebarItem } from '@backstage/core-components'; import { DarkTheme, LightTheme } from '../extensions/themes'; import { extractRouteInfoFromInstanceTree } from '../routing/extractRouteInfoFromInstanceTree'; import { getOrCreateGlobalSingleton } from '@backstage/version-bridge'; +import { + appLanguageApiRef, + translationApiRef, +} from '@backstage/core-plugin-api/alpha'; /** @public */ export interface ExtensionTreeNode { @@ -460,6 +468,21 @@ function createApiHolder( factory: () => configApi, }); + factoryRegistry.register('static', { + api: appLanguageApiRef, + deps: {}, + factory: () => AppLanguageSelector.createWithStorage(), + }); + + factoryRegistry.register('default', { + api: translationApiRef, + deps: { languageApi: appLanguageApiRef }, + factory: ({ languageApi }) => + I18nextTranslationApi.create({ + languageApi, + }), + }); + // TODO: ship these as default extensions instead for (const factory of defaultApis as AnyApiFactory[]) { if (!factoryRegistry.register('app', factory)) { diff --git a/plugins/user-settings/alpha-api-report.md b/plugins/user-settings/alpha-api-report.md index 203cfac601..a4f41a729a 100644 --- a/plugins/user-settings/alpha-api-report.md +++ b/plugins/user-settings/alpha-api-report.md @@ -3,8 +3,17 @@ > Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/). ```ts +import { BackstagePlugin } from '@backstage/frontend-plugin-api'; +import { RouteRef } from '@backstage/core-plugin-api'; import { TranslationRef } from '@backstage/core-plugin-api/alpha'; +// @alpha (undocumented) +const _default: BackstagePlugin; +export default _default; + +// @alpha (undocumented) +export const userSettingsRouteRef: RouteRef; + // @alpha (undocumented) export const userSettingsTranslationRef: TranslationRef< 'user-settings', diff --git a/plugins/user-settings/package.json b/plugins/user-settings/package.json index 6542137c0b..ea04370d41 100644 --- a/plugins/user-settings/package.json +++ b/plugins/user-settings/package.json @@ -7,13 +7,13 @@ "license": "Apache-2.0", "exports": { ".": "./src/index.ts", - "./alpha": "./src/alpha.ts", + "./alpha": "./src/alpha.tsx", "./package.json": "./package.json" }, "typesVersions": { "*": { "alpha": [ - "src/alpha.ts" + "src/alpha.tsx" ], "package.json": [ "package.json" @@ -50,6 +50,7 @@ "@backstage/core-components": "workspace:^", "@backstage/core-plugin-api": "workspace:^", "@backstage/errors": "workspace:^", + "@backstage/frontend-plugin-api": "workspace:^", "@backstage/plugin-catalog-react": "workspace:^", "@backstage/theme": "workspace:^", "@backstage/types": "workspace:^", diff --git a/plugins/user-settings/src/alpha.ts b/plugins/user-settings/src/alpha.ts deleted file mode 100644 index e1f7678bae..0000000000 --- a/plugins/user-settings/src/alpha.ts +++ /dev/null @@ -1,16 +0,0 @@ -/* - * Copyright 2023 The Backstage Authors - * - * Licensed 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. - */ -export * from './translation'; diff --git a/plugins/user-settings/src/alpha.tsx b/plugins/user-settings/src/alpha.tsx new file mode 100644 index 0000000000..8d68ccf259 --- /dev/null +++ b/plugins/user-settings/src/alpha.tsx @@ -0,0 +1,59 @@ +/* + * Copyright 2023 The Backstage Authors + * + * Licensed 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 { createRouteRef } from '@backstage/core-plugin-api'; +import { + coreExtensionData, + createExtensionInput, + createPageExtension, + createPlugin, +} from '@backstage/frontend-plugin-api'; + +import React from 'react'; + +export * from './translation'; + +/** + * @alpha + */ +export const userSettingsRouteRef = createRouteRef({ + id: 'plugin.user-settings.page', +}); + +const UserSettingsPage = createPageExtension({ + id: 'plugin.user-settings.page', + defaultPath: '/settings', + routeRef: userSettingsRouteRef, + inputs: { + providerSettings: createExtensionInput( + { + element: coreExtensionData.reactElement, + }, + { singleton: true, optional: true }, + ), + }, + loader: ({ inputs }) => + import('./components/SettingsPage').then(m => ( + + )), +}); + +/** + * @alpha + */ +export default createPlugin({ + id: 'user-settings', + extensions: [UserSettingsPage], +}); diff --git a/yarn.lock b/yarn.lock index 5fa67f26cf..3b7aab4485 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9972,6 +9972,7 @@ __metadata: "@backstage/core-plugin-api": "workspace:^" "@backstage/dev-utils": "workspace:^" "@backstage/errors": "workspace:^" + "@backstage/frontend-plugin-api": "workspace:^" "@backstage/plugin-catalog": "workspace:^" "@backstage/plugin-catalog-react": "workspace:^" "@backstage/test-utils": "workspace:^"