feat(ui): Replace all browser native confirm('Are you sure?') calls w…

…ith in ui confirm dialog to avoid cross platform design changes + fixes #96
flawiddsouza · Mar 8, 2024 · acde4e7 · acde4e7
1 parent 82284a3
commit acde4e7
Show file tree

Hide file tree

Showing 9 changed files with 147 additions and 125 deletions.
diff --git a/packages/ui/src/components/RequestPanel.vue b/packages/ui/src/components/RequestPanel.vue
@@ -584,7 +584,7 @@ export default {
             e.stopPropagation()
             const content = e.clipboardData.getData('text/plain').trim()
             if (content.startsWith('curl')) {
-                if(!confirm(`We've detected that you've pasted a curl command. Do you want to import the curl command into the current request?`)) {
+                if(!await window.createConfirm(`We've detected that you've pasted a curl command. Do you want to import the curl command into the current request?`)) {
                     return
                 }
                 const result = await convertCurlCommandToRestfoxCollection(content, this.activeWorkspace._id)

diff --git a/packages/ui/src/components/ResponsePanel.vue b/packages/ui/src/components/ResponsePanel.vue
@@ -372,8 +372,8 @@ export default {
             a.click()
             URL.revokeObjectURL(url)
         },
-        restoreCurrentResponseRequest() {
-            if(!confirm('Are you sure? Restoring a request will reset your existing request and make it the same as the saved response\'s request.')) {
+        async restoreCurrentResponseRequest() {
+            if(!await window.createConfirm('Are you sure? Restoring a request will reset your existing request and make it the same as the saved response\'s request.')) {
                 return
             }
 

diff --git a/packages/ui/src/components/Sidebar.vue b/packages/ui/src/components/Sidebar.vue
@@ -288,8 +288,9 @@ export default {
     methods: {
         async handleClick(clickedSidebarItem) {
             if(clickedSidebarItem === 'Delete') {
-                if(confirm('Are you sure?')) {
-                    this.$store.dispatch('deleteCollectionItem', this.activeSidebarItemForContextMenu)
+                const collectionItemToDelete = JSON.parse(JSON.stringify(this.activeSidebarItemForContextMenu))
+                if(await window.createConfirm('Are you sure?')) {
+                    this.$store.dispatch('deleteCollectionItem', collectionItemToDelete)
                 }
             }
 

diff --git a/packages/ui/src/components/SocketPanel.vue b/packages/ui/src/components/SocketPanel.vue
@@ -292,8 +292,8 @@ function addClient() {
     })
 }
 
-function removeClient(client: Client) {
-    if (!confirm('Are you sure you want to remove this client?')) {
+async function removeClient(client: Client) {
+    if (!await (window as any).createConfirm('Are you sure you want to remove this client?')) {
         return
     }
     sockets[activeTab.value._id + '-' + client.id]?.close()
@@ -616,13 +616,13 @@ function changePayloadTab(client: Client, tab: ClientPayload) {
     client.event = tab.event
 }
 
-function closePayloadTab(client: Client, event: { tabToClose: ClientPayload, tabToOpen: ClientPayload }) {
+async function closePayloadTab(client: Client, event: { tabToClose: ClientPayload, tabToOpen: ClientPayload }) {
     if(client.payloads.length === 1) {
         alert('Cannot delete payload as there\'s only one payload left')
         return
     }
 
-    if(!confirm(`Are you sure you want to remove "${event.tabToClose.name}?"`)) {
+    if(!await (window as any).createConfirm(`Are you sure you want to remove "${event.tabToClose.name}?"`)) {
         return
     }
 

diff --git a/packages/ui/src/components/Workspaces.vue b/packages/ui/src/components/Workspaces.vue
@@ -75,7 +75,7 @@ export default {
             this.contextMenuWorkspace = workspace
             this.showContextMenu = true
         },
-        handleContextMenuClick(clickedContextMenuItem) {
+        async handleContextMenuClick(clickedContextMenuItem) {
             if(clickedContextMenuItem === 'Duplicate') {
                 this.workspaceToDuplicate = JSON.parse(JSON.stringify(this.contextMenuWorkspace))
                 this.showDuplicateWorkspaceModal = true
@@ -86,7 +86,7 @@ export default {
             }
 
             if(clickedContextMenuItem === 'Delete') {
-                if(confirm('Are you sure?')) {
+                if(await window.createConfirm('Are you sure?')) {
                     this.$store.dispatch('deleteWorkspace', this.contextMenuWorkspace._id)
                 }
             }

diff --git a/packages/ui/src/components/modals/BackupAndRestoreModal.vue b/packages/ui/src/components/modals/BackupAndRestoreModal.vue
@@ -57,7 +57,7 @@ export default {
             downloadBlob(`Restfox_Backup_${todayISODate()}.json`, blob)
         },
         async restoreBackup() {
-            if(!confirm('Are you sure?')) {
+            if(!await window.createConfirm('Are you sure?')) {
                 return
             }
 

diff --git a/packages/ui/src/components/modals/EnvironmentModal.vue b/packages/ui/src/components/modals/EnvironmentModal.vue
@@ -192,7 +192,7 @@ export default {
                     alert(`Given environment name already exists: ${newEnvironmentName}`)
                     return
                 } else {
-                    if(!confirm(`Given environment name already exists: ${newEnvironmentName}\nDo you want to merge with the existing one?`)) {
+                    if(!await window.createConfirm(`Given environment name already exists: ${newEnvironmentName}\nDo you want to merge with the existing one?`)) {
                         return
                     }
 
@@ -372,14 +372,14 @@ export default {
 
             this.hideEnvironmentContextMenu()
         },
-        deleteEnvironment() {
+        async deleteEnvironment() {
             if(this.environments.length === 1) {
                 alert('Cannot delete environment as there\'s only one environment left')
                 this.hideEnvironmentContextMenu()
                 return
             }
 
-            if(!confirm('Are you sure you want to delete this environment?')) {
+            if(!await window.createConfirm('Are you sure you want to delete this environment?')) {
                 this.hideEnvironmentContextMenu()
                 return
             }

diff --git a/packages/ui/src/components/modals/PluginManagerModal.vue b/packages/ui/src/components/modals/PluginManagerModal.vue
@@ -192,8 +192,8 @@ export default {
         updatePluginStatus(pluginId, enabled) {
             this.$store.commit('updatePluginStatus', { _id: pluginId, enabled: enabled === '1' ? true : false })
         },
-        deletePlugin(pluginId) {
-            if(confirm('Are you sure?')) {
+        async deletePlugin(pluginId) {
+            if(await window.createConfirm('Are you sure?')) {
                 this.$store.commit('deletePlugin', pluginId)
             }
         },