fix(ui): properly sync field values in bulk upload preventing stale d…

…ata overriding old docs (#9918)

<!--

Thank you for the PR! Please go through the checklist below and make
sure you've completed all the steps.

Please review the
[CONTRIBUTING.md](https://github.com/payloadcms/payload/blob/main/CONTRIBUTING.md)
document in this repository if you haven't already.

The following items will ensure that your PR is handled as smoothly as
possible:

- PR Title must follow conventional commits format. For example, `feat:
my new feature`, `fix(plugin-seo): my fix`.
- Minimal description explained as if explained to someone not
immediately familiar with the code.
- Provide before/after screenshots or code diffs if applicable.
- Link any related issues/discussions from GitHub or Discord.
- Add review comments if necessary to explain to the reviewer the logic
behind a change

### What?

### Why?

### How?

Fixes #

-->
### What?
This PR fixes an issue where bulk upload on an upload field with
hasMany, which had errors on sequential uploads, caused only the last
successful upload to be saved to the field value.

### Why?
To save all successful uploads to the field value and sync what was
shown in the ui to the actual field data.

### How?
By triggering a rerender that syncs `populatedDocs` to the fields
`value` on each sequential successful upload after form errors were
resolved.

Fixes #9890

Before:

[Bulk-upload-before--Post---Payload.webm](https://github.com/user-attachments/assets/6396a88b-21c2-4037-b1ef-fd7f8d16103f)

After:

[Bulk-upload-after---Payload.webm](https://github.com/user-attachments/assets/8566a022-6e86-46c7-87fe-78d01e6dd8c9)

Notes:
- The core issue was that onSuccess function was not properly syncing
the correct field values resulting in stale values that would overwrite
old docs.

---------

Co-authored-by: Patrik Kozak <patrik@payloadcms.com>

packages/ui/src/fields/Upload/Input.tsx

@@ -266,7 +266,6 @@ export function UploadInput(props: UploadInputProps) {
         setInitialFiles(fileListToUse)
       }
       setCollectionSlug(relationTo)
-      setOnSuccess(onUploadSuccess)
       if (typeof maxRows === 'number') {
         setMaxFiles(maxRows)
       }
@@ -275,12 +274,10 @@ export function UploadInput(props: UploadInputProps) {
     [
       drawerSlug,
       hasMany,
-      onUploadSuccess,
       openModal,
       relationTo,
       setCollectionSlug,
       setInitialFiles,
-      setOnSuccess,
       maxRows,
       setMaxFiles,
     ],
@@ -428,6 +425,10 @@ export function UploadInput(props: UploadInputProps) {
     }
   }, [populateDocs, activeRelationTo, value])
 
+  useEffect(() => {
+    setOnSuccess(onUploadSuccess)
+  }, [value, onUploadSuccess, setOnSuccess])
+
   const showDropzone =
     !value ||
     (hasMany && Array.isArray(value) && (typeof maxRows !== 'number' || value.length < maxRows)) ||