From 1efc147953e0f34075af7f95789df5c3a50ef38e Mon Sep 17 00:00:00 2001
From: Abdelhamid Errahmouni <abdelhamid.errahmouni@gmail.com>
Date: Fri, 20 Sep 2024 14:56:45 +0100
Subject: [PATCH] added upload started and finished events (#5)

* added upload started and finished events to make it easy to deal with upload progress from outside the component.

* added $wireModelAttribute as an extra value sent with the event.

* added filepond-upload-reverted and filepond-upload-file-removed event.

* fixed a typo in dispatch of filepond-upload-finished event.
---
 resources/views/upload.blade.php | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/resources/views/upload.blade.php b/resources/views/upload.blade.php
index 7778341..3b4708c 100644
--- a/resources/views/upload.blade.php
+++ b/resources/views/upload.blade.php
@@ -57,16 +57,22 @@ class="{{ $attributes->get('class') }}"
       pond.setOptions({
           allowMultiple: isMultiple,
           server: {
-              process: (fieldName, file, metadata, load, error, progress) => {
-                  @this.upload('{{ $wireModelAttribute }}', file, load, error, progress);
+              process: async (fieldName, file, metadata, load, error, progress) => {
+                  $dispatch('filepond-upload-started', '{{ $wireModelAttribute }}');
+                  await @this.upload('{{ $wireModelAttribute }}', file, (response) => {
+                      load(response);
+                      $dispatch('filepond-upload-finished', {'{{ $wireModelAttribute }}': response });
+                  }, error, progress);
               },
-              revert: (filename, load) => {
-                  @this.revert('{{ $wireModelAttribute }}', filename, load);
+              revert: async (filename, load) => {
+                  await @this.revert('{{ $wireModelAttribute }}', filename, load);
+                  $dispatch('filepond-upload-reverted', '{{ $wireModelAttribute }}');
               },
-              remove: (file, load) => {
-              console.log(file);
-                  @this.remove('{{ $wireModelAttribute }}', file.name);
+              remove: async (file, load) => {
+                  console.log(file);
+                  await @this.remove('{{ $wireModelAttribute }}', file.name);
                   load();
+                  $dispatch('filepond-upload-file-removed', '{{ $wireModelAttribute }}');
               },
           },
           required: @js($required),