improve upload state handlers ergonomics (#5843)

Author: adhami3310

pyi_hashes.json

@@ -19,7 +19,7 @@
   "reflex/components/core/helmet.pyi": "43f8497c8fafe51e29dca1dd535d143a",
   "reflex/components/core/html.pyi": "ea5919db8c8172913185977df900f36b",
   "reflex/components/core/sticky.pyi": "a9b4492e423f1dd4ccbf270c8ea90157",
-  "reflex/components/core/upload.pyi": "77e828bbc55dd6593efdba1504e0cb5e",
+  "reflex/components/core/upload.pyi": "6dc28804a6dddf903e31162e87c1b023",
   "reflex/components/core/window_events.pyi": "76bf03a273a1fbbb3b333e10d5d08c30",
   "reflex/components/datadisplay/__init__.pyi": "52755871369acbfd3a96b46b9a11d32e",
   "reflex/components/datadisplay/code.pyi": "b86769987ef4d1cbdddb461be88539fd",

reflex/app.py

@@ -69,7 +69,6 @@
 )
 from reflex.components.core.breakpoints import set_breakpoints
 from reflex.components.core.sticky import sticky
-from reflex.components.core.upload import Upload, get_upload_dir
 from reflex.components.radix import themes
 from reflex.components.sonner.toast import toast
 from reflex.config import get_config
@@ -682,6 +681,8 @@ def _add_default_endpoints(self):
 
     def _add_optional_endpoints(self):
         """Add optional api endpoints (_upload)."""
+        from reflex.components.core.upload import Upload, get_upload_dir
+
         if not self._api:
             return
         upload_is_used_marker = (

reflex/components/core/upload.py

@@ -6,6 +6,7 @@
 from pathlib import Path
 from typing import Any, ClassVar
 
+from reflex.app import UploadFile
 from reflex.components.base.fragment import Fragment
 from reflex.components.component import (
     Component,
@@ -29,7 +30,9 @@
     call_event_fn,
     call_event_handler,
     parse_args_spec,
+    passthrough_event_spec,
     run_script,
+    upload_files,
 )
 from reflex.style import Style
 from reflex.utils import format
@@ -168,16 +171,7 @@ def get_upload_url(file_path: str | Var[str]) -> Var[str]:
     return Var.create(f"{uploaded_files_url_prefix}/{file_path}")
 
 
-def _on_drop_spec(files: Var) -> tuple[Var[Any]]:
-    """Args spec for the on_drop event trigger.
-
-    Args:
-        files: The files to upload.
-
-    Returns:
-        Signature for on_drop handler including the files to upload.
-    """
-    return (files,)
+_on_drop_spec = passthrough_event_spec(list[UploadFile])
 
 
 def _default_drop_rejected(rejected_files: ArrayVar[list[dict[str, Any]]]) -> EventSpec:
@@ -302,19 +296,21 @@ def create(cls, *children, **props) -> Component:
         }
 
         # Create the component.
-        upload_props["id"] = props.get("id", DEFAULT_UPLOAD_ID)
+        upload_props["id"] = upload_id = props.get("id", DEFAULT_UPLOAD_ID)
 
         if upload_props.get("on_drop") is None:
             # If on_drop is not provided, save files to be uploaded later.
-            upload_props["on_drop"] = upload_file(upload_props["id"])
+            upload_props["on_drop"] = upload_file(upload_id)
         else:
             on_drop = (
                 [on_drop_prop]
                 if not isinstance(on_drop_prop := upload_props["on_drop"], Sequence)
                 else list(on_drop_prop)
             )
             for ix, event in enumerate(on_drop):
-                if isinstance(event, (EventHandler, EventSpec)):
+                if isinstance(event, EventHandler):
+                    event = event(upload_files(upload_id))
+                if isinstance(event, EventSpec):
                     # Call the lambda to get the event chain.
                     event = call_event_handler(event, _on_drop_spec)
                 elif isinstance(event, Callable):