move TechDocsSearch into search components

Signed-off-by: Emma Indal <emma.indahl@gmail.com>

plugins/techdocs/src/search/components/TechDocsSearch.test.tsx

@@ -48,7 +48,7 @@ const singleResult = Promise.resolve({
   ],
 });
 
-describe('<TechDocsPage />', () => {
+describe('<TechDocsSearch />', () => {
   it('should render techdocs search bar', async () => {
     const query = () => emptyResults;
     const querySpy = jest.fn(query);

plugins/techdocs/src/search/components/TechDocsSearch.tsx

@@ -28,7 +28,7 @@ import Autocomplete from '@material-ui/lab/Autocomplete';
 import React, { ChangeEvent, useEffect, useState } from 'react';
 import { useNavigate } from 'react-router';
 import useDebounce from 'react-use/lib/useDebounce';
-import { DocsResultListItem } from '../../components/DocsResultListItem';
+import { TechDocsSearchResultListItem } from '../../search';
 
 const useStyles = makeStyles({
   root: {
@@ -36,7 +36,12 @@ const useStyles = makeStyles({
   },
 });
 
-type TechDocsSearchProps = {
+/**
+ * Props for {@link TechDocsSearch}
+ *
+ * @public
+ */
+export type TechDocsSearchProps = {
   entityId: EntityName;
   debounceTime?: number;
 };
@@ -55,10 +60,8 @@ type TechDocsSearchResult = {
   document: TechDocsDoc;
 };
 
-const TechDocsSearchBar = ({
-  entityId,
-  debounceTime = 150,
-}: TechDocsSearchProps) => {
+const TechDocsSearchBar = (props: TechDocsSearchProps) => {
+  const { entityId, debounceTime = 150 } = props;
   const [open, setOpen] = useState(false);
   const navigate = useNavigate();
   const {
@@ -138,7 +141,7 @@ const TechDocsSearchBar = ({
       value={null}
       options={options}
       renderOption={({ document }) => (
-        <DocsResultListItem
+        <TechDocsSearchResultListItem
           result={document}
           lineClamp={3}
           asListItem={false}
@@ -180,6 +183,11 @@ const TechDocsSearchBar = ({
   );
 };
 
+/**
+ * Component used to render search bar on TechDocs page, scoped to
+ *
+ * @public
+ */
 export const TechDocsSearch = (props: TechDocsSearchProps) => {
   const initialState = {
     term: '',