diff --git a/plugins/search/src/components/SearchModal/SearchModal.stories.tsx b/plugins/search/src/components/SearchModal/SearchModal.stories.tsx index 47c0f47c31..525eadc9df 100644 --- a/plugins/search/src/components/SearchModal/SearchModal.stories.tsx +++ b/plugins/search/src/components/SearchModal/SearchModal.stories.tsx @@ -13,32 +13,32 @@ * See the License for the specific language governing permissions and * limitations under the License. */ - -import { wrapInTestApp } from '@backstage/test-utils'; import { + DefaultResultListItem, + MockSearchApi, + searchApiRef, + SearchBar, + SearchContextProvider, + SearchResult, + SearchResultPager, +} from '@backstage/plugin-search-react'; +import { TestApiProvider, wrapInTestApp } from '@backstage/test-utils'; +import { + Box, Button, DialogActions, DialogContent, DialogTitle, Grid, + IconButton, List, - Paper, } from '@material-ui/core'; import { makeStyles } from '@material-ui/core/styles'; +import CloseIcon from '@material-ui/icons/Close'; import React, { ComponentType, PropsWithChildren } from 'react'; import { rootRouteRef } from '../../plugin'; -import { - SearchBar, - DefaultResultListItem, - searchApiRef, - MockSearchApi, - SearchContextProvider, - SearchResult, - SearchResultPager, -} from '@backstage/plugin-search-react'; -import { TestApiProvider } from '@backstage/test-utils'; -import { SearchModal } from './SearchModal'; import { SearchType } from '../SearchType'; +import { SearchModal } from './SearchModal'; import { useSearchModal } from './useSearchModal'; const mockResults = { @@ -103,10 +103,10 @@ export const Default = () => { }; const useStyles = makeStyles(theme => ({ - container: { - borderRadius: 30, + titleContainer: { display: 'flex', - height: '2.4em', + alignItems: 'center', + gap: theme.spacing(1), }, input: { flex: 1, @@ -127,9 +127,13 @@ export const CustomModal = () => { {() => ( <> - + - + + + + +