refactor(deleteButton): requested changes

package.json

@@ -87,7 +87,6 @@
     "happy-dom": "14.7.1",
     "lightningcss": "1.24.0",
     "rollup-plugin-visualizer": "5.12.0",
-    "sass": "1.75.0",
     "typescript": "5.3.3",
     "unocss": "0.58.5",
     "unplugin-icons": "0.18.5",

src/components/Layout/Views/ClientProfileView.vue

@@ -95,12 +95,12 @@
     </div>
   </div>
   <div
-    style="justify-content: center; display: flex;"
-    @click="deleteAccountMessage">
+    style="justify-content: center; display: flex;">
     <Boton
       type="rounded-red"
       class="ocial-button"
-      style="width: 80%; padding-top: 1vh; padding-bottom: 1vh;">
+      style="width: 80%; padding-top: 1vh; padding-bottom: 1vh;"
+      @click="deleteAccountMessage">
       <div>
         <p>
           {{ $t('eliminarCuenta') }}

src/components/Layout/Views/UserProfileView.vue

@@ -58,12 +58,12 @@
     </div>
   </div>
   <div
-    style="justify-content: center; display: flex;"
-    @click="deleteAccountMessage">
+    style="justify-content: center; display: flex;">
     <Boton
       type="rounded-red"
       class="ocial-button"
-      style="width: 80%; padding-top: 1vh; padding-bottom: 1vh;">
+      style="width: 80%; padding-top: 1vh; padding-bottom: 1vh;"
+      @click="deleteAccountMessage">
       <div>
         <p>
           {{ $t('eliminarCuenta') }}

src/composables/use-delete-account-alert.ts

@@ -10,7 +10,7 @@ import { useApi } from '@/composables/apis';
 export async function deleteAccountMessage() : Promise<void> {
   const { t } = i18n;
 
-  await Swal.fire({
+  const alert = await Swal.fire({
     title: t('deleteAccountMessageTitle'),
     text: t('deleteAccountMessageText'),
     icon: 'warning',
@@ -19,19 +19,15 @@ export async function deleteAccountMessage() : Promise<void> {
     cancelButtonColor: '#0e4781',
     confirmButtonText: t('deleteAccountMessageConfirm'),
     cancelButtonText: t('deleteAccountMessageCancel')
-  }).then(async (res) => {
-    if (res.isConfirmed) {
-      await Swal.fire({
-        title: t('deleteAccountMessageConfirmedTitle'),
-        text: t('deleteAccountMessageConfirmedText'),
-        icon: 'success'
-      });
-      await useApi(UsersApi, 'usersMeDeleteDestroy')();
-      auth.logout();
-
-      return 'Account deleted';
-    } else {
-      return 'Account deletion cancelled';
-    }
   });
+
+  if (alert.isConfirmed) {
+    await Swal.fire({
+      title: t('deleteAccountMessageConfirmedTitle'),
+      text: t('deleteAccountMessageConfirmedText'),
+      icon: 'success'
+    });
+    await useApi(UsersApi, 'usersMeDeleteDestroy')();
+    auth.logout();
+  }
 }

src/main.ts

@@ -27,7 +27,7 @@ import 'inter-ui/inter-variable.css';
 import '@unocss/reset/tailwind.css';
 import '@/assets/styles/global.css';
 import 'virtual:uno.css';
-import 'sweetalert2/src/sweetalert2.scss';
+import 'sweetalert2/dist/sweetalert2.css';
 
 /**
  * - PLUGINS DE VUE Y DIRECTIVAS -