primefaces
FileUpload Templated: Inconsistency in getFiles() and totalSize calculation during onSelect and onRemove events
Describe the bug
When utilizing the FileUpload component with custom templates (headerTemplate, itemTemplate), managing the total file size state (totalSize) externally becomes inconsistent. The onSelect and onRemove events appear to fire asynchronously relative to the component's internal file list update.
Reproducer
No response
System Information
"react": "18.3.1",
"react-dom": "18.3.1",
"primereact": "^10.9.7",
Steps to reproduce the behavior
Steps to Reproduce: Create a FileUpload component using the App Router in Next.js (client-side) with headerTemplate to display an external totalSize state managed by useState. Implement onSelect and onRemove handlers that attempt to use fileUploadRef.current.getFiles() to accurately calculate the current total size. Select a single file (File A). The displayed total size is incorrect (often 0 or delayed). Select a second file (File B). The total size calculation often incorrectly duplicates the size of File A plus the size of File B (e.g., A + A + B), or only shows the size of File A. Deleting File B sometimes synchronizes the size correctly, sometimes no
Expected behavior
fileUploadRef.current.getFiles() should reliably and synchronously reflect the updated list of files immediately after the onSelect or onRemove events have fired, allowing external state management to remain synchronized without requiring workarounds.
Current Workaround: The only reliable way to achieve synchronization is by using setTimeout(syncTotalSize, 0) within the onSelect and onRemove handlers to defer the state update to the next event loop tick.
