Password Change for Profile Page

wyatt-herkamp · Aug 28, 2024 · 48b066e · 48b066e
1 parent 7f4eeb6
commit 48b066e
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 12 deletions.
diff --git a/nitro_repo/src/app/api/user.rs b/nitro_repo/src/app/api/user.rs
@@ -4,7 +4,7 @@ use axum::{
     body::Body,
     extract::{ConnectInfo, State},
     response::{IntoResponse, Response},
-    routing::get,
+    routing::{get, post},
     Json,
 };
 use axum_extra::{
@@ -48,9 +48,10 @@ use crate::{
         login,
         get_sessions,
         logout,
+        change_password,
         password_reset::request_password_reset,
         password_reset::does_exist,
-        password_reset::change_password,
+        password_reset::perform_password_change,
         tokens::create,
         tokens::list,
         tokens::get_token
@@ -73,7 +74,7 @@ pub fn user_routes() -> axum::Router<NitroRepo> {
     axum::Router::new()
         .route("/me", axum::routing::get(me))
         .route("/me/permissions", axum::routing::get(me_permissions))
-        .route("/change-password", get(change_password))
+        .route("/change-password", post(change_password))
         .route("/whoami", axum::routing::get(whoami))
         .route("/login", axum::routing::post(login))
         .route("/sessions", axum::routing::get(get_sessions))

diff --git a/nitro_repo/src/app/api/user/password_reset.rs b/nitro_repo/src/app/api/user/password_reset.rs
@@ -34,7 +34,7 @@ pub fn password_reset_routes() -> axum::Router<NitroRepo> {
     axum::Router::new()
         .route("/request", post(request_password_reset))
         .route("/check/:token", get(does_exist))
-        .route("/:token", post(change_password))
+        .route("/:token", post(perform_password_change))
 }
 #[derive(Debug, Serialize, Deserialize, ToSchema)]
 pub struct RequestPasswordReset {
@@ -64,7 +64,7 @@ impl Email for PasswordResetEmail {
 }
 #[utoipa::path(
     post,
-    path = "password-reset/request",
+    path = "/password-reset/request",
     request_body = RequestPasswordReset,
     responses(
         (status = 200, description = "Returns a JSON Schema for the config type")
@@ -109,7 +109,7 @@ async fn request_password_reset(
 }
 #[utoipa::path(
     get,
-    path = "password-reset/check/{token}",
+    path = "/password-reset/check/{token}",
     responses(
         (status = 204, description = "Token Exists"),
         (status = 404, description = "Token Does Not Exist")
@@ -136,13 +136,13 @@ async fn does_exist(
 #[utoipa::path(
     post,
     request_body = ChangePasswordNoCheck,
-    path = "password-reset/{token}",
+    path = "/password-reset/{token}",
     responses(
         (status = 204, description = "Password Changed"),
         (status = 404, description = "Token Does Not Exist")
     ),
 )]
-async fn change_password(
+async fn perform_password_change(
     State(site): State<NitroRepo>,
     Path(token): Path<String>,
     Json(password_reset): Json<ChangePasswordNoCheck>,

diff --git a/site/src/views/profile/ProfileLoginSettings.vue b/site/src/views/profile/ProfileLoginSettings.vue
@@ -17,12 +17,13 @@
   </main>
 </template>
 <script setup lang="ts">
-import WorkInProgress from '@/components/core/WorkInProgress.vue'
 import SubmitButton from '@/components/form/SubmitButton.vue'
 import NewPasswordInput from '@/components/form/text/NewPasswordInput.vue'
 import PasswordInput from '@/components/form/text/PasswordInput.vue'
+import http from '@/http'
 import { sessionStore } from '@/stores/session'
 import { siteStore } from '@/stores/site'
+import { notify } from '@kyvg/vue3-notification'
 import { ref } from 'vue'
 const site = siteStore()
 const passwordRules = site.siteInfo?.password_rules
@@ -32,12 +33,30 @@ const oldPassword = ref('')
 const newPassword = ref('')
 
 async function changePassword() {
-  if (!passwordRules) {
-    return
-  }
   if (newPassword.value == undefined || newPassword.value == '') {
     return
   }
+  const request = {
+    old_password: oldPassword.value,
+    new_password: newPassword.value
+  }
+  await http
+    .post('/api/user/change-password', request)
+    .then(() => {
+      oldPassword.value = ''
+      newPassword.value = ''
+      notify({
+        type: 'success',
+        text: 'Password changed successfully'
+      })
+    })
+    .catch((error) => {
+      console.error(error)
+      notify({
+        type: 'error',
+        text: 'Failed to change password'
+      })
+    })
 }
 </script>