Merge pull request #77 from ManuLG/fix/broken-confirmation-modals

fix: await for confirmation before deleting voices and channels

app/src/components/AudioTab/AudioTab.tsx

@@ -124,6 +124,13 @@ export function AudioTab() {
     );
   }
 
+  const handleChannelDelete = async (e, channelId) => {
+    e.stopPropagation();
+    if (await confirm('Delete this channel?')) {
+      deleteChannel.mutate(channelId);
+    }
+  }
+
   const allChannels = channels || [];
   const allDevices = devices || [];
   const selectedChannel = selectedChannelId
@@ -241,12 +248,7 @@ export function AudioTab() {
                             variant="ghost"
                             size="sm"
                             className="h-8 w-8 p-0"
-                            onClick={(e) => {
+                            onClick={(e) => handleChannelDelete(e, channel.id)}
-                              e.stopPropagation();
-                              if (confirm('Delete this channel?')) {
-                                deleteChannel.mutate(channel.id);
-                              }
-                            }}
                           >
                             <Trash2 className="h-4 w-4" />
                           </Button>

app/src/components/VoicesTab/VoicesTab.tsx

@@ -79,8 +79,8 @@ export function VoicesTab() {
     setDialogOpen(true);
   };
 
-  const handleDelete = (profileId: string) => {
+  const handleProfileDelete = async (profileId: string) => {
-    if (confirm('Are you sure you want to delete this profile?')) {
+    if (await confirm('Are you sure you want to delete this profile?')) {
       deleteProfile.mutate(profileId);
     }
   };
@@ -147,7 +147,7 @@ export function VoicesTab() {
                 channels={channels || []}
                 onChannelChange={(channelIds) => handleChannelChange(profile.id, channelIds)}
                 onEdit={() => handleEdit(profile.id)}
-                onDelete={() => handleDelete(profile.id)}
+                onDelete={() => handleProfileDelete(profile.id)}
               />
             ))}
           </TableBody>