Livewire3 and Sweetalert2

I have a confirm button to delete an item.

<button type="button" wire:click="removeFieldGroupRel({{$t->id}})" class="btn btn-danger"><i class="bi bi-trash"></i></button>

this is my livewire function

public function removeFieldGroupRel($i){
		$this->dispatch('clientConfirm', [
			'targetEvent' => 'groupDelete',
			'id' => $i,
		]);
	}
	
	public function groupDelete($i){
		$this->model->trans($i)->delete();
	}

and this is my javascript

<script type="text/javascript">

document.addEventListener('livewire:init', () => {
   Livewire.on('clientConfirm', (eventData) => {
	   Livewire.dispatch("groupDelete");
	   console.log('Received clientConfirm event:', eventData);
	   Swal.fire({
		  icon: "question",
		  title: "{{__('Are you sure?')}}",
		  showCancelButton: true,
		  confirmButtonText: "{{__('Delete')}}",
		  cancelButtonText: "{{__('Cancel')}}",
		}).then((result) => {
		  if (result.isConfirmed) {
			  Livewire.dispatch("groupDelete");
		  }
		});
   });
});
</script>

he is showing the confirm, but he will not going to the groupDelete.