diff --git a/plugins/search/src/apis.ts b/plugins/search/src/apis.ts index 6b739427d7..a222cde5a9 100644 --- a/plugins/search/src/apis.ts +++ b/plugins/search/src/apis.ts @@ -14,12 +14,18 @@ * limitations under the License. */ +import { createApiRef, DiscoveryApi } from '@backstage/core'; import { Entity, ENTITY_DEFAULT_NAMESPACE } from '@backstage/catalog-model'; -import { DiscoveryApi } from '@backstage/core'; + import { CatalogApi } from '@backstage/plugin-catalog-react'; import { SearchQuery, SearchResultSet } from '@backstage/plugin-search-backend'; import qs from 'qs'; +export const searchApiRef = createApiRef({ + id: 'plugin.search.queryservice', + description: 'Used to make requests against the search API', +}); + export type Result = { name: string; description: string | undefined; @@ -31,7 +37,7 @@ export type Result = { export type SearchResults = Array; -class SearchApi { +export class SearchApi { private catalogApi: CatalogApi; private discoveryApi: DiscoveryApi; @@ -74,5 +80,3 @@ class SearchApi { return response.json(); } } - -export default SearchApi; diff --git a/plugins/search/src/components/SearchResult/SearchResult.tsx b/plugins/search/src/components/SearchResult/SearchResult.tsx index 141b7684cd..0aa209e6fe 100644 --- a/plugins/search/src/components/SearchResult/SearchResult.tsx +++ b/plugins/search/src/components/SearchResult/SearchResult.tsx @@ -14,7 +14,6 @@ * limitations under the License. */ import { - discoveryApiRef, EmptyState, Link, Progress, @@ -22,12 +21,12 @@ import { TableColumn, useApi, } from '@backstage/core'; -import { catalogApiRef } from '@backstage/plugin-catalog-react'; import { Divider, Grid, makeStyles, Typography } from '@material-ui/core'; import { Alert } from '@material-ui/lab'; import React, { useEffect, useState } from 'react'; import { useAsync } from 'react-use'; -import SearchApi, { Result, SearchResults } from '../../apis'; +import { Result, SearchResults, searchApiRef } from '../../apis'; + import { Filters, FiltersButton, FiltersState } from '../Filters'; const useStyles = makeStyles(theme => ({ @@ -117,8 +116,7 @@ const TableHeader = ({ }; export const SearchResult = ({ searchQuery }: SearchResultProps) => { - const catalogApi = useApi(catalogApiRef); - const discoveryApi = useApi(discoveryApiRef); + const searchApi = useApi(searchApiRef); const [showFilters, toggleFilters] = useState(false); const [selectedFilters, setSelectedFilters] = useState({ @@ -128,8 +126,6 @@ export const SearchResult = ({ searchQuery }: SearchResultProps) => { const [filteredResults, setFilteredResults] = useState([]); - const searchApi = new SearchApi(catalogApi, discoveryApi); - const { loading, error, value: results } = useAsync(() => { return searchApi.getSearchResult(); }, []); diff --git a/plugins/search/src/index.ts b/plugins/search/src/index.ts index 572d75bea5..268de25a00 100644 --- a/plugins/search/src/index.ts +++ b/plugins/search/src/index.ts @@ -13,6 +13,8 @@ * See the License for the specific language governing permissions and * limitations under the License. */ + +// TODO: export searchApiRef from ./apis once interface is stable and settled. export { searchPlugin, searchPlugin as plugin, SearchPage } from './plugin'; export { Filters, diff --git a/plugins/search/src/plugin.ts b/plugins/search/src/plugin.ts index 37503b7751..c94602868e 100644 --- a/plugins/search/src/plugin.ts +++ b/plugins/search/src/plugin.ts @@ -14,10 +14,14 @@ * limitations under the License. */ import { + createApiFactory, createPlugin, createRouteRef, createRoutableExtension, + discoveryApiRef, } from '@backstage/core'; +import { SearchApi, searchApiRef } from './apis'; +import { catalogApiRef } from '@backstage/plugin-catalog-react'; import { SearchPage as SearchPageComponent } from './components/SearchPage'; export const rootRouteRef = createRouteRef({ @@ -27,6 +31,15 @@ export const rootRouteRef = createRouteRef({ export const searchPlugin = createPlugin({ id: 'search', + apis: [ + createApiFactory({ + api: searchApiRef, + deps: { catalogApi: catalogApiRef, discoveryApi: discoveryApiRef }, + factory: ({ catalogApi, discoveryApi }) => { + return new SearchApi(catalogApi, discoveryApi); + }, + }), + ], register({ router }) { router.addRoute(rootRouteRef, SearchPageComponent); },