Update entity filter on entityName change.
Signed-off-by: Eric Peterson <ericpeterson@spotify.com>
This commit is contained in:
@@ -23,7 +23,7 @@ import {
|
||||
waitFor,
|
||||
within,
|
||||
} from '@testing-library/react';
|
||||
import React from 'react';
|
||||
import React, { useState } from 'react';
|
||||
import { TechDocsSearch } from './TechDocsSearch';
|
||||
|
||||
const entityId = {
|
||||
@@ -70,6 +70,7 @@ describe('<TechDocsPage />', () => {
|
||||
expect(rendered.getByTestId('techdocs-search-bar')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
it('should trigger query when autocomplete input changed', async () => {
|
||||
const query = () => singleResult;
|
||||
const querySpy = jest.fn(query);
|
||||
@@ -119,4 +120,61 @@ describe('<TechDocsPage />', () => {
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
it('should update filter values when a new entityName is provided', async () => {
|
||||
const query = () => singleResult;
|
||||
const querySpy = jest.fn(query);
|
||||
const searchApi = { query: querySpy };
|
||||
const apiRegistry = TestApiRegistry.from([searchApiRef, searchApi]);
|
||||
const newEntityId = {
|
||||
name: 'test-diff',
|
||||
namespace: 'testspace-diff',
|
||||
kind: 'TestableDiff',
|
||||
};
|
||||
|
||||
const WrappedSearchBar = () => {
|
||||
const [entityName, setEntityName] = useState(entityId);
|
||||
return wrapInTestApp(
|
||||
<ApiProvider apis={apiRegistry}>
|
||||
<button onClick={() => setEntityName(newEntityId)}>
|
||||
Update Entity
|
||||
</button>
|
||||
<TechDocsSearch entityId={entityName} debounceTime={0} />
|
||||
</ApiProvider>,
|
||||
);
|
||||
};
|
||||
|
||||
await act(async () => {
|
||||
const rendered = render(<WrappedSearchBar />);
|
||||
|
||||
await singleResult;
|
||||
expect(querySpy).toBeCalledWith({
|
||||
filters: {
|
||||
kind: 'Testable',
|
||||
name: 'test',
|
||||
namespace: 'testspace',
|
||||
},
|
||||
pageCursor: '',
|
||||
term: '',
|
||||
types: ['techdocs'],
|
||||
});
|
||||
|
||||
const button = rendered.getByText('Update Entity');
|
||||
button.click();
|
||||
|
||||
await singleResult;
|
||||
await waitFor(() =>
|
||||
expect(querySpy).toBeCalledWith({
|
||||
filters: {
|
||||
kind: 'TestableDiff',
|
||||
name: 'test-diff',
|
||||
namespace: 'testspace-diff',
|
||||
},
|
||||
pageCursor: '',
|
||||
term: '',
|
||||
types: ['techdocs'],
|
||||
}),
|
||||
);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -64,6 +64,7 @@ const TechDocsSearchBar = ({
|
||||
const {
|
||||
term,
|
||||
setTerm,
|
||||
setFilters,
|
||||
result: { loading, value: searchVal },
|
||||
} = useSearch();
|
||||
const classes = useStyles();
|
||||
@@ -87,6 +88,17 @@ const TechDocsSearchBar = ({
|
||||
|
||||
useDebounce(() => setTerm(value), debounceTime, [value]);
|
||||
|
||||
// Update the filter context when the entityId changes, e.g. when the search
|
||||
// bar continues to be rendered, navigating between different TechDocs sites.
|
||||
useEffect(() => {
|
||||
setFilters(prevFilters => {
|
||||
return {
|
||||
...prevFilters,
|
||||
...entityId,
|
||||
};
|
||||
});
|
||||
}, [entityId, setFilters]);
|
||||
|
||||
const handleQuery = (e: ChangeEvent<HTMLInputElement>) => {
|
||||
if (!open) {
|
||||
setOpen(true);
|
||||
|
||||
Reference in New Issue
Block a user