yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-09-23 07:22:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #14497 from strapi/fix/relations/infinite-scroll-in-input

Browse Source
This commit is contained in:
Josh 2022-10-03 09:22:35 +01:00 committed by GitHub
commit b93f4cb7b3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 32 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
packages/core/admin/admin/src/content-manager/components/RelationInput/RelationInput.js
View File

@ -68,6 +68,10 @@ const RelationInput = ({
const outerListRef = useRef();
const [overflow, setOverflow] = useState('');
const {
data: { pages },
} = searchResults;
const relations = useMemo(() => paginatedRelations.data.pages.flat(), [paginatedRelations]);
const totalNumberOfRelations = relations.length ?? 0;
@ -86,12 +90,12 @@ const RelationInput = ({
const options = useMemo(
() =>
searchResults.data.pages.flat().map((result) => ({
pages.flat().map((result) => ({
...result,
value: result.id,
label: result.mainField,
})),
[searchResults]
[pages]
);
useEffect(() => {
@ -135,8 +139,16 @@ const RelationInput = ({
const [isMenuOpen, setIsMenuOpen] = useState(false);
const timeoutRef = useRef();
const previousOptions = useRef([]);
useEffect(() => {
/**
* We only really want this effect to fire once when the options
* change from an empty array to an array with values.
* Otherwise, it'll fire when the infinite scrolling happens causing
* the menu to jump to the top all the time when loading more.
*/
if (options.length > 0 && previousOptions.current.length === 0) {
setIsMenuOpen((isCurrentlyOpened) => {
/**
* If we're currently open and the options changed
@ -153,6 +165,11 @@ const RelationInput = ({
return false;
});
}
return () => {
previousOptions.current = options || [];
};
}, [options]);
useEffect(() => {