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:^"