diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx
index 0e874e64e0..f5ad0337ee 100644
--- a/packages/app/src/App.tsx
+++ b/packages/app/src/App.tsx
@@ -39,7 +39,7 @@ import { GraphiQLPage } from '@backstage/plugin-graphiql';
import { LighthousePage } from '@backstage/plugin-lighthouse';
import { NewRelicPage } from '@backstage/plugin-newrelic';
import { ScaffolderPage, scaffolderPlugin } from '@backstage/plugin-scaffolder';
-import { SearchPage } from '@backstage/plugin-search';
+import { SearchPage, SearchPageNext } from '@backstage/plugin-search';
import { TechRadarPage } from '@backstage/plugin-tech-radar';
import { TechdocsPage } from '@backstage/plugin-techdocs';
import { UserSettingsPage } from '@backstage/plugin-user-settings';
@@ -50,7 +50,6 @@ import { Navigate, Route } from 'react-router';
import { apis } from './apis';
import { EntityPage } from './components/catalog/EntityPage';
import Root from './components/Root';
-import { SearchPage as SearchPageNext } from './components/search/SearchPage';
import { providers } from './identityProviders';
import * as plugins from './plugins';
@@ -113,7 +112,10 @@ const routes = (
} />
} />
} />
- } />
+ }
+ />
} />
{
+export const SearchPageNext = () => {
const [queryString, setQueryString] = useQueryParamState('query');
const [searchQuery, setSearchQuery] = useState(queryString ?? '');
diff --git a/plugins/search/src/components/SearchPageNext/index.tsx b/plugins/search/src/components/SearchPageNext/index.tsx
new file mode 100644
index 0000000000..464ba28750
--- /dev/null
+++ b/plugins/search/src/components/SearchPageNext/index.tsx
@@ -0,0 +1,17 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * 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 { SearchPageNext } from './SearchPageNext';
diff --git a/plugins/search/src/components/index.tsx b/plugins/search/src/components/index.tsx
index ac47860dc2..f571c61373 100644
--- a/plugins/search/src/components/index.tsx
+++ b/plugins/search/src/components/index.tsx
@@ -17,5 +17,6 @@
export * from './Filters';
export * from './SearchBar';
export * from './SearchPage';
+export * from './SearchPageNext';
export * from './SearchResult';
export * from './SidebarSearch';
diff --git a/plugins/search/src/index.ts b/plugins/search/src/index.ts
index 268de25a00..519d7fcf66 100644
--- a/plugins/search/src/index.ts
+++ b/plugins/search/src/index.ts
@@ -15,7 +15,12 @@
*/
// TODO: export searchApiRef from ./apis once interface is stable and settled.
-export { searchPlugin, searchPlugin as plugin, SearchPage } from './plugin';
+export {
+ searchPlugin,
+ searchPlugin as plugin,
+ SearchPage,
+ SearchPageNext,
+} from './plugin';
export {
Filters,
FiltersButton,
diff --git a/plugins/search/src/plugin.ts b/plugins/search/src/plugin.ts
index e21ad934a0..e3e953e07d 100644
--- a/plugins/search/src/plugin.ts
+++ b/plugins/search/src/plugin.ts
@@ -23,12 +23,18 @@ import {
import { SearchClient, searchApiRef } from './apis';
import { catalogApiRef } from '@backstage/plugin-catalog-react';
import { SearchPage as SearchPageComponent } from './components/SearchPage';
+import { SearchPageNext as SearchPageNextComponent } from './components/SearchPageNext';
export const rootRouteRef = createRouteRef({
path: '/search',
title: 'search',
});
+export const rootNextRouteRef = createRouteRef({
+ path: '/search-next',
+ title: 'search',
+});
+
export const searchPlugin = createPlugin({
id: 'search',
apis: [
@@ -42,9 +48,11 @@ export const searchPlugin = createPlugin({
],
register({ router }) {
router.addRoute(rootRouteRef, SearchPageComponent);
+ router.addRoute(rootNextRouteRef, SearchPageNextComponent);
},
routes: {
root: rootRouteRef,
+ nextRoot: rootNextRouteRef,
},
});
@@ -54,3 +62,11 @@ export const SearchPage = searchPlugin.provide(
mountPoint: rootRouteRef,
}),
);
+
+export const SearchPageNext = searchPlugin.provide(
+ createRoutableExtension({
+ component: () =>
+ import('./components/SearchPageNext').then(m => m.SearchPageNext),
+ mountPoint: rootNextRouteRef,
+ }),
+);