diff --git a/src/components/settings/Settings.svelte b/src/components/settings/Settings.svelte
index 39d6a04f..dcd9f1ed 100644
--- a/src/components/settings/Settings.svelte
+++ b/src/components/settings/Settings.svelte
@@ -3,6 +3,7 @@
   import isEmail from "validator/es/lib/isEmail";
   import { MeService } from "@odit/lfk-client-js";
   import Toastify from "toastify-js";
+  import ConfirmProfileDeletion from "./ConfirmProfileDeletion.svelte";
   $: data_loaded = false;
   $: original_data = {};
   $: editable = {};
@@ -10,26 +11,27 @@
     JSON.stringify(editable) === JSON.stringify(original_data)
   );
   $: save_enabled = changes_performed && isEmail(editable.email);
+  let modal_open = false;
   const user_promise = MeService.meControllerGet().then((data) => {
     data_loaded = true;
     data.groups = data.groups.map((g) => g.id);
-    data.permissions = [0]
+    data.permissions = [0];
     original_data = Object.assign(original_data, data);
     editable = Object.assign(editable, original_data);
   });
   function submit() {
     if (data_loaded === true && save_enabled) {
       Toastify({
-        text: $_('updating-your-profile'),
+        text: $_("updating-your-profile"),
         duration: 2500,
       }).showToast();
-      console.log(editable)
+      console.log(editable);
       MeService.meControllerPut(editable)
         .then((resp) => {
-          console.log(resp)
+          console.log(resp);
           original_data = Object.assign(original_data, editable);
           Toastify({
-            text:$_('profile-updated'),
+            text: $_("profile-updated"),
             duration: 2500,
             backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
           }).showToast();
@@ -39,6 +41,7 @@
   }
 </script>
 
+<ConfirmProfileDeletion bind:modal_open />
 <div class="pt-12 px-4 sm:px-6 lg:px-8 lg:pt-20 bg-gray-900 pb-12">
   <div class="text-center mb-8">
     <h1