Skip to content

Commit

Permalink
UISAUTCOMP-135: useAutoOpenDetailView - block auto-open on mount if r…
Browse files Browse the repository at this point in the history
…ecord id exists in URL.
  • Loading branch information
Dmytro-Melnyshyn committed Dec 13, 2024
1 parent f3e78d6 commit 598e494
Show file tree
Hide file tree
Showing 4 changed files with 77 additions and 9 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@
# Change history for stripes-authoriy-components

## [5.0.3] (IN PROGRESS)

- [UISAUTCOMP-135](https://issues.folio.org/browse/UISAUTCOMP-135) `useAutoOpenDetailView` - block auto-open on mount if record id exists in URL.

## [5.0.2] (https://github.com/folio-org/stripes-authority-components/tree/v5.0.2) (2024-12-10)

- [UISAUTCOMP-133](https://issues.folio.org/browse/UISAUTCOMP-133) Handle uncaught error when a search request fails.
Expand Down
20 changes: 12 additions & 8 deletions lib/hooks/useAutoOpenDetailView/useAutoOpenDetailView.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,14 @@ import { AuthoritiesSearchContext } from '../../context';
const useAutoOpenDetailView = (authorities, onOpenDetailView, isLoading = false, urlAuthorityId = '') => {
const { navigationSegmentValue } = useContext(AuthoritiesSearchContext);
const prevOpenedSingleAuthority = useRef(null);
const isBlockOnMount = useRef(false);

useEffect(() => {
// block auto-opening on page reload and redirection from quick marc.
if (urlAuthorityId) {
isBlockOnMount.current = true;
}
}, []);

Check warning on line 27 in lib/hooks/useAutoOpenDetailView/useAutoOpenDetailView.js

View workflow job for this annotation

GitHub Actions / ESLint Report Analysis

lib/hooks/useAutoOpenDetailView/useAutoOpenDetailView.js#L27

[react-hooks/exhaustive-deps] React Hook useEffect has a missing dependency: 'urlAuthorityId'. Either include it or remove the dependency array.

useEffect(() => {
// do nothing during loading, to be able to correctly compare the previously opened record with the current one.
Expand All @@ -32,14 +40,10 @@ const useAutoOpenDetailView = (authorities, onOpenDetailView, isLoading = false,
if (navigationSegmentValue === navigationSegments.browse) {
isDetailViewNeedsToBeOpen = authority?.isAnchor && authority?.isExactMatch;
} else {
// Check the record id so that when the third pane has a single record open and the user creates a record
// on a different route and then is redirected back to the third pane, then the third pane should contain
// the newly created record instead of the previously opened one.
if (urlAuthorityId) {
// A single record can be opened in two ways: when reloading the page with opened single record and when all
// the conditions for auto-opening a single record are met. So let's save the record for both cases. This will
// be used to compare the previously opened record with the current one.
if (isBlockOnMount.current) {
// record should be stored to avoid auto-opening after closing the third pane.
prevOpenedSingleAuthority.current = authority;
isBlockOnMount.current = false;
return;
}

Expand All @@ -53,7 +57,7 @@ const useAutoOpenDetailView = (authorities, onOpenDetailView, isLoading = false,
prevOpenedSingleAuthority.current = authority;
onOpenDetailView(authority);
}
}, [authorities, navigationSegmentValue, onOpenDetailView, urlAuthorityId, isLoading]);
}, [authorities, navigationSegmentValue, onOpenDetailView, isLoading]);
};

export default useAutoOpenDetailView;
60 changes: 60 additions & 0 deletions lib/hooks/useAutoOpenDetailView/useAutoOpenDetailView.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,66 @@ describe('useAutoOpenDetailView hook', () => {
});

describe('when there is a record ID in URL', () => {
describe('and it is mount (page reload or redirection from quick marc)', () => {
it('should not open record`s detail view', async () => {
const isLoading = true;
const urlAuthorityId = 'fake-id';

const initialProps = [[], openDetailView, isLoading, urlAuthorityId]

Check failure on line 58 in lib/hooks/useAutoOpenDetailView/useAutoOpenDetailView.test.js

View workflow job for this annotation

GitHub Actions / ESLint Report Analysis

lib/hooks/useAutoOpenDetailView/useAutoOpenDetailView.test.js#L57-L58

[semi] Missing semicolon.
const { rerender } = renderHook(_initialProps => useAutoOpenDetailView(..._initialProps), {
wrapper: Wrapper,
initialProps,
});

rerender([
[authorities[0]],
openDetailView,
false,
urlAuthorityId,
]);

expect(openDetailView).not.toHaveBeenCalled();
});
});

describe('and closing the opened single record', () => {
it('should not reopen record`s detail view', () => {
const isLoading = true;
const urlAuthorityId = 'fake-id';

const initialProps = [
[],
openDetailView,
isLoading,
urlAuthorityId,
];

const { rerender } = renderHook(_initialProps => useAutoOpenDetailView(..._initialProps), {
initialProps,
wrapper: Wrapper,
});

rerender([
[authorities[0]],
openDetailView,
false,
urlAuthorityId,
]);

const _urlAuthorityId = null;

rerender([
[authorities[0]],
openDetailView,
false,
_urlAuthorityId,
]);

expect(openDetailView).not.toHaveBeenCalled();
});
})

Check failure on line 111 in lib/hooks/useAutoOpenDetailView/useAutoOpenDetailView.test.js

View workflow job for this annotation

GitHub Actions / ESLint Report Analysis

lib/hooks/useAutoOpenDetailView/useAutoOpenDetailView.test.js#L110-L111

[semi] Missing semicolon.
it('should not open record`s detail view', () => {
const isLoading = false;
const urlAuthorityId = 'fake-id';
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@folio/stripes-authority-components",
"version": "5.0.2",
"version": "5.0.3",
"description": "Component library for Stripes Authority modules",
"repository": "https://github.com/folio-org/stripes-authority-components",
"main": "index.js",
Expand Down

0 comments on commit 598e494

Please sign in to comment.