Implemented the password change logic

ref #103

src/components/settings/Settings.svelte

@@ -15,7 +15,8 @@
     JSON.stringify(editable) === JSON.stringify(original_data)
   );
   $: save_enabled = changes_performed && isEmail(editable.email);
-  $: update_password_enabled = password_change.length > 0 &&(password_change === password_confirm);
+  $: update_password_enabled =
+    password_change.length > 0 && password_change === password_confirm;
   const user_promise = MeService.meControllerGet().then((data) => {
     data_loaded = true;
     data.groups = data.groups.map((g) => g.id);
@@ -29,10 +30,8 @@
         text: $_("updating-your-profile"),
         duration: 2500,
       }).showToast();
-      console.log(editable);
       MeService.meControllerPut(editable)
         .then((resp) => {
-          console.log(resp);
           original_data = Object.assign(original_data, editable);
           Toastify({
             text: $_("profile-updated"),
@@ -43,9 +42,30 @@
         .catch((err) => {});
     }
   }
+  function changePassword() {
+    if (data_loaded === true && update_password_enabled) {
+      Toastify({
+        text: "Changing your password",
+        duration: 2500,
+      }).showToast();
+      let postdata = Object.assign({}, original_data);
+      postdata.password = password_confirm;
+      MeService.meControllerPut(postdata)
+        .then((resp) => {
+          password_confirm = "";
+          password_change = "";
+          Toastify({
+            text: "Password changed",
+            duration: 2500,
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          }).showToast();
+        })
+        .catch((err) => {});
+    }
+  }
 </script>
 
-<ConfirmProfileDeletion bind:modal_open bind:delete_triggered/>
+<ConfirmProfileDeletion bind:modal_open bind:delete_triggered />
 <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
@@ -218,7 +238,7 @@
                     class="border-gray-300 placeholder-gray-500 appearance-none rounded-none relative block w-full px-3 py-2 border rounded-b-md focus:outline-none focus:shadow-outline-blue focus:border-blue-300 focus:z-10 sm:text-sm"
                     placeholder={$_('password')} />
                 </div>
-                {#if (password_change != password_confirm) && password_change.length>0}
+                {#if password_change != password_confirm && password_change.length > 0}
                   <span
                     class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">{$_('passwords-dont-match')}</span>
                 {/if}
@@ -228,7 +248,7 @@
                   type="submit"
                   disabled={!update_password_enabled}
                   class:opacity-50={!update_password_enabled}
-                  on:click={submit}
+                  on:click={changePassword}
                   class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
                   {$_('update-password')}
                 </button>
@@ -261,7 +281,7 @@
                 <span data-id="donor_actions_${editable.id}">
                   {#if delete_triggered}
                     <button
-                        on:click={()=>{
+                      on:click={() => {
                         modal_open = true;
                       }}
                       class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:">{$_('confirm-deletion')}</button>