diff --git a/frontend/src/pages/views/MassEditor.tsx b/frontend/src/pages/views/MassEditor.tsx index 56446e723..7476812e6 100644 --- a/frontend/src/pages/views/MassEditor.tsx +++ b/frontend/src/pages/views/MassEditor.tsx @@ -51,11 +51,20 @@ function MassEditor(props: MassEditorProps) { const { mutateAsync } = mutation; + /** + * Submit the form that contains the series id and the respective profile id set in chunks to prevent payloads too + * large when we have a high amount of series or movies being applied the profile. The chunks are executed in order + * since there are no much benefit on executing in parallel, also parallelism could result in high load on the server + * side if not throttled properly. + */ const save = useCallback(() => { + const chunkSize = 1000; + const form: FormType.ModifyItem = { id: [], profileid: [], }; + dirties.forEach((v) => { const id = GetItemId(v); if (id) { @@ -63,7 +72,25 @@ function MassEditor(props: MassEditorProps) { form.profileid.push(v.profileId); } }); - return mutateAsync(form); + + const mutateInChunks = async ( + ids: number[], + profileIds: (number | null)[], + ) => { + if (ids.length === 0) return; + + const chunkIds = ids.slice(0, chunkSize); + const chunkProfileIds = profileIds.slice(0, chunkSize); + + await mutateAsync({ + id: chunkIds, + profileid: chunkProfileIds, + }); + + await mutateInChunks(ids.slice(chunkSize), profileIds.slice(chunkSize)); + }; + + return mutateInChunks(form.id, form.profileid); }, [dirties, mutateAsync]); const setProfiles = useCallback(