From 0ccebdc7d7f74f5cbce124b1ee73b787373044e9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=A4=E9=9B=A8=E4=B8=9C?= <root@ltpp.vip>
Date: Thu, 7 May 2026 21:34:37 +0800
Subject: [PATCH 1/3] feat: v21.3.0

---
 application/controller/auth/fn.rs             |   22 +-
 application/controller/auth/impl.rs           |   89 +-
 application/controller/auth/struct.rs         |    8 +-
 application/controller/blog/fn.rs             |  204 +++
 application/controller/blog/impl.rs           |  766 ++++++++
 application/controller/blog/mod.rs            |   17 +
 application/controller/blog/struct.rs         |   57 +
 application/controller/mod.rs                 |    2 +
 application/controller/notification/impl.rs   |   14 +-
 application/controller/user/fn.rs             |   93 +
 application/controller/user/impl.rs           |  387 ++++
 application/controller/user/mod.rs            |   17 +
 application/controller/user/struct.rs         |   25 +
 application/mapper/blog/comment/enum.rs       |    4 +
 application/mapper/blog/comment/impl.rs       |    7 +
 application/mapper/blog/comment/mod.rs        |    8 +
 application/mapper/blog/comment/struct.rs     |   30 +
 application/mapper/blog/comment/type.rs       |    6 +
 application/mapper/blog/favorite/enum.rs      |    4 +
 application/mapper/blog/favorite/impl.rs      |    7 +
 application/mapper/blog/favorite/mod.rs       |    8 +
 application/mapper/blog/favorite/struct.rs    |   24 +
 application/mapper/blog/favorite/type.rs      |    6 +
 application/mapper/blog/image/enum.rs         |    4 +
 application/mapper/blog/image/impl.rs         |    7 +
 application/mapper/blog/image/mod.rs          |    8 +
 application/mapper/blog/image/struct.rs       |   30 +
 application/mapper/blog/image/type.rs         |    6 +
 application/mapper/blog/like/enum.rs          |    4 +
 application/mapper/blog/like/impl.rs          |    7 +
 application/mapper/blog/like/mod.rs           |    8 +
 application/mapper/blog/like/struct.rs        |   24 +
 application/mapper/blog/like/type.rs          |    6 +
 application/mapper/blog/mod.rs                |    7 +
 application/mapper/blog/post/enum.rs          |    4 +
 application/mapper/blog/post/impl.rs          |    7 +
 application/mapper/blog/post/mod.rs           |    8 +
 application/mapper/blog/post/struct.rs        |   40 +
 application/mapper/blog/post/type.rs          |    6 +
 application/mapper/mod.rs                     |    2 +
 application/mapper/openapi/struct.rs          |   47 +-
 application/mapper/user/enum.rs               |   19 +
 application/mapper/user/impl.rs               |  126 ++
 application/mapper/user/mod.rs                |    8 +
 application/mapper/user/struct.rs             |   29 +
 application/mapper/user/type.rs               |    6 +
 application/model/application/blog/mod.rs     |    5 +
 application/model/application/blog/struct.rs  |   31 +
 application/model/application/mod.rs          |    2 +
 application/model/application/user/const.rs   |    2 +
 application/model/application/user/mod.rs     |    3 +
 application/model/request/auth/struct.rs      |    2 +-
 application/model/request/blog/mod.rs         |    5 +
 application/model/request/blog/struct.rs      |   60 +
 application/model/request/mod.rs              |    2 +
 application/model/request/user/mod.rs         |    5 +
 application/model/request/user/struct.rs      |   27 +
 application/model/response/blog/mod.rs        |    5 +
 application/model/response/blog/struct.rs     |  108 ++
 application/model/response/mod.rs             |    2 +
 application/model/response/user/mod.rs        |    5 +
 application/model/response/user/struct.rs     |   22 +
 application/repository/auth/impl.rs           |   45 +
 application/repository/auth/mod.rs            |    3 +-
 application/repository/blog/impl.rs           |  500 ++++++
 application/repository/blog/mod.rs            |   13 +
 application/repository/blog/struct.rs         |   39 +
 application/repository/mod.rs                 |    2 +
 application/repository/user/impl.rs           |  145 ++
 application/repository/user/mod.rs            |   12 +
 application/repository/user/struct.rs         |    4 +
 application/service/auth/const.rs             |    1 -
 application/service/auth/impl.rs              |   53 +-
 application/service/auth/mod.rs               |    4 +-
 application/service/auth/static.rs            |    4 +
 application/service/blog/impl.rs              |  634 +++++++
 application/service/blog/mod.rs               |   16 +
 application/service/blog/struct.rs            |    4 +
 application/service/mod.rs                    |    2 +
 application/service/user/impl.rs              |  160 ++
 application/service/user/mod.rs               |   14 +
 application/service/user/struct.rs            |    4 +
 application/view/blog/fn.rs                   |   14 +
 application/view/blog/impl.rs                 |   22 +
 application/view/blog/mod.rs                  |    7 +
 application/view/blog/struct.rs               |    5 +
 application/view/mod.rs                       |    2 +
 application/view/user/fn.rs                   |   14 +
 application/view/user/impl.rs                 |   22 +
 application/view/user/mod.rs                  |    7 +
 application/view/user/struct.rs               |    5 +
 bootstrap/application/db/enum.rs              |    5 +
 bootstrap/application/db/impl.rs              |   31 +
 resources/sql/const.rs                        |    8 +
 .../sql/postgresql/blog/comment_table.sql     |   10 +
 .../sql/postgresql/blog/favorite_table.sql    |    7 +
 resources/sql/postgresql/blog/image_table.sql |   11 +
 resources/sql/postgresql/blog/index.sql       |   41 +
 resources/sql/postgresql/blog/like_table.sql  |    7 +
 resources/sql/postgresql/blog/post_table.sql  |   16 +
 resources/static/auth/index.html              |    1 +
 resources/static/auth/js/app.js               |   12 +
 resources/static/blog/css/style.css           | 1582 +++++++++++++++++
 resources/static/blog/index.html              |  447 +++++
 resources/static/blog/js/app.js               | 1258 +++++++++++++
 resources/static/chat/index.html              |   25 +
 resources/static/chat/js/history.js           |    8 +
 resources/static/cicd/index.html              |   25 +
 resources/static/common/js/error-handler.js   |   52 +
 resources/static/notification/index.html      |    1 +
 resources/static/notification/js/app.js       |   48 +
 resources/static/order/index.html             |    1 +
 resources/static/order/js/app.js              |   80 +-
 resources/static/redis/index.html             |    1 +
 resources/static/redis/index.js               |   20 +
 resources/static/rss/index.html               |    1 +
 resources/static/shortlink/index.html         |    1 +
 resources/static/shortlink/js/app.js          |   16 +
 resources/static/tracking/index.html          |    9 +
 resources/static/upload/index.html            |    1 +
 resources/static/upload/index.js              |   16 +
 resources/static/user/css/style.css           |  967 ++++++++++
 resources/static/user/index.html              |  133 ++
 resources/static/user/js/app.js               |  471 +++++
 124 files changed, 9498 insertions(+), 75 deletions(-)
 create mode 100644 application/controller/blog/fn.rs
 create mode 100644 application/controller/blog/impl.rs
 create mode 100644 application/controller/blog/mod.rs
 create mode 100644 application/controller/blog/struct.rs
 create mode 100644 application/controller/user/fn.rs
 create mode 100644 application/controller/user/impl.rs
 create mode 100644 application/controller/user/mod.rs
 create mode 100644 application/controller/user/struct.rs
 create mode 100644 application/mapper/blog/comment/enum.rs
 create mode 100644 application/mapper/blog/comment/impl.rs
 create mode 100644 application/mapper/blog/comment/mod.rs
 create mode 100644 application/mapper/blog/comment/struct.rs
 create mode 100644 application/mapper/blog/comment/type.rs
 create mode 100644 application/mapper/blog/favorite/enum.rs
 create mode 100644 application/mapper/blog/favorite/impl.rs
 create mode 100644 application/mapper/blog/favorite/mod.rs
 create mode 100644 application/mapper/blog/favorite/struct.rs
 create mode 100644 application/mapper/blog/favorite/type.rs
 create mode 100644 application/mapper/blog/image/enum.rs
 create mode 100644 application/mapper/blog/image/impl.rs
 create mode 100644 application/mapper/blog/image/mod.rs
 create mode 100644 application/mapper/blog/image/struct.rs
 create mode 100644 application/mapper/blog/image/type.rs
 create mode 100644 application/mapper/blog/like/enum.rs
 create mode 100644 application/mapper/blog/like/impl.rs
 create mode 100644 application/mapper/blog/like/mod.rs
 create mode 100644 application/mapper/blog/like/struct.rs
 create mode 100644 application/mapper/blog/like/type.rs
 create mode 100644 application/mapper/blog/mod.rs
 create mode 100644 application/mapper/blog/post/enum.rs
 create mode 100644 application/mapper/blog/post/impl.rs
 create mode 100644 application/mapper/blog/post/mod.rs
 create mode 100644 application/mapper/blog/post/struct.rs
 create mode 100644 application/mapper/blog/post/type.rs
 create mode 100644 application/mapper/user/enum.rs
 create mode 100644 application/mapper/user/impl.rs
 create mode 100644 application/mapper/user/mod.rs
 create mode 100644 application/mapper/user/struct.rs
 create mode 100644 application/mapper/user/type.rs
 create mode 100644 application/model/application/blog/mod.rs
 create mode 100644 application/model/application/blog/struct.rs
 create mode 100644 application/model/application/user/const.rs
 create mode 100644 application/model/application/user/mod.rs
 create mode 100644 application/model/request/blog/mod.rs
 create mode 100644 application/model/request/blog/struct.rs
 create mode 100644 application/model/request/user/mod.rs
 create mode 100644 application/model/request/user/struct.rs
 create mode 100644 application/model/response/blog/mod.rs
 create mode 100644 application/model/response/blog/struct.rs
 create mode 100644 application/model/response/user/mod.rs
 create mode 100644 application/model/response/user/struct.rs
 create mode 100644 application/repository/blog/impl.rs
 create mode 100644 application/repository/blog/mod.rs
 create mode 100644 application/repository/blog/struct.rs
 create mode 100644 application/repository/user/impl.rs
 create mode 100644 application/repository/user/mod.rs
 create mode 100644 application/repository/user/struct.rs
 create mode 100644 application/service/blog/impl.rs
 create mode 100644 application/service/blog/mod.rs
 create mode 100644 application/service/blog/struct.rs
 create mode 100644 application/service/user/impl.rs
 create mode 100644 application/service/user/mod.rs
 create mode 100644 application/service/user/struct.rs
 create mode 100644 application/view/blog/fn.rs
 create mode 100644 application/view/blog/impl.rs
 create mode 100644 application/view/blog/mod.rs
 create mode 100644 application/view/blog/struct.rs
 create mode 100644 application/view/user/fn.rs
 create mode 100644 application/view/user/impl.rs
 create mode 100644 application/view/user/mod.rs
 create mode 100644 application/view/user/struct.rs
 create mode 100644 resources/sql/postgresql/blog/comment_table.sql
 create mode 100644 resources/sql/postgresql/blog/favorite_table.sql
 create mode 100644 resources/sql/postgresql/blog/image_table.sql
 create mode 100644 resources/sql/postgresql/blog/index.sql
 create mode 100644 resources/sql/postgresql/blog/like_table.sql
 create mode 100644 resources/sql/postgresql/blog/post_table.sql
 create mode 100644 resources/static/blog/css/style.css
 create mode 100644 resources/static/blog/index.html
 create mode 100644 resources/static/blog/js/app.js
 create mode 100644 resources/static/common/js/error-handler.js
 create mode 100644 resources/static/user/css/style.css
 create mode 100644 resources/static/user/index.html
 create mode 100644 resources/static/user/js/app.js

diff --git a/application/controller/auth/fn.rs b/application/controller/auth/fn.rs
index 7a3028d3..f47079c2 100644
--- a/application/controller/auth/fn.rs
+++ b/application/controller/auth/fn.rs
@@ -71,18 +71,18 @@ pub fn openapi_auth_user_change_password() {}
 
 #[utoipa::path(
     post,
-    path = "/api/auth/user/approve/{id}",
+    path = "/api/auth/user/update_status/{id}",
     params(
         ("id" = i32, Path, description = "User ID")
     ),
     responses(
-        (status = 200, description = "User approval status updated successfully"),
+        (status = 200, description = "User status updated successfully"),
         (status = 400, description = "Bad request"),
         (status = 500, description = "Internal server error")
     )
 )]
 #[instrument_trace]
-pub fn openapi_auth_user_approve() {}
+pub fn openapi_auth_user_update_status() {}
 
 #[utoipa::path(
     get,
@@ -111,3 +111,19 @@ pub fn openapi_auth_user_list() {}
 )]
 #[instrument_trace]
 pub fn openapi_auth_user_get() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/auth/user/delete/{id}",
+    params(
+        ("id" = i32, Path, description = "User ID")
+    ),
+    responses(
+        (status = 200, description = "User deleted successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 403, description = "Forbidden"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_auth_user_delete() {}
diff --git a/application/controller/auth/impl.rs b/application/controller/auth/impl.rs
index a2729e9f..28f2cb61 100644
--- a/application/controller/auth/impl.rs
+++ b/application/controller/auth/impl.rs
@@ -264,13 +264,13 @@ impl ServerHook for UserChangePasswordRoute {
     }
 }
 
-impl ServerHook for UserApproveRoute {
+impl ServerHook for UserUpdateStatusRoute {
     #[instrument_trace]
     async fn new(_ctx: &mut Context) -> Self {
         Self
     }
 
-    #[prologue_macros(post_method, route_param_option(ID_KEY => id_opt), request_body_json_result(request_opt: ApproveUserRequest), response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[prologue_macros(post_method, route_param_option(ID_KEY => id_opt), request_body_json_result(request_opt: UpdateUserStatusRequest), response_header(CONTENT_TYPE => APPLICATION_JSON))]
     #[instrument_trace]
     async fn handle(self, ctx: &mut Context) {
         let user_id: i32 = match id_opt {
@@ -290,7 +290,7 @@ impl ServerHook for UserApproveRoute {
                 return;
             }
         };
-        let request: ApproveUserRequest = match request_opt {
+        let request: UpdateUserStatusRequest = match request_opt {
             Ok(data) => data,
             Err(error) => {
                 let response: ApiResponse<String> =
@@ -299,7 +299,7 @@ impl ServerHook for UserApproveRoute {
                 return;
             }
         };
-        match AuthService::approve_user(user_id, request.get_approved()).await {
+        match AuthService::update_user_status(user_id, request.get_approved()).await {
             Ok(user) => {
                 let response: ApiResponse<UserResponse> =
                     ApiResponse::new(ApiResponseStatus::Success, user);
@@ -428,6 +428,87 @@ impl ServerHook for UserGetRoute {
     }
 }
 
+impl ServerHook for UserDeleteRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(post_method, route_param_option(ID_KEY => id_opt), response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user: UserResponse = match AuthService::get_user(current_user_id).await {
+            Ok(Some(user_info)) => user_info,
+            Ok(None) => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, "User not found");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let user_role: UserRole = current_user.get_role().parse().unwrap_or_default();
+        if !user_role.is_admin() {
+            let response: ApiResponse<&str> =
+                ApiResponse::new(ApiResponseStatus::Forbidden, "Only admin can delete users");
+            ctx.get_mut_response().set_body(response.to_json_bytes());
+            return;
+        }
+        let target_user_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid user ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "User ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        if current_user_id == target_user_id {
+            let response: ApiResponse<&str> =
+                ApiResponse::new(ApiResponseStatus::Forbidden, "Cannot delete yourself");
+            ctx.get_mut_response().set_body(response.to_json_bytes());
+            return;
+        }
+        match AuthService::delete_user(target_user_id).await {
+            Ok(_) => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::Success, "User deleted successfully");
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
 impl ServerHook for UserLogoutRoute {
     #[instrument_trace]
     async fn new(_ctx: &mut Context) -> Self {
diff --git a/application/controller/auth/struct.rs b/application/controller/auth/struct.rs
index 13d1397a..8170592b 100644
--- a/application/controller/auth/struct.rs
+++ b/application/controller/auth/struct.rs
@@ -20,9 +20,9 @@ pub struct UserUpdateRoute;
 #[derive(Clone, Copy, Data, Debug, Default)]
 pub struct UserChangePasswordRoute;
 
-#[route("/api/auth/user/approve/{id}")]
+#[route("/api/auth/user/update_status/{id}")]
 #[derive(Clone, Copy, Data, Debug, Default)]
-pub struct UserApproveRoute;
+pub struct UserUpdateStatusRoute;
 
 #[route("/api/auth/user/list")]
 #[derive(Clone, Copy, Data, Debug, Default)]
@@ -32,6 +32,10 @@ pub struct UserListRoute;
 #[derive(Clone, Copy, Data, Debug, Default)]
 pub struct UserGetRoute;
 
+#[route("/api/auth/user/delete/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct UserDeleteRoute;
+
 #[route("/api/auth/logout")]
 #[derive(Clone, Copy, Data, Debug, Default)]
 pub struct UserLogoutRoute;
diff --git a/application/controller/blog/fn.rs b/application/controller/blog/fn.rs
new file mode 100644
index 00000000..fb76e4bd
--- /dev/null
+++ b/application/controller/blog/fn.rs
@@ -0,0 +1,204 @@
+use super::*;
+
+#[utoipa::path(
+    post,
+    path = "/api/blog/post/create",
+    responses(
+        (status = 200, description = "Blog post created successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 401, description = "Unauthorized"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_post_create() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/blog/post/update/{id}",
+    params(
+        ("id" = i32, Path, description = "Post ID")
+    ),
+    responses(
+        (status = 200, description = "Blog post updated successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 401, description = "Unauthorized"),
+        (status = 404, description = "Post not found"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_post_update() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/blog/post/delete/{id}",
+    params(
+        ("id" = i32, Path, description = "Post ID")
+    ),
+    responses(
+        (status = 200, description = "Blog post deleted successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 401, description = "Unauthorized"),
+        (status = 404, description = "Post not found"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_post_delete() {}
+
+#[utoipa::path(
+    get,
+    path = "/api/blog/post/get/{id}",
+    params(
+        ("id" = i32, Path, description = "Post ID")
+    ),
+    responses(
+        (status = 200, description = "Blog post retrieved successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 404, description = "Post not found"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_post_get() {}
+
+#[utoipa::path(
+    get,
+    path = "/api/blog/post/list",
+    responses(
+        (status = 200, description = "Blog post list retrieved successfully"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_post_list() {}
+
+#[utoipa::path(
+    get,
+    path = "/api/blog/post/my-list",
+    responses(
+        (status = 200, description = "My blog post list retrieved successfully"),
+        (status = 401, description = "Unauthorized"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_post_my_list() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/blog/post/like/{id}",
+    params(
+        ("id" = i32, Path, description = "Post ID")
+    ),
+    responses(
+        (status = 200, description = "Like toggled successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 401, description = "Unauthorized"),
+        (status = 404, description = "Post not found"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_post_like() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/blog/post/favorite/{id}",
+    params(
+        ("id" = i32, Path, description = "Post ID")
+    ),
+    responses(
+        (status = 200, description = "Favorite toggled successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 401, description = "Unauthorized"),
+        (status = 404, description = "Post not found"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_post_favorite() {}
+
+#[utoipa::path(
+    get,
+    path = "/api/blog/post/favorite-list",
+    responses(
+        (status = 200, description = "Favorite post list retrieved successfully"),
+        (status = 401, description = "Unauthorized"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_post_favorite_list() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/blog/comment/create",
+    responses(
+        (status = 200, description = "Comment created successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 401, description = "Unauthorized"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_comment_create() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/blog/comment/delete/{id}",
+    params(
+        ("id" = i32, Path, description = "Comment ID")
+    ),
+    responses(
+        (status = 200, description = "Comment deleted successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 401, description = "Unauthorized"),
+        (status = 404, description = "Comment not found"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_comment_delete() {}
+
+#[utoipa::path(
+    get,
+    path = "/api/blog/comment/list",
+    responses(
+        (status = 200, description = "Comment list retrieved successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_comment_list() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/blog/image/upload",
+    responses(
+        (status = 200, description = "Image uploaded successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 401, description = "Unauthorized"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_image_upload() {}
+
+#[utoipa::path(
+    get,
+    path = "/api/blog/image/download/{id}",
+    params(
+        ("id" = i32, Path, description = "Image ID")
+    ),
+    responses(
+        (status = 200, description = "Image downloaded successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 404, description = "Image not found"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_image_download() {}
diff --git a/application/controller/blog/impl.rs b/application/controller/blog/impl.rs
new file mode 100644
index 00000000..dd67a79e
--- /dev/null
+++ b/application/controller/blog/impl.rs
@@ -0,0 +1,766 @@
+use super::*;
+
+impl ServerHook for BlogPostCreateRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        post_method,
+        request_body_json_result(request_opt: CreateBlogPostRequest),
+        response_header(CONTENT_TYPE => APPLICATION_JSON)
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let request: CreateBlogPostRequest = match request_opt {
+            Ok(data) => data,
+            Err(error) => {
+                let response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, error.to_string());
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match BlogService::create_post(current_user_id, request).await {
+            Ok(post) => {
+                let response: ApiResponse<BlogPostResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, post);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogPostUpdateRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        post_method,
+        route_param_option(ID_KEY => id_opt),
+        request_body_json_result(request_opt: UpdateBlogPostRequest),
+        response_header(CONTENT_TYPE => APPLICATION_JSON)
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let post_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid post ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "Post ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let request: UpdateBlogPostRequest = match request_opt {
+            Ok(data) => data,
+            Err(error) => {
+                let response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, error.to_string());
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match BlogService::update_post(post_id, current_user_id, request).await {
+            Ok(post) => {
+                let response: ApiResponse<BlogPostResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, post);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogPostDeleteRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        post_method,
+        route_param_option(ID_KEY => id_opt),
+        response_header(CONTENT_TYPE => APPLICATION_JSON)
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let post_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid post ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "Post ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match BlogService::delete_post(post_id, current_user_id).await {
+            Ok(()) => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::Success, "Post deleted successfully");
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogPostGetRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        get_method,
+        route_param_option(ID_KEY => id_opt),
+        response_header(CONTENT_TYPE => APPLICATION_JSON)
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let post_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid post ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "Post ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user_id: Option<i32> = AuthService::extract_user_from_cookie(ctx).ok();
+        match BlogService::get_post(post_id, current_user_id).await {
+            Ok(Some(post)) => {
+                let response: ApiResponse<BlogPostResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, post);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Ok(None) => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::ResourceNotFound, "Post not found");
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogPostListRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(get_method, response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    #[request_query_option("keyword" => keyword_opt)]
+    #[request_query_option("is_published" => is_published_opt)]
+    #[request_query_option("page" => page_opt)]
+    #[request_query_option("limit" => limit_opt)]
+    async fn handle(self, ctx: &mut Context) {
+        let current_user_id: Option<i32> = AuthService::extract_user_from_cookie(ctx).ok();
+        let mut query: BlogPostListQueryRequest = BlogPostListQueryRequest::default();
+        if let Some(keyword) = keyword_opt {
+            query.set_keyword(Some(keyword));
+        }
+        if let Some(is_published_str) = is_published_opt
+            && let Ok(is_published) = is_published_str.parse::<bool>()
+        {
+            query.set_is_published(Some(is_published));
+        }
+        if let Some(page_str) = page_opt
+            && let Ok(page) = page_str.parse::<i32>()
+        {
+            query.set_page(Some(page));
+        }
+        if let Some(limit_str) = limit_opt
+            && let Ok(limit) = limit_str.parse::<u64>()
+        {
+            query.set_limit(Some(limit.min(100)));
+        }
+        match BlogService::list_posts(query, current_user_id).await {
+            Ok(list_response) => {
+                let response: ApiResponse<BlogPostListResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, list_response);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogPostMyListRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(get_method, response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    #[request_query_option("keyword" => keyword_opt)]
+    #[request_query_option("page" => page_opt)]
+    #[request_query_option("limit" => limit_opt)]
+    async fn handle(self, ctx: &mut Context) {
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let mut query: BlogPostListQueryRequest = BlogPostListQueryRequest::default();
+        if let Some(keyword) = keyword_opt {
+            query.set_keyword(Some(keyword));
+        }
+        if let Some(page_str) = page_opt
+            && let Ok(page) = page_str.parse::<i32>()
+        {
+            query.set_page(Some(page));
+        }
+        if let Some(limit_str) = limit_opt
+            && let Ok(limit) = limit_str.parse::<u64>()
+        {
+            query.set_limit(Some(limit.min(100)));
+        }
+        match BlogService::list_my_posts(current_user_id, query).await {
+            Ok(list_response) => {
+                let response: ApiResponse<BlogPostListResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, list_response);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogPostLikeRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        post_method,
+        route_param_option(ID_KEY => id_opt),
+        response_header(CONTENT_TYPE => APPLICATION_JSON)
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let post_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid post ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "Post ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match BlogService::toggle_like(post_id, current_user_id).await {
+            Ok(status) => {
+                let response: ApiResponse<BlogLikeStatusResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, status);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogPostFavoriteRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        post_method,
+        route_param_option(ID_KEY => id_opt),
+        response_header(CONTENT_TYPE => APPLICATION_JSON)
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let post_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid post ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "Post ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match BlogService::toggle_favorite(post_id, current_user_id).await {
+            Ok(status) => {
+                let response: ApiResponse<BlogFavoriteStatusResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, status);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogPostFavoriteListRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(get_method, response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    #[request_query_option("page" => page_opt)]
+    #[request_query_option("limit" => limit_opt)]
+    async fn handle(self, ctx: &mut Context) {
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let mut query: BlogPostListQueryRequest = BlogPostListQueryRequest::default();
+        if let Some(page_str) = page_opt
+            && let Ok(page) = page_str.parse::<i32>()
+        {
+            query.set_page(Some(page));
+        }
+        if let Some(limit_str) = limit_opt
+            && let Ok(limit) = limit_str.parse::<u64>()
+        {
+            query.set_limit(Some(limit.min(100)));
+        }
+        match BlogService::list_favorite_posts(current_user_id, query).await {
+            Ok(list_response) => {
+                let response: ApiResponse<BlogPostListResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, list_response);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogCommentCreateRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        post_method,
+        request_body_json_result(request_opt: CreateBlogCommentRequest),
+        response_header(CONTENT_TYPE => APPLICATION_JSON)
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let request: CreateBlogCommentRequest = match request_opt {
+            Ok(data) => data,
+            Err(error) => {
+                let response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, error.to_string());
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match BlogService::create_comment(current_user_id, request).await {
+            Ok(comment) => {
+                let response: ApiResponse<BlogCommentResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, comment);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogCommentDeleteRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        post_method,
+        route_param_option(ID_KEY => id_opt),
+        response_header(CONTENT_TYPE => APPLICATION_JSON)
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let comment_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid comment ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "Comment ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match BlogService::delete_comment(comment_id, current_user_id).await {
+            Ok(()) => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::Success, "Comment deleted successfully");
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogCommentListRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(get_method, response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    #[request_query_option("post_id" => post_id_opt)]
+    #[request_query_option("page" => page_opt)]
+    #[request_query_option("limit" => limit_opt)]
+    async fn handle(self, ctx: &mut Context) {
+        let mut query: BlogCommentListQueryRequest = BlogCommentListQueryRequest::default();
+        match post_id_opt {
+            Some(post_id) => query.set_post_id(post_id),
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "Post ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        if let Some(page_str) = page_opt
+            && let Ok(page) = page_str.parse::<i32>()
+        {
+            query.set_page(Some(page));
+        }
+        if let Some(limit_str) = limit_opt
+            && let Ok(limit) = limit_str.parse::<u64>()
+        {
+            query.set_limit(Some(limit.min(100)));
+        }
+        match BlogService::list_comments(query).await {
+            Ok(list_response) => {
+                let response: ApiResponse<BlogCommentListResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, list_response);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for BlogImageUploadRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        post_method,
+        request_header_option(X_FILE_NAME => file_name_opt),
+        request_header_option(X_ORIGINAL_NAME => original_name_opt),
+        request_header_option(X_MIME_TYPE => mime_type_opt),
+        response_header(CONTENT_TYPE => APPLICATION_JSON)
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let file_name: String = match file_name_opt {
+            Some(s) => urlencoding::decode(&s).unwrap_or_default().to_string(),
+            None => {
+                let response: ApiResponse<&str> = ApiResponse::new(
+                    ApiResponseStatus::InvalidRequest,
+                    "Missing X-File-Name header",
+                );
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let mime_type: String = match mime_type_opt {
+            Some(s) => s,
+            None => {
+                let response: ApiResponse<&str> = ApiResponse::new(
+                    ApiResponseStatus::InvalidRequest,
+                    "Missing X-Mime-Type header",
+                );
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let file_data: Vec<u8> = ctx.get_request().get_body().clone();
+        let original_name: Option<String> = original_name_opt
+            .map(|s: String| urlencoding::decode(&s).unwrap_or_default().to_string());
+        match BlogService::upload_image(
+            current_user_id,
+            file_name,
+            original_name,
+            mime_type,
+            file_data,
+        )
+        .await
+        {
+            Ok(image_response) => {
+                let response: ApiResponse<BlogImageResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, image_response);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+            }
+        }
+    }
+}
+
+impl ServerHook for BlogImageDownloadRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(get_method, route_param_option(ID_KEY => id_opt))]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let image_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid image ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "Image ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match BlogService::get_image_data(image_id).await {
+            Ok(Some(image)) => {
+                let file_name: String = image
+                    .try_get_original_name()
+                    .clone()
+                    .unwrap_or_else(|| image.get_file_name().clone());
+                let content_disposition: String =
+                    format!("{ATTACHMENT}; {FILENAME}=\"{}\"", file_name);
+                let mime_type: String = image.get_mime_type().clone();
+                let file_data: Vec<u8> = image.get_file_data().clone();
+                ctx.get_mut_response()
+                    .set_header(CONTENT_TYPE, &mime_type)
+                    .set_header(CONTENT_DISPOSITION, &content_disposition)
+                    .set_header(CONTENT_LENGTH, file_data.len().to_string())
+                    .set_body(file_data);
+            }
+            Ok(None) => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::ResourceNotFound, "Image not found");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+            }
+        };
+    }
+}
diff --git a/application/controller/blog/mod.rs b/application/controller/blog/mod.rs
new file mode 100644
index 00000000..0c540fa0
--- /dev/null
+++ b/application/controller/blog/mod.rs
@@ -0,0 +1,17 @@
+mod r#fn;
+mod r#impl;
+mod r#struct;
+
+pub use r#fn::*;
+
+use {
+    super::*,
+    model::{
+        request::{blog::*, order::*},
+        response::{blog::*, common::*},
+    },
+    service::{auth::*, blog::*},
+    r#struct::*,
+};
+
+use hyperlane_config::application::shortlink::*;
diff --git a/application/controller/blog/struct.rs b/application/controller/blog/struct.rs
new file mode 100644
index 00000000..648f793f
--- /dev/null
+++ b/application/controller/blog/struct.rs
@@ -0,0 +1,57 @@
+use super::*;
+
+#[route("/api/blog/post/create")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogPostCreateRoute;
+
+#[route("/api/blog/post/update/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogPostUpdateRoute;
+
+#[route("/api/blog/post/delete/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogPostDeleteRoute;
+
+#[route("/api/blog/post/get/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogPostGetRoute;
+
+#[route("/api/blog/post/list")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogPostListRoute;
+
+#[route("/api/blog/post/my-list")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogPostMyListRoute;
+
+#[route("/api/blog/post/like/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogPostLikeRoute;
+
+#[route("/api/blog/post/favorite/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogPostFavoriteRoute;
+
+#[route("/api/blog/post/favorite-list")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogPostFavoriteListRoute;
+
+#[route("/api/blog/comment/create")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogCommentCreateRoute;
+
+#[route("/api/blog/comment/delete/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogCommentDeleteRoute;
+
+#[route("/api/blog/comment/list")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogCommentListRoute;
+
+#[route("/api/blog/image/upload")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogImageUploadRoute;
+
+#[route("/api/blog/image/download/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogImageDownloadRoute;
diff --git a/application/controller/mod.rs b/application/controller/mod.rs
index 7a05f997..6ab39de7 100644
--- a/application/controller/mod.rs
+++ b/application/controller/mod.rs
@@ -1,4 +1,5 @@
 pub mod auth;
+pub mod blog;
 pub mod chat;
 pub mod cicd;
 pub mod dataset;
@@ -19,6 +20,7 @@ pub mod templates;
 pub mod trace;
 pub mod tracking;
 pub mod upload;
+pub mod user;
 pub mod websocket;
 
 use super::*;
diff --git a/application/controller/notification/impl.rs b/application/controller/notification/impl.rs
index 1d337cfb..05c5030d 100644
--- a/application/controller/notification/impl.rs
+++ b/application/controller/notification/impl.rs
@@ -26,7 +26,7 @@ impl ServerHook for NotificationCreateRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -65,7 +65,7 @@ impl ServerHook for NotificationListRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -144,7 +144,7 @@ impl ServerHook for NotificationGetRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -211,7 +211,7 @@ impl ServerHook for NotificationReadRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -246,7 +246,7 @@ impl ServerHook for NotificationReadAllRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -308,7 +308,7 @@ impl ServerHook for NotificationDeleteRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -345,7 +345,7 @@ impl ServerHook for NotificationUnreadCountRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
diff --git a/application/controller/user/fn.rs b/application/controller/user/fn.rs
new file mode 100644
index 00000000..7077f713
--- /dev/null
+++ b/application/controller/user/fn.rs
@@ -0,0 +1,93 @@
+use super::*;
+
+#[utoipa::path(
+    get,
+    path = "/api/user/list",
+    responses(
+        (status = 200, description = "List of users retrieved successfully"),
+        (status = 401, description = "Unauthorized"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_user_list() {}
+
+#[utoipa::path(
+    get,
+    path = "/api/user/get/{id}",
+    params(
+        ("id" = i32, Path, description = "User ID")
+    ),
+    responses(
+        (status = 200, description = "User details retrieved successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 404, description = "User not found"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_user_get() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/user/update/{id}",
+    params(
+        ("id" = i32, Path, description = "User ID")
+    ),
+    responses(
+        (status = 200, description = "User updated successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 401, description = "Unauthorized"),
+        (status = 403, description = "Forbidden"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_user_update() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/user/change_password/{id}",
+    params(
+        ("id" = i32, Path, description = "User ID")
+    ),
+    responses(
+        (status = 200, description = "Password changed successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 401, description = "Unauthorized"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_user_change_password() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/user/update_status/{id}",
+    params(
+        ("id" = i32, Path, description = "User ID")
+    ),
+    responses(
+        (status = 200, description = "User status updated successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_user_update_status() {}
+
+#[utoipa::path(
+    post,
+    path = "/api/user/delete/{id}",
+    params(
+        ("id" = i32, Path, description = "User ID")
+    ),
+    responses(
+        (status = 200, description = "User deleted successfully"),
+        (status = 400, description = "Bad request"),
+        (status = 403, description = "Forbidden"),
+        (status = 500, description = "Internal server error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_user_delete() {}
diff --git a/application/controller/user/impl.rs b/application/controller/user/impl.rs
new file mode 100644
index 00000000..bd7409bd
--- /dev/null
+++ b/application/controller/user/impl.rs
@@ -0,0 +1,387 @@
+use super::*;
+
+use service::auth::AuthService;
+
+impl ServerHook for UserListRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(get_method, response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user: model::response::auth::UserResponse =
+            match AuthService::get_user(current_user_id).await {
+                Ok(Some(user_info)) => user_info,
+                Ok(None) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::Unauthorized, "User not found");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+                Err(error) => {
+                    let mut response: ApiResponse<String> =
+                        ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    response.set_message(&error);
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            };
+        let mut query: UserListQueryRequest = UserListQueryRequest::default();
+        let user_role: UserRole = current_user.get_role().parse().unwrap_or_default();
+        if user_role.is_admin() {
+            let querys: &RequestQuerys = ctx.get_request().get_querys();
+            let keyword: Option<String> = querys.get("keyword").cloned();
+            let last_id: Option<String> = querys.get("last_id").cloned();
+            let limit: Option<u64> = querys
+                .get("limit")
+                .and_then(|s: &String| s.parse().ok())
+                .map(|l: u64| l.min(MAX_LIMIT));
+            query
+                .set_keyword(keyword)
+                .set_last_id(last_id)
+                .set_limit(limit);
+        }
+        match UserService::list_users(query).await {
+            Ok(data) => {
+                let response: ApiResponse<UserListResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, data);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for UserGetRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(get_method, route_param_option(ID_KEY => id_opt), response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let user_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid user ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "User ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match UserService::get_user(user_id).await {
+            Ok(Some(user)) => {
+                let response: ApiResponse<UserResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, user);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Ok(None) => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::ResourceNotFound, "User not found");
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for UserUpdateRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(post_method, route_param_option(ID_KEY => id_opt), request_body_json_result(request_opt: UpdateUserRequest), response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let target_user_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid user ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "User ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user: model::response::auth::UserResponse =
+            match AuthService::get_user(current_user_id).await {
+                Ok(Some(user_info)) => user_info,
+                Ok(None) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::Unauthorized, "User not found");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+                Err(error) => {
+                    let mut response: ApiResponse<String> =
+                        ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    response.set_message(&error);
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            };
+        let user_role: UserRole = current_user.get_role().parse().unwrap_or_default();
+        if !user_role.is_admin() && current_user_id != target_user_id {
+            let response: ApiResponse<&str> = ApiResponse::new(
+                ApiResponseStatus::Forbidden,
+                "You can only update your own data",
+            );
+            ctx.get_mut_response().set_body(response.to_json_bytes());
+            return;
+        }
+        let request: UpdateUserRequest = match request_opt {
+            Ok(data) => data,
+            Err(error) => {
+                let response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, error.to_string());
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match UserService::update_user(target_user_id, request).await {
+            Ok(user) => {
+                let response: ApiResponse<UserResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, user);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for UserChangePasswordRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(post_method, route_param_option(ID_KEY => id_opt), request_body_json_result(request_opt: ChangePasswordRequest), response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let user_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid user ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "User ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let request: ChangePasswordRequest = match request_opt {
+            Ok(data) => data,
+            Err(error) => {
+                let response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, error.to_string());
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match UserService::change_password(user_id, request).await {
+            Ok(_) => {
+                let response: ApiResponse<()> = ApiResponse::new(ApiResponseStatus::Success, ());
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for UserUpdateStatusRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(post_method, route_param_option(ID_KEY => id_opt), request_body_json_result(request_opt: UpdateUserStatusRequest), response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let user_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid user ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "User ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let request: UpdateUserStatusRequest = match request_opt {
+            Ok(data) => data,
+            Err(error) => {
+                let response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, error.to_string());
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        match UserService::update_user_status(user_id, request.get_approved()).await {
+            Ok(user) => {
+                let response: ApiResponse<UserResponse> =
+                    ApiResponse::new(ApiResponseStatus::Success, user);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
+
+impl ServerHook for UserDeleteRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(post_method, route_param_option(ID_KEY => id_opt), response_header(CONTENT_TYPE => APPLICATION_JSON))]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let current_user_id: i32 = match AuthService::extract_user_from_cookie(ctx) {
+            Ok(id) => id,
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        let current_user: model::response::auth::UserResponse =
+            match AuthService::get_user(current_user_id).await {
+                Ok(Some(user_info)) => user_info,
+                Ok(None) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::Unauthorized, "User not found");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+                Err(error) => {
+                    let mut response: ApiResponse<String> =
+                        ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    response.set_message(&error);
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            };
+        let user_role: UserRole = current_user.get_role().parse().unwrap_or_default();
+        if !user_role.is_admin() {
+            let response: ApiResponse<&str> =
+                ApiResponse::new(ApiResponseStatus::Forbidden, "Only admin can delete users");
+            ctx.get_mut_response().set_body(response.to_json_bytes());
+            return;
+        }
+        let target_user_id: i32 = match id_opt {
+            Some(id_str) => match AuthService::decode_id(&id_str) {
+                Ok(id) => id,
+                Err(_) => {
+                    let response: ApiResponse<&str> =
+                        ApiResponse::new(ApiResponseStatus::InvalidRequest, "Invalid user ID");
+                    ctx.get_mut_response().set_body(response.to_json_bytes());
+                    return;
+                }
+            },
+            None => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::InvalidRequest, "User ID is required");
+                ctx.get_mut_response().set_body(response.to_json_bytes());
+                return;
+            }
+        };
+        if current_user_id == target_user_id {
+            let response: ApiResponse<&str> =
+                ApiResponse::new(ApiResponseStatus::Forbidden, "Cannot delete yourself");
+            ctx.get_mut_response().set_body(response.to_json_bytes());
+            return;
+        }
+        match UserService::delete_user(target_user_id).await {
+            Ok(_) => {
+                let response: ApiResponse<&str> =
+                    ApiResponse::new(ApiResponseStatus::Success, "User deleted successfully");
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+            Err(error) => {
+                let mut response: ApiResponse<String> =
+                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                response.set_message(&error);
+                ctx.get_mut_response().set_body(response.to_json_bytes())
+            }
+        };
+    }
+}
diff --git a/application/controller/user/mod.rs b/application/controller/user/mod.rs
new file mode 100644
index 00000000..cfb9fb76
--- /dev/null
+++ b/application/controller/user/mod.rs
@@ -0,0 +1,17 @@
+mod r#fn;
+mod r#impl;
+mod r#struct;
+
+pub use r#fn::*;
+
+use {
+    super::*,
+    mapper::user::*,
+    model::{
+        application::user::{ID_KEY, MAX_LIMIT},
+        request::user::*,
+        response::{common::*, user::*},
+    },
+    service::user::*,
+    r#struct::*,
+};
diff --git a/application/controller/user/struct.rs b/application/controller/user/struct.rs
new file mode 100644
index 00000000..95f5b045
--- /dev/null
+++ b/application/controller/user/struct.rs
@@ -0,0 +1,25 @@
+use super::*;
+
+#[route("/api/user/list")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct UserListRoute;
+
+#[route("/api/user/get/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct UserGetRoute;
+
+#[route("/api/user/update/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct UserUpdateRoute;
+
+#[route("/api/user/change_password/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct UserChangePasswordRoute;
+
+#[route("/api/user/update_status/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct UserUpdateStatusRoute;
+
+#[route("/api/user/delete/{id}")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct UserDeleteRoute;
diff --git a/application/mapper/blog/comment/enum.rs b/application/mapper/blog/comment/enum.rs
new file mode 100644
index 00000000..17d03e5a
--- /dev/null
+++ b/application/mapper/blog/comment/enum.rs
@@ -0,0 +1,4 @@
+use super::*;
+
+#[derive(Clone, Copy, Debug, EnumIter)]
+pub enum Relation {}
diff --git a/application/mapper/blog/comment/impl.rs b/application/mapper/blog/comment/impl.rs
new file mode 100644
index 00000000..16265438
--- /dev/null
+++ b/application/mapper/blog/comment/impl.rs
@@ -0,0 +1,7 @@
+use super::*;
+
+impl RelationTrait for Relation {
+    fn def(&self) -> RelationDef {
+        panic!("No relations defined - using manual association management")
+    }
+}
diff --git a/application/mapper/blog/comment/mod.rs b/application/mapper/blog/comment/mod.rs
new file mode 100644
index 00000000..0e99b941
--- /dev/null
+++ b/application/mapper/blog/comment/mod.rs
@@ -0,0 +1,8 @@
+mod r#enum;
+mod r#impl;
+mod r#struct;
+mod r#type;
+
+pub use {r#enum::*, r#struct::*, r#type::*};
+
+use super::*;
diff --git a/application/mapper/blog/comment/struct.rs b/application/mapper/blog/comment/struct.rs
new file mode 100644
index 00000000..17fe81c1
--- /dev/null
+++ b/application/mapper/blog/comment/struct.rs
@@ -0,0 +1,30 @@
+use super::*;
+
+#[derive(
+    Clone,
+    Data,
+    Debug,
+    Default,
+    DeriveActiveModelBehavior,
+    DeriveEntityModel,
+    Deserialize,
+    PartialEq,
+    Serialize,
+)]
+#[sea_orm(table_name = "blog_comment", schema_name = "public")]
+pub struct Model {
+    #[sea_orm(primary_key, auto_increment = true)]
+    #[get(type(copy))]
+    pub(super) id: i32,
+    #[get(type(copy))]
+    pub(super) post_id: i32,
+    #[get(type(copy))]
+    pub(super) user_id: i32,
+    #[get(type(copy))]
+    pub(super) parent_id: i32,
+    pub(super) content: String,
+    #[get(type(copy))]
+    pub(super) is_deleted: bool,
+    pub(super) created_at: Option<NaiveDateTime>,
+    pub(super) updated_at: Option<NaiveDateTime>,
+}
diff --git a/application/mapper/blog/comment/type.rs b/application/mapper/blog/comment/type.rs
new file mode 100644
index 00000000..a62ba2a9
--- /dev/null
+++ b/application/mapper/blog/comment/type.rs
@@ -0,0 +1,6 @@
+use super::*;
+
+pub type BlogCommentEntity = Entity;
+pub type BlogCommentActiveModel = ActiveModel;
+pub type BlogCommentColumn = Column;
+pub type BlogCommentModel = Model;
diff --git a/application/mapper/blog/favorite/enum.rs b/application/mapper/blog/favorite/enum.rs
new file mode 100644
index 00000000..17d03e5a
--- /dev/null
+++ b/application/mapper/blog/favorite/enum.rs
@@ -0,0 +1,4 @@
+use super::*;
+
+#[derive(Clone, Copy, Debug, EnumIter)]
+pub enum Relation {}
diff --git a/application/mapper/blog/favorite/impl.rs b/application/mapper/blog/favorite/impl.rs
new file mode 100644
index 00000000..16265438
--- /dev/null
+++ b/application/mapper/blog/favorite/impl.rs
@@ -0,0 +1,7 @@
+use super::*;
+
+impl RelationTrait for Relation {
+    fn def(&self) -> RelationDef {
+        panic!("No relations defined - using manual association management")
+    }
+}
diff --git a/application/mapper/blog/favorite/mod.rs b/application/mapper/blog/favorite/mod.rs
new file mode 100644
index 00000000..0e99b941
--- /dev/null
+++ b/application/mapper/blog/favorite/mod.rs
@@ -0,0 +1,8 @@
+mod r#enum;
+mod r#impl;
+mod r#struct;
+mod r#type;
+
+pub use {r#enum::*, r#struct::*, r#type::*};
+
+use super::*;
diff --git a/application/mapper/blog/favorite/struct.rs b/application/mapper/blog/favorite/struct.rs
new file mode 100644
index 00000000..2c645b09
--- /dev/null
+++ b/application/mapper/blog/favorite/struct.rs
@@ -0,0 +1,24 @@
+use super::*;
+
+#[derive(
+    Clone,
+    Data,
+    Debug,
+    Default,
+    DeriveActiveModelBehavior,
+    DeriveEntityModel,
+    Deserialize,
+    PartialEq,
+    Serialize,
+)]
+#[sea_orm(table_name = "blog_favorite", schema_name = "public")]
+pub struct Model {
+    #[sea_orm(primary_key, auto_increment = true)]
+    #[get(type(copy))]
+    pub(super) id: i32,
+    #[get(type(copy))]
+    pub(super) post_id: i32,
+    #[get(type(copy))]
+    pub(super) user_id: i32,
+    pub(super) created_at: Option<NaiveDateTime>,
+}
diff --git a/application/mapper/blog/favorite/type.rs b/application/mapper/blog/favorite/type.rs
new file mode 100644
index 00000000..d5c350d6
--- /dev/null
+++ b/application/mapper/blog/favorite/type.rs
@@ -0,0 +1,6 @@
+use super::*;
+
+pub type BlogFavoriteEntity = Entity;
+pub type BlogFavoriteActiveModel = ActiveModel;
+pub type BlogFavoriteColumn = Column;
+pub type BlogFavoriteModel = Model;
diff --git a/application/mapper/blog/image/enum.rs b/application/mapper/blog/image/enum.rs
new file mode 100644
index 00000000..17d03e5a
--- /dev/null
+++ b/application/mapper/blog/image/enum.rs
@@ -0,0 +1,4 @@
+use super::*;
+
+#[derive(Clone, Copy, Debug, EnumIter)]
+pub enum Relation {}
diff --git a/application/mapper/blog/image/impl.rs b/application/mapper/blog/image/impl.rs
new file mode 100644
index 00000000..16265438
--- /dev/null
+++ b/application/mapper/blog/image/impl.rs
@@ -0,0 +1,7 @@
+use super::*;
+
+impl RelationTrait for Relation {
+    fn def(&self) -> RelationDef {
+        panic!("No relations defined - using manual association management")
+    }
+}
diff --git a/application/mapper/blog/image/mod.rs b/application/mapper/blog/image/mod.rs
new file mode 100644
index 00000000..0e99b941
--- /dev/null
+++ b/application/mapper/blog/image/mod.rs
@@ -0,0 +1,8 @@
+mod r#enum;
+mod r#impl;
+mod r#struct;
+mod r#type;
+
+pub use {r#enum::*, r#struct::*, r#type::*};
+
+use super::*;
diff --git a/application/mapper/blog/image/struct.rs b/application/mapper/blog/image/struct.rs
new file mode 100644
index 00000000..eac1009a
--- /dev/null
+++ b/application/mapper/blog/image/struct.rs
@@ -0,0 +1,30 @@
+use super::*;
+
+#[derive(
+    Clone,
+    Data,
+    Debug,
+    Default,
+    DeriveActiveModelBehavior,
+    DeriveEntityModel,
+    Deserialize,
+    PartialEq,
+    Serialize,
+)]
+#[sea_orm(table_name = "blog_image", schema_name = "public")]
+pub struct Model {
+    #[sea_orm(primary_key, auto_increment = true)]
+    #[get(type(copy))]
+    pub(super) id: i32,
+    #[get(type(copy))]
+    pub(super) post_id: i32,
+    #[get(type(copy))]
+    pub(super) user_id: i32,
+    pub(super) file_name: String,
+    pub(super) original_name: Option<String>,
+    pub(super) mime_type: String,
+    #[get(type(copy))]
+    pub(super) file_size: i32,
+    pub(super) file_data: Vec<u8>,
+    pub(super) created_at: Option<NaiveDateTime>,
+}
diff --git a/application/mapper/blog/image/type.rs b/application/mapper/blog/image/type.rs
new file mode 100644
index 00000000..69f25a5e
--- /dev/null
+++ b/application/mapper/blog/image/type.rs
@@ -0,0 +1,6 @@
+use super::*;
+
+pub type BlogImageEntity = Entity;
+pub type BlogImageActiveModel = ActiveModel;
+pub type BlogImageColumn = Column;
+pub type BlogImageModel = Model;
diff --git a/application/mapper/blog/like/enum.rs b/application/mapper/blog/like/enum.rs
new file mode 100644
index 00000000..17d03e5a
--- /dev/null
+++ b/application/mapper/blog/like/enum.rs
@@ -0,0 +1,4 @@
+use super::*;
+
+#[derive(Clone, Copy, Debug, EnumIter)]
+pub enum Relation {}
diff --git a/application/mapper/blog/like/impl.rs b/application/mapper/blog/like/impl.rs
new file mode 100644
index 00000000..16265438
--- /dev/null
+++ b/application/mapper/blog/like/impl.rs
@@ -0,0 +1,7 @@
+use super::*;
+
+impl RelationTrait for Relation {
+    fn def(&self) -> RelationDef {
+        panic!("No relations defined - using manual association management")
+    }
+}
diff --git a/application/mapper/blog/like/mod.rs b/application/mapper/blog/like/mod.rs
new file mode 100644
index 00000000..0e99b941
--- /dev/null
+++ b/application/mapper/blog/like/mod.rs
@@ -0,0 +1,8 @@
+mod r#enum;
+mod r#impl;
+mod r#struct;
+mod r#type;
+
+pub use {r#enum::*, r#struct::*, r#type::*};
+
+use super::*;
diff --git a/application/mapper/blog/like/struct.rs b/application/mapper/blog/like/struct.rs
new file mode 100644
index 00000000..a19bf42e
--- /dev/null
+++ b/application/mapper/blog/like/struct.rs
@@ -0,0 +1,24 @@
+use super::*;
+
+#[derive(
+    Clone,
+    Data,
+    Debug,
+    Default,
+    DeriveActiveModelBehavior,
+    DeriveEntityModel,
+    Deserialize,
+    PartialEq,
+    Serialize,
+)]
+#[sea_orm(table_name = "blog_like", schema_name = "public")]
+pub struct Model {
+    #[sea_orm(primary_key, auto_increment = true)]
+    #[get(type(copy))]
+    pub(super) id: i32,
+    #[get(type(copy))]
+    pub(super) post_id: i32,
+    #[get(type(copy))]
+    pub(super) user_id: i32,
+    pub(super) created_at: Option<NaiveDateTime>,
+}
diff --git a/application/mapper/blog/like/type.rs b/application/mapper/blog/like/type.rs
new file mode 100644
index 00000000..a1816181
--- /dev/null
+++ b/application/mapper/blog/like/type.rs
@@ -0,0 +1,6 @@
+use super::*;
+
+pub type BlogLikeEntity = Entity;
+pub type BlogLikeActiveModel = ActiveModel;
+pub type BlogLikeColumn = Column;
+pub type BlogLikeModel = Model;
diff --git a/application/mapper/blog/mod.rs b/application/mapper/blog/mod.rs
new file mode 100644
index 00000000..b18288fc
--- /dev/null
+++ b/application/mapper/blog/mod.rs
@@ -0,0 +1,7 @@
+pub mod comment;
+pub mod favorite;
+pub mod image;
+pub mod like;
+pub mod post;
+
+use super::*;
diff --git a/application/mapper/blog/post/enum.rs b/application/mapper/blog/post/enum.rs
new file mode 100644
index 00000000..17d03e5a
--- /dev/null
+++ b/application/mapper/blog/post/enum.rs
@@ -0,0 +1,4 @@
+use super::*;
+
+#[derive(Clone, Copy, Debug, EnumIter)]
+pub enum Relation {}
diff --git a/application/mapper/blog/post/impl.rs b/application/mapper/blog/post/impl.rs
new file mode 100644
index 00000000..16265438
--- /dev/null
+++ b/application/mapper/blog/post/impl.rs
@@ -0,0 +1,7 @@
+use super::*;
+
+impl RelationTrait for Relation {
+    fn def(&self) -> RelationDef {
+        panic!("No relations defined - using manual association management")
+    }
+}
diff --git a/application/mapper/blog/post/mod.rs b/application/mapper/blog/post/mod.rs
new file mode 100644
index 00000000..0e99b941
--- /dev/null
+++ b/application/mapper/blog/post/mod.rs
@@ -0,0 +1,8 @@
+mod r#enum;
+mod r#impl;
+mod r#struct;
+mod r#type;
+
+pub use {r#enum::*, r#struct::*, r#type::*};
+
+use super::*;
diff --git a/application/mapper/blog/post/struct.rs b/application/mapper/blog/post/struct.rs
new file mode 100644
index 00000000..ffab5c83
--- /dev/null
+++ b/application/mapper/blog/post/struct.rs
@@ -0,0 +1,40 @@
+use super::*;
+
+#[derive(
+    Clone,
+    Data,
+    Debug,
+    Default,
+    DeriveActiveModelBehavior,
+    DeriveEntityModel,
+    Deserialize,
+    PartialEq,
+    Serialize,
+)]
+#[sea_orm(table_name = "blog_post", schema_name = "public")]
+pub struct Model {
+    #[sea_orm(primary_key, auto_increment = true)]
+    #[get(type(copy))]
+    pub(super) id: i32,
+    #[get(type(copy))]
+    pub(super) user_id: i32,
+    pub(super) title: String,
+    pub(super) summary: Option<String>,
+    pub(super) content: String,
+    #[get(type(copy))]
+    pub(super) cover_image_id: i32,
+    #[get(type(copy))]
+    pub(super) is_published: bool,
+    #[get(type(copy))]
+    pub(super) is_deleted: bool,
+    #[get(type(copy))]
+    pub(super) view_count: i32,
+    #[get(type(copy))]
+    pub(super) like_count: i32,
+    #[get(type(copy))]
+    pub(super) favorite_count: i32,
+    #[get(type(copy))]
+    pub(super) comment_count: i32,
+    pub(super) created_at: Option<NaiveDateTime>,
+    pub(super) updated_at: Option<NaiveDateTime>,
+}
diff --git a/application/mapper/blog/post/type.rs b/application/mapper/blog/post/type.rs
new file mode 100644
index 00000000..9e33b156
--- /dev/null
+++ b/application/mapper/blog/post/type.rs
@@ -0,0 +1,6 @@
+use super::*;
+
+pub type BlogPostEntity = Entity;
+pub type BlogPostActiveModel = ActiveModel;
+pub type BlogPostColumn = Column;
+pub type BlogPostModel = Model;
diff --git a/application/mapper/mod.rs b/application/mapper/mod.rs
index 75366f3b..c528bd26 100644
--- a/application/mapper/mod.rs
+++ b/application/mapper/mod.rs
@@ -1,4 +1,5 @@
 pub mod auth;
+pub mod blog;
 pub mod chat;
 pub mod cicd;
 pub mod gomoku;
@@ -10,5 +11,6 @@ pub mod order;
 pub mod redis;
 pub mod shortlink;
 pub mod tracking;
+pub mod user;
 
 use super::*;
diff --git a/application/mapper/openapi/struct.rs b/application/mapper/openapi/struct.rs
index 6439ad9e..c94c7b76 100644
--- a/application/mapper/openapi/struct.rs
+++ b/application/mapper/openapi/struct.rs
@@ -42,9 +42,16 @@ use super::*;
         controller::auth::openapi_auth_login,
         controller::auth::openapi_auth_user_update,
         controller::auth::openapi_auth_user_change_password,
-        controller::auth::openapi_auth_user_approve,
+        controller::auth::openapi_auth_user_update_status,
         controller::auth::openapi_auth_user_list,
         controller::auth::openapi_auth_user_get,
+        controller::auth::openapi_auth_user_delete,
+        controller::user::openapi_user_list,
+        controller::user::openapi_user_get,
+        controller::user::openapi_user_update,
+        controller::user::openapi_user_change_password,
+        controller::user::openapi_user_update_status,
+        controller::user::openapi_user_delete,
         controller::redis::openapi_redis_record_create,
         controller::redis::openapi_redis_record_delete,
         controller::redis::openapi_redis_record_update,
@@ -55,6 +62,20 @@ use super::*;
         controller::sse::openapi_sse,
         controller::templates::openapi_templates,
         controller::trace::openapi_trace_search,
+        controller::blog::openapi_blog_post_create,
+        controller::blog::openapi_blog_post_update,
+        controller::blog::openapi_blog_post_delete,
+        controller::blog::openapi_blog_post_get,
+        controller::blog::openapi_blog_post_list,
+        controller::blog::openapi_blog_post_my_list,
+        controller::blog::openapi_blog_post_like,
+        controller::blog::openapi_blog_post_favorite,
+        controller::blog::openapi_blog_post_favorite_list,
+        controller::blog::openapi_blog_comment_create,
+        controller::blog::openapi_blog_comment_delete,
+        controller::blog::openapi_blog_comment_list,
+        controller::blog::openapi_blog_image_upload,
+        controller::blog::openapi_blog_image_download,
         controller::notification::openapi_notification_create,
         controller::notification::openapi_notification_list,
         controller::notification::openapi_notification_get,
@@ -74,9 +95,11 @@ use super::*;
         view::favicon::openapi_favicon,
         view::gomoku::openapi_gomoku_view,
         view::monitor::openapi_monitor_view,
+        view::blog::openapi_blog_view,
         view::notification::openapi_notification_view,
         view::openapi::openapi_openapi_view,
         view::order::openapi_order_view,
+        view::user::openapi_user_view,
         view::redis::openapi_redis_view,
         view::rss::openapi_rss_view,
         view::shortlink::openapi_shortlink_view,
@@ -129,7 +152,7 @@ use super::*;
         model::request::cicd::UpdateJobStatusParam,
         model::request::cicd::UpdateStepStatusParam,
         model::request::gomoku::GomokuWsRequest,
-        model::request::auth::ApproveUserRequest,
+        model::request::auth::UpdateUserStatusRequest,
         model::request::auth::ChangePasswordRequest,
         model::request::auth::LoginRequest,
         model::request::auth::RegisterRequest,
@@ -148,6 +171,12 @@ use super::*;
         model::response::auth::RsaPublicKeyResponse,
         model::response::auth::UserListResponse,
         model::response::auth::UserResponse,
+        model::request::user::UpdateUserStatusRequest,
+        model::request::user::ChangePasswordRequest,
+        model::request::user::UpdateUserRequest,
+        model::request::user::UserListQueryRequest,
+        model::response::user::UserListResponse,
+        model::response::user::UserResponse,
         model::response::chat::ChatHistoryResponse,
         model::response::chat::UserListResponse,
         model::response::chat::WebSocketRespData,
@@ -193,6 +222,20 @@ use super::*;
         model::response::rss::RssChannel,
         model::response::rss::RssEnclosure,
         model::response::rss::RssItem,
+        model::request::blog::CreateBlogPostRequest,
+        model::request::blog::UpdateBlogPostRequest,
+        model::request::blog::BlogPostListQueryRequest,
+        model::request::blog::CreateBlogCommentRequest,
+        model::request::blog::BlogCommentListQueryRequest,
+        model::request::blog::BlogImageUploadRequest,
+        model::response::blog::BlogPostResponse,
+        model::response::blog::BlogPostListResponse,
+        model::response::blog::BlogCommentResponse,
+        model::response::blog::BlogCommentListResponse,
+        model::response::blog::BlogImageResponse,
+        model::response::blog::BlogImageDataResponse,
+        model::response::blog::BlogLikeStatusResponse,
+        model::response::blog::BlogFavoriteStatusResponse,
         model::request::notification::CreateNotificationRequest,
         model::request::notification::NotificationListQueryRequest,
         model::response::notification::NotificationResponse,
diff --git a/application/mapper/user/enum.rs b/application/mapper/user/enum.rs
new file mode 100644
index 00000000..5cd24384
--- /dev/null
+++ b/application/mapper/user/enum.rs
@@ -0,0 +1,19 @@
+use super::*;
+
+#[derive(Clone, Copy, Debug, EnumIter)]
+pub enum Relation {}
+
+#[derive(Clone, Copy, Debug, Default, EnumIter, Eq, PartialEq, Serialize, Deserialize)]
+pub enum UserRole {
+    #[default]
+    User = 0,
+    Admin = 1,
+}
+
+#[derive(Clone, Copy, Debug, Default, EnumIter, Eq, PartialEq, Serialize, Deserialize)]
+pub enum UserStatus {
+    #[default]
+    Pending = 0,
+    Approved = 1,
+    Rejected = 2,
+}
diff --git a/application/mapper/user/impl.rs b/application/mapper/user/impl.rs
new file mode 100644
index 00000000..25eec1e7
--- /dev/null
+++ b/application/mapper/user/impl.rs
@@ -0,0 +1,126 @@
+use super::*;
+
+impl RelationTrait for Relation {
+    fn def(&self) -> RelationDef {
+        panic!("No relations defined - using manual association management")
+    }
+}
+
+impl std::str::FromStr for UserRole {
+    type Err = String;
+
+    #[instrument_trace]
+    fn from_str(s: &str) -> Result<Self, Self::Err> {
+        match s {
+            "admin" => Ok(UserRole::Admin),
+            "user" => Ok(UserRole::User),
+            _ => Ok(UserRole::default()),
+        }
+    }
+}
+
+impl UserRole {
+    #[instrument_trace]
+    pub fn as_str(&self) -> &'static str {
+        match self {
+            UserRole::User => "user",
+            UserRole::Admin => "admin",
+        }
+    }
+
+    #[instrument_trace]
+    pub fn from_string(s: &str) -> Option<Self> {
+        match s {
+            "user" => Some(UserRole::User),
+            "admin" => Some(UserRole::Admin),
+            _ => None,
+        }
+    }
+
+    #[instrument_trace]
+    pub fn to_i16(&self) -> i16 {
+        *self as i16
+    }
+
+    #[instrument_trace]
+    pub fn from_i16(v: i16) -> Option<Self> {
+        match v {
+            0 => Some(UserRole::User),
+            1 => Some(UserRole::Admin),
+            _ => None,
+        }
+    }
+
+    #[instrument_trace]
+    pub fn is_admin(&self) -> bool {
+        matches!(self, UserRole::Admin)
+    }
+}
+
+impl From<UserRole> for i16 {
+    #[instrument_trace]
+    fn from(role: UserRole) -> Self {
+        role as i16
+    }
+}
+
+impl TryFrom<i16> for UserRole {
+    type Error = String;
+
+    #[instrument_trace]
+    fn try_from(v: i16) -> Result<Self, Self::Error> {
+        UserRole::from_i16(v).ok_or_else(|| format!("Invalid UserRole value: {v}"))
+    }
+}
+
+impl UserStatus {
+    #[instrument_trace]
+    pub fn as_str(&self) -> &'static str {
+        match self {
+            UserStatus::Pending => "pending",
+            UserStatus::Approved => "approved",
+            UserStatus::Rejected => "rejected",
+        }
+    }
+
+    #[instrument_trace]
+    pub fn from_string(s: &str) -> Option<Self> {
+        match s {
+            "pending" => Some(UserStatus::Pending),
+            "approved" => Some(UserStatus::Approved),
+            "rejected" => Some(UserStatus::Rejected),
+            _ => None,
+        }
+    }
+
+    #[instrument_trace]
+    pub fn to_i16(&self) -> i16 {
+        *self as i16
+    }
+
+    #[instrument_trace]
+    pub fn from_i16(v: i16) -> Option<Self> {
+        match v {
+            0 => Some(UserStatus::Pending),
+            1 => Some(UserStatus::Approved),
+            2 => Some(UserStatus::Rejected),
+            _ => None,
+        }
+    }
+}
+
+impl From<UserStatus> for i16 {
+    #[instrument_trace]
+    fn from(status: UserStatus) -> Self {
+        status as i16
+    }
+}
+
+impl TryFrom<i16> for UserStatus {
+    type Error = String;
+
+    #[instrument_trace]
+    fn try_from(v: i16) -> Result<Self, Self::Error> {
+        UserStatus::from_i16(v).ok_or_else(|| format!("Invalid UserStatus value: {v}"))
+    }
+}
diff --git a/application/mapper/user/mod.rs b/application/mapper/user/mod.rs
new file mode 100644
index 00000000..0e99b941
--- /dev/null
+++ b/application/mapper/user/mod.rs
@@ -0,0 +1,8 @@
+mod r#enum;
+mod r#impl;
+mod r#struct;
+mod r#type;
+
+pub use {r#enum::*, r#struct::*, r#type::*};
+
+use super::*;
diff --git a/application/mapper/user/struct.rs b/application/mapper/user/struct.rs
new file mode 100644
index 00000000..480b20f8
--- /dev/null
+++ b/application/mapper/user/struct.rs
@@ -0,0 +1,29 @@
+use super::*;
+
+#[derive(
+    Clone,
+    Data,
+    Debug,
+    Default,
+    DeriveActiveModelBehavior,
+    DeriveEntityModel,
+    Deserialize,
+    PartialEq,
+    Serialize,
+)]
+#[sea_orm(table_name = "auth_user", schema_name = "public")]
+pub struct Model {
+    #[sea_orm(primary_key, auto_increment = true)]
+    #[get(type(copy))]
+    pub(super) id: i32,
+    pub(super) username: String,
+    pub(super) password_hash: String,
+    pub(super) email: Option<String>,
+    pub(super) phone: Option<String>,
+    #[get(type(copy))]
+    pub(super) role: i16,
+    #[get(type(copy))]
+    pub(super) status: i16,
+    pub(super) created_at: Option<NaiveDateTime>,
+    pub(super) updated_at: Option<NaiveDateTime>,
+}
diff --git a/application/mapper/user/type.rs b/application/mapper/user/type.rs
new file mode 100644
index 00000000..89de3130
--- /dev/null
+++ b/application/mapper/user/type.rs
@@ -0,0 +1,6 @@
+use super::*;
+
+pub type UserEntity = Entity;
+pub type UserActiveModel = ActiveModel;
+pub type UserColumn = Column;
+pub type UserModel = Model;
diff --git a/application/model/application/blog/mod.rs b/application/model/application/blog/mod.rs
new file mode 100644
index 00000000..1a7bc417
--- /dev/null
+++ b/application/model/application/blog/mod.rs
@@ -0,0 +1,5 @@
+mod r#struct;
+
+pub use r#struct::*;
+
+use super::*;
diff --git a/application/model/application/blog/struct.rs b/application/model/application/blog/struct.rs
new file mode 100644
index 00000000..d693291b
--- /dev/null
+++ b/application/model/application/blog/struct.rs
@@ -0,0 +1,31 @@
+use super::*;
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize)]
+pub struct BlogPost {
+    pub(super) id: i32,
+    pub(super) user_id: i32,
+    pub(super) title: String,
+    pub(super) summary: Option<String>,
+    pub(super) content: String,
+    pub(super) cover_image_id: i32,
+    pub(super) is_published: bool,
+    pub(super) is_deleted: bool,
+    pub(super) view_count: i32,
+    pub(super) like_count: i32,
+    pub(super) favorite_count: i32,
+    pub(super) comment_count: i32,
+    pub(super) created_at: Option<NaiveDateTime>,
+    pub(super) updated_at: Option<NaiveDateTime>,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize)]
+pub struct BlogComment {
+    pub(super) id: i32,
+    pub(super) post_id: i32,
+    pub(super) user_id: i32,
+    pub(super) parent_id: i32,
+    pub(super) content: String,
+    pub(super) is_deleted: bool,
+    pub(super) created_at: Option<NaiveDateTime>,
+    pub(super) updated_at: Option<NaiveDateTime>,
+}
diff --git a/application/model/application/mod.rs b/application/model/application/mod.rs
index 5ba43d8c..c89968b4 100644
--- a/application/model/application/mod.rs
+++ b/application/model/application/mod.rs
@@ -1,3 +1,4 @@
+pub mod blog;
 pub mod chat;
 pub mod cicd;
 pub mod gomoku;
@@ -9,5 +10,6 @@ pub mod rss;
 pub mod shortlink;
 pub mod tracking;
 pub mod upload;
+pub mod user;
 
 use super::*;
diff --git a/application/model/application/user/const.rs b/application/model/application/user/const.rs
new file mode 100644
index 00000000..7e26fb42
--- /dev/null
+++ b/application/model/application/user/const.rs
@@ -0,0 +1,2 @@
+pub const MAX_LIMIT: u64 = 100;
+pub const ID_KEY: &str = "id";
diff --git a/application/model/application/user/mod.rs b/application/model/application/user/mod.rs
new file mode 100644
index 00000000..47b526e7
--- /dev/null
+++ b/application/model/application/user/mod.rs
@@ -0,0 +1,3 @@
+mod r#const;
+
+pub use r#const::*;
diff --git a/application/model/request/auth/struct.rs b/application/model/request/auth/struct.rs
index 890c66e9..09b20bdb 100644
--- a/application/model/request/auth/struct.rs
+++ b/application/model/request/auth/struct.rs
@@ -27,7 +27,7 @@ pub struct ChangePasswordRequest {
 }
 
 #[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
-pub struct ApproveUserRequest {
+pub struct UpdateUserStatusRequest {
     #[get(type(copy))]
     pub(super) approved: bool,
 }
diff --git a/application/model/request/blog/mod.rs b/application/model/request/blog/mod.rs
new file mode 100644
index 00000000..1a7bc417
--- /dev/null
+++ b/application/model/request/blog/mod.rs
@@ -0,0 +1,5 @@
+mod r#struct;
+
+pub use r#struct::*;
+
+use super::*;
diff --git a/application/model/request/blog/struct.rs b/application/model/request/blog/struct.rs
new file mode 100644
index 00000000..41e818f8
--- /dev/null
+++ b/application/model/request/blog/struct.rs
@@ -0,0 +1,60 @@
+use super::*;
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct CreateBlogPostRequest {
+    pub(super) title: String,
+    pub(super) summary: Option<String>,
+    pub(super) content: String,
+    pub(super) cover_image_id: Option<String>,
+    #[get(type(copy))]
+    pub(super) is_published: bool,
+    pub(super) image_ids: Vec<String>,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct UpdateBlogPostRequest {
+    pub(super) title: Option<String>,
+    pub(super) summary: Option<String>,
+    pub(super) content: Option<String>,
+    pub(super) cover_image_id: Option<String>,
+    #[get(type(copy))]
+    pub(super) is_published: Option<bool>,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogPostListQueryRequest {
+    pub(super) keyword: Option<String>,
+    #[get(type(copy))]
+    pub(super) is_published: Option<bool>,
+    #[get(type(copy))]
+    pub(super) page: Option<i32>,
+    #[get(type(copy))]
+    pub(super) limit: Option<u64>,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct CreateBlogCommentRequest {
+    pub(super) post_id: String,
+    pub(super) parent_id: Option<String>,
+    pub(super) content: String,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogCommentListQueryRequest {
+    pub(super) post_id: String,
+    #[get(type(copy))]
+    pub(super) page: Option<i32>,
+    #[get(type(copy))]
+    pub(super) limit: Option<u64>,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogImageUploadRequest {
+    pub(super) file_name: String,
+    pub(super) original_name: Option<String>,
+    pub(super) mime_type: String,
+    #[get(type(copy))]
+    pub(super) file_size: i32,
+    #[schema(value_type = String, format = Binary)]
+    pub(super) file_data: Vec<u8>,
+}
diff --git a/application/model/request/mod.rs b/application/model/request/mod.rs
index 35e2411e..be6e80a8 100644
--- a/application/model/request/mod.rs
+++ b/application/model/request/mod.rs
@@ -1,4 +1,5 @@
 pub mod auth;
+pub mod blog;
 pub mod chat;
 pub mod cicd;
 pub mod gomoku;
@@ -8,6 +9,7 @@ pub mod redis;
 pub mod rss;
 pub mod shortlink;
 pub mod upload;
+pub mod user;
 pub mod websocket;
 
 use super::*;
diff --git a/application/model/request/user/mod.rs b/application/model/request/user/mod.rs
new file mode 100644
index 00000000..1a7bc417
--- /dev/null
+++ b/application/model/request/user/mod.rs
@@ -0,0 +1,5 @@
+mod r#struct;
+
+pub use r#struct::*;
+
+use super::*;
diff --git a/application/model/request/user/struct.rs b/application/model/request/user/struct.rs
new file mode 100644
index 00000000..83f47dd8
--- /dev/null
+++ b/application/model/request/user/struct.rs
@@ -0,0 +1,27 @@
+use super::*;
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct UpdateUserRequest {
+    pub(super) email: Option<String>,
+    pub(super) phone: Option<String>,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct ChangePasswordRequest {
+    pub(super) old_password: String,
+    pub(super) new_password: String,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct UpdateUserStatusRequest {
+    #[get(type(copy))]
+    pub(super) approved: bool,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct UserListQueryRequest {
+    pub(super) keyword: Option<String>,
+    pub(super) last_id: Option<String>,
+    #[get(type(copy))]
+    pub(super) limit: Option<u64>,
+}
diff --git a/application/model/response/blog/mod.rs b/application/model/response/blog/mod.rs
new file mode 100644
index 00000000..1a7bc417
--- /dev/null
+++ b/application/model/response/blog/mod.rs
@@ -0,0 +1,5 @@
+mod r#struct;
+
+pub use r#struct::*;
+
+use super::*;
diff --git a/application/model/response/blog/struct.rs b/application/model/response/blog/struct.rs
new file mode 100644
index 00000000..5131f185
--- /dev/null
+++ b/application/model/response/blog/struct.rs
@@ -0,0 +1,108 @@
+use super::*;
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogPostResponse {
+    pub(super) id: String,
+    pub(super) user_id: String,
+    pub(super) username: Option<String>,
+    pub(super) title: String,
+    pub(super) summary: Option<String>,
+    pub(super) content: String,
+    pub(super) cover_image: Option<BlogImageResponse>,
+    pub(super) images: Vec<BlogImageResponse>,
+    #[get(type(copy))]
+    pub(super) is_published: bool,
+    #[get(type(copy))]
+    pub(super) view_count: i32,
+    #[get(type(copy))]
+    pub(super) like_count: i32,
+    #[get(type(copy))]
+    pub(super) favorite_count: i32,
+    #[get(type(copy))]
+    pub(super) comment_count: i32,
+    #[get(type(copy))]
+    pub(super) is_liked: bool,
+    #[get(type(copy))]
+    pub(super) is_favorited: bool,
+    #[get(type(copy))]
+    pub(super) created_at: i64,
+    #[get(type(copy))]
+    pub(super) updated_at: i64,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogPostListResponse {
+    pub(super) posts: Vec<BlogPostResponse>,
+    #[get(type(copy))]
+    pub(super) total: i64,
+    #[get(type(copy))]
+    pub(super) page: i32,
+    #[get(type(copy))]
+    pub(super) limit: u64,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogCommentResponse {
+    pub(super) id: String,
+    pub(super) post_id: String,
+    pub(super) user_id: String,
+    pub(super) username: String,
+    pub(super) avatar: Option<String>,
+    pub(super) parent_id: Option<String>,
+    pub(super) content: String,
+    #[get(type(copy))]
+    pub(super) created_at: i64,
+    pub(super) replies: Vec<BlogCommentResponse>,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogCommentListResponse {
+    pub(super) comments: Vec<BlogCommentResponse>,
+    #[get(type(copy))]
+    pub(super) total: i64,
+    #[get(type(copy))]
+    pub(super) page: i32,
+    #[get(type(copy))]
+    pub(super) limit: u64,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogImageResponse {
+    pub(super) id: String,
+    pub(super) post_id: String,
+    pub(super) user_id: String,
+    pub(super) file_name: String,
+    pub(super) original_name: Option<String>,
+    pub(super) mime_type: String,
+    #[get(type(copy))]
+    pub(super) file_size: i32,
+    #[get(type(copy))]
+    pub(super) created_at: i64,
+    pub(super) download_url: String,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogImageDataResponse {
+    pub(super) id: String,
+    pub(super) post_id: String,
+    pub(super) file_name: String,
+    pub(super) original_name: Option<String>,
+    pub(super) mime_type: String,
+    pub(super) file_data: Vec<u8>,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogLikeStatusResponse {
+    #[get(type(copy))]
+    pub(super) liked: bool,
+    #[get(type(copy))]
+    pub(super) like_count: i32,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct BlogFavoriteStatusResponse {
+    #[get(type(copy))]
+    pub(super) favorited: bool,
+    #[get(type(copy))]
+    pub(super) favorite_count: i32,
+}
diff --git a/application/model/response/mod.rs b/application/model/response/mod.rs
index 5a4cb1c1..c425253e 100644
--- a/application/model/response/mod.rs
+++ b/application/model/response/mod.rs
@@ -1,4 +1,5 @@
 pub mod auth;
+pub mod blog;
 pub mod chat;
 pub mod cicd;
 pub mod common;
@@ -8,6 +9,7 @@ pub mod order;
 pub mod rss;
 pub mod tracking;
 pub mod upload;
+pub mod user;
 pub mod websocket;
 
 use super::*;
diff --git a/application/model/response/user/mod.rs b/application/model/response/user/mod.rs
new file mode 100644
index 00000000..1a7bc417
--- /dev/null
+++ b/application/model/response/user/mod.rs
@@ -0,0 +1,5 @@
+mod r#struct;
+
+pub use r#struct::*;
+
+use super::*;
diff --git a/application/model/response/user/struct.rs b/application/model/response/user/struct.rs
new file mode 100644
index 00000000..c971c4a5
--- /dev/null
+++ b/application/model/response/user/struct.rs
@@ -0,0 +1,22 @@
+use super::*;
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct UserResponse {
+    pub(super) id: String,
+    pub(super) username: String,
+    pub(super) email: Option<String>,
+    pub(super) phone: Option<String>,
+    pub(super) role: String,
+    pub(super) status: String,
+    pub(super) created_at: Option<i64>,
+}
+
+#[derive(Clone, Data, Debug, Default, Deserialize, Serialize, ToSchema)]
+pub struct UserListResponse {
+    pub(super) users: Vec<UserResponse>,
+    #[get(type(copy))]
+    pub(super) has_more: bool,
+    pub(super) last_id: Option<String>,
+    #[get(type(copy))]
+    pub(super) total_count: i64,
+}
diff --git a/application/repository/auth/impl.rs b/application/repository/auth/impl.rs
index 0267fc5e..77af8337 100644
--- a/application/repository/auth/impl.rs
+++ b/application/repository/auth/impl.rs
@@ -1,6 +1,38 @@
 use super::*;
 
 impl UserRepository {
+    #[instrument_trace]
+    fn validate_email(email: &str) -> bool {
+        match EMAIL_REGEX.as_ref() {
+            Some(regex) => regex.is_match(email),
+            None => false,
+        }
+    }
+
+    #[instrument_trace]
+    fn validate_phone(phone: &str) -> bool {
+        match PHONE_REGEX_OPT.as_ref() {
+            Some(regex) => regex.is_match(phone),
+            None => false,
+        }
+    }
+
+    #[instrument_trace]
+    fn validate_active_model(active_model: &AuthUserActiveModel) -> Result<(), String> {
+        if let ActiveValue::Set(Some(ref email)) = active_model.email
+            && !email.is_empty()
+            && !Self::validate_email(email)
+        {
+            return Err("Invalid email format".to_string());
+        }
+        if let ActiveValue::Set(Some(ref phone)) = active_model.phone
+            && !phone.is_empty()
+            && !Self::validate_phone(phone)
+        {
+            return Err("Invalid phone format".to_string());
+        }
+        Ok(())
+    }
     #[instrument_trace]
     pub async fn find_by_id(user_id: i32) -> Result<Option<AuthUserModel>, String> {
         let db: DatabaseConnection =
@@ -38,6 +70,7 @@ impl UserRepository {
 
     #[instrument_trace]
     pub async fn insert(active_model: AuthUserActiveModel) -> Result<AuthUserModel, String> {
+        Self::validate_active_model(&active_model)?;
         let db: DatabaseConnection =
             PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
         let result: AuthUserModel = active_model
@@ -49,6 +82,7 @@ impl UserRepository {
 
     #[instrument_trace]
     pub async fn update(active_model: AuthUserActiveModel) -> Result<AuthUserModel, String> {
+        Self::validate_active_model(&active_model)?;
         let db: DatabaseConnection =
             PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
         let result: AuthUserModel = active_model
@@ -132,4 +166,15 @@ impl UserRepository {
             .map_err(|error: DbErr| error.to_string())?;
         Ok(result)
     }
+
+    #[instrument_trace]
+    pub async fn delete_by_id(user_id: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        AuthUserEntity::delete_by_id(user_id)
+            .exec(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
 }
diff --git a/application/repository/auth/mod.rs b/application/repository/auth/mod.rs
index b06a72d7..670bf679 100644
--- a/application/repository/auth/mod.rs
+++ b/application/repository/auth/mod.rs
@@ -8,5 +8,6 @@ use {super::*, mapper::auth::user::*};
 use {
     chrono::NaiveDateTime,
     hyperlane_plugin::{common::*, postgresql::*},
-    sea_orm::{Condition, QuerySelect},
+    sea_orm::{ActiveValue, Condition, QuerySelect},
+    service::auth::{EMAIL_REGEX, PHONE_REGEX_OPT},
 };
diff --git a/application/repository/blog/impl.rs b/application/repository/blog/impl.rs
new file mode 100644
index 00000000..d86a92f8
--- /dev/null
+++ b/application/repository/blog/impl.rs
@@ -0,0 +1,500 @@
+use super::*;
+
+impl BlogPostRepository {
+    #[instrument_trace]
+    pub async fn insert(active_model: BlogPostActiveModel) -> Result<BlogPostModel, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: BlogPostModel = active_model
+            .insert(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn find_by_id(id: i32) -> Result<Option<BlogPostModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Option<BlogPostModel> = BlogPostEntity::find_by_id(id)
+            .filter(BlogPostColumn::IsDeleted.eq(false))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn query_with_pagination(
+        query: BlogPostQuery,
+    ) -> Result<(Vec<BlogPostModel>, i64), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let mut base_select: sea_orm::Select<BlogPostEntity> = BlogPostEntity::find();
+        if let Some(user_id) = query.try_get_user_id() {
+            base_select = base_select.filter(BlogPostColumn::UserId.eq(user_id));
+        }
+        if let Some(keyword) = query.try_get_keyword() {
+            base_select = base_select.filter(
+                BlogPostColumn::Title
+                    .contains(keyword)
+                    .or(BlogPostColumn::Summary.contains(keyword)),
+            );
+        }
+        if let Some(is_published) = query.try_get_is_published() {
+            base_select = base_select.filter(BlogPostColumn::IsPublished.eq(is_published));
+        }
+        base_select = base_select.filter(BlogPostColumn::IsDeleted.eq(false));
+        let total: i64 = base_select
+            .clone()
+            .count(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())? as i64;
+        let records: Vec<BlogPostModel> = base_select
+            .order_by_desc(BlogPostColumn::CreatedAt)
+            .offset(((query.get_page() - 1) as i64 * query.get_limit() as i64) as u64)
+            .limit(query.get_limit())
+            .all(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok((records, total))
+    }
+
+    #[instrument_trace]
+    pub async fn update(
+        id: i32,
+        active_model: BlogPostActiveModel,
+    ) -> Result<BlogPostModel, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogPostModel = BlogPostEntity::find_by_id(id)
+            .filter(BlogPostColumn::IsDeleted.eq(false))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        let mut update_model: BlogPostActiveModel = model.into();
+        if active_model.title != ActiveValue::NotSet {
+            update_model.title = active_model.title;
+        }
+        if active_model.summary != ActiveValue::NotSet {
+            update_model.summary = active_model.summary;
+        }
+        if active_model.content != ActiveValue::NotSet {
+            update_model.content = active_model.content;
+        }
+        if active_model.cover_image_id != ActiveValue::NotSet {
+            update_model.cover_image_id = active_model.cover_image_id;
+        }
+        if active_model.is_published != ActiveValue::NotSet {
+            update_model.is_published = active_model.is_published;
+        }
+        let result: BlogPostModel = update_model
+            .update(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn soft_delete_by_id(id: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogPostModel = BlogPostEntity::find_by_id(id)
+            .filter(BlogPostColumn::IsDeleted.eq(false))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        let mut active_model: BlogPostActiveModel = model.into();
+        active_model.is_deleted = ActiveValue::Set(true);
+        active_model
+            .update(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+
+    #[instrument_trace]
+    pub async fn increment_view_count(id: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogPostModel = BlogPostEntity::find_by_id(id)
+            .filter(BlogPostColumn::IsDeleted.eq(false))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        let new_count: i32 = model.get_view_count() + 1;
+        let mut active_model: BlogPostActiveModel = model.into();
+        active_model.view_count = ActiveValue::Set(new_count);
+        active_model
+            .update(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+
+    #[instrument_trace]
+    pub async fn update_like_count(id: i32, delta: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogPostModel = BlogPostEntity::find_by_id(id)
+            .filter(BlogPostColumn::IsDeleted.eq(false))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        let new_count: i32 = (model.get_like_count() + delta).max(0);
+        let mut active_model: BlogPostActiveModel = model.into();
+        active_model.like_count = ActiveValue::Set(new_count);
+        active_model
+            .update(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+
+    #[instrument_trace]
+    pub async fn update_favorite_count(id: i32, delta: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogPostModel = BlogPostEntity::find_by_id(id)
+            .filter(BlogPostColumn::IsDeleted.eq(false))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        let new_count: i32 = (model.get_favorite_count() + delta).max(0);
+        let mut active_model: BlogPostActiveModel = model.into();
+        active_model.favorite_count = ActiveValue::Set(new_count);
+        active_model
+            .update(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+
+    #[instrument_trace]
+    pub async fn update_comment_count(id: i32, delta: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogPostModel = BlogPostEntity::find_by_id(id)
+            .filter(BlogPostColumn::IsDeleted.eq(false))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        let new_count: i32 = (model.get_comment_count() + delta).max(0);
+        let mut active_model: BlogPostActiveModel = model.into();
+        active_model.comment_count = ActiveValue::Set(new_count);
+        active_model
+            .update(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+}
+
+impl BlogCommentRepository {
+    #[instrument_trace]
+    pub async fn insert(active_model: BlogCommentActiveModel) -> Result<BlogCommentModel, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: BlogCommentModel = active_model
+            .insert(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn find_by_id(id: i32) -> Result<Option<BlogCommentModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Option<BlogCommentModel> = BlogCommentEntity::find_by_id(id)
+            .filter(BlogCommentColumn::IsDeleted.eq(false))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn query_by_post_id(
+        query: BlogCommentQuery,
+    ) -> Result<(Vec<BlogCommentModel>, i64), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let base_select: sea_orm::Select<BlogCommentEntity> = BlogCommentEntity::find()
+            .filter(BlogCommentColumn::PostId.eq(query.get_post_id()))
+            .filter(BlogCommentColumn::IsDeleted.eq(false));
+        let total: i64 = base_select
+            .clone()
+            .count(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())? as i64;
+        let records: Vec<BlogCommentModel> = base_select
+            .order_by_asc(BlogCommentColumn::CreatedAt)
+            .offset(((query.get_page() - 1) as i64 * query.get_limit() as i64) as u64)
+            .limit(query.get_limit())
+            .all(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok((records, total))
+    }
+
+    #[instrument_trace]
+    pub async fn query_replies_by_parent_id(
+        parent_id: i32,
+    ) -> Result<Vec<BlogCommentModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Vec<BlogCommentModel> = BlogCommentEntity::find()
+            .filter(BlogCommentColumn::ParentId.eq(parent_id))
+            .filter(BlogCommentColumn::IsDeleted.eq(false))
+            .order_by_asc(BlogCommentColumn::CreatedAt)
+            .all(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn soft_delete_by_id(id: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogCommentModel = BlogCommentEntity::find_by_id(id)
+            .filter(BlogCommentColumn::IsDeleted.eq(false))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Comment not found".to_string())?;
+        let mut active_model: BlogCommentActiveModel = model.into();
+        active_model.is_deleted = ActiveValue::Set(true);
+        active_model
+            .update(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+}
+
+impl BlogLikeRepository {
+    #[instrument_trace]
+    pub async fn insert(active_model: BlogLikeActiveModel) -> Result<BlogLikeModel, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: BlogLikeModel = active_model
+            .insert(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn find_by_post_and_user(
+        post_id: i32,
+        user_id: i32,
+    ) -> Result<Option<BlogLikeModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Option<BlogLikeModel> = BlogLikeEntity::find()
+            .filter(BlogLikeColumn::PostId.eq(post_id))
+            .filter(BlogLikeColumn::UserId.eq(user_id))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn delete_by_post_and_user(post_id: i32, user_id: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogLikeModel = BlogLikeEntity::find()
+            .filter(BlogLikeColumn::PostId.eq(post_id))
+            .filter(BlogLikeColumn::UserId.eq(user_id))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Like not found".to_string())?;
+        let active_model: BlogLikeActiveModel = model.into();
+        active_model
+            .delete(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+
+    #[instrument_trace]
+    pub async fn count_by_post_id(post_id: i32) -> Result<i64, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let count: i64 = BlogLikeEntity::find()
+            .filter(BlogLikeColumn::PostId.eq(post_id))
+            .count(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())? as i64;
+        Ok(count)
+    }
+}
+
+impl BlogFavoriteRepository {
+    #[instrument_trace]
+    pub async fn insert(
+        active_model: BlogFavoriteActiveModel,
+    ) -> Result<BlogFavoriteModel, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: BlogFavoriteModel = active_model
+            .insert(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn find_by_post_and_user(
+        post_id: i32,
+        user_id: i32,
+    ) -> Result<Option<BlogFavoriteModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Option<BlogFavoriteModel> = BlogFavoriteEntity::find()
+            .filter(BlogFavoriteColumn::PostId.eq(post_id))
+            .filter(BlogFavoriteColumn::UserId.eq(user_id))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn delete_by_post_and_user(post_id: i32, user_id: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogFavoriteModel = BlogFavoriteEntity::find()
+            .filter(BlogFavoriteColumn::PostId.eq(post_id))
+            .filter(BlogFavoriteColumn::UserId.eq(user_id))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Favorite not found".to_string())?;
+        let active_model: BlogFavoriteActiveModel = model.into();
+        active_model
+            .delete(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+
+    #[instrument_trace]
+    pub async fn count_by_post_id(post_id: i32) -> Result<i64, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let count: i64 = BlogFavoriteEntity::find()
+            .filter(BlogFavoriteColumn::PostId.eq(post_id))
+            .count(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())? as i64;
+        Ok(count)
+    }
+
+    #[instrument_trace]
+    pub async fn find_by_user_id(
+        user_id: i32,
+        page: i32,
+        limit: u64,
+    ) -> Result<(Vec<BlogFavoriteModel>, i64), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let base_select: sea_orm::Select<BlogFavoriteEntity> =
+            BlogFavoriteEntity::find().filter(BlogFavoriteColumn::UserId.eq(user_id));
+        let total: i64 = base_select
+            .clone()
+            .count(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())? as i64;
+        let records: Vec<BlogFavoriteModel> = base_select
+            .order_by_desc(BlogFavoriteColumn::CreatedAt)
+            .offset(((page - 1) as i64 * limit as i64) as u64)
+            .limit(limit)
+            .all(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok((records, total))
+    }
+}
+
+impl BlogImageRepository {
+    #[instrument_trace]
+    pub async fn insert(active_model: BlogImageActiveModel) -> Result<BlogImageModel, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: BlogImageModel = active_model
+            .insert(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn find_by_id(id: i32) -> Result<Option<BlogImageModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Option<BlogImageModel> = BlogImageEntity::find_by_id(id)
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn find_by_post_id(post_id: i32) -> Result<Vec<BlogImageModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Vec<BlogImageModel> = BlogImageEntity::find()
+            .filter(BlogImageColumn::PostId.eq(post_id))
+            .order_by_desc(BlogImageColumn::Id)
+            .all(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn update_post_id(image_id: i32, post_id: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogImageModel = BlogImageEntity::find_by_id(image_id)
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Image not found".to_string())?;
+        let mut active_model: BlogImageActiveModel = model.into();
+        active_model.post_id = ActiveValue::Set(post_id);
+        active_model
+            .update(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+
+    #[instrument_trace]
+    pub async fn delete_by_id(id: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let model: BlogImageModel = BlogImageEntity::find_by_id(id)
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?
+            .ok_or_else(|| "Image not found".to_string())?;
+        let active_model: BlogImageActiveModel = model.into();
+        active_model
+            .delete(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+}
diff --git a/application/repository/blog/mod.rs b/application/repository/blog/mod.rs
new file mode 100644
index 00000000..ec464daf
--- /dev/null
+++ b/application/repository/blog/mod.rs
@@ -0,0 +1,13 @@
+mod r#impl;
+mod r#struct;
+
+pub use r#struct::*;
+
+use {
+    super::*,
+    mapper::blog::{comment::*, favorite::*, image::*, like::*, post::*},
+};
+
+use hyperlane_plugin::{common::*, postgresql::*};
+
+use sea_orm::ActiveValue;
diff --git a/application/repository/blog/struct.rs b/application/repository/blog/struct.rs
new file mode 100644
index 00000000..5f2d808b
--- /dev/null
+++ b/application/repository/blog/struct.rs
@@ -0,0 +1,39 @@
+use super::*;
+
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogPostRepository;
+
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogCommentRepository;
+
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogLikeRepository;
+
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogFavoriteRepository;
+
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogImageRepository;
+
+#[derive(Clone, Data, Debug, Default)]
+pub struct BlogPostQuery {
+    #[get(type(copy))]
+    pub(super) user_id: Option<i32>,
+    pub(super) keyword: Option<String>,
+    #[get(type(copy))]
+    pub(super) is_published: Option<bool>,
+    #[get(type(copy))]
+    pub(super) page: i32,
+    #[get(type(copy))]
+    pub(super) limit: u64,
+}
+
+#[derive(Clone, Data, Debug, Default)]
+pub struct BlogCommentQuery {
+    #[get(type(copy))]
+    pub post_id: i32,
+    #[get(type(copy))]
+    pub page: i32,
+    #[get(type(copy))]
+    pub limit: u64,
+}
diff --git a/application/repository/mod.rs b/application/repository/mod.rs
index a8bd4071..077333c1 100644
--- a/application/repository/mod.rs
+++ b/application/repository/mod.rs
@@ -1,4 +1,5 @@
 pub mod auth;
+pub mod blog;
 pub mod chat;
 pub mod cicd;
 pub mod notification;
@@ -6,5 +7,6 @@ pub mod order;
 pub mod shortlink;
 pub mod tracking;
 pub mod upload;
+pub mod user;
 
 use super::*;
diff --git a/application/repository/user/impl.rs b/application/repository/user/impl.rs
new file mode 100644
index 00000000..354ce38d
--- /dev/null
+++ b/application/repository/user/impl.rs
@@ -0,0 +1,145 @@
+use super::*;
+
+impl UserRepository {
+    #[instrument_trace]
+    pub async fn find_by_id(user_id: i32) -> Result<Option<UserModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Option<UserModel> = UserEntity::find_by_id(user_id)
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn find_by_username(username: String) -> Result<Option<UserModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Option<UserModel> = UserEntity::find()
+            .filter(UserColumn::Username.eq(username))
+            .one(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn find_by_ids(user_ids: Vec<i32>) -> Result<Vec<UserModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Vec<UserModel> = UserEntity::find()
+            .filter(UserColumn::Id.is_in(user_ids))
+            .all(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn insert(active_model: UserActiveModel) -> Result<UserModel, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: UserModel = active_model
+            .insert(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn update(active_model: UserActiveModel) -> Result<UserModel, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: UserModel = active_model
+            .update(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn query_with_pagination(
+        keyword: Option<String>,
+        last_id: Option<i32>,
+        limit: u64,
+    ) -> Result<(Vec<UserModel>, i64, bool), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let mut base_select: Select<UserEntity> = UserEntity::find();
+        if let Some(keyword) = keyword {
+            let keyword_pattern: String = format!("%{keyword}%");
+            let mut condition: Condition = Condition::any()
+                .add(UserColumn::Username.like(keyword_pattern.clone()))
+                .add(UserColumn::Email.like(keyword_pattern.clone()))
+                .add(UserColumn::Phone.like(keyword_pattern.clone()));
+            if let Ok(user_id) = keyword.parse::<i32>() {
+                condition = condition.add(UserColumn::Id.eq(user_id));
+            }
+            base_select = base_select.filter(condition);
+        }
+        let total_count_u64: u64 = base_select
+            .clone()
+            .count(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        let total_count: i64 = total_count_u64 as i64;
+        let mut paged_select: Select<UserEntity> = base_select;
+        if let Some(last_id) = last_id {
+            paged_select = paged_select.filter(UserColumn::Id.lt(last_id));
+        }
+        paged_select = paged_select.order_by_desc(UserColumn::Id);
+        let limit_with_extra: u64 = limit + 1;
+        paged_select = paged_select.limit(limit_with_extra);
+        let paged_users: Vec<UserModel> = paged_select
+            .all(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        let has_more: bool = paged_users.len() > limit as usize;
+        let paged_users: Vec<UserModel> = paged_users.into_iter().take(limit as usize).collect();
+        Ok((paged_users, total_count, has_more))
+    }
+
+    #[instrument_trace]
+    pub async fn count_by_created_at_range(
+        start: NaiveDateTime,
+        end: NaiveDateTime,
+    ) -> Result<i64, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let count_u64: u64 = UserEntity::find()
+            .filter(UserColumn::CreatedAt.gte(start))
+            .filter(UserColumn::CreatedAt.lte(end))
+            .count(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(count_u64 as i64)
+    }
+
+    #[instrument_trace]
+    pub async fn find_by_created_at_range(
+        start: NaiveDateTime,
+        end: NaiveDateTime,
+    ) -> Result<Vec<UserModel>, String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        let result: Vec<UserModel> = UserEntity::find()
+            .filter(UserColumn::CreatedAt.gte(start))
+            .filter(UserColumn::CreatedAt.lte(end))
+            .all(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(result)
+    }
+
+    #[instrument_trace]
+    pub async fn delete_by_id(user_id: i32) -> Result<(), String> {
+        let db: DatabaseConnection =
+            PostgreSqlPlugin::get_connection(DEFAULT_POSTGRESQL_INSTANCE_NAME, None).await?;
+        UserEntity::delete_by_id(user_id)
+            .exec(&db)
+            .await
+            .map_err(|error: DbErr| error.to_string())?;
+        Ok(())
+    }
+}
diff --git a/application/repository/user/mod.rs b/application/repository/user/mod.rs
new file mode 100644
index 00000000..e1ca2848
--- /dev/null
+++ b/application/repository/user/mod.rs
@@ -0,0 +1,12 @@
+mod r#impl;
+mod r#struct;
+
+pub use r#struct::*;
+
+use {super::*, mapper::user::*};
+
+use {
+    chrono::NaiveDateTime,
+    hyperlane_plugin::{common::*, postgresql::*},
+    sea_orm::{Condition, QuerySelect},
+};
diff --git a/application/repository/user/struct.rs b/application/repository/user/struct.rs
new file mode 100644
index 00000000..761a7481
--- /dev/null
+++ b/application/repository/user/struct.rs
@@ -0,0 +1,4 @@
+use super::*;
+
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct UserRepository;
diff --git a/application/service/auth/const.rs b/application/service/auth/const.rs
index e07db7b5..bd697f1c 100644
--- a/application/service/auth/const.rs
+++ b/application/service/auth/const.rs
@@ -1,2 +1 @@
-pub const EMAIL_REGEX_PATTERN: &str = r"^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$";
 pub const RSA_KEY_CACHE_TTL_SECS: u64 = 3600;
diff --git a/application/service/auth/impl.rs b/application/service/auth/impl.rs
index 11ca326e..7bdeb449 100644
--- a/application/service/auth/impl.rs
+++ b/application/service/auth/impl.rs
@@ -106,11 +106,18 @@ impl AuthService {
 
     #[instrument_trace]
     fn validate_email(email: &str) -> bool {
-        let regex: Regex = match Regex::new(EMAIL_REGEX_PATTERN) {
-            Ok(r) => r,
-            Err(_) => return false,
-        };
-        regex.is_match(email)
+        match EMAIL_REGEX.as_ref() {
+            Some(regex) => regex.is_match(email),
+            None => false,
+        }
+    }
+
+    #[instrument_trace]
+    fn validate_phone(phone: &str) -> bool {
+        match PHONE_REGEX_OPT.as_ref() {
+            Some(regex) => regex.is_match(phone),
+            None => false,
+        }
     }
 
     #[instrument_trace]
@@ -131,6 +138,12 @@ impl AuthService {
         {
             return Err("Invalid email format".to_string());
         }
+        if let Some(ref phone) = decrypted_phone
+            && !phone.is_empty()
+            && !Self::validate_phone(phone)
+        {
+            return Err("Invalid phone format".to_string());
+        }
         if UserRepository::find_by_username(decrypted_username.clone())
             .await?
             .is_some()
@@ -201,16 +214,21 @@ impl AuthService {
         {
             return Err("Invalid email format".to_string());
         }
+        if let Some(ref phone) = decrypted_phone
+            && !phone.is_empty()
+            && !Self::validate_phone(phone)
+        {
+            return Err("Invalid phone format".to_string());
+        }
         match UserRepository::find_by_id(user_id).await? {
             Some(model) => {
                 let mut active_model: AuthUserActiveModel = model.into();
-                if decrypted_email.is_some() {
-                    active_model.email = ActiveValue::Set(decrypted_email);
+                if let Some(email) = decrypted_email {
+                    active_model.email = ActiveValue::Set(Some(email));
                 }
-                if decrypted_phone.is_some() {
-                    active_model.phone = ActiveValue::Set(decrypted_phone);
+                if let Some(phone) = decrypted_phone {
+                    active_model.phone = ActiveValue::Set(Some(phone));
                 }
-                active_model.updated_at = ActiveValue::NotSet;
                 let result: AuthUserModel = UserRepository::update(active_model).await?;
                 Self::model_to_user_response(&result)
             }
@@ -241,7 +259,6 @@ impl AuthService {
                     PasswordUtil::hash_password(&decrypted_new_password);
                 let mut active_model: AuthUserActiveModel = model.into();
                 active_model.password_hash = ActiveValue::Set(new_password_hash);
-                active_model.updated_at = ActiveValue::NotSet;
                 UserRepository::update(active_model).await?;
                 Ok(())
             }
@@ -250,7 +267,7 @@ impl AuthService {
     }
 
     #[instrument_trace]
-    pub async fn approve_user(user_id: i32, approved: bool) -> Result<UserResponse, String> {
+    pub async fn update_user_status(user_id: i32, approved: bool) -> Result<UserResponse, String> {
         match UserRepository::find_by_id(user_id).await? {
             Some(model) => {
                 let mut active_model: AuthUserActiveModel = model.into();
@@ -260,7 +277,6 @@ impl AuthService {
                     UserStatus::Rejected.to_i16()
                 };
                 active_model.status = ActiveValue::Set(status);
-                active_model.updated_at = ActiveValue::NotSet;
                 let result: AuthUserModel = UserRepository::update(active_model).await?;
                 Self::model_to_user_response(&result)
             }
@@ -304,6 +320,17 @@ impl AuthService {
         }
     }
 
+    #[instrument_trace]
+    pub async fn delete_user(user_id: i32) -> Result<(), String> {
+        match UserRepository::find_by_id(user_id).await? {
+            Some(_) => {
+                UserRepository::delete_by_id(user_id).await?;
+                Ok(())
+            }
+            None => Err("User not found".to_string()),
+        }
+    }
+
     #[instrument_trace]
     fn model_to_user_response(model: &AuthUserModel) -> Result<UserResponse, String> {
         let mut response: UserResponse = UserResponse::default();
diff --git a/application/service/auth/mod.rs b/application/service/auth/mod.rs
index 963758b3..d6060eca 100644
--- a/application/service/auth/mod.rs
+++ b/application/service/auth/mod.rs
@@ -3,14 +3,13 @@ mod r#impl;
 mod r#static;
 mod r#struct;
 
-pub use {r#const::*, r#struct::*};
+pub use {r#const::*, r#static::*, r#struct::*};
 
 use {
     super::*,
     mapper::auth::user::*,
     model::{application::order::*, request::auth::*, response::auth::*},
     repository::auth::*,
-    r#static::*,
     utils::crypto::*,
 };
 
@@ -23,6 +22,7 @@ use std::{
 
 use {
     md5::compute,
+    once_cell::sync::Lazy,
     regex::Regex,
     rsa::RsaPrivateKey,
     sea_orm::ActiveValue,
diff --git a/application/service/auth/static.rs b/application/service/auth/static.rs
index cba01b53..d851f796 100644
--- a/application/service/auth/static.rs
+++ b/application/service/auth/static.rs
@@ -1,3 +1,7 @@
 use super::*;
 
 pub(super) static AUTH_SERVICE: OnceLock<AuthService> = OnceLock::new();
+pub static EMAIL_REGEX: Lazy<Option<Regex>> =
+    Lazy::new(|| Regex::new(r"^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$").ok());
+pub static PHONE_REGEX_OPT: Lazy<Option<Regex>> =
+    Lazy::new(|| Regex::new(r"^\+?[1-9]\d{1,14}$").ok());
diff --git a/application/service/blog/impl.rs b/application/service/blog/impl.rs
new file mode 100644
index 00000000..5acb3594
--- /dev/null
+++ b/application/service/blog/impl.rs
@@ -0,0 +1,634 @@
+use super::*;
+
+impl BlogService {
+    #[instrument_trace]
+    pub async fn create_post(
+        user_id: i32,
+        request: CreateBlogPostRequest,
+    ) -> Result<BlogPostResponse, String> {
+        let cover_image_id: i32 = match request.try_get_cover_image_id() {
+            Some(encoded_id) => AuthService::decode_id(encoded_id).unwrap_or(0),
+            None => 0,
+        };
+        let active_model: BlogPostActiveModel = BlogPostActiveModel {
+            user_id: ActiveValue::Set(user_id),
+            title: ActiveValue::Set(request.get_title().clone()),
+            summary: ActiveValue::Set(request.try_get_summary().clone()),
+            content: ActiveValue::Set(request.get_content().clone()),
+            cover_image_id: ActiveValue::Set(cover_image_id),
+            is_published: ActiveValue::Set(request.get_is_published()),
+            is_deleted: ActiveValue::Set(false),
+            view_count: ActiveValue::Set(0),
+            like_count: ActiveValue::Set(0),
+            favorite_count: ActiveValue::Set(0),
+            comment_count: ActiveValue::Set(0),
+            id: ActiveValue::NotSet,
+            created_at: ActiveValue::NotSet,
+            updated_at: ActiveValue::NotSet,
+        };
+        let model: BlogPostModel = BlogPostRepository::insert(active_model).await?;
+        let post_id: i32 = model.get_id();
+        let image_ids: Vec<i32> = request
+            .get_image_ids()
+            .iter()
+            .map(|encoded_id: &String| AuthService::decode_id(encoded_id))
+            .collect::<Result<Vec<i32>, String>>()?;
+        for image_id in image_ids {
+            let _: Result<(), String> =
+                BlogImageRepository::update_post_id(image_id, post_id).await;
+        }
+        let response: BlogPostResponse =
+            Self::model_to_post_response(&model, user_id, false).await?;
+        Ok(response)
+    }
+
+    #[instrument_trace]
+    pub async fn update_post(
+        post_id: i32,
+        user_id: i32,
+        request: UpdateBlogPostRequest,
+    ) -> Result<BlogPostResponse, String> {
+        let model: BlogPostModel = BlogPostRepository::find_by_id(post_id)
+            .await?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        if model.get_user_id() != user_id {
+            return Err("You can only update your own posts".to_string());
+        }
+        let mut active_model: BlogPostActiveModel = BlogPostActiveModel {
+            id: ActiveValue::NotSet,
+            user_id: ActiveValue::NotSet,
+            title: ActiveValue::NotSet,
+            summary: ActiveValue::NotSet,
+            content: ActiveValue::NotSet,
+            cover_image_id: ActiveValue::NotSet,
+            is_published: ActiveValue::NotSet,
+            is_deleted: ActiveValue::NotSet,
+            view_count: ActiveValue::NotSet,
+            like_count: ActiveValue::NotSet,
+            favorite_count: ActiveValue::NotSet,
+            comment_count: ActiveValue::NotSet,
+            created_at: ActiveValue::NotSet,
+            updated_at: ActiveValue::NotSet,
+        };
+        if let Some(title) = request.try_get_title() {
+            active_model.title = ActiveValue::Set(title.clone());
+        }
+        if let Some(summary) = request.try_get_summary() {
+            active_model.summary = ActiveValue::Set(Some(summary.clone()));
+        }
+        if let Some(content) = request.try_get_content() {
+            active_model.content = ActiveValue::Set(content.clone());
+        }
+        if let Some(cover_image_id_str) = request.try_get_cover_image_id() {
+            let decoded_id: i32 = AuthService::decode_id(cover_image_id_str).unwrap_or(0);
+            active_model.cover_image_id = ActiveValue::Set(decoded_id);
+        }
+        if let Some(is_published) = request.try_get_is_published() {
+            active_model.is_published = ActiveValue::Set(is_published);
+        }
+        let updated_model: BlogPostModel =
+            BlogPostRepository::update(post_id, active_model).await?;
+        let response: BlogPostResponse =
+            Self::model_to_post_response(&updated_model, user_id, false).await?;
+        Ok(response)
+    }
+
+    #[instrument_trace]
+    pub async fn delete_post(post_id: i32, user_id: i32) -> Result<(), String> {
+        let model: BlogPostModel = BlogPostRepository::find_by_id(post_id)
+            .await?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        if model.get_user_id() != user_id {
+            return Err("You can only delete your own posts".to_string());
+        }
+        BlogPostRepository::soft_delete_by_id(post_id).await
+    }
+
+    #[instrument_trace]
+    pub async fn get_post(
+        post_id: i32,
+        current_user_id: Option<i32>,
+    ) -> Result<Option<BlogPostResponse>, String> {
+        match BlogPostRepository::find_by_id(post_id).await? {
+            Some(model) => {
+                if !model.get_is_published() {
+                    if let Some(user_id) = current_user_id {
+                        if model.get_user_id() != user_id {
+                            return Ok(None);
+                        }
+                    } else {
+                        return Ok(None);
+                    }
+                }
+                BlogPostRepository::increment_view_count(post_id).await?;
+                let mut response: BlogPostResponse =
+                    Self::model_to_post_response(&model, current_user_id.unwrap_or(0), true)
+                        .await?;
+                response.set_view_count(model.get_view_count() + 1);
+                Ok(Some(response))
+            }
+            None => Ok(None),
+        }
+    }
+
+    #[instrument_trace]
+    pub async fn list_posts(
+        query: BlogPostListQueryRequest,
+        current_user_id: Option<i32>,
+    ) -> Result<BlogPostListResponse, String> {
+        let page: i32 = query.get_page().unwrap_or(1).max(1);
+        let limit: u64 = query.get_limit().unwrap_or(20).min(100);
+        let mut repository_query: BlogPostQuery = BlogPostQuery::default();
+        repository_query
+            .set_keyword(query.try_get_keyword().clone())
+            .set_is_published(query.try_get_is_published())
+            .set_page(page)
+            .set_limit(limit);
+        let (models, total): (Vec<BlogPostModel>, i64) =
+            BlogPostRepository::query_with_pagination(repository_query).await?;
+        let mut posts: Vec<BlogPostResponse> = Vec::new();
+        for model in models {
+            let user_id: i32 = current_user_id.unwrap_or(0);
+            let response: BlogPostResponse =
+                Self::model_to_post_response(&model, user_id, false).await?;
+            posts.push(response);
+        }
+        let mut response: BlogPostListResponse = BlogPostListResponse::default();
+        response
+            .set_posts(posts)
+            .set_total(total)
+            .set_page(page)
+            .set_limit(limit);
+        Ok(response)
+    }
+
+    #[instrument_trace]
+    pub async fn list_my_posts(
+        user_id: i32,
+        query: BlogPostListQueryRequest,
+    ) -> Result<BlogPostListResponse, String> {
+        let page: i32 = query.get_page().unwrap_or(1).max(1);
+        let limit: u64 = query.get_limit().unwrap_or(20).min(100);
+        let mut repository_query: BlogPostQuery = BlogPostQuery::default();
+        repository_query
+            .set_user_id(Some(user_id))
+            .set_keyword(query.try_get_keyword().clone())
+            .set_page(page)
+            .set_limit(limit);
+        let (models, total): (Vec<BlogPostModel>, i64) =
+            BlogPostRepository::query_with_pagination(repository_query).await?;
+        let mut posts: Vec<BlogPostResponse> = Vec::new();
+        for model in models {
+            let response: BlogPostResponse =
+                Self::model_to_post_response(&model, user_id, false).await?;
+            posts.push(response);
+        }
+        let mut response: BlogPostListResponse = BlogPostListResponse::default();
+        response
+            .set_posts(posts)
+            .set_total(total)
+            .set_page(page)
+            .set_limit(limit);
+        Ok(response)
+    }
+
+    #[instrument_trace]
+    pub async fn toggle_like(post_id: i32, user_id: i32) -> Result<BlogLikeStatusResponse, String> {
+        let post: BlogPostModel = BlogPostRepository::find_by_id(post_id)
+            .await?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        match BlogLikeRepository::find_by_post_and_user(post_id, user_id).await? {
+            Some(_) => {
+                BlogLikeRepository::delete_by_post_and_user(post_id, user_id).await?;
+                BlogPostRepository::update_like_count(post_id, -1).await?;
+                let mut response: BlogLikeStatusResponse = BlogLikeStatusResponse::default();
+                response
+                    .set_liked(false)
+                    .set_like_count((post.get_like_count() - 1).max(0));
+                Ok(response)
+            }
+            None => {
+                let active_model: BlogLikeActiveModel = BlogLikeActiveModel {
+                    post_id: ActiveValue::Set(post_id),
+                    user_id: ActiveValue::Set(user_id),
+                    id: ActiveValue::NotSet,
+                    created_at: ActiveValue::NotSet,
+                };
+                BlogLikeRepository::insert(active_model).await?;
+                BlogPostRepository::update_like_count(post_id, 1).await?;
+                let mut response: BlogLikeStatusResponse = BlogLikeStatusResponse::default();
+                response
+                    .set_liked(true)
+                    .set_like_count(post.get_like_count() + 1);
+                Ok(response)
+            }
+        }
+    }
+
+    #[instrument_trace]
+    pub async fn list_favorite_posts(
+        user_id: i32,
+        query: BlogPostListQueryRequest,
+    ) -> Result<BlogPostListResponse, String> {
+        let page: i32 = query.get_page().unwrap_or(1).max(1);
+        let limit: u64 = query.get_limit().unwrap_or(20).min(100);
+        let (favorite_models, total): (Vec<BlogFavoriteModel>, i64) =
+            BlogFavoriteRepository::find_by_user_id(user_id, page, limit).await?;
+        let mut posts: Vec<BlogPostResponse> = Vec::new();
+        for favorite_model in favorite_models {
+            if let Some(post_model) =
+                BlogPostRepository::find_by_id(favorite_model.get_post_id()).await?
+            {
+                if post_model.get_is_deleted() {
+                    continue;
+                }
+                let response: BlogPostResponse =
+                    Self::model_to_post_response(&post_model, user_id, false).await?;
+                posts.push(response);
+            }
+        }
+        let mut response: BlogPostListResponse = BlogPostListResponse::default();
+        response
+            .set_posts(posts)
+            .set_total(total)
+            .set_page(page)
+            .set_limit(limit);
+        Ok(response)
+    }
+
+    #[instrument_trace]
+    pub async fn toggle_favorite(
+        post_id: i32,
+        user_id: i32,
+    ) -> Result<BlogFavoriteStatusResponse, String> {
+        let post: BlogPostModel = BlogPostRepository::find_by_id(post_id)
+            .await?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        match BlogFavoriteRepository::find_by_post_and_user(post_id, user_id).await? {
+            Some(_) => {
+                BlogFavoriteRepository::delete_by_post_and_user(post_id, user_id).await?;
+                BlogPostRepository::update_favorite_count(post_id, -1).await?;
+                let mut response: BlogFavoriteStatusResponse =
+                    BlogFavoriteStatusResponse::default();
+                response
+                    .set_favorited(false)
+                    .set_favorite_count((post.get_favorite_count() - 1).max(0));
+                Ok(response)
+            }
+            None => {
+                let active_model: BlogFavoriteActiveModel = BlogFavoriteActiveModel {
+                    post_id: ActiveValue::Set(post_id),
+                    user_id: ActiveValue::Set(user_id),
+                    id: ActiveValue::NotSet,
+                    created_at: ActiveValue::NotSet,
+                };
+                BlogFavoriteRepository::insert(active_model).await?;
+                BlogPostRepository::update_favorite_count(post_id, 1).await?;
+                let mut response: BlogFavoriteStatusResponse =
+                    BlogFavoriteStatusResponse::default();
+                response
+                    .set_favorited(true)
+                    .set_favorite_count(post.get_favorite_count() + 1);
+                Ok(response)
+            }
+        }
+    }
+
+    #[instrument_trace]
+    pub async fn create_comment(
+        user_id: i32,
+        request: CreateBlogCommentRequest,
+    ) -> Result<BlogCommentResponse, String> {
+        let post_id: i32 = AuthService::decode_id(request.get_post_id())?;
+        let _: BlogPostModel = BlogPostRepository::find_by_id(post_id)
+            .await?
+            .ok_or_else(|| "Blog post not found".to_string())?;
+        let parent_id: i32 = match request.try_get_parent_id() {
+            Some(parent_id_str) => AuthService::decode_id(parent_id_str).unwrap_or(0),
+            None => 0,
+        };
+        if parent_id > 0
+            && BlogCommentRepository::find_by_id(parent_id)
+                .await?
+                .is_none()
+        {
+            return Err("Parent comment not found".to_string());
+        }
+        let active_model: BlogCommentActiveModel = BlogCommentActiveModel {
+            post_id: ActiveValue::Set(post_id),
+            user_id: ActiveValue::Set(user_id),
+            parent_id: ActiveValue::Set(parent_id),
+            content: ActiveValue::Set(request.get_content().clone()),
+            is_deleted: ActiveValue::Set(false),
+            id: ActiveValue::NotSet,
+            created_at: ActiveValue::NotSet,
+            updated_at: ActiveValue::NotSet,
+        };
+        let model: BlogCommentModel = BlogCommentRepository::insert(active_model).await?;
+        BlogPostRepository::update_comment_count(post_id, 1).await?;
+        let response: BlogCommentResponse = Self::model_to_comment_response(&model).await?;
+        Ok(response)
+    }
+
+    #[instrument_trace]
+    pub async fn delete_comment(comment_id: i32, user_id: i32) -> Result<(), String> {
+        let model: BlogCommentModel = BlogCommentRepository::find_by_id(comment_id)
+            .await?
+            .ok_or_else(|| "Comment not found".to_string())?;
+        if model.get_user_id() != user_id {
+            return Err("You can only delete your own comments".to_string());
+        }
+        BlogCommentRepository::soft_delete_by_id(comment_id).await?;
+        BlogPostRepository::update_comment_count(model.get_post_id(), -1).await?;
+        Ok(())
+    }
+
+    #[instrument_trace]
+    pub async fn list_comments(
+        query: BlogCommentListQueryRequest,
+    ) -> Result<BlogCommentListResponse, String> {
+        let post_id: i32 = AuthService::decode_id(query.get_post_id())?;
+        let page: i32 = query.get_page().unwrap_or(1).max(1);
+        let limit: u64 = query.get_limit().unwrap_or(50).min(100);
+        let repository_query: BlogCommentQuery = BlogCommentQuery {
+            post_id,
+            page,
+            limit,
+        };
+        let (models, total): (Vec<BlogCommentModel>, i64) =
+            BlogCommentRepository::query_by_post_id(repository_query).await?;
+        let mut comment_map: HashMap<i32, BlogCommentModel> = HashMap::new();
+        let mut children_map: HashMap<i32, Vec<i32>> = HashMap::new();
+        let mut root_ids: Vec<i32> = Vec::new();
+        for model in &models {
+            let id: i32 = model.get_id();
+            let parent_id: i32 = model.get_parent_id();
+            comment_map.insert(id, model.clone());
+            if parent_id > 0 {
+                children_map.entry(parent_id).or_default().push(id);
+            } else {
+                root_ids.push(id);
+            }
+        }
+        let mut top_level_comments: Vec<BlogCommentResponse> = Vec::new();
+        for root_id in root_ids {
+            if let Some(model) = comment_map.get(&root_id) {
+                let mut response: BlogCommentResponse =
+                    Self::model_to_comment_response(model).await?;
+                let replies: Vec<BlogCommentResponse> =
+                    Self::build_reply_tree(root_id, &comment_map, &children_map)?;
+                response.set_replies(replies);
+                top_level_comments.push(response);
+            }
+        }
+        let mut response: BlogCommentListResponse = BlogCommentListResponse::default();
+        response
+            .set_comments(top_level_comments)
+            .set_total(total)
+            .set_page(page)
+            .set_limit(limit);
+        Ok(response)
+    }
+
+    fn build_reply_tree(
+        parent_id: i32,
+        comment_map: &HashMap<i32, BlogCommentModel>,
+        children_map: &HashMap<i32, Vec<i32>>,
+    ) -> Result<Vec<BlogCommentResponse>, String> {
+        let mut replies: Vec<BlogCommentResponse> = Vec::new();
+        if let Some(child_ids) = children_map.get(&parent_id) {
+            for child_id in child_ids {
+                if let Some(model) = comment_map.get(child_id) {
+                    let mut response: BlogCommentResponse =
+                        Self::model_to_comment_response_sync(model)?;
+                    let nested_replies: Vec<BlogCommentResponse> =
+                        Self::build_reply_tree(*child_id, comment_map, children_map)?;
+                    response.set_replies(nested_replies);
+                    replies.push(response);
+                }
+            }
+        }
+        Ok(replies)
+    }
+
+    #[instrument_trace]
+    pub async fn upload_image(
+        user_id: i32,
+        file_name: String,
+        original_name: Option<String>,
+        mime_type: String,
+        file_data: Vec<u8>,
+    ) -> Result<BlogImageResponse, String> {
+        let file_size: i32 = file_data.len() as i32;
+        let active_model: BlogImageActiveModel = BlogImageActiveModel {
+            post_id: ActiveValue::Set(0),
+            user_id: ActiveValue::Set(user_id),
+            file_name: ActiveValue::Set(file_name),
+            original_name: ActiveValue::Set(original_name),
+            mime_type: ActiveValue::Set(mime_type),
+            file_size: ActiveValue::Set(file_size),
+            file_data: ActiveValue::Set(file_data),
+            id: ActiveValue::NotSet,
+            created_at: ActiveValue::NotSet,
+        };
+        let result: BlogImageModel = BlogImageRepository::insert(active_model).await?;
+        Self::model_to_image_response(&result, 0)
+    }
+
+    #[instrument_trace]
+    pub async fn get_image_data(image_id: i32) -> Result<Option<BlogImageDataResponse>, String> {
+        match BlogImageRepository::find_by_id(image_id).await? {
+            Some(model) => {
+                let mut response: BlogImageDataResponse = BlogImageDataResponse::default();
+                response
+                    .set_id(AuthService::encode_id(model.get_id()).unwrap_or_default())
+                    .set_post_id(AuthService::encode_id(model.get_post_id()).unwrap_or_default())
+                    .set_file_name(model.get_file_name().clone())
+                    .set_original_name(model.try_get_original_name().clone())
+                    .set_mime_type(model.get_mime_type().clone())
+                    .set_file_data(model.get_file_data().clone());
+                Ok(Some(response))
+            }
+            None => Ok(None),
+        }
+    }
+
+    #[instrument_trace]
+    async fn model_to_post_response(
+        model: &BlogPostModel,
+        current_user_id: i32,
+        include_content: bool,
+    ) -> Result<BlogPostResponse, String> {
+        let encoded_id: String = AuthService::encode_id(model.get_id()).unwrap_or_default();
+        let encoded_user_id: String =
+            AuthService::encode_id(model.get_user_id()).unwrap_or_default();
+        let username: Option<String> = UserRepository::find_by_id(model.get_user_id())
+            .await?
+            .map(|user| user.get_username().clone());
+        let cover_image: Option<BlogImageResponse> = if model.get_cover_image_id() > 0 {
+            match BlogImageRepository::find_by_id(model.get_cover_image_id()).await? {
+                Some(image_model) => {
+                    Some(Self::model_to_image_response(&image_model, model.get_id())?)
+                }
+                None => None,
+            }
+        } else {
+            None
+        };
+        let is_liked: bool = if current_user_id > 0 {
+            BlogLikeRepository::find_by_post_and_user(model.get_id(), current_user_id)
+                .await?
+                .is_some()
+        } else {
+            false
+        };
+        let is_favorited: bool = if current_user_id > 0 {
+            BlogFavoriteRepository::find_by_post_and_user(model.get_id(), current_user_id)
+                .await?
+                .is_some()
+        } else {
+            false
+        };
+        let images: Vec<BlogImageResponse> =
+            match BlogImageRepository::find_by_post_id(model.get_id()).await {
+                Ok(image_models) => {
+                    let mut responses: Vec<BlogImageResponse> = Vec::new();
+                    for image_model in image_models {
+                        if let Ok(response) =
+                            Self::model_to_image_response(&image_model, model.get_id())
+                        {
+                            responses.push(response);
+                        }
+                    }
+                    responses
+                }
+                Err(_) => Vec::new(),
+            };
+        let created_at: i64 = model
+            .try_get_created_at()
+            .map(|dt: NaiveDateTime| dt.and_utc().timestamp_millis())
+            .unwrap_or(0);
+        let updated_at: i64 = model
+            .try_get_updated_at()
+            .map(|dt: NaiveDateTime| dt.and_utc().timestamp_millis())
+            .unwrap_or(0);
+        let mut response: BlogPostResponse = BlogPostResponse::default();
+        response
+            .set_id(encoded_id)
+            .set_user_id(encoded_user_id)
+            .set_username(username)
+            .set_title(model.get_title().clone())
+            .set_summary(model.try_get_summary().clone())
+            .set_content(if include_content {
+                model.get_content().clone()
+            } else {
+                String::new()
+            })
+            .set_cover_image(cover_image)
+            .set_images(images)
+            .set_is_published(model.get_is_published())
+            .set_view_count(model.get_view_count())
+            .set_like_count(model.get_like_count())
+            .set_favorite_count(model.get_favorite_count())
+            .set_comment_count(model.get_comment_count())
+            .set_is_liked(is_liked)
+            .set_is_favorited(is_favorited)
+            .set_created_at(created_at)
+            .set_updated_at(updated_at);
+        Ok(response)
+    }
+
+    #[instrument_trace]
+    async fn model_to_comment_response(
+        model: &BlogCommentModel,
+    ) -> Result<BlogCommentResponse, String> {
+        let encoded_id: String = AuthService::encode_id(model.get_id()).unwrap_or_default();
+        let encoded_post_id: String =
+            AuthService::encode_id(model.get_post_id()).unwrap_or_default();
+        let encoded_user_id: String =
+            AuthService::encode_id(model.get_user_id()).unwrap_or_default();
+        let username: String = match UserRepository::find_by_id(model.get_user_id()).await? {
+            Some(user) => user.get_username().clone(),
+            None => "Unknown".to_string(),
+        };
+        let parent_id: Option<String> = if model.get_parent_id() > 0 {
+            Some(AuthService::encode_id(model.get_parent_id()).unwrap_or_default())
+        } else {
+            None
+        };
+        let created_at: i64 = model
+            .try_get_created_at()
+            .map(|dt: NaiveDateTime| dt.and_utc().timestamp_millis())
+            .unwrap_or(0);
+        let mut response: BlogCommentResponse = BlogCommentResponse::default();
+        response
+            .set_id(encoded_id)
+            .set_post_id(encoded_post_id)
+            .set_user_id(encoded_user_id)
+            .set_username(username)
+            .set_parent_id(parent_id)
+            .set_content(model.get_content().clone())
+            .set_created_at(created_at)
+            .set_replies(Vec::new());
+        Ok(response)
+    }
+
+    fn model_to_comment_response_sync(
+        model: &BlogCommentModel,
+    ) -> Result<BlogCommentResponse, String> {
+        let encoded_id: String = AuthService::encode_id(model.get_id()).unwrap_or_default();
+        let encoded_post_id: String =
+            AuthService::encode_id(model.get_post_id()).unwrap_or_default();
+        let encoded_user_id: String =
+            AuthService::encode_id(model.get_user_id()).unwrap_or_default();
+        let username: String = "Unknown".to_string();
+        let parent_id: Option<String> = if model.get_parent_id() > 0 {
+            Some(AuthService::encode_id(model.get_parent_id()).unwrap_or_default())
+        } else {
+            None
+        };
+        let created_at: i64 = model
+            .try_get_created_at()
+            .map(|dt: NaiveDateTime| dt.and_utc().timestamp_millis())
+            .unwrap_or(0);
+        let mut response: BlogCommentResponse = BlogCommentResponse::default();
+        response
+            .set_id(encoded_id)
+            .set_post_id(encoded_post_id)
+            .set_user_id(encoded_user_id)
+            .set_username(username)
+            .set_parent_id(parent_id)
+            .set_content(model.get_content().clone())
+            .set_created_at(created_at)
+            .set_replies(Vec::new());
+        Ok(response)
+    }
+
+    #[instrument_trace]
+    fn model_to_image_response(
+        model: &BlogImageModel,
+        post_id: i32,
+    ) -> Result<BlogImageResponse, String> {
+        let created_at: i64 = model
+            .try_get_created_at()
+            .map(|dt: NaiveDateTime| dt.and_utc().timestamp_millis())
+            .unwrap_or(0);
+        let mut response: BlogImageResponse = BlogImageResponse::default();
+        let encoded_id: String = AuthService::encode_id(model.get_id()).unwrap_or_default();
+        let encoded_post_id: String = AuthService::encode_id(post_id).unwrap_or_default();
+        let encoded_user_id: String =
+            AuthService::encode_id(model.get_user_id()).unwrap_or_default();
+        let download_url: String = format!("/api/blog/image/download/{}", encoded_id);
+        response
+            .set_id(encoded_id)
+            .set_post_id(encoded_post_id)
+            .set_user_id(encoded_user_id)
+            .set_file_name(model.get_file_name().clone())
+            .set_original_name(model.try_get_original_name().clone())
+            .set_mime_type(model.get_mime_type().clone())
+            .set_file_size(model.get_file_size())
+            .set_created_at(created_at)
+            .set_download_url(download_url);
+        Ok(response)
+    }
+}
diff --git a/application/service/blog/mod.rs b/application/service/blog/mod.rs
new file mode 100644
index 00000000..fefdc4f8
--- /dev/null
+++ b/application/service/blog/mod.rs
@@ -0,0 +1,16 @@
+mod r#impl;
+mod r#struct;
+
+pub use r#struct::*;
+
+use {
+    super::*,
+    mapper::blog::{comment::*, favorite::*, image::*, like::*, post::*},
+    model::{request::blog::*, response::blog::*},
+    repository::{auth::*, blog::*},
+    service::auth::*,
+};
+
+use {chrono::NaiveDateTime, sea_orm::ActiveValue};
+
+use std::collections::HashMap;
diff --git a/application/service/blog/struct.rs b/application/service/blog/struct.rs
new file mode 100644
index 00000000..a11324be
--- /dev/null
+++ b/application/service/blog/struct.rs
@@ -0,0 +1,4 @@
+use super::*;
+
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogService;
diff --git a/application/service/mod.rs b/application/service/mod.rs
index c9d740f3..2977947d 100644
--- a/application/service/mod.rs
+++ b/application/service/mod.rs
@@ -1,4 +1,5 @@
 pub mod auth;
+pub mod blog;
 pub mod chat;
 pub mod cicd;
 pub mod dataset;
@@ -14,6 +15,7 @@ pub mod shortlink;
 pub mod trace;
 pub mod tracking;
 pub mod upload;
+pub mod user;
 pub mod websocket;
 
 use super::*;
diff --git a/application/service/user/impl.rs b/application/service/user/impl.rs
new file mode 100644
index 00000000..8f8dfe9b
--- /dev/null
+++ b/application/service/user/impl.rs
@@ -0,0 +1,160 @@
+use super::*;
+
+impl UserService {
+    #[instrument_trace]
+    pub async fn get_user(user_id: i32) -> Result<Option<UserResponse>, String> {
+        match UserRepository::find_by_id(user_id).await? {
+            Some(model) => Ok(Some(Self::model_to_user_response(&model)?)),
+            None => Ok(None),
+        }
+    }
+
+    #[instrument_trace]
+    pub async fn list_users(query: UserListQueryRequest) -> Result<UserListResponse, String> {
+        let limit: u64 = query.get_limit().unwrap_or(20);
+        let keyword: Option<String> = query.try_get_keyword().clone();
+        let last_id: Option<i32> = query
+            .try_get_last_id()
+            .as_ref()
+            .map(|id: &String| AuthService::decode_id(id))
+            .transpose()?;
+        let (paged_users, total_count, has_more) =
+            UserRepository::query_with_pagination(keyword, last_id, limit).await?;
+        let encoded_last_id: Option<String> = paged_users
+            .last()
+            .map(|u: &UserModel| AuthService::encode_id(u.get_id()))
+            .transpose()?;
+        let user_responses: Vec<UserResponse> = paged_users
+            .iter()
+            .map(Self::model_to_user_response)
+            .collect::<Result<Vec<UserResponse>, String>>()?;
+        let mut response: UserListResponse = UserListResponse::default();
+        response
+            .set_users(user_responses)
+            .set_has_more(has_more)
+            .set_last_id(encoded_last_id)
+            .set_total_count(total_count);
+        Ok(response)
+    }
+
+    #[instrument_trace]
+    pub async fn update_user(
+        user_id: i32,
+        request: UpdateUserRequest,
+    ) -> Result<UserResponse, String> {
+        match UserRepository::find_by_id(user_id).await? {
+            Some(model) => {
+                let mut active_model: UserActiveModel = model.into();
+                if let Some(email) = request.try_get_email() {
+                    if !email.is_empty() && !Self::validate_email(email) {
+                        return Err("Invalid email format".to_string());
+                    }
+                    active_model.email = ActiveValue::Set(Some(email.clone()));
+                }
+                if let Some(phone) = request.try_get_phone() {
+                    if !phone.is_empty() && !Self::validate_phone(phone) {
+                        return Err("Invalid phone format".to_string());
+                    }
+                    active_model.phone = ActiveValue::Set(Some(phone.clone()));
+                }
+                let result: UserModel = UserRepository::update(active_model).await?;
+                Self::model_to_user_response(&result)
+            }
+            None => Err("User not found".to_string()),
+        }
+    }
+
+    #[instrument_trace]
+    fn validate_email(email: &str) -> bool {
+        match EMAIL_REGEX.as_ref() {
+            Some(regex) => regex.is_match(email),
+            None => false,
+        }
+    }
+
+    #[instrument_trace]
+    fn validate_phone(phone: &str) -> bool {
+        match PHONE_REGEX_OPT.as_ref() {
+            Some(regex) => regex.is_match(phone),
+            None => false,
+        }
+    }
+
+    #[instrument_trace]
+    pub async fn update_user_status(user_id: i32, approved: bool) -> Result<UserResponse, String> {
+        match UserRepository::find_by_id(user_id).await? {
+            Some(model) => {
+                let target_role: UserRole = UserRole::try_from(model.get_role())?;
+                if !approved && target_role.is_admin() {
+                    return Err("Cannot reject an admin user".to_string());
+                }
+                let mut active_model: UserActiveModel = model.into();
+                let status: i16 = if approved {
+                    UserStatus::Approved.to_i16()
+                } else {
+                    UserStatus::Rejected.to_i16()
+                };
+                active_model.status = ActiveValue::Set(status);
+                let result: UserModel = UserRepository::update(active_model).await?;
+                Self::model_to_user_response(&result)
+            }
+            None => Err("User not found".to_string()),
+        }
+    }
+
+    #[instrument_trace]
+    pub async fn change_password(
+        user_id: i32,
+        request: ChangePasswordRequest,
+    ) -> Result<(), String> {
+        match UserRepository::find_by_id(user_id).await? {
+            Some(model) => {
+                let valid: bool = PasswordUtil::verify_password(
+                    request.get_old_password(),
+                    model.get_password_hash(),
+                );
+                if !valid {
+                    return Err("Old password is incorrect".to_string());
+                }
+                let new_password_hash: String =
+                    PasswordUtil::hash_password(request.get_new_password());
+                let mut active_model: UserActiveModel = model.into();
+                active_model.password_hash = ActiveValue::Set(new_password_hash);
+                UserRepository::update(active_model).await?;
+                Ok(())
+            }
+            None => Err("User not found".to_string()),
+        }
+    }
+
+    #[instrument_trace]
+    pub async fn delete_user(user_id: i32) -> Result<(), String> {
+        match UserRepository::find_by_id(user_id).await? {
+            Some(_) => {
+                UserRepository::delete_by_id(user_id).await?;
+                Ok(())
+            }
+            None => Err("User not found".to_string()),
+        }
+    }
+
+    #[instrument_trace]
+    fn model_to_user_response(model: &UserModel) -> Result<UserResponse, String> {
+        let mut response: UserResponse = UserResponse::default();
+        let created_at: Option<i64> = model
+            .try_get_created_at()
+            .map(|dt| dt.and_utc().timestamp_millis());
+        let role: UserRole = UserRole::try_from(model.get_role()).unwrap_or_default();
+        let status: UserStatus = UserStatus::try_from(model.get_status()).unwrap_or_default();
+        let encoded_id: String = AuthService::encode_id(model.get_id())?;
+        response
+            .set_id(encoded_id)
+            .set_username(model.get_username().clone())
+            .set_email(model.try_get_email().clone())
+            .set_phone(model.try_get_phone().clone())
+            .set_role(role.as_str().to_string())
+            .set_status(status.as_str().to_string())
+            .set_created_at(created_at);
+        Ok(response)
+    }
+}
diff --git a/application/service/user/mod.rs b/application/service/user/mod.rs
new file mode 100644
index 00000000..acf97e75
--- /dev/null
+++ b/application/service/user/mod.rs
@@ -0,0 +1,14 @@
+mod r#impl;
+mod r#struct;
+
+pub use r#struct::*;
+
+use {
+    super::*,
+    mapper::user::*,
+    model::{request::user::*, response::user::*},
+    repository::user::*,
+    service::auth::*,
+};
+
+use sea_orm::ActiveValue;
diff --git a/application/service/user/struct.rs b/application/service/user/struct.rs
new file mode 100644
index 00000000..18d0946f
--- /dev/null
+++ b/application/service/user/struct.rs
@@ -0,0 +1,4 @@
+use super::*;
+
+#[derive(Clone, Data, Debug, Default)]
+pub struct UserService;
diff --git a/application/view/blog/fn.rs b/application/view/blog/fn.rs
new file mode 100644
index 00000000..06505bf4
--- /dev/null
+++ b/application/view/blog/fn.rs
@@ -0,0 +1,14 @@
+use super::*;
+
+#[utoipa::path(
+    get,
+    path = "/blog",
+    responses(
+        (status = 200, description = "Success"),
+        (status = 400, description = "Bad Request"),
+        (status = 404, description = "Not Found"),
+        (status = 500, description = "Internal Server Error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_blog_view() {}
diff --git a/application/view/blog/impl.rs b/application/view/blog/impl.rs
new file mode 100644
index 00000000..1ad37102
--- /dev/null
+++ b/application/view/blog/impl.rs
@@ -0,0 +1,22 @@
+use super::*;
+
+impl ServerHook for BlogViewRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        methods(get, post),
+        response_status_code(302),
+        response_header(LOCATION => "/static/blog/index.html")
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let is_authenticated: bool = ctx.get_request().try_get_cookie(TOKEN).is_some();
+        if !is_authenticated {
+            ctx.get_mut_response()
+                .set_header(LOCATION, format!("/auth?{LOCATION}=/blog"));
+        }
+    }
+}
diff --git a/application/view/blog/mod.rs b/application/view/blog/mod.rs
new file mode 100644
index 00000000..5316cde2
--- /dev/null
+++ b/application/view/blog/mod.rs
@@ -0,0 +1,7 @@
+mod r#fn;
+mod r#impl;
+mod r#struct;
+
+pub use {r#fn::*, r#struct::*};
+
+use super::*;
diff --git a/application/view/blog/struct.rs b/application/view/blog/struct.rs
new file mode 100644
index 00000000..5715e726
--- /dev/null
+++ b/application/view/blog/struct.rs
@@ -0,0 +1,5 @@
+use super::*;
+
+#[route("/blog")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct BlogViewRoute;
diff --git a/application/view/mod.rs b/application/view/mod.rs
index aa009da9..4ce05f7c 100644
--- a/application/view/mod.rs
+++ b/application/view/mod.rs
@@ -1,4 +1,5 @@
 pub mod auth;
+pub mod blog;
 pub mod chat;
 pub mod cicd;
 pub mod diff;
@@ -15,5 +16,6 @@ pub mod static_resource;
 pub mod trace;
 pub mod tracking;
 pub mod upload;
+pub mod user;
 
 use super::*;
diff --git a/application/view/user/fn.rs b/application/view/user/fn.rs
new file mode 100644
index 00000000..b552119d
--- /dev/null
+++ b/application/view/user/fn.rs
@@ -0,0 +1,14 @@
+use super::*;
+
+#[utoipa::path(
+    get,
+    path = "/user",
+    responses(
+        (status = 200, description = "Success"),
+        (status = 400, description = "Bad Request"),
+        (status = 404, description = "Not Found"),
+        (status = 500, description = "Internal Server Error")
+    )
+)]
+#[instrument_trace]
+pub fn openapi_user_view() {}
diff --git a/application/view/user/impl.rs b/application/view/user/impl.rs
new file mode 100644
index 00000000..14b73e17
--- /dev/null
+++ b/application/view/user/impl.rs
@@ -0,0 +1,22 @@
+use super::*;
+
+impl ServerHook for UserViewRoute {
+    #[instrument_trace]
+    async fn new(_ctx: &mut Context) -> Self {
+        Self
+    }
+
+    #[prologue_macros(
+        methods(get, post),
+        response_status_code(302),
+        response_header(LOCATION => "/static/user/index.html")
+    )]
+    #[instrument_trace]
+    async fn handle(self, ctx: &mut Context) {
+        let is_authenticated: bool = ctx.get_request().try_get_cookie(TOKEN).is_some();
+        if !is_authenticated {
+            ctx.get_mut_response()
+                .set_header(LOCATION, format!("/auth?{LOCATION}=/user"));
+        }
+    }
+}
diff --git a/application/view/user/mod.rs b/application/view/user/mod.rs
new file mode 100644
index 00000000..5316cde2
--- /dev/null
+++ b/application/view/user/mod.rs
@@ -0,0 +1,7 @@
+mod r#fn;
+mod r#impl;
+mod r#struct;
+
+pub use {r#fn::*, r#struct::*};
+
+use super::*;
diff --git a/application/view/user/struct.rs b/application/view/user/struct.rs
new file mode 100644
index 00000000..c2be2a45
--- /dev/null
+++ b/application/view/user/struct.rs
@@ -0,0 +1,5 @@
+use super::*;
+
+#[route("/user")]
+#[derive(Clone, Copy, Data, Debug, Default)]
+pub struct UserViewRoute;
diff --git a/bootstrap/application/db/enum.rs b/bootstrap/application/db/enum.rs
index 4b852956..720fde48 100644
--- a/bootstrap/application/db/enum.rs
+++ b/bootstrap/application/db/enum.rs
@@ -11,4 +11,9 @@ pub enum PostgresqlTableName {
     Shortlink,
     Order,
     Notification,
+    BlogPost,
+    BlogComment,
+    BlogLike,
+    BlogFavorite,
+    BlogImage,
 }
diff --git a/bootstrap/application/db/impl.rs b/bootstrap/application/db/impl.rs
index a30e408a..712a8957 100644
--- a/bootstrap/application/db/impl.rs
+++ b/bootstrap/application/db/impl.rs
@@ -19,6 +19,11 @@ impl std::fmt::Display for PostgresqlTableName {
             PostgresqlTableName::Shortlink => write!(f, "shortlink"),
             PostgresqlTableName::Order => write!(f, "order"),
             PostgresqlTableName::Notification => write!(f, "notification"),
+            PostgresqlTableName::BlogPost => write!(f, "blog_post"),
+            PostgresqlTableName::BlogComment => write!(f, "blog_comment"),
+            PostgresqlTableName::BlogLike => write!(f, "blog_like"),
+            PostgresqlTableName::BlogFavorite => write!(f, "blog_favorite"),
+            PostgresqlTableName::BlogImage => write!(f, "blog_image"),
         }
     }
 }
@@ -94,6 +99,32 @@ impl DbBootstrap {
                 POSTGRESQL_NOTIFICATION_TABLE_SQL.to_string(),
             ))
             .add_index(POSTGRESQL_NOTIFICATION_INDEX_SQL.to_string())
+            .add_table(TableSchema::new(
+                vec![],
+                PostgresqlTableName::BlogPost.to_string(),
+                POSTGRESQL_BLOG_POST_TABLE_SQL.to_string(),
+            ))
+            .add_table(TableSchema::new(
+                vec![PostgresqlTableName::BlogPost.to_string()],
+                PostgresqlTableName::BlogComment.to_string(),
+                POSTGRESQL_BLOG_COMMENT_TABLE_SQL.to_string(),
+            ))
+            .add_table(TableSchema::new(
+                vec![PostgresqlTableName::BlogPost.to_string()],
+                PostgresqlTableName::BlogLike.to_string(),
+                POSTGRESQL_BLOG_LIKE_TABLE_SQL.to_string(),
+            ))
+            .add_table(TableSchema::new(
+                vec![PostgresqlTableName::BlogPost.to_string()],
+                PostgresqlTableName::BlogFavorite.to_string(),
+                POSTGRESQL_BLOG_FAVORITE_TABLE_SQL.to_string(),
+            ))
+            .add_table(TableSchema::new(
+                vec![PostgresqlTableName::BlogPost.to_string()],
+                PostgresqlTableName::BlogImage.to_string(),
+                POSTGRESQL_BLOG_IMAGE_TABLE_SQL.to_string(),
+            ))
+            .add_index(POSTGRESQL_BLOG_INDEX_SQL.to_string())
     }
 }
 
diff --git a/resources/sql/const.rs b/resources/sql/const.rs
index f16d8d8a..1e266744 100644
--- a/resources/sql/const.rs
+++ b/resources/sql/const.rs
@@ -20,6 +20,14 @@ pub const POSTGRESQL_NOTIFICATION_TABLE_SQL: &str =
     include_str!("./postgresql/notification/notification_table.sql");
 pub const POSTGRESQL_NOTIFICATION_INDEX_SQL: &str =
     include_str!("./postgresql/notification/index.sql");
+pub const POSTGRESQL_BLOG_POST_TABLE_SQL: &str = include_str!("./postgresql/blog/post_table.sql");
+pub const POSTGRESQL_BLOG_COMMENT_TABLE_SQL: &str =
+    include_str!("./postgresql/blog/comment_table.sql");
+pub const POSTGRESQL_BLOG_LIKE_TABLE_SQL: &str = include_str!("./postgresql/blog/like_table.sql");
+pub const POSTGRESQL_BLOG_FAVORITE_TABLE_SQL: &str =
+    include_str!("./postgresql/blog/favorite_table.sql");
+pub const POSTGRESQL_BLOG_IMAGE_TABLE_SQL: &str = include_str!("./postgresql/blog/image_table.sql");
+pub const POSTGRESQL_BLOG_INDEX_SQL: &str = include_str!("./postgresql/blog/index.sql");
 pub const MYSQL_CICD_PIPELINE_TABLE_SQL: &str = include_str!("./mysql/cicd/pipeline_table.sql");
 pub const MYSQL_CICD_RUN_TABLE_SQL: &str = include_str!("./mysql/cicd/run_table.sql");
 pub const MYSQL_CICD_JOB_TABLE_SQL: &str = include_str!("./mysql/cicd/job_table.sql");
diff --git a/resources/sql/postgresql/blog/comment_table.sql b/resources/sql/postgresql/blog/comment_table.sql
new file mode 100644
index 00000000..35408843
--- /dev/null
+++ b/resources/sql/postgresql/blog/comment_table.sql
@@ -0,0 +1,10 @@
+CREATE TABLE IF NOT EXISTS blog_comment (
+    id SERIAL PRIMARY KEY,
+    post_id INTEGER NOT NULL,
+    user_id INTEGER NOT NULL,
+    parent_id INTEGER DEFAULT 0,
+    content TEXT NOT NULL,
+    is_deleted BOOLEAN NOT NULL DEFAULT FALSE,
+    created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    updated_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP
+);
\ No newline at end of file
diff --git a/resources/sql/postgresql/blog/favorite_table.sql b/resources/sql/postgresql/blog/favorite_table.sql
new file mode 100644
index 00000000..fc2512de
--- /dev/null
+++ b/resources/sql/postgresql/blog/favorite_table.sql
@@ -0,0 +1,7 @@
+CREATE TABLE IF NOT EXISTS blog_favorite (
+    id SERIAL PRIMARY KEY,
+    post_id INTEGER NOT NULL,
+    user_id INTEGER NOT NULL,
+    created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    UNIQUE (post_id, user_id)
+);
\ No newline at end of file
diff --git a/resources/sql/postgresql/blog/image_table.sql b/resources/sql/postgresql/blog/image_table.sql
new file mode 100644
index 00000000..fc3b3be4
--- /dev/null
+++ b/resources/sql/postgresql/blog/image_table.sql
@@ -0,0 +1,11 @@
+CREATE TABLE IF NOT EXISTS blog_image (
+    id SERIAL PRIMARY KEY,
+    post_id INTEGER DEFAULT 0,
+    user_id INTEGER NOT NULL,
+    file_name VARCHAR(255) NOT NULL,
+    original_name VARCHAR(255),
+    mime_type VARCHAR(100) NOT NULL,
+    file_size INTEGER NOT NULL DEFAULT 0,
+    file_data BYTEA NOT NULL,
+    created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP
+);
\ No newline at end of file
diff --git a/resources/sql/postgresql/blog/index.sql b/resources/sql/postgresql/blog/index.sql
new file mode 100644
index 00000000..f9df693e
--- /dev/null
+++ b/resources/sql/postgresql/blog/index.sql
@@ -0,0 +1,41 @@
+CREATE INDEX IF NOT EXISTS idx_blog_post_user_id ON blog_post (user_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_post_is_published ON blog_post (is_published);
+
+CREATE INDEX IF NOT EXISTS idx_blog_post_is_deleted ON blog_post (is_deleted);
+
+CREATE INDEX IF NOT EXISTS idx_blog_post_created_at ON blog_post (created_at DESC);
+
+CREATE INDEX IF NOT EXISTS idx_blog_post_published_deleted ON blog_post (
+    is_published,
+    is_deleted,
+    created_at DESC
+);
+
+CREATE INDEX IF NOT EXISTS idx_blog_comment_post_id ON blog_comment (post_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_comment_user_id ON blog_comment (user_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_comment_parent_id ON blog_comment (parent_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_comment_post_deleted ON blog_comment (
+    post_id,
+    is_deleted,
+    created_at DESC
+);
+
+CREATE INDEX IF NOT EXISTS idx_blog_like_post_id ON blog_like (post_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_like_user_id ON blog_like (user_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_like_post_user ON blog_like (post_id, user_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_favorite_post_id ON blog_favorite (post_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_favorite_user_id ON blog_favorite (user_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_favorite_post_user ON blog_favorite (post_id, user_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_image_post_id ON blog_image (post_id);
+
+CREATE INDEX IF NOT EXISTS idx_blog_image_user_id ON blog_image (user_id);
\ No newline at end of file
diff --git a/resources/sql/postgresql/blog/like_table.sql b/resources/sql/postgresql/blog/like_table.sql
new file mode 100644
index 00000000..1bc59647
--- /dev/null
+++ b/resources/sql/postgresql/blog/like_table.sql
@@ -0,0 +1,7 @@
+CREATE TABLE IF NOT EXISTS blog_like (
+    id SERIAL PRIMARY KEY,
+    post_id INTEGER NOT NULL,
+    user_id INTEGER NOT NULL,
+    created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    UNIQUE (post_id, user_id)
+);
\ No newline at end of file
diff --git a/resources/sql/postgresql/blog/post_table.sql b/resources/sql/postgresql/blog/post_table.sql
new file mode 100644
index 00000000..44b804ed
--- /dev/null
+++ b/resources/sql/postgresql/blog/post_table.sql
@@ -0,0 +1,16 @@
+CREATE TABLE IF NOT EXISTS blog_post (
+    id SERIAL PRIMARY KEY,
+    user_id INTEGER NOT NULL,
+    title VARCHAR(255) NOT NULL,
+    summary TEXT,
+    content TEXT NOT NULL,
+    cover_image_id INTEGER DEFAULT 0,
+    is_published BOOLEAN NOT NULL DEFAULT FALSE,
+    is_deleted BOOLEAN NOT NULL DEFAULT FALSE,
+    view_count INTEGER NOT NULL DEFAULT 0,
+    like_count INTEGER NOT NULL DEFAULT 0,
+    favorite_count INTEGER NOT NULL DEFAULT 0,
+    comment_count INTEGER NOT NULL DEFAULT 0,
+    created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    updated_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP
+);
\ No newline at end of file
diff --git a/resources/static/auth/index.html b/resources/static/auth/index.html
index 65a0e4fd..ae5bbb12 100644
--- a/resources/static/auth/index.html
+++ b/resources/static/auth/index.html
@@ -13,6 +13,7 @@
     <link href="./css/style.css" rel="stylesheet" />
     <script src="../common/js/request-manager.js"></script>
     <script src="../common/js/common.js"></script>
+    <script src="../common/js/error-handler.js"></script>
     <script src="../common/js/rsa.js"></script>
     <script src="./js/app.js" defer></script>
   </head>
diff --git a/resources/static/auth/js/app.js b/resources/static/auth/js/app.js
index 6bc420d8..f90814b7 100644
--- a/resources/static/auth/js/app.js
+++ b/resources/static/auth/js/app.js
@@ -60,6 +60,10 @@ loginForm.addEventListener('submit', async (e) => {
         const locationUrl = getQueryParam('location') || '/';
         window.location.href = locationUrl;
       }, 360);
+    } else if (
+      HyperlaneErrorHandler.handleResponse(data, 'Login failed', showToast)
+    ) {
+      return;
     } else {
       showToast(data.data || 'Login failed', 'error');
     }
@@ -115,6 +119,14 @@ registerForm.addEventListener('submit', async (e) => {
       registerPage.classList.add('hidden');
       loginPage.classList.remove('hidden');
       registerForm.reset();
+    } else if (
+      HyperlaneErrorHandler.handleResponse(
+        data,
+        'Registration failed',
+        showToast,
+      )
+    ) {
+      return;
     } else {
       showToast(data.data || 'Registration failed', 'error');
     }
diff --git a/resources/static/blog/css/style.css b/resources/static/blog/css/style.css
new file mode 100644
index 00000000..42808d2f
--- /dev/null
+++ b/resources/static/blog/css/style.css
@@ -0,0 +1,1582 @@
+body {
+  background: #667eea;
+}
+
+.app-title,
+.app-title span,
+button,
+.btn {
+  white-space: nowrap;
+}
+
+.main-app {
+  display: flex;
+  height: 100dvh;
+  overflow: hidden;
+}
+
+.sidebar {
+  width: 260px;
+  background: #ffffff;
+  border-right: 1px solid #e0e0e0;
+  display: flex;
+  flex-direction: column;
+  position: fixed;
+  top: 0;
+  left: 0;
+  height: 100%;
+  z-index: 100;
+}
+
+.sidebar-header {
+  padding: 20px;
+  border-bottom: 1px solid #e0e0e0;
+}
+
+.sidebar-header h2 {
+  font-size: 18px;
+  font-weight: 600;
+  color: #2c3e50;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.sidebar-header h2 .nav-logo {
+  width: 28px;
+  height: 28px;
+  border-radius: 6px;
+  object-fit: contain;
+  vertical-align: middle;
+}
+
+.sidebar-nav {
+  flex: 1;
+  padding: 16px 0;
+  overflow-y: auto;
+}
+
+.nav-item {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 12px 20px;
+  cursor: pointer;
+  color: #4a5568;
+  font-size: 14px;
+  font-weight: 600;
+  transition: all 0.2s;
+  border-left: 3px solid transparent;
+}
+
+.nav-item:hover {
+  background: #f5f7fb;
+  color: #2d3748;
+}
+
+.nav-item.active {
+  background: #d4e0ff;
+  color: #5a67d8;
+  border-left-color: #5a67d8;
+  font-weight: 700;
+}
+
+.nav-icon {
+  font-size: 18px;
+  width: 24px;
+  text-align: center;
+}
+
+.sidebar-footer {
+  padding: 16px 20px;
+  border-top: 1px solid #e0e0e0;
+}
+
+#logout-btn {
+  width: 100%;
+}
+
+.user-info {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 12px;
+  font-size: 14px;
+  color: #2d3748;
+  font-weight: 700;
+}
+
+.main-content {
+  margin-left: 260px;
+  padding: 24px;
+  height: 100dvh;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  width: 100%;
+}
+
+.content-header {
+  margin-bottom: 12px;
+  flex-shrink: 0;
+}
+
+.content-header h1 {
+  font-size: 20px;
+  font-weight: 600;
+  color: #2c3e50;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.btn {
+  padding: 8px 16px;
+  border: 1px solid #e0e0e0;
+  border-radius: 6px;
+  font-size: 14px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.2s;
+  background: #f5f7fb;
+  color: #2c3e50;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+}
+
+.btn:hover {
+  background: #e8ecf4;
+  border-color: #d0d0d0;
+}
+
+.btn:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.btn-primary {
+  background: #667eea;
+  border-color: transparent;
+  color: #fff;
+}
+
+.btn-primary:hover {
+  background: #5a6fd6;
+  border-color: transparent;
+}
+
+.btn-secondary {
+  background: #f5f7fb;
+  border-color: #e0e0e0;
+  color: #2c3e50;
+}
+
+.btn-secondary:hover {
+  background: #e8ecf4;
+  border-color: #d0d0d0;
+}
+
+.btn-danger {
+  background: #ef4444;
+  border-color: #ef4444;
+  color: #fff;
+}
+
+.btn-danger:hover {
+  background: #dc2626;
+  border-color: #dc2626;
+}
+
+.btn-sm {
+  padding: 4px 12px;
+  font-size: 12px;
+}
+
+.btn-block {
+  width: 100%;
+  padding: 12px;
+}
+
+.form-group {
+  margin-bottom: 16px;
+}
+
+.form-label {
+  display: block;
+  font-size: 14px;
+  font-weight: 500;
+  color: #2c3e50;
+  margin-bottom: 8px;
+}
+
+.form-input {
+  width: 100%;
+  padding: 10px 12px;
+  background: #f8f9fa;
+  border: 1px solid #e0e0e0;
+  border-radius: 6px;
+  color: #2c3e50;
+  font-size: 14px;
+  transition: all 0.2s;
+}
+
+.form-input:focus {
+  outline: none;
+  border-color: #667eea;
+  box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
+  background: #fff;
+}
+
+.form-input::placeholder {
+  color: #999;
+}
+
+.form-input-sm {
+  padding: 6px 10px;
+  font-size: 13px;
+}
+
+.form-textarea {
+  width: 100%;
+  padding: 10px 12px;
+  background: #f8f9fa;
+  border: 1px solid #e0e0e0;
+  border-radius: 6px;
+  color: #2c3e50;
+  font-size: 14px;
+  transition: all 0.2s;
+  font-family: inherit;
+  outline: none;
+  resize: vertical;
+}
+
+.form-textarea:focus {
+  outline: none;
+  border-color: #667eea;
+  box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
+  background: #fff;
+}
+
+.form-textarea.editor {
+  font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
+  font-size: 13px;
+  line-height: 1.7;
+  background: #fafbfc;
+  resize: vertical;
+  min-height: 280px;
+}
+
+.card {
+  background: #ffffff;
+  border: 1px solid #e0e0e0;
+  border-radius: 12px;
+  overflow: hidden;
+  margin-bottom: 16px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+}
+
+.card-header {
+  padding: 16px 20px;
+  border-bottom: 1px solid #e0e0e0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.card-title {
+  font-size: 16px;
+  font-weight: 600;
+  color: #2c3e50;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.card-body {
+  padding: 20px;
+}
+
+#explore-page,
+#my-posts-page,
+#favorites-page,
+#write-page {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+}
+
+#explore-page .card,
+#my-posts-page .card,
+#favorites-page .card {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  min-height: 0;
+  overflow: hidden;
+}
+
+#explore-page .card-body,
+#my-posts-page .card-body,
+#favorites-page .card-body {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow: hidden;
+}
+
+#write-page .card {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow: hidden;
+}
+
+#write-page .card-body {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow-y: auto;
+}
+
+.stats-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 16px;
+  margin-bottom: 24px;
+  flex-shrink: 0;
+}
+
+.stat-card {
+  background: #ffffff;
+  border: 1px solid #e0e0e0;
+  border-radius: 12px;
+  padding: 20px;
+  text-align: center;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+  min-width: 0;
+  overflow: hidden;
+}
+
+.stat-card.balance {
+  border-left: 4px solid #f59e0b;
+}
+
+.stat-card.income {
+  border-left: 4px solid #22c55e;
+}
+
+.stat-card.expense {
+  border-left: 4px solid #ef4444;
+}
+
+.stat-label {
+  font-size: 12px;
+  color: #666;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  margin-bottom: 8px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.stat-value {
+  font-size: 24px;
+  font-weight: 600;
+  color: #2c3e50;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.post-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  flex: 1;
+  overflow-y: auto;
+  min-height: 0;
+}
+
+.post-card {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  gap: 8px;
+  padding: 16px;
+  background: #f8f9fa;
+  border: 1px solid #e0e0e0;
+  border-radius: 8px;
+  transition: all 0.2s;
+  cursor: pointer;
+}
+
+.post-card:hover {
+  border-color: #667eea;
+  background: #f0f4ff;
+}
+
+.post-card:active {
+  transform: scale(0.995);
+}
+
+.post-avatar {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 16px;
+  font-weight: 600;
+  color: #fff;
+  flex-shrink: 0;
+  background: #667eea;
+}
+
+.post-info {
+  flex: 1;
+  min-width: 0;
+}
+
+.post-header {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-bottom: 4px;
+  width: 100%;
+}
+
+.post-author {
+  font-size: 14px;
+  font-weight: 700;
+  color: #2c3e50;
+}
+
+.post-time {
+  font-size: 12px;
+  color: #718096;
+}
+
+.post-title {
+  font-size: 15px;
+  font-weight: 600;
+  color: #2c3e50;
+  margin-bottom: 4px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  width: 100%;
+}
+
+.post-summary {
+  font-size: 13px;
+  color: #4a5568;
+  line-height: 1.5;
+  margin-bottom: 8px;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  width: 100%;
+}
+
+.post-cover {
+  width: 100%;
+  max-height: 180px;
+  object-fit: cover;
+  border-radius: 6px;
+  margin-bottom: 8px;
+  align-self: stretch;
+}
+
+.post-stats {
+  display: flex;
+  gap: 16px;
+  font-size: 12px;
+  color: #718096;
+  justify-content: flex-end;
+}
+
+.post-stat {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.post-stat.liked {
+  color: #ef4444;
+  font-weight: 600;
+}
+
+.post-stat.favorited {
+  color: #f59e0b;
+  font-weight: 600;
+}
+
+.post-actions {
+  display: flex;
+  gap: 8px;
+  margin-top: 8px;
+  justify-content: flex-end;
+}
+
+.filter-group {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-wrap: nowrap;
+  white-space: nowrap;
+}
+
+.filter-group .form-input-sm {
+  width: 200px;
+  min-width: 0;
+}
+
+.pagination-container {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16px;
+  margin-top: 16px;
+  background: #ffffff;
+  border: 1px solid #e0e0e0;
+  border-radius: 12px;
+  flex-wrap: wrap;
+  gap: 12px;
+  flex-shrink: 0;
+}
+
+.pagination-info {
+  display: flex;
+  gap: 16px;
+  font-size: 14px;
+  color: #666;
+}
+
+.pagination-controls {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+}
+
+.pagination-controls .btn {
+  min-width: 80px;
+}
+
+.page-numbers {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+}
+
+.page-btn {
+  padding: 6px 12px;
+  background: #f5f7fb;
+  border: 1px solid #e0e0e0;
+  border-radius: 6px;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 500;
+  color: #2c3e50;
+  transition: all 0.2s ease;
+  min-width: 36px;
+  text-align: center;
+}
+
+.page-btn:hover:not(.active):not(:disabled) {
+  background: #e8ecf4;
+  border-color: #d0d0d0;
+}
+
+.page-btn.active {
+  background: #667eea;
+  border-color: transparent;
+  color: #ffffff;
+  font-weight: 600;
+}
+
+.page-ellipsis {
+  color: #999;
+  padding: 0 4px;
+  font-size: 14px;
+}
+
+.modal {
+  display: none;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 1000;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+}
+
+.modal.active {
+  display: flex;
+}
+
+.modal-content {
+  background: #ffffff;
+  border: 1px solid #e0e0e0;
+  border-radius: 0;
+  max-width: 100%;
+  width: 100%;
+  height: 100%;
+  max-height: 100%;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
+}
+
+.modal-large {
+  max-width: 100%;
+  width: 100%;
+  height: 100%;
+  max-height: 100%;
+}
+
+.modal-header {
+  padding: 20px;
+  border-bottom: 1px solid #e0e0e0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: #f8f9fa;
+  flex-shrink: 0;
+}
+
+.modal-body {
+  flex: 1;
+  overflow-y: auto;
+  padding: 20px;
+  min-height: 0;
+}
+
+.modal-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #2c3e50;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.modal-close {
+  background: none;
+  border: none;
+  color: #666;
+  font-size: 24px;
+  cursor: pointer;
+  padding: 0;
+  width: 32px;
+  height: 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 6px;
+  transition: all 0.2s;
+}
+
+.modal-close:hover {
+  background: #f5f7fb;
+  color: #2c3e50;
+}
+
+.empty-state {
+  text-align: center;
+  padding: 60px 20px;
+  color: #666;
+}
+
+.loading-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  gap: 16px;
+}
+
+.loading-spinner {
+  width: 40px;
+  height: 40px;
+  border: 3px solid #e0e0e0;
+  border-top-color: #667eea;
+  border-radius: 50%;
+  animation: spin 0.8s linear infinite;
+}
+
+.loading-text {
+  color: #666;
+  font-size: 14px;
+}
+
+.empty-state-icon {
+  font-size: 48px;
+  margin-bottom: 16px;
+}
+
+.empty-state-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #2c3e50;
+  margin-bottom: 8px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.no-data {
+  text-align: center;
+  padding: 48px 20px;
+  color: #666;
+  font-size: 14px;
+}
+
+.toast-container {
+  position: fixed;
+  top: 20px;
+  right: 20px;
+  z-index: 10000;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.toast {
+  background: #ffffff;
+  border: 1px solid #e0e0e0;
+  border-radius: 8px;
+  padding: 12px 16px;
+  min-width: 280px;
+  max-width: 400px;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
+  animation: slideIn 0.3s ease;
+  cursor: pointer;
+}
+
+.toast.hiding {
+  animation: slideOut 0.3s ease forwards;
+}
+
+@keyframes slideIn {
+  from {
+    transform: translateX(100%);
+    opacity: 0;
+  }
+  to {
+    transform: translateX(0);
+    opacity: 1;
+  }
+}
+
+@keyframes slideOut {
+  from {
+    transform: translateX(0);
+    opacity: 1;
+  }
+  to {
+    transform: translateX(100%);
+    opacity: 0;
+  }
+}
+
+.toast-icon {
+  font-size: 18px;
+  flex-shrink: 0;
+}
+
+.toast-icon.success {
+  color: #22c55e;
+}
+
+.toast-icon.error {
+  color: #ef4444;
+}
+
+.toast-icon.info {
+  color: #667eea;
+}
+
+.toast-content {
+  flex: 1;
+  font-size: 14px;
+  color: #2c3e50;
+}
+
+.mobile-menu-btn {
+  display: none;
+}
+
+.sidebar-overlay {
+  display: none;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.3);
+  z-index: 99;
+  opacity: 0;
+  transition: opacity 0.3s;
+}
+
+.sidebar-overlay.active {
+  display: block;
+  opacity: 1;
+}
+
+.editor-container {
+  background: #ffffff;
+  border-radius: 12px;
+  padding: 24px;
+  border: 1px solid #e0e0e0;
+}
+
+.image-upload-row {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+
+.file-upload-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 16px;
+  background: #f5f7fb;
+  border: 1px solid #e0e0e0;
+  border-radius: 6px;
+  font-size: 14px;
+  font-weight: 500;
+  color: #2c3e50;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.file-upload-btn:hover {
+  background: #e8ecf4;
+  border-color: #d0d0d0;
+}
+
+.file-upload-btn input[type='file'] {
+  display: none;
+}
+
+.image-preview-list {
+  display: flex;
+  gap: 10px;
+  flex-wrap: wrap;
+  margin-top: 10px;
+}
+
+.image-preview-item {
+  position: relative;
+  width: 88px;
+  height: 88px;
+  border-radius: 6px;
+  overflow: hidden;
+  border: 1.5px solid #e0e0e0;
+  transition: all 0.2s;
+}
+
+.image-preview-item:hover {
+  transform: scale(1.03);
+  border-color: #667eea;
+}
+
+.image-preview-item img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.image-preview-item .remove-btn {
+  position: absolute;
+  top: 4px;
+  right: 4px;
+  width: 22px;
+  height: 22px;
+  background: #ef4444;
+  color: #fff;
+  border: none;
+  border-radius: 50%;
+  font-size: 13px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.2s;
+}
+
+.image-preview-item .remove-btn:hover {
+  background: #dc2626;
+  transform: scale(1.1);
+}
+
+.form-actions {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 12px;
+  flex-wrap: wrap;
+  padding-top: 8px;
+  border-top: 1px solid #e0e0e0;
+}
+
+.checkbox-label {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+  cursor: pointer;
+  color: #4a5568;
+  user-select: none;
+}
+
+.checkbox-label input[type='checkbox'] {
+  width: 18px;
+  height: 18px;
+  accent-color: #667eea;
+  cursor: pointer;
+}
+
+.markdown-body {
+  font-size: 15px;
+  line-height: 1.75;
+  color: #2c3e50;
+}
+
+.markdown-body h1,
+.markdown-body h2,
+.markdown-body h3,
+.markdown-body h4 {
+  margin-top: 24px;
+  margin-bottom: 12px;
+  font-weight: 700;
+  letter-spacing: -0.3px;
+  color: #2c3e50;
+}
+
+.markdown-body h1 {
+  font-size: 26px;
+}
+
+.markdown-body h2 {
+  font-size: 22px;
+}
+
+.markdown-body h3 {
+  font-size: 18px;
+}
+
+.markdown-body h4 {
+  font-size: 15px;
+}
+
+.markdown-body p {
+  margin: 0 0 14px;
+}
+
+.markdown-body img {
+  max-width: 100%;
+  border-radius: 6px;
+  margin: 8px 0;
+}
+
+.markdown-body pre {
+  background: #f8fafc;
+  padding: 16px;
+  border-radius: 6px;
+  overflow-x: auto;
+  border: 1px solid #e0e0e0;
+  margin: 12px 0;
+}
+
+.markdown-body code {
+  font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
+  font-size: 13px;
+  background: #f1f5f9;
+  padding: 2px 6px;
+  border-radius: 4px;
+  color: #4f46e5;
+}
+
+.markdown-body pre code {
+  background: none;
+  padding: 0;
+  color: inherit;
+}
+
+.markdown-body blockquote {
+  border-left: 3px solid #667eea;
+  margin: 12px 0;
+  padding: 8px 16px;
+  color: #4a5568;
+  background: rgba(102, 126, 234, 0.08);
+  border-radius: 0 6px 6px 0;
+}
+
+.markdown-body ul,
+.markdown-body ol {
+  padding-left: 24px;
+  margin: 10px 0;
+}
+
+.markdown-body li {
+  margin: 4px 0;
+}
+
+.markdown-body a {
+  color: #667eea;
+  text-decoration: none;
+  font-weight: 500;
+}
+
+.markdown-body a:hover {
+  text-decoration: underline;
+}
+
+.markdown-body hr {
+  border: none;
+  border-top: 1px solid #e0e0e0;
+  margin: 20px 0;
+}
+
+.comment-section {
+  margin-top: 24px;
+  border-top: 1px solid #e0e0e0;
+  padding-top: 20px;
+}
+
+.comment-section h4 {
+  font-size: 16px;
+  font-weight: 700;
+  margin: 0 0 14px;
+  color: #2c3e50;
+}
+
+.comment-input-row {
+  display: flex;
+  gap: 10px;
+  margin-bottom: 16px;
+}
+
+.comment-input {
+  flex: 1;
+  padding: 11px 14px;
+  border: 1.5px solid #e0e0e0;
+  border-radius: 6px;
+  font-size: 14px;
+  outline: none;
+  background: #ffffff;
+  transition: all 0.2s;
+}
+
+.comment-input:focus {
+  border-color: #667eea;
+  box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
+}
+
+.comment-item {
+  padding: 12px 0;
+  border-bottom: 1px solid #f1f5f9;
+}
+
+.comment-item:last-child {
+  border-bottom: none;
+}
+
+.comment-header {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 6px;
+}
+
+.comment-author {
+  font-size: 13px;
+  font-weight: 700;
+  color: #2c3e50;
+}
+
+.comment-time {
+  font-size: 12px;
+  color: #718096;
+}
+
+.comment-text {
+  font-size: 14px;
+  line-height: 1.6;
+  margin: 0 0 8px;
+  color: #2c3e50;
+  padding-left: 38px;
+}
+
+.comment-actions {
+  display: flex;
+  gap: 12px;
+  font-size: 12px;
+  padding-left: 38px;
+}
+
+.comment-action {
+  color: #718096;
+  cursor: pointer;
+  background: none;
+  border: none;
+  padding: 4px 8px;
+  border-radius: 4px;
+  font-size: 12px;
+  font-weight: 600;
+  transition: all 0.2s;
+}
+
+.comment-action:hover {
+  color: #667eea;
+  background: rgba(102, 126, 234, 0.08);
+}
+
+.replies {
+  margin-left: 24px;
+  margin-top: 8px;
+  padding-left: 12px;
+  border-left: 2px solid rgba(102, 126, 234, 0.08);
+}
+
+.replies .replies {
+  margin-left: 20px;
+  padding-left: 10px;
+}
+
+.replies .replies .replies {
+  margin-left: 16px;
+  padding-left: 8px;
+}
+
+.replies .replies .replies .replies {
+  margin-left: 12px;
+  padding-left: 6px;
+  border-left-width: 1.5px;
+}
+
+.replies .replies .replies .replies .replies {
+  margin-left: 8px;
+  padding-left: 4px;
+  border-left-width: 1px;
+}
+
+.replies .comment-item {
+  padding: 10px 0;
+}
+
+.replies .comment-text {
+  padding-left: 0;
+}
+
+.replies .comment-actions {
+  padding-left: 0;
+}
+
+.preview-title {
+  font-size: 24px;
+  font-weight: 800;
+  margin-bottom: 16px;
+  letter-spacing: -0.5px;
+  color: #2c3e50;
+}
+
+@keyframes spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@media (max-width: 768px) {
+  .sidebar {
+    width: 100%;
+    transform: translateX(-100%);
+    transition: transform 0.3s;
+  }
+
+  .sidebar.open {
+    transform: translateX(0);
+  }
+
+  .main-content {
+    margin-left: 0;
+    padding: 8px 16px;
+    height: 100dvh;
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+    box-sizing: border-box;
+  }
+
+  .mobile-menu-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 32px;
+    height: 32px;
+    background: #f5f7fb;
+    border: 1px solid #e0e0e0;
+    border-radius: 6px;
+    color: #2c3e50;
+    font-size: 16px;
+    cursor: pointer;
+    margin-right: 8px;
+  }
+
+  .content-header {
+    display: flex;
+    align-items: center;
+    margin-bottom: 8px;
+  }
+
+  .stats-grid {
+    grid-template-columns: 1fr;
+    gap: 8px;
+    margin-bottom: 12px;
+  }
+
+  .stat-card {
+    padding: 12px 8px;
+  }
+
+  .stat-label {
+    font-size: 11px;
+  }
+
+  .stat-value {
+    font-size: 16px;
+  }
+
+  .post-card {
+    flex-direction: column;
+    gap: 8px;
+    padding: 12px;
+  }
+
+  .post-card:active {
+    transform: none;
+  }
+
+  .post-info {
+    flex: 1;
+    min-width: 0;
+    order: 2;
+  }
+
+  .post-avatar {
+    order: 1;
+  }
+
+  .post-header {
+    width: 100%;
+  }
+
+  .post-actions {
+    width: 100%;
+    order: 3;
+    flex-direction: row;
+    justify-content: flex-end;
+    margin-top: 4px;
+    gap: 12px;
+  }
+
+  .post-stats {
+    gap: 8px;
+    font-size: 11px;
+  }
+
+  .post-title {
+    font-size: 14px;
+  }
+
+  .post-summary {
+    font-size: 12px;
+  }
+
+  .card-header {
+    flex-wrap: nowrap;
+    gap: 12px;
+    align-items: center;
+  }
+
+  .card-header .card-title {
+    flex: 1;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    min-width: 0;
+  }
+
+  .card-header > div {
+    display: flex;
+    gap: 8px;
+    flex-wrap: nowrap;
+    flex-shrink: 0;
+  }
+
+  .filter-group .form-input-sm {
+    width: 100%;
+    min-width: 90px;
+  }
+
+  #explore-page,
+  #my-posts-page,
+  #favorites-page,
+  #write-page {
+    width: 100%;
+    flex: 1;
+    overflow-y: auto;
+  }
+
+  #explore-page .card,
+  #my-posts-page .card,
+  #favorites-page .card,
+  #write-page .card {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-height: 0;
+    width: 100%;
+    overflow: hidden;
+  }
+
+  #explore-page .card-body,
+  #my-posts-page .card-body,
+  #favorites-page .card-body,
+  #write-page .card-body {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-height: 0;
+    overflow: hidden;
+  }
+
+  #explore-page .post-list,
+  #my-posts-page .post-list,
+  #favorites-page .post-list {
+    flex: 1;
+    min-height: 0;
+    overflow-y: auto;
+  }
+
+  .pagination-container {
+    flex-direction: column;
+    align-items: center;
+    position: fixed;
+    bottom: 0;
+    left: 16px;
+    right: 16px;
+    margin: 0;
+    border-radius: 0;
+    border-top: none;
+    z-index: 50;
+    max-height: 120px;
+    padding: 8px 16px;
+    gap: 8px;
+  }
+
+  .pagination-info {
+    display: block;
+    text-align: center;
+    font-size: 12px;
+    width: 100%;
+  }
+
+  .pagination-controls {
+    justify-content: center;
+    gap: 8px;
+    width: 100%;
+  }
+
+  .pagination-controls .btn {
+    min-width: 60px;
+    padding: 4px 8px;
+    font-size: 12px;
+  }
+
+  .page-btn {
+    padding: 4px 8px;
+    font-size: 12px;
+    min-width: 28px;
+  }
+
+  #explore-page .card-body,
+  #my-posts-page .card-body,
+  #favorites-page .card-body {
+    padding-bottom: 80px;
+  }
+
+  .modal-content {
+    border-radius: 0;
+    max-width: 100%;
+    width: 100%;
+    height: 100%;
+    max-height: 100%;
+  }
+
+  .editor-container {
+    padding: 16px;
+  }
+
+  .form-actions {
+    justify-content: flex-end;
+    gap: 8px;
+  }
+
+  .form-textarea.editor {
+    min-height: 200px;
+  }
+
+  .comment-text {
+    padding-left: 0;
+  }
+
+  .comment-actions {
+    padding-left: 0;
+  }
+
+  .replies {
+    margin-left: 12px;
+    padding-left: 8px;
+  }
+
+  .replies .replies {
+    margin-left: 10px;
+    padding-left: 6px;
+  }
+
+  .replies .replies .replies {
+    margin-left: 8px;
+    padding-left: 4px;
+  }
+
+  .replies .replies .replies .replies {
+    margin-left: 6px;
+    padding-left: 3px;
+    border-left-width: 1px;
+  }
+
+  .replies .replies .replies .replies .replies {
+    margin-left: 4px;
+    padding-left: 2px;
+    border-left-width: 1px;
+  }
+
+  .markdown-body h1 {
+    font-size: 22px;
+  }
+
+  .markdown-body h2 {
+    font-size: 19px;
+  }
+
+  .markdown-body h3 {
+    font-size: 16px;
+  }
+}
+
+@media (max-width: 480px) {
+  .stats-grid {
+    grid-template-columns: 1fr;
+    gap: 6px;
+  }
+
+  .stat-card {
+    padding: 10px 6px;
+  }
+
+  .stat-label {
+    font-size: 10px;
+  }
+
+  .stat-value {
+    font-size: 14px;
+  }
+}
+
+.modal-content-fullscreen {
+  max-width: 100%;
+  width: 100%;
+  height: 100%;
+  max-height: 100%;
+  border-radius: 0;
+}
+
+.image-preview-body {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow: hidden;
+  padding: 0;
+}
+
+.image-preview-container {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  cursor: grab;
+  background: #000;
+  position: relative;
+}
+
+.image-preview-container:active {
+  cursor: grabbing;
+}
+
+.preview-image {
+  max-width: 100%;
+  max-height: 100%;
+  object-fit: contain;
+  transition: transform 0.2s ease;
+  user-select: none;
+  -webkit-user-drag: none;
+}
+
+.image-preview-controls {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  padding: 12px 20px;
+  background: #f8f9fa;
+  border-top: 1px solid #e0e0e0;
+  flex-shrink: 0;
+}
+
+.image-preview-uploader {
+  font-size: 14px;
+  color: #666;
+  font-weight: 500;
+}
diff --git a/resources/static/blog/index.html b/resources/static/blog/index.html
new file mode 100644
index 00000000..d7af65d2
--- /dev/null
+++ b/resources/static/blog/index.html
@@ -0,0 +1,447 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
+      name="viewport"
+    />
+    <title>Hyperlane - Blog</title>
+    <link rel="icon" href="https://docs.ltpp.vip/img/hyperlane.png" />
+    <link href="../common/css/common.css" rel="stylesheet" />
+    <link href="../common/css/header.css" rel="stylesheet" />
+    <link href="./css/style.css" rel="stylesheet" />
+    <script src="../common/js/markdown-it.min.js"></script>
+    <script src="../common/js/highlight.min.js"></script>
+    <script src="../common/js/common.js"></script>
+    <script src="../common/js/error-handler.js"></script>
+    <script src="../common/components/hyperlane-confirm.js"></script>
+    <script src="./js/app.js" defer></script>
+  </head>
+  <body>
+    <div id="app">
+      <div id="main-app" class="main-app">
+        <aside class="sidebar">
+          <div class="sidebar-header light-bg">
+            <h2>
+              <a
+                href="https://github.com/hyperlane-dev/hyperlane"
+                target="_blank"
+              >
+                <img
+                  src="https://docs.ltpp.vip/img/hyperlane.png"
+                  alt=""
+                  class="nav-logo"
+                  onerror="this.style.display = 'none'"
+                />
+                <span class="text shimmer">Hyperlane Blog</span>
+              </a>
+            </h2>
+          </div>
+          <nav class="sidebar-nav">
+            <div class="nav-item active" data-page="explore">
+              <span class="nav-icon">🌐</span>
+              <span>Explore</span>
+            </div>
+            <div class="nav-item" data-page="my-posts">
+              <span class="nav-icon">📝</span>
+              <span>My Posts</span>
+            </div>
+            <div class="nav-item" data-page="favorites">
+              <span class="nav-icon">⭐</span>
+              <span>Favorites</span>
+            </div>
+            <div class="nav-item" data-page="write">
+              <span class="nav-icon">✏️</span>
+              <span>Write</span>
+            </div>
+          </nav>
+          <div class="sidebar-footer">
+            <div class="user-info">
+              <span id="current-user">User</span>
+            </div>
+            <button id="logout-btn" class="btn btn-sm btn-primary">
+              Logout
+            </button>
+          </div>
+        </aside>
+
+        <div class="sidebar-overlay" id="sidebar-overlay"></div>
+        <main class="main-content">
+          <header class="content-header light-bg">
+            <button class="mobile-menu-btn" id="mobile-menu-btn">☰</button>
+            <h1 id="page-title">Explore</h1>
+          </header>
+
+          <div id="explore-page" class="page-content">
+            <div class="stats-grid">
+              <div class="stat-card balance">
+                <div class="stat-label">Total Posts</div>
+                <div class="stat-value" id="explore-total-posts">0</div>
+              </div>
+              <div class="stat-card income">
+                <div class="stat-label">Total Likes</div>
+                <div class="stat-value" id="explore-total-likes">0</div>
+              </div>
+              <div class="stat-card expense">
+                <div class="stat-label">Total Comments</div>
+                <div class="stat-value" id="explore-total-comments">0</div>
+              </div>
+            </div>
+            <div class="card">
+              <div class="card-header">
+                <span class="card-title">Posts</span>
+                <div class="filter-group">
+                  <input
+                    type="text"
+                    class="form-input form-input-sm"
+                    id="searchKeyword"
+                    placeholder="Search posts..."
+                    oninput="app.onSearchInput()"
+                  />
+                </div>
+              </div>
+              <div class="card-body">
+                <div id="exploreList" class="post-list">
+                  <div class="loading-state">
+                    <div class="loading-spinner"></div>
+                    <div class="loading-text">Loading posts...</div>
+                  </div>
+                </div>
+                <div id="explorePagination" class="pagination-container">
+                  <div class="pagination-info">
+                    <span>Total: 0 posts</span>
+                    <span>Showing 0 - 0</span>
+                  </div>
+                  <div class="pagination-controls"></div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <div id="my-posts-page" class="page-content hidden">
+            <div class="stats-grid">
+              <div class="stat-card balance">
+                <div class="stat-label">My Posts</div>
+                <div class="stat-value" id="my-total-posts">0</div>
+              </div>
+              <div class="stat-card income">
+                <div class="stat-label">Total Likes</div>
+                <div class="stat-value" id="my-total-likes">0</div>
+              </div>
+              <div class="stat-card expense">
+                <div class="stat-label">Total Comments</div>
+                <div class="stat-value" id="my-total-comments">0</div>
+              </div>
+            </div>
+            <div class="card">
+              <div class="card-header">
+                <span class="card-title">My Posts</span>
+                <div></div>
+              </div>
+              <div class="card-body">
+                <div id="myPostsList" class="post-list">
+                  <div class="loading-state">
+                    <div class="loading-spinner"></div>
+                    <div class="loading-text">Loading your posts...</div>
+                  </div>
+                </div>
+                <div id="myPostsPagination" class="pagination-container">
+                  <div class="pagination-info">
+                    <span id="my-posts-pagination-total">Total: 0 posts</span>
+                    <span id="my-posts-pagination-range">Showing 0 - 0</span>
+                  </div>
+                  <div
+                    id="my-posts-pagination-controls"
+                    class="pagination-controls"
+                  ></div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <div id="favorites-page" class="page-content hidden">
+            <div class="card">
+              <div class="card-header">
+                <span class="card-title">Favorites</span>
+                <div></div>
+              </div>
+              <div class="card-body">
+                <div id="favoritesList" class="post-list">
+                  <div class="no-data">Favorites feature coming soon</div>
+                </div>
+                <div id="favoritesPagination" class="pagination-container">
+                  <div class="pagination-info">
+                    <span id="favorites-pagination-total">Total: 0 posts</span>
+                    <span id="favorites-pagination-range">Showing 0 - 0</span>
+                  </div>
+                  <div
+                    id="favorites-pagination-controls"
+                    class="pagination-controls"
+                  ></div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <div id="write-page" class="page-content hidden">
+            <div class="card">
+              <div class="card-header">
+                <span class="card-title">Write Post</span>
+                <div></div>
+              </div>
+              <div class="card-body">
+                <div class="editor-container">
+                  <div class="form-group">
+                    <label class="form-label">Title</label>
+                    <input
+                      type="text"
+                      class="form-input"
+                      id="writeTitle"
+                      placeholder="Enter post title"
+                    />
+                  </div>
+                  <div class="form-group">
+                    <label class="form-label">Summary (optional)</label>
+                    <input
+                      type="text"
+                      class="form-input"
+                      id="writeSummary"
+                      placeholder="Brief summary"
+                    />
+                  </div>
+                  <div class="form-group">
+                    <label class="form-label">Cover Image</label>
+                    <div class="image-upload-row">
+                      <label class="file-upload-btn">
+                        <input
+                          type="file"
+                          id="coverImageInput"
+                          accept="image/*"
+                          onchange="app.uploadCoverImage(this)"
+                        />
+                        <span>Choose File</span>
+                      </label>
+                      <span id="coverImageName"></span>
+                      <input type="hidden" id="coverImageId" />
+                    </div>
+                  </div>
+                  <div class="form-group">
+                    <label class="form-label"
+                      >Content (Markdown supported)</label
+                    >
+                    <textarea
+                      class="form-textarea editor"
+                      id="writeContent"
+                      rows="12"
+                      placeholder="Write your post in Markdown..."
+                    ></textarea>
+                  </div>
+                  <div class="form-group">
+                    <label class="form-label">Images</label>
+                    <label class="file-upload-btn">
+                      <input
+                        type="file"
+                        id="contentImagesInput"
+                        accept="image/*"
+                        multiple
+                        onchange="app.uploadContentImages(this)"
+                      />
+                      <span>Choose Files</span>
+                    </label>
+                    <div
+                      class="image-preview-list"
+                      id="contentImagesPreview"
+                    ></div>
+                  </div>
+                  <div class="form-actions">
+                    <label class="checkbox-label">
+                      <input type="checkbox" id="writePublish" checked />
+                      Publish immediately
+                    </label>
+                    <button
+                      class="btn btn-secondary"
+                      onclick="app.previewPost()"
+                    >
+                      Preview
+                    </button>
+                    <button class="btn btn-primary" onclick="app.submitPost()">
+                      Publish
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </main>
+      </div>
+    </div>
+
+    <div class="toast-container" id="toast-container"></div>
+
+    <div class="modal" id="postDetailModal">
+      <div class="modal-content modal-large">
+        <div class="modal-header">
+          <span class="modal-title">Post Detail</span>
+          <button class="modal-close" onclick="app.closePostDetail()">
+            &times;
+          </button>
+        </div>
+        <div class="modal-body" id="postDetailContent"></div>
+      </div>
+    </div>
+
+    <div class="modal" id="previewModal">
+      <div class="modal-content modal-large">
+        <div class="modal-header">
+          <span class="modal-title">Preview</span>
+          <button class="modal-close" onclick="app.closePreview()">
+            &times;
+          </button>
+        </div>
+        <div class="modal-body">
+          <div class="preview-title" id="previewTitle"></div>
+          <div class="markdown-body" id="previewBody"></div>
+        </div>
+      </div>
+    </div>
+
+    <div class="modal" id="editModal">
+      <div class="modal-content modal-large">
+        <div class="modal-header">
+          <span class="modal-title">Edit Post</span>
+          <button class="modal-close" onclick="app.closeEdit()">&times;</button>
+        </div>
+        <div class="modal-body">
+          <div class="editor-container">
+            <div class="form-group">
+              <label class="form-label">Title</label>
+              <input type="text" class="form-input" id="editTitle" />
+            </div>
+            <div class="form-group">
+              <label class="form-label">Summary</label>
+              <input type="text" class="form-input" id="editSummary" />
+            </div>
+            <div class="form-group">
+              <label class="form-label">Content</label>
+              <textarea
+                class="form-textarea editor"
+                id="editContent"
+                rows="12"
+              ></textarea>
+            </div>
+            <div class="form-actions">
+              <label class="checkbox-label">
+                <input type="checkbox" id="editPublish" />
+                Published
+              </label>
+              <button class="btn btn-secondary" onclick="app.closeEdit()">
+                Cancel
+              </button>
+              <button class="btn btn-primary" onclick="app.submitEdit()">
+                Save
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="modal" id="replyModal">
+      <div class="modal-content modal-large">
+        <div class="modal-header">
+          <span class="modal-title">Reply to Comment</span>
+          <button class="modal-close" onclick="app.closeReply()">
+            &times;
+          </button>
+        </div>
+        <div class="modal-body">
+          <div style="margin-bottom: 16px">
+            <div
+              style="
+                font-size: 15px;
+                font-weight: 700;
+                color: #2c3e50;
+                margin-bottom: 4px;
+              "
+            >
+              Reply to Comment
+            </div>
+            <div
+              id="replyTargetText"
+              style="
+                font-size: 13px;
+                color: #666;
+                line-height: 1.5;
+                padding: 10px 12px;
+                background: #f8f9fa;
+                border-radius: 6px;
+                border-left: 3px solid #667eea;
+              "
+            ></div>
+          </div>
+          <div class="form-group" style="margin-bottom: 12px">
+            <textarea
+              class="form-textarea"
+              id="replyContent"
+              rows="4"
+              placeholder="Write your reply..."
+              style="resize: vertical; min-height: 80px"
+            ></textarea>
+          </div>
+          <div
+            class="form-actions"
+            style="border-top: none; padding-top: 0; justify-content: flex-end"
+          >
+            <button class="btn btn-secondary" onclick="app.closeReply()">
+              Cancel
+            </button>
+            <button class="btn btn-primary" onclick="app.submitReply()">
+              Reply
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="modal" id="imagePreviewModal">
+      <div class="modal-content modal-content-fullscreen theme-adaptive">
+        <div class="modal-header">
+          <span class="image-preview-uploader" id="imagePreviewUploader"></span>
+          <button class="modal-close" onclick="app.closeImagePreview()">
+            &times;
+          </button>
+        </div>
+        <div class="modal-body image-preview-body">
+          <div class="image-preview-container" id="imagePreviewContainer">
+            <img
+              id="blogPreviewImage"
+              class="preview-image"
+              src=""
+              alt="Preview"
+              onerror="this.style.display = 'none'"
+            />
+          </div>
+          <div class="image-preview-controls">
+            <button type="button" class="btn" onclick="app.zoomOut()">
+              <span>➖</span>
+            </button>
+            <button type="button" class="btn" onclick="app.zoomIn()">
+              <span>➕</span>
+            </button>
+            <button type="button" class="btn" onclick="app.resetZoom()">
+              <span>🔄️</span>
+            </button>
+            <button
+              type="button"
+              class="btn btn-primary"
+              onclick="app.downloadCurrentImage()"
+            >
+              <span>⬇️</span>
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/resources/static/blog/js/app.js b/resources/static/blog/js/app.js
new file mode 100644
index 00000000..200bf661
--- /dev/null
+++ b/resources/static/blog/js/app.js
@@ -0,0 +1,1258 @@
+class BlogApp {
+  constructor() {
+    this.currentTab = 'explore';
+    this.currentPage = { explore: 1, 'my-posts': 1, favorites: 1 };
+    this.pageSize = 10;
+    this.apiBase = '/api/blog';
+    this.posts = [];
+    this.currentPostId = null;
+    this.editingPostId = null;
+    this.replyCommentId = null;
+    this.replyCommentContent = '';
+    this.uploadedImages = [];
+    this.searchDebounceTimer = null;
+    this.currentZoom = 1;
+    this.imagePosition = { x: 0, y: 0 };
+    this.isDragging = false;
+    this.dragStart = { x: 0, y: 0 };
+    this.rafId = null;
+    this.pendingPosition = null;
+    this.currentPreviewImageUrl = null;
+    this.md = window.markdownit({
+      html: false,
+      linkify: true,
+      typographer: true,
+      highlight: (str, lang) => {
+        if (lang && hljs.getLanguage(lang)) {
+          try {
+            return hljs.highlight(str, { language: lang }).value;
+          } catch (e) {
+            return '';
+          }
+        }
+        return '';
+      },
+    });
+  }
+
+  async init() {
+    const routeState = this.parseRouteHash();
+    const page = routeState.page || 'explore';
+    this.switchPage(page, false);
+    if (page === 'explore') {
+      await this.loadExplorePosts();
+    } else if (page === 'my-posts') {
+      await this.loadMyPosts();
+    } else if (page === 'favorites') {
+      await this.loadFavorites();
+    }
+  }
+
+  parseRouteHash() {
+    const hash = window.location.hash.replace('#', '');
+    if (!hash) return {};
+    const params = new URLSearchParams(hash);
+    return { page: params.get('page') };
+  }
+
+  updateRouteHash(page) {
+    const hash = `#page=${page}`;
+    if (window.location.hash !== hash) {
+      window.location.hash = hash;
+    }
+  }
+
+  switchPage(page, updateHash = true) {
+    this.currentTab = page;
+    document.querySelectorAll('.nav-item').forEach((item) => {
+      item.classList.toggle('active', item.dataset.page === page);
+    });
+    document.querySelectorAll('.page-content').forEach((content) => {
+      content.classList.toggle('hidden', content.id !== `${page}-page`);
+    });
+    const pageTitleMap = {
+      explore: 'Explore',
+      'my-posts': 'My Posts',
+      favorites: 'Favorites',
+      write: 'Write Post',
+    };
+    const pageTitle = document.getElementById('page-title');
+    if (pageTitle) pageTitle.textContent = pageTitleMap[page] || page;
+    if (updateHash) {
+      this.updateRouteHash(page);
+    }
+    if (page === 'explore') {
+      this.loadExplorePosts();
+    } else if (page === 'my-posts') {
+      this.loadMyPosts();
+    } else if (page === 'favorites') {
+      this.loadFavorites();
+    }
+  }
+
+  async loadExplorePosts(page = 1) {
+    this.currentPage.explore = page;
+    const keyword = document.getElementById('searchKeyword')?.value || '';
+    let url = `${this.apiBase}/post/list?page=${page}&limit=${this.pageSize}`;
+    if (keyword) url += `&keyword=${encodeURIComponent(keyword)}`;
+    url += `&is_published=true`;
+    this.showLoading('exploreList');
+    try {
+      const response = await fetch(url, {
+        method: 'GET',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200 && result.data) {
+        this.renderPostList(result.data, 'exploreList', 'explorePagination');
+        this.updateExploreStats(result.data.posts);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to load posts',
+          showToast,
+        )
+      ) {
+        return;
+      } else {
+        this.showError('exploreList', result.message || 'Failed to load posts');
+      }
+    } catch (error) {
+      this.showError('exploreList', 'Network error: ' + error.message);
+    }
+  }
+
+  async loadMyPosts(page = 1) {
+    this.currentPage['my-posts'] = page;
+    const keyword = document.getElementById('searchKeyword')?.value || '';
+    let url = `${this.apiBase}/post/my-list?page=${page}&limit=${this.pageSize}`;
+    if (keyword) url += `&keyword=${encodeURIComponent(keyword)}`;
+    this.showLoading('myPostsList');
+    try {
+      const response = await fetch(url, {
+        method: 'GET',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200 && result.data) {
+        this.renderPostList(
+          result.data,
+          'myPostsList',
+          'myPostsPagination',
+          true,
+        );
+        this.updateMyPostsStats(result.data.posts);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to load posts',
+          showToast,
+        )
+      ) {
+        return;
+      } else {
+        this.showError('myPostsList', result.message || 'Failed to load posts');
+      }
+    } catch (error) {
+      this.showError('myPostsList', 'Network error: ' + error.message);
+    }
+  }
+
+  async loadFavorites(page = 1) {
+    this.currentPage.favorites = page;
+    this.showLoading('favoritesList');
+    const url = `${this.apiBase}/post/favorite-list?page=${page}&limit=${this.pageSize}`;
+    try {
+      const response = await fetch(url, {
+        method: 'GET',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200 && result.data) {
+        this.renderPostList(
+          result.data,
+          'favoritesList',
+          'favoritesPagination',
+          false,
+        );
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to load favorites',
+          showToast,
+        )
+      ) {
+        return;
+      } else {
+        this.showError(
+          'favoritesList',
+          result.message || 'Failed to load favorites',
+        );
+      }
+    } catch (error) {
+      this.showError('favoritesList', 'Network error: ' + error.message);
+    }
+  }
+
+  renderPostList(data, listId, paginationId, isMyPosts = false) {
+    const container = document.getElementById(listId);
+    const paginationContainer = document.getElementById(paginationId);
+    if (!data.posts || data.posts.length === 0) {
+      container.innerHTML = '<div class="no-data">No posts found</div>';
+      if (paginationContainer) {
+        const totalEl = paginationContainer.querySelector('.pagination-info');
+        const controlsEl = paginationContainer.querySelector(
+          '.pagination-controls',
+        );
+        if (totalEl) totalEl.innerHTML = '<span>Total: 0 posts</span>';
+        if (controlsEl) controlsEl.innerHTML = '';
+      }
+      return;
+    }
+    let html = '';
+    data.posts.forEach((post) => {
+      html += this.renderPostCard(post, isMyPosts);
+    });
+    container.innerHTML = html;
+    if (paginationContainer) {
+      const totalPages = Math.ceil(data.total / data.limit) || 1;
+      this.renderPagination(
+        data.page,
+        totalPages,
+        data.total,
+        data.posts.length,
+        paginationId,
+      );
+    }
+  }
+
+  renderPostCard(post, isMyPosts = false) {
+    const coverHtml = post.cover_image
+      ? `<img src="${post.cover_image.download_url}" class="post-cover" alt="" onerror="this.style.display='none'" loading="lazy" />`
+      : '';
+    const summaryHtml = post.summary
+      ? `<p class="post-summary">${this.escapeHtml(post.summary)}</p>`
+      : '';
+    const likeClass = post.is_liked ? 'liked' : '';
+    const favoriteClass = post.is_favorited ? 'favorited' : '';
+    let actionsHtml = '';
+    if (isMyPosts) {
+      actionsHtml = `
+        <div class="post-actions">
+          <button class="btn btn-sm btn-secondary" onclick="event.stopPropagation();app.editPost('${post.id}')">Edit</button>
+          <button class="btn btn-sm btn-danger" onclick="event.stopPropagation();app.deletePost('${post.id}')">Delete</button>
+        </div>
+      `;
+    }
+    return `
+      <div class="post-card" onclick="app.showPostDetail('${post.id}')">
+        <div class="post-header">
+          <div class="post-avatar">${(post.username || 'U').charAt(0).toUpperCase()}</div>
+          <div class="post-meta">
+            <div class="post-author">${this.escapeHtml(post.username || 'Unknown')}</div>
+            <div class="post-time">${this.formatTime(post.created_at)}</div>
+          </div>
+        </div>
+        ${coverHtml}
+        <h3 class="post-title">${this.escapeHtml(post.title)}</h3>
+        ${summaryHtml}
+        <div class="post-stats">
+          <span class="post-stat">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
+            ${post.view_count}
+          </span>
+          <span class="post-stat ${likeClass}">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="${post.is_liked ? 'currentColor' : 'none'}" stroke="currentColor" stroke-width="2"><path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"/></svg>
+            ${post.like_count}
+          </span>
+          <span class="post-stat ${favoriteClass}">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="${post.is_favorited ? 'currentColor' : 'none'}" stroke="currentColor" stroke-width="2"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
+            ${post.favorite_count}
+          </span>
+          <span class="post-stat">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></svg>
+            ${post.comment_count}
+          </span>
+          ${!post.is_published ? '<span class="post-stat" style="color:var(--text-tertiary);"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg> Draft</span>' : ''}
+        </div>
+        ${actionsHtml}
+      </div>
+    `;
+  }
+
+  renderPagination(
+    currentPage,
+    totalPages,
+    totalCount,
+    pageSize,
+    paginationContainerId,
+  ) {
+    const container = document.getElementById(paginationContainerId);
+    if (!container) return;
+    const totalEl = container.querySelector('.pagination-info');
+    const controlsEl = container.querySelector('.pagination-controls');
+    if (!totalEl || !controlsEl) return;
+
+    const startRecord = (currentPage - 1) * pageSize + 1;
+    const endRecord = startRecord + pageSize - 1;
+    const totalText =
+      totalCount > 0 ? `Total: ${totalCount} posts` : 'Total: 0 posts';
+    const rangeText =
+      totalCount > 0
+        ? `Showing ${startRecord} - ${Math.min(endRecord, totalCount)}`
+        : 'Showing 0 - 0';
+
+    totalEl.innerHTML = `<span>${totalText}</span><span>${rangeText}</span>`;
+
+    let pageButtonsHtml = '';
+    if (totalPages > 1) {
+      const maxVisiblePages = 5;
+      let startPage = Math.max(
+        1,
+        currentPage - Math.floor(maxVisiblePages / 2),
+      );
+      let endPage = Math.min(totalPages, startPage + maxVisiblePages - 1);
+      if (endPage - startPage < maxVisiblePages - 1) {
+        startPage = Math.max(1, endPage - maxVisiblePages + 1);
+      }
+      if (startPage > 1) {
+        pageButtonsHtml += `<button class="page-btn" onclick="app.goToPage('${this.currentTab}', 1)">1</button>`;
+        if (startPage > 2) {
+          pageButtonsHtml += `<span class="page-ellipsis">...</span>`;
+        }
+      }
+      for (let i = startPage; i <= endPage; i++) {
+        pageButtonsHtml += `<button class="page-btn ${i === currentPage ? 'active' : ''}" onclick="app.goToPage('${this.currentTab}', ${i})">${i}</button>`;
+      }
+      if (endPage < totalPages) {
+        if (endPage < totalPages - 1) {
+          pageButtonsHtml += `<span class="page-ellipsis">...</span>`;
+        }
+        pageButtonsHtml += `<button class="page-btn" onclick="app.goToPage('${this.currentTab}', ${totalPages})">${totalPages}</button>`;
+      }
+    }
+
+    controlsEl.innerHTML = `
+      <button class="btn btn-sm" onclick="app.goToPrevPage()" ${currentPage <= 1 ? 'disabled' : ''}>← Previous</button>
+      <div class="page-numbers">${pageButtonsHtml}</div>
+      <button class="btn btn-sm" onclick="app.goToNextPage()" ${currentPage >= totalPages ? 'disabled' : ''}>Next →</button>
+    `;
+  }
+
+  goToNextPage() {
+    const tab = this.currentTab;
+    const currentPage = this.currentPage[tab];
+    if (tab === 'explore') {
+      this.loadExplorePosts(currentPage + 1);
+    } else if (tab === 'my-posts') {
+      this.loadMyPosts(currentPage + 1);
+    } else if (tab === 'favorites') {
+      this.loadFavorites(currentPage + 1);
+    }
+  }
+
+  goToPrevPage() {
+    const tab = this.currentTab;
+    const currentPage = this.currentPage[tab];
+    if (tab === 'explore') {
+      this.loadExplorePosts(currentPage - 1);
+    } else if (tab === 'my-posts') {
+      this.loadMyPosts(currentPage - 1);
+    } else if (tab === 'favorites') {
+      this.loadFavorites(currentPage - 1);
+    }
+  }
+
+  goToPage(tab, pageNum) {
+    if (tab === 'explore') {
+      this.loadExplorePosts(pageNum);
+    } else if (tab === 'my-posts') {
+      this.loadMyPosts(pageNum);
+    } else if (tab === 'favorites') {
+      this.loadFavorites(pageNum);
+    }
+  }
+
+  onSearchInput() {
+    clearTimeout(this.searchDebounceTimer);
+    this.searchDebounceTimer = setTimeout(() => {
+      if (this.currentTab === 'explore') {
+        this.loadExplorePosts(1);
+      } else if (this.currentTab === 'my-posts') {
+        this.loadMyPosts(1);
+      }
+    }, 400);
+  }
+
+  async showPostDetail(postId) {
+    this.currentPostId = postId;
+    try {
+      const response = await fetch(`${this.apiBase}/post/get/${postId}`, {
+        method: 'GET',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200 && result.data) {
+        this.renderPostDetail(result.data);
+        document.getElementById('postDetailModal').classList.add('active');
+        this.loadComments(postId);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to load post',
+          showToast,
+        )
+      ) {
+        return;
+      } else {
+        showToast(result.message || 'Failed to load post', 'error');
+      }
+    } catch (error) {
+      showToast('Network error: ' + error.message, 'error');
+    }
+  }
+
+  renderPostDetail(post) {
+    const coverHtml = post.cover_image
+      ? `<img src="${post.cover_image.download_url}" class="post-cover" alt="" onerror="this.style.display='none'" loading="lazy" style="margin-bottom:16px;cursor:pointer;" onclick="app.openImagePreview('${post.cover_image.download_url}')" />`
+      : '';
+    let imagesHtml = '';
+    if (post.images && post.images.length > 0) {
+      imagesHtml =
+        '<div class="post-images" style="display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin:16px 0;">';
+      post.images.forEach((img) => {
+        imagesHtml += `<div style="display:block;border-radius:8px;overflow:hidden;border:1px solid var(--border);cursor:pointer;" onclick="app.openImagePreview('${img.download_url}')"><img src="${img.download_url}" style="width:100%;height:140px;object-fit:cover;display:block;" alt="" onerror="this.style.display='none'" loading="lazy" /></div>`;
+      });
+      imagesHtml += '</div>';
+    }
+    const likeClass = post.is_liked ? 'liked' : '';
+    const favoriteClass = post.is_favorited ? 'favorited' : '';
+    const html = `
+      <div class="post-header">
+        <div class="post-avatar">${(post.username || 'U').charAt(0).toUpperCase()}</div>
+        <div class="post-meta">
+          <div class="post-author">${this.escapeHtml(post.username || 'Unknown')}</div>
+          <div class="post-time">${this.formatTime(post.created_at)}</div>
+        </div>
+      </div>
+      ${coverHtml}
+      <h2 class="preview-title">${this.escapeHtml(post.title)}</h2>
+      <div class="markdown-body">${this.md.render(post.content || '')}</div>
+      ${imagesHtml}
+      <div class="post-stats" style="margin-top:20px;padding-top:14px;border-top:1.5px solid var(--border);">
+        <span class="post-stat">
+          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
+          ${post.view_count}
+        </span>
+        <span class="post-stat ${likeClass}" style="cursor:pointer;" onclick="app.toggleLike('${post.id}')">
+          <svg width="16" height="16" viewBox="0 0 24 24" fill="${post.is_liked ? 'currentColor' : 'none'}" stroke="currentColor" stroke-width="2"><path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"/></svg>
+          ${post.like_count}
+        </span>
+        <span class="post-stat ${favoriteClass}" style="cursor:pointer;" onclick="app.toggleFavorite('${post.id}')">
+          <svg width="16" height="16" viewBox="0 0 24 24" fill="${post.is_favorited ? 'currentColor' : 'none'}" stroke="currentColor" stroke-width="2"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
+          ${post.favorite_count}
+        </span>
+        <span class="post-stat">
+          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></svg>
+          ${post.comment_count}
+        </span>
+      </div>
+      <div class="comment-section">
+        <h4>Comments (${post.comment_count})</h4>
+        <div class="comment-input-row">
+          <input type="text" class="comment-input" id="commentInput" placeholder="Share your thoughts..." />
+          <button class="btn btn-primary" onclick="app.submitComment()">Send</button>
+        </div>
+        <div id="commentsList"><div class="no-data">Loading comments...</div></div>
+      </div>
+    `;
+    document.getElementById('postDetailContent').innerHTML = html;
+  }
+
+  closePostDetail() {
+    document.getElementById('postDetailModal').classList.remove('active');
+    this.currentPostId = null;
+  }
+
+  async loadComments(postId) {
+    try {
+      const response = await fetch(
+        `${this.apiBase}/comment/list?post_id=${postId}&page=1&limit=50`,
+        {
+          method: 'GET',
+          headers: { 'Content-Type': 'application/json' },
+          credentials: 'include',
+        },
+      );
+      const result = await response.json();
+      if (result.code === 200 && result.data) {
+        this.renderComments(result.data.comments);
+      }
+    } catch (error) {
+      console.error('Failed to load comments:', error);
+    }
+  }
+
+  renderComments(comments) {
+    const container = document.getElementById('commentsList');
+    if (!comments || comments.length === 0) {
+      container.innerHTML = '<div class="no-data">No comments yet</div>';
+      return;
+    }
+    let html = '';
+    comments.forEach((comment) => {
+      html += this.renderCommentItem(comment);
+    });
+    container.innerHTML = html;
+  }
+
+  renderCommentItem(comment) {
+    let repliesHtml = '';
+    if (comment.replies && comment.replies.length > 0) {
+      repliesHtml = '<div class="replies">';
+      comment.replies.forEach((reply) => {
+        repliesHtml += this.renderCommentItem(reply);
+      });
+      repliesHtml += '</div>';
+    }
+    return `
+      <div class="comment-item">
+        <div class="comment-header">
+          <div class="post-avatar" style="width:32px;height:32px;font-size:12px;">${(comment.username || 'U').charAt(0).toUpperCase()}</div>
+          <div style="flex:1;min-width:0;">
+            <div class="comment-author">${this.escapeHtml(comment.username)}</div>
+            <div class="comment-time">${this.formatTime(comment.created_at)}</div>
+          </div>
+        </div>
+        <p class="comment-text">${this.escapeHtml(comment.content)}</p>
+        <div class="comment-actions">
+          <button class="comment-action" onclick="event.stopPropagation();app.replyToComment('${comment.id}', '${this.escapeHtml(comment.content)}')">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="vertical-align:middle;margin-right:3px;"><polyline points="9 17 4 12 9 7"/><path d="M20 18v-2a4 4 0 0 0-4-4H4"/></svg>
+            Reply
+          </button>
+        </div>
+        ${repliesHtml}
+      </div>
+    `;
+  }
+
+  async submitComment() {
+    const input = document.getElementById('commentInput');
+    const content = input.value.trim();
+    if (!content) {
+      showToast('Comment content is required', 'error');
+      return;
+    }
+    if (!this.currentPostId) return;
+    try {
+      const response = await fetch(`${this.apiBase}/comment/create`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+        body: JSON.stringify({ post_id: this.currentPostId, content }),
+      });
+      const result = await response.json();
+      if (result.code === 200) {
+        input.value = '';
+        showToast('Comment posted', 'success');
+        await this.showPostDetail(this.currentPostId);
+        this.refreshCurrentList();
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to post comment',
+          showToast,
+        )
+      ) {
+        return;
+      } else {
+        showToast(result.message || 'Failed to post comment', 'error');
+      }
+    } catch (error) {
+      showToast('Network error: ' + error.message, 'error');
+    }
+  }
+
+  replyToComment(commentId, commentContent) {
+    this.replyCommentId = commentId;
+    this.replyCommentContent = commentContent || '';
+    document.getElementById('replyTargetText').textContent =
+      this.replyCommentContent;
+    document.getElementById('replyContent').value = '';
+    document.getElementById('replyModal').classList.add('active');
+    setTimeout(() => document.getElementById('replyContent').focus(), 100);
+  }
+
+  closeReply() {
+    document.getElementById('replyModal').classList.remove('active');
+    this.replyCommentId = null;
+    this.replyCommentContent = '';
+  }
+
+  async submitReply() {
+    const content = document.getElementById('replyContent').value.trim();
+    if (!content) {
+      showToast('Reply content is required', 'error');
+      return;
+    }
+    if (!this.replyCommentId || !this.currentPostId) {
+      showToast('Invalid reply state', 'error');
+      return;
+    }
+    try {
+      const response = await fetch(`${this.apiBase}/comment/create`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+        body: JSON.stringify({
+          post_id: this.currentPostId,
+          parent_id: this.replyCommentId,
+          content: content,
+        }),
+      });
+      const result = await response.json();
+      if (result.code === 200) {
+        showToast('Reply posted', 'success');
+        this.closeReply();
+        await this.showPostDetail(this.currentPostId);
+        this.refreshCurrentList();
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to reply',
+          showToast,
+        )
+      ) {
+        return;
+      } else {
+        showToast(result.message || 'Failed to reply', 'error');
+      }
+    } catch (error) {
+      showToast('Network error: ' + error.message, 'error');
+    }
+  }
+
+  refreshCurrentList() {
+    if (this.currentTab === 'explore') {
+      this.loadExplorePosts(this.currentPage.explore);
+    } else if (this.currentTab === 'my-posts') {
+      this.loadMyPosts(this.currentPage['my-posts']);
+    } else if (this.currentTab === 'favorites') {
+      this.loadFavorites(this.currentPage.favorites);
+    }
+  }
+
+  async toggleLike(postId) {
+    try {
+      const response = await fetch(`${this.apiBase}/post/like/${postId}`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200) {
+        showToast(result.data.liked ? 'Liked' : 'Unliked', 'success');
+        this.showPostDetail(postId);
+        if (this.currentTab === 'explore') {
+          this.loadExplorePosts(this.currentPage.explore);
+        } else if (this.currentTab === 'my-posts') {
+          this.loadMyPosts(this.currentPage['my-posts']);
+        } else if (this.currentTab === 'favorites') {
+          this.loadFavorites(this.currentPage.favorites);
+        }
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to toggle like',
+          showToast,
+        )
+      ) {
+        return;
+      } else {
+        showToast(result.message || 'Failed to toggle like', 'error');
+      }
+    } catch (error) {
+      showToast('Network error: ' + error.message, 'error');
+    }
+  }
+
+  async toggleFavorite(postId) {
+    try {
+      const response = await fetch(`${this.apiBase}/post/favorite/${postId}`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200) {
+        showToast(
+          result.data.favorited
+            ? 'Added to favorites'
+            : 'Removed from favorites',
+          'success',
+        );
+        this.showPostDetail(postId);
+        if (this.currentTab === 'explore') {
+          this.loadExplorePosts(this.currentPage.explore);
+        } else if (this.currentTab === 'my-posts') {
+          this.loadMyPosts(this.currentPage['my-posts']);
+        } else if (this.currentTab === 'favorites') {
+          this.loadFavorites(this.currentPage.favorites);
+        }
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to toggle favorite',
+          showToast,
+        )
+      ) {
+        return;
+      } else {
+        showToast(result.message || 'Failed to toggle favorite', 'error');
+      }
+    } catch (error) {
+      showToast('Network error: ' + error.message, 'error');
+    }
+  }
+
+  previewPost() {
+    const title = document.getElementById('writeTitle').value.trim();
+    const content = document.getElementById('writeContent').value.trim();
+    if (!title && !content) {
+      showToast('Please enter title or content', 'error');
+      return;
+    }
+    document.getElementById('previewTitle').textContent = title || 'Untitled';
+    document.getElementById('previewBody').innerHTML = this.md.render(content);
+    document.getElementById('previewModal').classList.add('active');
+  }
+
+  closePreview() {
+    document.getElementById('previewModal').classList.remove('active');
+  }
+
+  async submitPost() {
+    const title = document.getElementById('writeTitle').value.trim();
+    const summary =
+      document.getElementById('writeSummary').value.trim() || null;
+    const content = document.getElementById('writeContent').value.trim();
+    const coverImageId = document.getElementById('coverImageId').value || null;
+    const isPublished = document.getElementById('writePublish').checked;
+    if (!title) {
+      showToast('Title is required', 'error');
+      return;
+    }
+    if (!content) {
+      showToast('Content is required', 'error');
+      return;
+    }
+    const imageIds = this.uploadedImages.map((img) => img.id);
+    try {
+      const response = await fetch(`${this.apiBase}/post/create`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+        body: JSON.stringify({
+          title,
+          summary: summary || null,
+          content,
+          cover_image_id: coverImageId,
+          is_published: isPublished,
+          image_ids: imageIds,
+        }),
+      });
+      const result = await response.json();
+      if (result.code === 200) {
+        showToast('Post published', 'success');
+        this.resetEditor();
+        this.switchPage('explore');
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to publish post',
+          showToast,
+        )
+      ) {
+        return;
+      } else {
+        showToast(result.message || 'Failed to publish post', 'error');
+      }
+    } catch (error) {
+      showToast('Network error: ' + error.message, 'error');
+    }
+  }
+
+  resetEditor() {
+    document.getElementById('writeTitle').value = '';
+    document.getElementById('writeSummary').value = '';
+    document.getElementById('writeContent').value = '';
+    document.getElementById('coverImageInput').value = '';
+    document.getElementById('coverImageName').textContent = '';
+    document.getElementById('coverImageId').value = '';
+    document.getElementById('contentImagesInput').value = '';
+    document.getElementById('contentImagesPreview').innerHTML = '';
+    this.uploadedImages = [];
+  }
+
+  async uploadCoverImage(input) {
+    const file = input.files[0];
+    if (!file) return;
+    const result = await this.uploadImageFile(file);
+    if (result) {
+      document.getElementById('coverImageName').textContent = file.name;
+      document.getElementById('coverImageId').value = result.id;
+    }
+  }
+
+  async uploadContentImages(input) {
+    const files = Array.from(input.files);
+    for (const file of files) {
+      const result = await this.uploadImageFile(file);
+      if (result) {
+        this.uploadedImages.push(result);
+        this.renderImagePreview(result, file);
+      }
+    }
+  }
+
+  async uploadImageFile(file) {
+    try {
+      const arrayBuffer = await file.arrayBuffer();
+      const bytes = new Uint8Array(arrayBuffer);
+      const response = await fetch(`${this.apiBase}/image/upload`, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/octet-stream',
+          'X-File-Name': encodeURIComponent(file.name),
+          'X-Mime-Type': file.type,
+          'X-Original-Name': encodeURIComponent(file.name),
+        },
+        credentials: 'include',
+        body: bytes,
+      });
+      const result = await response.json();
+      if (result.code === 200 && result.data) {
+        return result.data;
+      } else {
+        showToast(result.message || 'Failed to upload image', 'error');
+        return null;
+      }
+    } catch (error) {
+      showToast('Upload error: ' + error.message, 'error');
+      return null;
+    }
+  }
+
+  renderImagePreview(imageData, file) {
+    const container = document.getElementById('contentImagesPreview');
+    const div = document.createElement('div');
+    div.className = 'image-preview-item';
+    div.dataset.id = imageData.id;
+    const url = URL.createObjectURL(file);
+    div.innerHTML = `
+      <img src="${url}" alt="" />
+      <button class="remove-btn" onclick="app.removeImage('${imageData.id}')">&times;</button>
+    `;
+    container.appendChild(div);
+  }
+
+  removeImage(imageId) {
+    this.uploadedImages = this.uploadedImages.filter(
+      (img) => img.id !== imageId,
+    );
+    const item = document.querySelector(
+      `.image-preview-item[data-id="${imageId}"]`,
+    );
+    if (item) item.remove();
+  }
+
+  async deletePost(postId) {
+    const confirmed = await HLConfirm.show(
+      'Are you sure you want to delete this post?',
+    );
+    if (!confirmed) return;
+    try {
+      const response = await fetch(`${this.apiBase}/post/delete/${postId}`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200) {
+        showToast('Post deleted', 'success');
+        this.loadMyPosts(this.currentPage['my-posts']);
+      } else {
+        showToast(result.message || 'Failed to delete post', 'error');
+      }
+    } catch (error) {
+      showToast('Network error: ' + error.message, 'error');
+    }
+  }
+
+  async editPost(postId) {
+    try {
+      const response = await fetch(`${this.apiBase}/post/get/${postId}`, {
+        method: 'GET',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200 && result.data) {
+        const post = result.data;
+        this.editingPostId = postId;
+        document.getElementById('editTitle').value = post.title;
+        document.getElementById('editSummary').value = post.summary || '';
+        document.getElementById('editContent').value = post.content;
+        document.getElementById('editPublish').checked = post.is_published;
+        document.getElementById('editModal').classList.add('active');
+      } else {
+        showToast(result.message || 'Failed to load post', 'error');
+      }
+    } catch (error) {
+      showToast('Network error: ' + error.message, 'error');
+    }
+  }
+
+  closeEdit() {
+    document.getElementById('editModal').classList.remove('active');
+    this.editingPostId = null;
+  }
+
+  async submitEdit() {
+    if (!this.editingPostId) return;
+    const title = document.getElementById('editTitle').value.trim() || null;
+    const summary = document.getElementById('editSummary').value.trim() || null;
+    const content = document.getElementById('editContent').value.trim() || null;
+    const isPublished = document.getElementById('editPublish').checked;
+    const body = {};
+    if (title) body.title = title;
+    if (summary !== null) body.summary = summary;
+    if (content) body.content = content;
+    body.is_published = isPublished;
+    try {
+      const response = await fetch(
+        `${this.apiBase}/post/update/${this.editingPostId}`,
+        {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          credentials: 'include',
+          body: JSON.stringify(body),
+        },
+      );
+      const result = await response.json();
+      if (result.code === 200) {
+        showToast('Post updated', 'success');
+        this.closeEdit();
+        this.loadMyPosts(this.currentPage['my-posts']);
+      } else {
+        showToast(result.message || 'Failed to update post', 'error');
+      }
+    } catch (error) {
+      showToast('Network error: ' + error.message, 'error');
+    }
+  }
+
+  showLoading(elementId) {
+    const el = document.getElementById(elementId);
+    if (el) el.innerHTML = '<div class="no-data">Loading...</div>';
+  }
+
+  showError(elementId, message) {
+    const el = document.getElementById(elementId);
+    if (el)
+      el.innerHTML = `<div class="no-data">Error: ${this.escapeHtml(message)}</div>`;
+  }
+
+  escapeHtml(text) {
+    if (!text) return '';
+    const div = document.createElement('div');
+    div.textContent = text;
+    return div.innerHTML;
+  }
+
+  formatTime(timestamp) {
+    if (!timestamp) return '';
+    const date = new Date(timestamp);
+    return date.toLocaleString();
+  }
+
+  updateExploreStats(posts) {
+    if (!posts) return;
+    const totalPosts = posts.length;
+    const totalLikes = posts.reduce(
+      (sum, post) => sum + (post.like_count || 0),
+      0,
+    );
+    const totalComments = posts.reduce(
+      (sum, post) => sum + (post.comment_count || 0),
+      0,
+    );
+    const totalPostsEl = document.getElementById('explore-total-posts');
+    const totalLikesEl = document.getElementById('explore-total-likes');
+    const totalCommentsEl = document.getElementById('explore-total-comments');
+    if (totalPostsEl) totalPostsEl.textContent = totalPosts;
+    if (totalLikesEl) totalLikesEl.textContent = totalLikes;
+    if (totalCommentsEl) totalCommentsEl.textContent = totalComments;
+  }
+
+  updateMyPostsStats(posts) {
+    if (!posts) return;
+    const totalPosts = posts.length;
+    const totalLikes = posts.reduce(
+      (sum, post) => sum + (post.like_count || 0),
+      0,
+    );
+    const totalComments = posts.reduce(
+      (sum, post) => sum + (post.comment_count || 0),
+      0,
+    );
+    const totalPostsEl = document.getElementById('my-total-posts');
+    const totalLikesEl = document.getElementById('my-total-likes');
+    const totalCommentsEl = document.getElementById('my-total-comments');
+    if (totalPostsEl) totalPostsEl.textContent = totalPosts;
+    if (totalLikesEl) totalLikesEl.textContent = totalLikes;
+    if (totalCommentsEl) totalCommentsEl.textContent = totalComments;
+  }
+
+  openImagePreview(imageUrl) {
+    this.currentPreviewImageUrl = imageUrl;
+    this.currentZoom = 1;
+    this.imagePosition = { x: 0, y: 0 };
+    const img = document.getElementById('blogPreviewImage');
+    if (img) {
+      img.style.display = 'block';
+      img.src = imageUrl;
+      img.style.transition = 'transform 0.2s ease';
+    }
+    this.updateImagePosition();
+    document.getElementById('imagePreviewModal').classList.add('active');
+    this.setupImagePreviewInteractions();
+  }
+
+  closeImagePreview() {
+    document.getElementById('imagePreviewModal').classList.remove('active');
+    this.currentPreviewImageUrl = null;
+    this.currentZoom = 1;
+    this.imagePosition = { x: 0, y: 0 };
+    this.isDragging = false;
+    this.pendingPosition = null;
+    if (this.rafId) {
+      cancelAnimationFrame(this.rafId);
+      this.rafId = null;
+    }
+    const img = document.getElementById('blogPreviewImage');
+    if (img) {
+      img.style.display = 'block';
+      img.style.transition = 'transform 0.2s ease';
+    }
+  }
+
+  zoomIn() {
+    this.currentZoom = Math.min(this.currentZoom + 0.25, 3);
+    this.updateImagePosition();
+  }
+
+  zoomOut() {
+    this.currentZoom = Math.max(this.currentZoom - 0.25, 0.5);
+    this.updateImagePosition();
+  }
+
+  resetZoom() {
+    this.currentZoom = 1;
+    this.imagePosition = { x: 0, y: 0 };
+    this.updateImagePosition();
+  }
+
+  updateImagePosition() {
+    const img = document.getElementById('blogPreviewImage');
+    if (img) {
+      img.style.transform = `translate(${this.imagePosition.x}px, ${this.imagePosition.y}px) scale(${this.currentZoom})`;
+    }
+  }
+
+  setupImagePreviewInteractions() {
+    const container = document.getElementById('imagePreviewContainer');
+    const img = document.getElementById('blogPreviewImage');
+    if (!container || !img) return;
+    container.onwheel = (event) => this.handleImageWheel(event);
+    container.onmousedown = (event) => this.handleImageMouseDown(event);
+    container.onmousemove = (event) => this.handleImageMouseMove(event);
+    container.onmouseup = () => this.handleImageMouseUp();
+    container.onmouseleave = () => this.handleImageMouseUp();
+    container.ondblclick = () => this.resetZoom();
+    img.ondragstart = () => false;
+  }
+
+  handleImageWheel(event) {
+    event.preventDefault();
+    const delta = event.deltaY > 0 ? -0.1 : 0.1;
+    const newZoom = Math.max(0.5, Math.min(5, this.currentZoom + delta));
+    if (newZoom !== this.currentZoom) {
+      this.currentZoom = newZoom;
+      this.updateImagePosition();
+    }
+  }
+
+  handleImageMouseDown(event) {
+    if (event.button !== 0) return;
+    event.preventDefault();
+    this.isDragging = true;
+    this.dragStart = {
+      x: event.clientX - this.imagePosition.x,
+      y: event.clientY - this.imagePosition.y,
+    };
+    const container = document.getElementById('imagePreviewContainer');
+    const img = document.getElementById('blogPreviewImage');
+    if (container) container.style.cursor = 'grabbing';
+    if (img) img.style.transition = 'none';
+  }
+
+  handleImageMouseMove(event) {
+    if (!this.isDragging) return;
+    event.preventDefault();
+    this.pendingPosition = {
+      x: event.clientX - this.dragStart.x,
+      y: event.clientY - this.dragStart.y,
+    };
+    if (!this.rafId) {
+      this.rafId = requestAnimationFrame(() => {
+        if (this.pendingPosition) {
+          this.imagePosition.x = this.pendingPosition.x;
+          this.imagePosition.y = this.pendingPosition.y;
+          this.updateImagePosition();
+        }
+        this.rafId = null;
+      });
+    }
+  }
+
+  handleImageMouseUp() {
+    this.isDragging = false;
+    this.pendingPosition = null;
+    if (this.rafId) {
+      cancelAnimationFrame(this.rafId);
+      this.rafId = null;
+    }
+    const container = document.getElementById('imagePreviewContainer');
+    const img = document.getElementById('blogPreviewImage');
+    if (container) container.style.cursor = 'grab';
+    if (img) img.style.transition = 'transform 0.2s ease';
+  }
+
+  downloadCurrentImage() {
+    if (!this.currentPreviewImageUrl) return;
+    const link = document.createElement('a');
+    link.href = this.currentPreviewImageUrl;
+    link.download = 'image.jpg';
+    link.target = '_blank';
+    link.click();
+  }
+}
+
+const app = new BlogApp();
+
+window.addEventListener('DOMContentLoaded', () => {
+  app.init();
+
+  window.addEventListener('hashchange', () => {
+    const routeState = app.parseRouteHash();
+    if (routeState.page && routeState.page !== app.currentTab) {
+      app.switchPage(routeState.page, false);
+    }
+  });
+
+  document.querySelectorAll('.nav-item[data-page]').forEach((item) => {
+    item.addEventListener('click', () => {
+      const page = item.dataset.page;
+      if (page) {
+        app.switchPage(page);
+        const sidebar = document.querySelector('.sidebar');
+        const sidebarOverlay = document.getElementById('sidebar-overlay');
+        if (sidebar && sidebar.classList.contains('open')) {
+          sidebar.classList.remove('open');
+        }
+        if (sidebarOverlay && sidebarOverlay.classList.contains('active')) {
+          sidebarOverlay.classList.remove('active');
+        }
+      }
+    });
+  });
+
+  const mobileMenuBtn = document.getElementById('mobile-menu-btn');
+  const sidebar = document.querySelector('.sidebar');
+  const sidebarOverlay = document.getElementById('sidebar-overlay');
+
+  if (mobileMenuBtn && sidebar && sidebarOverlay) {
+    mobileMenuBtn.addEventListener('click', () => {
+      sidebar.classList.toggle('open');
+      sidebarOverlay.classList.toggle('active');
+    });
+
+    sidebarOverlay.addEventListener('click', () => {
+      sidebar.classList.remove('open');
+      sidebarOverlay.classList.remove('active');
+    });
+  }
+
+  const logoutBtn = document.getElementById('logout-btn');
+  if (logoutBtn) {
+    logoutBtn.addEventListener('click', () => handleLogout());
+  }
+});
+
+document.getElementById('postDetailModal').addEventListener('click', (e) => {
+  if (e.target.id === 'postDetailModal') app.closePostDetail();
+});
+
+document.getElementById('previewModal').addEventListener('click', (e) => {
+  if (e.target.id === 'previewModal') app.closePreview();
+});
+
+document.getElementById('editModal').addEventListener('click', (e) => {
+  if (e.target.id === 'editModal') app.closeEdit();
+});
+
+document.getElementById('replyModal').addEventListener('click', (e) => {
+  if (e.target.id === 'replyModal') app.closeReply();
+});
+
+document.getElementById('imagePreviewModal').addEventListener('click', (e) => {
+  if (e.target.id === 'imagePreviewModal') app.closeImagePreview();
+});
+
+async function handleLogout() {
+  try {
+    await fetch('/api/auth/logout', {
+      method: 'POST',
+      credentials: 'include',
+    });
+  } catch (error) {
+    console.error('Logout request failed:', error);
+  }
+  window.location.href = '/auth?location=/blog';
+}
+
+function showToast(message, type = 'info', duration = 3000) {
+  const container = document.getElementById('toast-container');
+  if (!container) return;
+  const toast = document.createElement('div');
+  toast.className = 'toast';
+  const iconMap = { success: '✓', error: '✗', info: 'ℹ' };
+  toast.innerHTML = `
+    <span class="toast-icon ${type}">${iconMap[type] || iconMap.info}</span>
+    <span class="toast-content">${message}</span>
+  `;
+  toast.addEventListener('click', () => hideToast(toast));
+  container.appendChild(toast);
+  setTimeout(() => hideToast(toast), duration);
+}
+
+function hideToast(toast) {
+  if (!toast || toast.classList.contains('hiding')) return;
+  toast.classList.add('hiding');
+  setTimeout(() => toast.remove(), 300);
+}
diff --git a/resources/static/chat/index.html b/resources/static/chat/index.html
index 211823ec..05603c6d 100644
--- a/resources/static/chat/index.html
+++ b/resources/static/chat/index.html
@@ -16,6 +16,7 @@
     <script src="../common/js/markdown-it.min.js"></script>
     <script src="../common/js/highlight.min.js"></script>
     <script src="../common/js/common.js"></script>
+    <script src="../common/js/error-handler.js"></script>
     <style>
       .btn-upload {
         padding: 8px 16px;
@@ -3117,6 +3118,14 @@ <h1 class="nav-title light-bg">
               uploadedChunks.add(index);
               saveProgress();
               return data;
+            } else if (
+              HyperlaneErrorHandler.handleResponse(
+                data,
+                'Upload failed',
+                (msg, type) => showUploadStatus(msg, type),
+              )
+            ) {
+              throw new Error(data.msg || 'Upload failed');
             } else if (data.code === 0) {
               showUploadStatus(`Upload failed: ${data.msg}`, 'error');
               throw new Error(data.msg);
@@ -3157,6 +3166,14 @@ <h1 class="nav-title light-bg">
               registerSuccessfulUploads = await response.json();
               if (registerSuccessfulUploads.code == 200) {
                 registerSuccess = true;
+              } else if (
+                HyperlaneErrorHandler.handleResponse(
+                  registerSuccessfulUploads,
+                  'Register upload failed',
+                  (msg, type) => showUploadStatus(msg, type),
+                )
+              ) {
+                registerSuccess = false;
               }
             } catch (error) {
               registerSuccess = false;
@@ -3266,6 +3283,14 @@ <h1 class="nav-title light-bg">
               mergeSuccessfulUploads = await response.json();
               if (registerSuccessfulUploads.code == 200) {
                 mergeSuccess = true;
+              } else if (
+                HyperlaneErrorHandler.handleResponse(
+                  mergeSuccessfulUploads,
+                  'Merge upload failed',
+                  (msg, type) => showUploadStatus(msg, type),
+                )
+              ) {
+                mergeSuccess = false;
               }
             } catch (error) {
               mergeSuccess = false;
diff --git a/resources/static/chat/js/history.js b/resources/static/chat/js/history.js
index f51db85b..a71e3807 100644
--- a/resources/static/chat/js/history.js
+++ b/resources/static/chat/js/history.js
@@ -56,6 +56,14 @@ const ChatHistory = {
         } else {
           this.hasMore = false;
         }
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to load history',
+          console.error,
+        )
+      ) {
+        return;
       } else {
         console.error('Failed to load history:', result.message);
         this.hasMore = false;
diff --git a/resources/static/cicd/index.html b/resources/static/cicd/index.html
index b0533397..59ee1878 100644
--- a/resources/static/cicd/index.html
+++ b/resources/static/cicd/index.html
@@ -8,6 +8,7 @@
     <link href="../common/css/common.css" rel="stylesheet" />
     <link href="../common/css/header.css" rel="stylesheet" />
     <script src="../common/js/common.js"></script>
+    <script src="../common/js/error-handler.js"></script>
     <style>
       * {
         scrollbar-width: thin;
@@ -1485,6 +1486,14 @@ <h1 class="app-title" style="font-size: 1.5rem; margin: 0">
           if (result.code === 200) {
             pipelines = result.data || [];
             renderPipelines();
+          } else if (
+            HyperlaneErrorHandler.handleResponse(
+              result,
+              'Failed to load pipelines',
+              showToast,
+            )
+          ) {
+            return;
           }
         } catch (error) {
           console.error('Error loading pipelines:', error);
@@ -1561,6 +1570,14 @@ <h1 class="app-title" style="font-size: 1.5rem; margin: 0">
             document.getElementById('create-description').value = '';
             document.getElementById('create-config').value = '';
             showToast('Pipeline created successfully', 'success');
+          } else if (
+            HyperlaneErrorHandler.handleResponse(
+              result,
+              'Failed to create pipeline',
+              showToast,
+            )
+          ) {
+            return;
           } else {
             showToast('Error: ' + result.message, 'error');
           }
@@ -1614,6 +1631,14 @@ <h1 class="app-title" style="font-size: 1.5rem; margin: 0">
               'success',
             );
             await loadRuns(true);
+          } else if (
+            HyperlaneErrorHandler.handleResponse(
+              result,
+              'Failed to trigger pipeline',
+              showToast,
+            )
+          ) {
+            return;
           } else {
             showToast('Error: ' + result.message, 'error');
           }
diff --git a/resources/static/common/js/error-handler.js b/resources/static/common/js/error-handler.js
new file mode 100644
index 00000000..caa5d790
--- /dev/null
+++ b/resources/static/common/js/error-handler.js
@@ -0,0 +1,52 @@
+const HyperlaneErrorHandler = {
+  logout: async function () {
+    try {
+      await fetch('/api/auth/logout', {
+        method: 'POST',
+        credentials: 'include',
+      });
+    } catch (error) {
+      console.error('Logout request failed:', error);
+    }
+    window.location.href = '/auth';
+  },
+
+  handleResponse: function (result, defaultMessage, toastCallback) {
+    if (result.code === 500) {
+      if (typeof Toast !== 'undefined') {
+        Toast.error(result.message || 'Server error, please try again later');
+      } else if (toastCallback) {
+        toastCallback(
+          result.message || 'Server error, please try again later',
+          'error',
+        );
+      }
+      return true;
+    }
+    return false;
+  },
+
+  handleResponseWithLogout: function (result, defaultMessage, toastCallback) {
+    if (result.code === 500) {
+      if (typeof Toast !== 'undefined') {
+        Toast.error(result.message || 'Server error, please try again later');
+      } else if (toastCallback) {
+        toastCallback(
+          result.message || 'Server error, please try again later',
+          'error',
+        );
+      }
+      this.logout();
+      return true;
+    }
+    return false;
+  },
+};
+
+if (typeof window !== 'undefined') {
+  window.HyperlaneErrorHandler = HyperlaneErrorHandler;
+}
+
+if (typeof module !== 'undefined' && module.exports) {
+  module.exports = HyperlaneErrorHandler;
+}
diff --git a/resources/static/notification/index.html b/resources/static/notification/index.html
index 3552fb56..c619c745 100644
--- a/resources/static/notification/index.html
+++ b/resources/static/notification/index.html
@@ -11,6 +11,7 @@
     <link href="./css/style.css" rel="stylesheet" />
     <script src="../common/js/common.js"></script>
     <script src="../common/js/toast.js"></script>
+    <script src="../common/js/error-handler.js"></script>
     <script src="../common/components/hyperlane-confirm.js"></script>
     <script
       src="../common/components/hyperlane-select.js"
diff --git a/resources/static/notification/js/app.js b/resources/static/notification/js/app.js
index 561da79f..f2f71afa 100644
--- a/resources/static/notification/js/app.js
+++ b/resources/static/notification/js/app.js
@@ -23,6 +23,14 @@ class NotificationApp {
       const result = await response.json();
       if (result.code === 200 && result.data) {
         document.getElementById('unreadCount').textContent = result.data.count;
+      } else if (
+        HyperlaneErrorHandler.handleResponseWithLogout(
+          result,
+          'Failed to load unread count',
+          Toast.error.bind(Toast),
+        )
+      ) {
+        return;
       }
     } catch (error) {
       console.error('Failed to load unread count:', error);
@@ -50,6 +58,14 @@ class NotificationApp {
 
       if (result.code === 200 && result.data) {
         this.displayNotifications(result.data);
+      } else if (
+        HyperlaneErrorHandler.handleResponseWithLogout(
+          result,
+          'Failed to load notifications',
+          Toast.error.bind(Toast),
+        )
+      ) {
+        return;
       } else {
         this.showError(result.message || 'Failed to load notifications');
       }
@@ -154,6 +170,14 @@ class NotificationApp {
         Toast.success('Marked as read');
         await this.loadUnreadCount();
         await this.loadNotifications(this.currentPage);
+      } else if (
+        HyperlaneErrorHandler.handleResponseWithLogout(
+          result,
+          'Failed to mark as read',
+          Toast.error.bind(Toast),
+        )
+      ) {
+        return;
       } else {
         Toast.error(result.message || 'Failed to mark as read');
       }
@@ -174,6 +198,14 @@ class NotificationApp {
         Toast.success('All notifications marked as read');
         await this.loadUnreadCount();
         await this.loadNotifications(1);
+      } else if (
+        HyperlaneErrorHandler.handleResponseWithLogout(
+          result,
+          'Failed to mark all as read',
+          Toast.error.bind(Toast),
+        )
+      ) {
+        return;
       } else {
         Toast.error(result.message || 'Failed to mark all as read');
       }
@@ -199,6 +231,14 @@ class NotificationApp {
         Toast.success('Notification deleted');
         await this.loadUnreadCount();
         await this.loadNotifications(this.currentPage);
+      } else if (
+        HyperlaneErrorHandler.handleResponseWithLogout(
+          result,
+          'Failed to delete notification',
+          Toast.error.bind(Toast),
+        )
+      ) {
+        return;
       } else {
         Toast.error(result.message || 'Failed to delete notification');
       }
@@ -287,6 +327,14 @@ class NotificationApp {
         this.closeCreateModal();
         await this.loadUnreadCount();
         await this.loadNotifications(1);
+      } else if (
+        HyperlaneErrorHandler.handleResponseWithLogout(
+          result,
+          'Failed to create notification',
+          Toast.error.bind(Toast),
+        )
+      ) {
+        return;
       } else {
         Toast.error(result.message || 'Failed to create notification');
       }
diff --git a/resources/static/order/index.html b/resources/static/order/index.html
index d059adef..15fb45b9 100644
--- a/resources/static/order/index.html
+++ b/resources/static/order/index.html
@@ -16,6 +16,7 @@
     <script src="../common/js/qr.js"></script>
     <script src="../common/js/request-manager.js"></script>
     <script src="../common/js/common.js"></script>
+    <script src="../common/js/error-handler.js"></script>
     <script src="../common/js/rsa.js"></script>
     <script
       src="../common/components/hyperlane-select.js"
diff --git a/resources/static/order/js/app.js b/resources/static/order/js/app.js
index 2b36ed5f..01f62d70 100644
--- a/resources/static/order/js/app.js
+++ b/resources/static/order/js/app.js
@@ -430,6 +430,14 @@ async function loadOverview() {
     } else {
       if (result.code === 401) {
         handleAuthError(result.message);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Error loading overview data',
+          showToast,
+        )
+      ) {
+        return;
       } else {
         showToast(result.message || 'Error loading overview data', 'error');
       }
@@ -1859,6 +1867,14 @@ async function applyFilters(pageDirection = null) {
     } else {
       if (result.code === 401) {
         handleAuthError(result.message);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Error loading records',
+          showToast,
+        )
+      ) {
+        return;
       } else {
         showToast(result.message || 'Error loading records', 'error');
       }
@@ -2080,6 +2096,14 @@ async function handleRecordSubmit(e) {
     } else {
       if (result.code === 401) {
         handleAuthError(result.message);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Operation failed',
+          showToast,
+        )
+      ) {
+        return;
       } else {
         showToast(result.message || 'Operation failed', 'error');
       }
@@ -2297,6 +2321,14 @@ async function loadUsers(pageDirection = null) {
     } else {
       if (result.code === 401) {
         handleAuthError(result.message);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Error loading users',
+          showToast,
+        )
+      ) {
+        return;
       } else {
         showToast(result.message || 'Error loading users', 'error');
       }
@@ -2368,10 +2400,7 @@ function renderUsers(users) {
         <div class="user-meta">ID: ${u.id}${contactInfo ? ' • ' + escapeHtml(contactInfo) : ''}</div>
       </div>
       <div class="user-status ${statusClass}">${statusText}</div>
-      <div class="user-actions" onclick="event.stopPropagation();">
-        ${u.status !== UserStatus.APPROVED ? `<button class="btn btn-sm btn-primary" onclick="approveUser('${u.id}', true)">Approve</button>` : ''}
-        ${u.status === UserStatus.PENDING ? `<button class="btn btn-sm btn-danger" onclick="approveUser('${u.id}', false)">Reject</button>` : ''}
-      </div>
+      <div class="user-actions" onclick="event.stopPropagation();"></div>
     </div>`;
     })
     .join('');
@@ -2665,41 +2694,6 @@ function resetUserRecordFilters() {
   applyUserRecordFilters('reset');
 }
 
-async function approveUser(userId, approved) {
-  const requestKey = `approve_user_${userId}`;
-  if (orderRequestManager.isPending(requestKey)) {
-    showToast('Processing, please wait...', 'info');
-    return;
-  }
-  try {
-    const response = await orderRequestManager.fetch(
-      requestKey,
-      `${AUTH_API_BASE}/user/approve/${userId}`,
-      {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ approved }),
-        credentials: 'include',
-      },
-    );
-    const result = await response.json();
-    if (result.code === 200) {
-      showToast(approved ? 'User approved!' : 'User rejected!', 'success');
-      loadUsers();
-    } else {
-      if (result.code === 401) {
-        handleAuthError(result.message);
-      } else {
-        showToast(result.message || 'Operation failed', 'error');
-      }
-    }
-  } catch (error) {
-    if (error.message !== 'Request aborted') {
-      showToast('Network error', 'error');
-    }
-  }
-}
-
 function loadProfile() {
   if (!currentUser) return;
   document.getElementById('profile-username').textContent =
@@ -2744,6 +2738,10 @@ async function handleProfileSubmit(e) {
     } else {
       if (result.code === 401) {
         handleAuthError(result.message);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(result, 'Update failed', showToast)
+      ) {
+        return;
       } else {
         showToast(result.message || 'Update failed', 'error');
       }
@@ -2789,6 +2787,10 @@ async function handlePasswordSubmit(e) {
     } else {
       if (result.code === 401) {
         handleAuthError(result.message);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(result, 'Change failed', showToast)
+      ) {
+        return;
       } else {
         showToast(result.message || 'Change failed', 'error');
       }
diff --git a/resources/static/redis/index.html b/resources/static/redis/index.html
index ea0787d6..436392bd 100644
--- a/resources/static/redis/index.html
+++ b/resources/static/redis/index.html
@@ -9,6 +9,7 @@
     <link href="../common/css/header.css" rel="stylesheet" />
     <link href="index.css" rel="stylesheet" />
     <script src="../common/js/common.js"></script>
+    <script src="../common/js/error-handler.js"></script>
   </head>
 
   <body>
diff --git a/resources/static/redis/index.js b/resources/static/redis/index.js
index 4ba481e6..ab63018d 100644
--- a/resources/static/redis/index.js
+++ b/resources/static/redis/index.js
@@ -32,6 +32,10 @@ document.getElementById('create-btn').addEventListener('click', async () => {
       document.getElementById('create-key').value = '';
       document.getElementById('create-value').value = '';
       loadRecords();
+    } else if (
+      HyperlaneErrorHandler.handleResponse(result, 'Create failed', showToast)
+    ) {
+      return;
     } else {
       showToast(result.message, 'error');
     }
@@ -62,6 +66,10 @@ document.getElementById('edit-btn').addEventListener('click', async () => {
       showToast(result.message, 'success');
       toggleModal(false);
       loadRecords();
+    } else if (
+      HyperlaneErrorHandler.handleResponse(result, 'Update failed', showToast)
+    ) {
+      return;
     } else {
       showToast(result.message, 'error');
     }
@@ -91,6 +99,10 @@ async function deleteRecord(key) {
     if (result.code === 200) {
       showToast(result.message, 'success');
       loadRecords();
+    } else if (
+      HyperlaneErrorHandler.handleResponse(result, 'Delete failed', showToast)
+    ) {
+      return;
     } else {
       showToast(result.message, 'error');
     }
@@ -106,6 +118,14 @@ async function loadRecords() {
     const result = await response.json();
     if (result.code === 200) {
       renderRecords(result.data);
+    } else if (
+      HyperlaneErrorHandler.handleResponse(
+        result,
+        'Failed to load records',
+        showToast,
+      )
+    ) {
+      return;
     } else {
       document.getElementById('records-list').innerHTML =
         '<p style="text-align: center; color: #6c757d;">Failed to load records</p>';
diff --git a/resources/static/rss/index.html b/resources/static/rss/index.html
index 263abc5f..bdd0e743 100644
--- a/resources/static/rss/index.html
+++ b/resources/static/rss/index.html
@@ -9,6 +9,7 @@
     <link href="../common/css/header.css" rel="stylesheet" />
     <link href="index.css" rel="stylesheet" />
     <script src="../common/js/common.js"></script>
+    <script src="../common/js/error-handler.js"></script>
     <script
       src="../common/components/hyperlane-loading.js"
       type="module"
diff --git a/resources/static/shortlink/index.html b/resources/static/shortlink/index.html
index 68e5ab69..105f2870 100644
--- a/resources/static/shortlink/index.html
+++ b/resources/static/shortlink/index.html
@@ -14,6 +14,7 @@
     <link href="./css/style.css" rel="stylesheet" />
     <script src="../common/js/request-manager.js"></script>
     <script src="../common/js/common.js"></script>
+    <script src="../common/js/error-handler.js"></script>
     <script
       src="../common/components/hyperlane-button.js"
       type="module"
diff --git a/resources/static/shortlink/js/app.js b/resources/static/shortlink/js/app.js
index 2c9c7a66..78e8bdf7 100644
--- a/resources/static/shortlink/js/app.js
+++ b/resources/static/shortlink/js/app.js
@@ -179,6 +179,14 @@ const ShortlinkApp = {
         this.currentShortlinkId = result.data;
         this.displayResult(result.data);
         this.showToast('Shortlink generated successfully!', 'success');
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to generate shortlink',
+          (msg, type) => this.showToast(msg, type),
+        )
+      ) {
+        return;
       } else {
         throw new Error(result.message || 'Failed to generate shortlink');
       }
@@ -258,6 +266,14 @@ const ShortlinkApp = {
       const result = await response.json();
       if (result.code === 200 && result.data && result.data.url) {
         window.open(result.data.url, '_blank');
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to retrieve original URL',
+          (msg, type) => this.showToast(msg, type),
+        )
+      ) {
+        return;
       } else {
         throw new Error('Failed to retrieve original URL');
       }
diff --git a/resources/static/tracking/index.html b/resources/static/tracking/index.html
index ce5c37cc..2cc65737 100644
--- a/resources/static/tracking/index.html
+++ b/resources/static/tracking/index.html
@@ -9,6 +9,7 @@
     <link href="../common/css/common.css" rel="stylesheet" />
     <link href="../common/css/header.css" rel="stylesheet" />
     <script src="../common/js/common.js"></script>
+    <script src="../common/js/error-handler.js"></script>
     <style>
       @import url('./css/css2');
 
@@ -1388,6 +1389,14 @@ <h1 class="app-title">
 
             if (result.code === 200 && result.data) {
               this.displayResults(result.data);
+            } else if (
+              HyperlaneErrorHandler.handleResponse(
+                result,
+                'Query failed',
+                (msg, type) => this.showError(msg),
+              )
+            ) {
+              return;
             } else {
               this.showError(result.message || 'Query failed');
             }
diff --git a/resources/static/upload/index.html b/resources/static/upload/index.html
index b1f1bc4f..a2ef8b6e 100644
--- a/resources/static/upload/index.html
+++ b/resources/static/upload/index.html
@@ -9,6 +9,7 @@
     <link href="../common/css/header.css" rel="stylesheet" />
     <link href="index.css" rel="stylesheet" />
     <script src="../common/js/common.js"></script>
+    <script src="../common/js/error-handler.js"></script>
     <script
       src="../common/components/hyperlane-button.js"
       type="module"
diff --git a/resources/static/upload/index.js b/resources/static/upload/index.js
index 9caceaf3..eb2cedd3 100644
--- a/resources/static/upload/index.js
+++ b/resources/static/upload/index.js
@@ -294,6 +294,14 @@ async function uploadFile(file, fileId) {
         registerSuccessfulUploads = await response.json();
         if (registerSuccessfulUploads.code == 200) {
           registerSuccess = true;
+        } else if (
+          HyperlaneErrorHandler.handleResponse(
+            registerSuccessfulUploads,
+            'Register upload failed',
+            showToast,
+          )
+        ) {
+          registerSuccess = false;
         }
       } catch (error) {
         registerSuccess = false;
@@ -394,6 +402,14 @@ async function uploadFile(file, fileId) {
         mergeSuccessfulUploads = await response.json();
         if (registerSuccessfulUploads.code == 200) {
           mergeSuccess = true;
+        } else if (
+          HyperlaneErrorHandler.handleResponse(
+            mergeSuccessfulUploads,
+            'Merge upload failed',
+            showToast,
+          )
+        ) {
+          mergeSuccess = false;
         }
       } catch (error) {
         mergeSuccess = false;
diff --git a/resources/static/user/css/style.css b/resources/static/user/css/style.css
new file mode 100644
index 00000000..dcc3f039
--- /dev/null
+++ b/resources/static/user/css/style.css
@@ -0,0 +1,967 @@
+body {
+  background: #667eea;
+}
+
+.app-title,
+.app-title span,
+button,
+.btn {
+  white-space: nowrap;
+}
+
+.main-app {
+  display: flex;
+  height: 100dvh;
+  overflow: hidden;
+}
+
+.sidebar {
+  width: 260px;
+  background: #ffffff;
+  border-right: 1px solid #e0e0e0;
+  display: flex;
+  flex-direction: column;
+  position: fixed;
+  top: 0;
+  left: 0;
+  height: 100%;
+  z-index: 100;
+}
+
+.sidebar-header {
+  padding: 20px;
+  border-bottom: 1px solid #e0e0e0;
+}
+
+.sidebar-header h2 {
+  font-size: 18px;
+  font-weight: 600;
+  color: #2c3e50;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.sidebar-header h2 .nav-logo {
+  width: 28px;
+  height: 28px;
+  border-radius: 6px;
+  object-fit: contain;
+  vertical-align: middle;
+}
+
+.sidebar-nav {
+  flex: 1;
+  padding: 16px 0;
+  overflow-y: auto;
+}
+
+.nav-item {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 12px 20px;
+  cursor: pointer;
+  color: #4a5568;
+  font-size: 14px;
+  font-weight: 600;
+  transition: all 0.2s;
+  border-left: 3px solid transparent;
+}
+
+.nav-item:hover {
+  background: #f5f7fb;
+  color: #2d3748;
+}
+
+.nav-item.active {
+  background: #d4e0ff;
+  color: #5a67d8;
+  border-left-color: #5a67d8;
+  font-weight: 700;
+}
+
+.nav-icon {
+  font-size: 18px;
+  width: 24px;
+  text-align: center;
+}
+
+.sidebar-footer {
+  padding: 16px 20px;
+  border-top: 1px solid #e0e0e0;
+}
+
+#logout-btn {
+  width: 100%;
+}
+
+.user-info {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 12px;
+  font-size: 14px;
+  color: #2d3748;
+  font-weight: 700;
+}
+
+.role-badge {
+  background: #16a34a;
+  color: #fff;
+  padding: 2px 8px;
+  border-radius: 10px;
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+}
+
+.role-badge.admin {
+  background: #5a67d8;
+}
+
+.main-content {
+  margin-left: 260px;
+  padding: 24px;
+  height: 100dvh;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  width: 100%;
+}
+
+.content-header {
+  margin-bottom: 12px;
+  flex-shrink: 0;
+  animation: fadeInDown 0.6s ease;
+}
+
+.content-header h1 {
+  font-size: 20px;
+  font-weight: 600;
+  color: #2c3e50;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.btn {
+  padding: 8px 16px;
+  border: 1px solid #e0e0e0;
+  border-radius: 6px;
+  font-size: 14px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.2s;
+  background: #f5f7fb;
+  color: #2c3e50;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+}
+
+.btn:hover {
+  background: #e8ecf4;
+  border-color: #d0d0d0;
+}
+
+.btn:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.btn-primary {
+  background: #667eea;
+  border-color: transparent;
+  color: #fff;
+}
+
+.btn-primary:hover {
+  background: #5a6fd6;
+  border-color: transparent;
+}
+
+.btn-danger {
+  background: #ef4444;
+  border-color: #ef4444;
+  color: #fff;
+}
+
+.btn-danger:hover {
+  background: #dc2626;
+  border-color: #dc2626;
+}
+
+.btn-success {
+  background: rgba(16, 185, 129, 0.1);
+  border-color: rgba(16, 185, 129, 0.3);
+  color: #10b981;
+}
+
+.btn-success:hover {
+  background: rgba(16, 185, 129, 0.2);
+}
+
+.btn-secondary {
+  background: #f1f5f9;
+  border-color: #e0e0e0;
+  color: #64748b;
+}
+
+.btn-secondary:hover {
+  background: #e2e8f0;
+}
+
+.btn-sm {
+  padding: 4px 12px;
+  font-size: 12px;
+}
+
+.form-group {
+  margin-bottom: 16px;
+}
+
+.form-label {
+  display: block;
+  font-size: 14px;
+  font-weight: 500;
+  color: #2c3e50;
+  margin-bottom: 8px;
+}
+
+.form-input {
+  width: 100%;
+  padding: 10px 12px;
+  background: #f8f9fa;
+  border: 1px solid #e0e0e0;
+  border-radius: 6px;
+  color: #2c3e50;
+  font-size: 14px;
+  transition: all 0.2s;
+  box-sizing: border-box;
+}
+
+.form-input:focus {
+  outline: none;
+  border-color: #667eea;
+  box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
+  background: #fff;
+}
+
+.form-input::placeholder {
+  color: #999;
+}
+
+.form-input-sm {
+  padding: 6px 10px;
+  font-size: 13px;
+}
+
+.card {
+  background: #ffffff;
+  border: 1px solid #e0e0e0;
+  border-radius: 12px;
+  overflow: hidden;
+  margin-bottom: 16px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+}
+
+.card-header {
+  padding: 16px 20px;
+  border-bottom: 1px solid #e0e0e0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 16px;
+}
+
+.card-title {
+  font-size: 16px;
+  font-weight: 600;
+  color: #2c3e50;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  flex-shrink: 0;
+}
+
+.card-body {
+  padding: 20px;
+}
+
+#users-page {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  min-height: 0;
+}
+
+#users-page .card {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  min-height: 0;
+  width: 100%;
+  overflow: hidden;
+}
+
+#users-page .card-body {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow: hidden;
+}
+
+.stats-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 16px;
+  margin-bottom: 16px;
+  flex-shrink: 0;
+}
+
+.stat-card {
+  background: #ffffff;
+  border: 1px solid #e0e0e0;
+  border-radius: 12px;
+  padding: 20px;
+  text-align: center;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+  min-width: 0;
+  overflow: hidden;
+}
+
+.stat-card.balance {
+  border-left: 4px solid #f59e0b;
+}
+
+.stat-card.income {
+  border-left: 4px solid #22c55e;
+}
+
+.stat-card.expense {
+  border-left: 4px solid #ef4444;
+}
+
+.stat-label {
+  font-size: 12px;
+  color: #666;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  margin-bottom: 8px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.stat-value {
+  font-size: 24px;
+  font-weight: 600;
+  color: #2c3e50;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.stat-card.income .stat-value {
+  color: #22c55e;
+}
+
+.stat-card.expense .stat-value {
+  color: #ef4444;
+}
+
+.stat-card.balance .stat-value {
+  color: #f59e0b;
+}
+
+.filter-group {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-wrap: nowrap;
+  white-space: nowrap;
+  flex: 1;
+  min-width: 0;
+}
+
+.filter-group .form-input-sm {
+  width: 100%;
+  min-width: 0;
+}
+
+.user-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  flex: 1;
+  overflow-y: auto;
+  min-height: 0;
+}
+
+.user-card {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  padding: 16px;
+  background: #f8f9fa;
+  border: 1px solid #e0e0e0;
+  border-radius: 8px;
+  transition: all 0.2s;
+}
+
+.user-card:hover {
+  border-color: #667eea;
+  background: #f0f4ff;
+  cursor: pointer;
+}
+
+.user-card:active {
+  transform: scale(0.995);
+}
+
+.user-info {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex: 1;
+  min-width: 0;
+}
+
+.user-avatar {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 16px;
+  font-weight: 600;
+  flex-shrink: 0;
+}
+
+.user-details {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  min-width: 0;
+}
+
+.user-name {
+  font-size: 14px;
+  font-weight: 500;
+  color: #2c3e50;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.user-meta {
+  font-size: 12px;
+  color: #666;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.user-badges {
+  display: flex;
+  gap: 6px;
+  flex-wrap: wrap;
+  flex-shrink: 0;
+}
+
+.badge {
+  padding: 4px 10px;
+  border-radius: 20px;
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.3px;
+}
+
+.badge-admin {
+  background: rgba(102, 126, 234, 0.12);
+  color: #667eea;
+}
+
+.badge-user {
+  background: rgba(16, 185, 129, 0.12);
+  color: #10b981;
+}
+
+.badge-pending {
+  background: rgba(245, 158, 11, 0.12);
+  color: #d97706;
+}
+
+.badge-approved {
+  background: rgba(16, 185, 129, 0.12);
+  color: #10b981;
+}
+
+.badge-rejected {
+  background: rgba(239, 68, 68, 0.12);
+  color: #ef4444;
+}
+
+.user-actions {
+  display: flex;
+  gap: 8px;
+  flex-shrink: 0;
+}
+
+.no-data {
+  text-align: center;
+  padding: 60px 20px;
+  color: #888;
+  font-size: 14px;
+}
+
+.loading-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  gap: 16px;
+}
+
+.loading-spinner {
+  width: 40px;
+  height: 40px;
+  border: 3px solid #e0e0e0;
+  border-top-color: #667eea;
+  border-radius: 50%;
+  animation: spin 0.8s linear infinite;
+}
+
+.loading-text {
+  color: #666;
+  font-size: 14px;
+}
+
+.modal {
+  display: none;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 1000;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+}
+
+.modal.active {
+  display: flex;
+}
+
+.modal-content {
+  background: #ffffff;
+  border: 1px solid #e0e0e0;
+  border-radius: 12px;
+  max-width: 480px;
+  width: 90%;
+  max-height: 80vh;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
+}
+
+.modal-header {
+  padding: 20px;
+  border-bottom: 1px solid #e0e0e0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: #f8f9fa;
+}
+
+.modal-body {
+  flex: 1;
+  overflow-y: auto;
+  padding: 20px;
+  min-height: 0;
+}
+
+.modal-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #2c3e50;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.modal-close {
+  background: none;
+  border: none;
+  color: #666;
+  font-size: 24px;
+  cursor: pointer;
+  padding: 0;
+  width: 32px;
+  height: 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 6px;
+  transition: all 0.2s;
+}
+
+.modal-close:hover {
+  background: #f5f7fb;
+  color: #2c3e50;
+}
+
+.modal-footer {
+  padding: 20px;
+  border-top: 1px solid #e0e0e0;
+  display: flex;
+  justify-content: flex-end;
+  gap: 12px;
+  flex-shrink: 0;
+}
+
+.detail-row {
+  display: flex;
+  justify-content: space-between;
+  padding: 10px 0;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.detail-label {
+  font-size: 13px;
+  color: #888;
+  font-weight: 600;
+}
+
+.detail-value {
+  font-size: 13px;
+  color: #333;
+}
+
+.detail-actions {
+  display: flex;
+  gap: 12px;
+  justify-content: flex-end;
+  margin-top: 20px;
+  padding-top: 16px;
+  border-top: 1px solid #e0e0e0;
+}
+
+.toast-container {
+  position: fixed;
+  top: 20px;
+  right: 20px;
+  z-index: 10000;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.mobile-menu-btn {
+  display: none;
+}
+
+.sidebar-overlay {
+  display: none;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.3);
+  z-index: 99;
+  opacity: 0;
+  transition: opacity 0.3s;
+}
+
+.sidebar-overlay.active {
+  display: block;
+  opacity: 1;
+}
+
+.pagination-container {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16px;
+  margin-top: 16px;
+  background: #ffffff;
+  border: 1px solid #e0e0e0;
+  border-radius: 12px;
+  flex-wrap: wrap;
+  gap: 12px;
+  flex-shrink: 0;
+}
+
+.pagination-info {
+  display: flex;
+  gap: 16px;
+  font-size: 14px;
+  color: #666;
+}
+
+.pagination-controls {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+}
+
+.pagination-controls > button {
+  min-width: 80px;
+  background: #f5f7fb;
+  border: 1px solid #e0e0e0;
+  border-radius: 6px;
+  padding: 6px 12px;
+  font-size: 14px;
+  font-weight: 500;
+  color: #2c3e50;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.pagination-controls > button:hover:not(:disabled) {
+  background: #e8ecf4;
+  border-color: #d0d0d0;
+}
+
+.pagination-controls > button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+  background: #f5f7fb;
+}
+
+@keyframes spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes fadeInDown {
+  from {
+    opacity: 0;
+    transform: translateY(-10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@media (max-width: 768px) {
+  .sidebar {
+    width: 100%;
+    transform: translateX(-100%);
+    transition: transform 0.3s;
+  }
+
+  .sidebar.open {
+    transform: translateX(0);
+  }
+
+  .main-content {
+    margin-left: 0;
+    padding: 8px 16px;
+    height: 100dvh;
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+    box-sizing: border-box;
+  }
+
+  .mobile-menu-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 32px;
+    height: 32px;
+    background: #f5f7fb;
+    border: 1px solid #e0e0e0;
+    border-radius: 6px;
+    color: #2c3e50;
+    font-size: 16px;
+    cursor: pointer;
+    margin-right: 8px;
+  }
+
+  .content-header {
+    display: flex;
+    align-items: center;
+    margin-bottom: 8px;
+  }
+
+  .stats-grid {
+    grid-template-columns: 1fr;
+    gap: 8px;
+    margin-bottom: 12px;
+  }
+
+  .stat-card {
+    padding: 12px 8px;
+  }
+
+  .stat-label {
+    font-size: 11px;
+  }
+
+  .stat-value {
+    font-size: 16px;
+  }
+
+  .user-card {
+    flex-wrap: wrap;
+    gap: 12px;
+    padding: 12px;
+  }
+
+  .user-card:active {
+    transform: none;
+  }
+
+  .user-info {
+    flex: 1;
+    min-width: 0;
+  }
+
+  .user-details {
+    min-width: 0;
+  }
+
+  .user-badges {
+    flex-shrink: 0;
+    margin-left: auto;
+  }
+
+  .user-actions {
+    width: 100%;
+    margin-top: 8px;
+    justify-content: flex-end;
+  }
+
+  .card-header {
+    flex-wrap: nowrap;
+    gap: 12px;
+    align-items: center;
+  }
+
+  .card-header .card-title {
+    flex: 1;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    min-width: 0;
+  }
+
+  .card-header > div {
+    display: flex;
+    gap: 8px;
+    flex-wrap: nowrap;
+    flex-shrink: 0;
+  }
+
+  #users-page {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-height: 0;
+    max-height: calc(100dvh - 80px);
+    overflow: hidden;
+  }
+
+  #users-page .card {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-height: 0;
+    width: 100%;
+    overflow: hidden;
+  }
+
+  #users-page .card-body {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-height: 0;
+    overflow: hidden;
+    padding-bottom: 80px;
+  }
+
+  #users-page .user-list {
+    flex: 1;
+    min-height: 0;
+    overflow-y: auto;
+  }
+
+  .pagination-container {
+    flex-direction: column;
+    align-items: center;
+    position: fixed;
+    bottom: 0;
+    left: 16px;
+    right: 16px;
+    margin: 0;
+    border-radius: 0;
+    border-top: none;
+    z-index: 50;
+    max-height: 120px;
+    padding: 8px 16px;
+    gap: 8px;
+  }
+
+  .pagination-info {
+    display: block;
+    text-align: center;
+    font-size: 12px;
+    width: 100%;
+  }
+
+  .pagination-controls {
+    justify-content: center;
+    gap: 8px;
+    width: 100%;
+  }
+
+  .pagination-controls > button {
+    min-width: 60px;
+    padding: 4px 8px;
+    font-size: 12px;
+  }
+}
+
+@media (max-width: 1200px) {
+  .pagination-container {
+    justify-content: center;
+    align-items: center;
+  }
+
+  .pagination-info {
+    display: block;
+    text-align: center;
+    width: 100%;
+  }
+
+  .pagination-controls {
+    justify-content: center;
+    width: 100%;
+  }
+}
diff --git a/resources/static/user/index.html b/resources/static/user/index.html
new file mode 100644
index 00000000..1afd6684
--- /dev/null
+++ b/resources/static/user/index.html
@@ -0,0 +1,133 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
+      name="viewport"
+    />
+    <title>Hyperlane - User Management</title>
+    <link rel="icon" href="https://docs.ltpp.vip/img/hyperlane.png" />
+    <link href="../common/css/common.css" rel="stylesheet" />
+    <link href="../common/css/header.css" rel="stylesheet" />
+    <link href="../common/css/toast.css" rel="stylesheet" />
+    <link href="./css/style.css" rel="stylesheet" />
+    <script src="../common/js/common.js"></script>
+    <script src="../common/js/toast.js"></script>
+    <script src="../common/js/error-handler.js"></script>
+    <script src="../common/components/hyperlane-confirm.js"></script>
+    <script
+      src="../common/components/hyperlane-pagination.js"
+      type="module"
+    ></script>
+    <script src="./js/app.js" defer></script>
+  </head>
+  <body>
+    <div id="app">
+      <div id="main-app" class="main-app">
+        <aside class="sidebar">
+          <div class="sidebar-header light-bg">
+            <h2>
+              <a
+                href="https://github.com/hyperlane-dev/hyperlane"
+                target="_blank"
+              >
+                <img
+                  src="https://docs.ltpp.vip/img/hyperlane.png"
+                  alt=""
+                  class="nav-logo"
+                  onerror="this.style.display = 'none'"
+                />
+                <span class="text shimmer">Hyperlane Users</span>
+              </a>
+            </h2>
+          </div>
+          <nav class="sidebar-nav">
+            <div class="nav-item active" data-page="users">
+              <span class="nav-icon">👥</span>
+              <span>Users</span>
+            </div>
+          </nav>
+          <div class="sidebar-footer">
+            <div class="user-info">
+              <span id="current-user">User</span>
+              <span id="user-role" class="role-badge">user</span>
+            </div>
+            <button id="logout-btn" class="btn btn-sm btn-primary">
+              Logout
+            </button>
+          </div>
+        </aside>
+
+        <div class="sidebar-overlay" id="sidebar-overlay"></div>
+        <main class="main-content">
+          <header class="content-header light-bg">
+            <button class="mobile-menu-btn" id="mobile-menu-btn">☰</button>
+            <h1 id="page-title">User Management</h1>
+          </header>
+
+          <div id="users-page" class="page-content">
+            <div class="stats-grid">
+              <div class="stat-card balance">
+                <div class="stat-label">Total Users</div>
+                <div class="stat-value" id="totalUsers">0</div>
+              </div>
+              <div class="stat-card income">
+                <div class="stat-label">Admins</div>
+                <div class="stat-value" id="adminCount">0</div>
+              </div>
+              <div class="stat-card expense">
+                <div class="stat-label">Pending</div>
+                <div class="stat-value" id="pendingCount">0</div>
+              </div>
+            </div>
+            <div class="card">
+              <div class="card-header">
+                <span class="card-title">Users</span>
+                <div class="filter-group">
+                  <input
+                    type="text"
+                    class="form-input form-input-sm"
+                    id="searchKeyword"
+                    placeholder="Search users..."
+                    oninput="app.onSearchInput()"
+                  />
+                </div>
+              </div>
+              <div class="card-body">
+                <div id="resultsContainer">
+                  <div class="loading-state">
+                    <div class="loading-spinner"></div>
+                    <div class="loading-text">Loading users...</div>
+                  </div>
+                </div>
+                <div
+                  id="paginationContainer"
+                  class="pagination-container"
+                ></div>
+              </div>
+            </div>
+          </div>
+        </main>
+      </div>
+    </div>
+
+    <div class="modal" id="detailModal">
+      <div class="modal-content">
+        <div class="modal-header">
+          <span class="modal-title" id="modalTitle">User Detail</span>
+          <button
+            class="modal-close"
+            onclick="app.closeModal()"
+            aria-label="Close"
+          >
+            <span>&times;</span>
+          </button>
+        </div>
+        <div class="modal-body" id="modalContent"></div>
+      </div>
+    </div>
+
+    <div class="toast-container" id="toast-container"></div>
+  </body>
+</html>
diff --git a/resources/static/user/js/app.js b/resources/static/user/js/app.js
new file mode 100644
index 00000000..bede101f
--- /dev/null
+++ b/resources/static/user/js/app.js
@@ -0,0 +1,471 @@
+class UserApp {
+  constructor() {
+    this.currentPage = 1;
+    this.pageSize = 20;
+    this.totalRecords = 0;
+    this.apiBase = '/api/user';
+    this.users = [];
+    this.currentUserId = null;
+    this.searchDebounceTimer = null;
+  }
+
+  async init() {
+    this.setupMobileMenu();
+    this.setupModalClose();
+    await this.loadUsers();
+  }
+
+  setupModalClose() {
+    const modal = document.getElementById('detailModal');
+    if (modal) {
+      modal.addEventListener('click', (event) => {
+        if (event.target === modal) {
+          this.closeModal();
+        }
+      });
+    }
+  }
+
+  setupMobileMenu() {
+    const mobileMenuBtn = document.getElementById('mobile-menu-btn');
+    const sidebar = document.querySelector('.sidebar');
+    const sidebarOverlay = document.getElementById('sidebar-overlay');
+    if (mobileMenuBtn) {
+      mobileMenuBtn.addEventListener('click', () => {
+        sidebar.classList.add('open');
+        sidebarOverlay.classList.add('active');
+      });
+    }
+    if (sidebarOverlay) {
+      sidebarOverlay.addEventListener('click', () => {
+        sidebar.classList.remove('open');
+        sidebarOverlay.classList.remove('active');
+      });
+    }
+  }
+
+  async loadUsers(page = 1) {
+    this.currentPage = page;
+    const keyword = document.getElementById('searchKeyword')?.value || '';
+    let url = `${this.apiBase}/list?limit=${this.pageSize}`;
+    if (keyword) url += `&keyword=${encodeURIComponent(keyword)}`;
+    if (page > 1) url += `&last_id=${this.getLastIdForPage(page)}`;
+    this.showLoading();
+    try {
+      const response = await fetch(url, {
+        method: 'GET',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200 && result.data) {
+        this.displayUsers(result.data);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to load users',
+          (msg, type) => toast[type](msg),
+        )
+      ) {
+        return;
+      } else {
+        this.showError(result.message || 'Failed to load users');
+      }
+    } catch (error) {
+      this.showError('Network error: ' + error.message);
+    }
+  }
+
+  getLastIdForPage(page) {
+    if (page <= 1) return '';
+    const index = (page - 2) * this.pageSize + (this.pageSize - 1);
+    if (this.users && this.users[index]) {
+      return this.users[index].id;
+    }
+    return '';
+  }
+
+  displayUsers(data) {
+    this.users = data.users || [];
+    this.totalRecords = data.total_count || 0;
+    const container = document.getElementById('resultsContainer');
+    const paginationContainer = document.getElementById('paginationContainer');
+    document.getElementById('totalUsers').textContent = this.totalRecords;
+    let adminCount = 0;
+    let pendingCount = 0;
+    this.users.forEach((user) => {
+      if (user.role === 'admin') adminCount++;
+      if (user.status === 'pending') pendingCount++;
+    });
+    document.getElementById('adminCount').textContent = adminCount;
+    document.getElementById('pendingCount').textContent = pendingCount;
+    if (this.users.length === 0) {
+      container.innerHTML = '<div class="no-data">No users found</div>';
+      paginationContainer.innerHTML = '';
+      return;
+    }
+    container.innerHTML =
+      '<div class="user-list">' +
+      this.users.map((user) => this.renderUserCard(user)).join('') +
+      '</div>';
+    if (paginationContainer) {
+      paginationContainer.innerHTML = this.renderPagination(data.has_more);
+    }
+  }
+
+  renderUserCard(user) {
+    const roleClass = user.role === 'admin' ? 'badge-admin' : 'badge-user';
+    const statusClass =
+      user.status === 'pending'
+        ? 'badge-pending'
+        : user.status === 'approved'
+          ? 'badge-approved'
+          : 'badge-rejected';
+    const initials = user.username
+      ? user.username.substring(0, 2).toUpperCase()
+      : '??';
+    return `
+      <div class="user-card" onclick="app.viewUser('${user.id}')">
+        <div class="user-info">
+          <div class="user-avatar">${initials}</div>
+          <div class="user-details">
+            <div class="user-name">${this.escapeHtml(user.username)}</div>
+            <div class="user-meta">
+              ${user.email ? this.escapeHtml(user.email) : 'No email'}
+              ${user.phone ? ' | ' + this.escapeHtml(user.phone) : ''}
+            </div>
+          </div>
+        </div>
+        <div class="user-badges">
+          <span class="badge ${roleClass}">${user.role}</span>
+          <span class="badge ${statusClass}">${user.status}</span>
+        </div>
+        <div class="user-actions" onclick="event.stopPropagation()">
+          ${user.status === 'pending' || user.status === 'rejected' ? `<button class="btn btn-success" onclick="app.updateUserStatus('${user.id}', true)">Approve</button>` : ''}
+          ${(user.status === 'pending' || user.status === 'approved') && user.role !== 'admin' ? `<button class="btn btn-danger" onclick="app.updateUserStatus('${user.id}', false)">Reject</button>` : ''}
+          <button class="btn btn-danger" onclick="app.deleteUser('${user.id}')">Delete</button>
+        </div>
+      </div>
+    `;
+  }
+
+  renderPagination(hasMore) {
+    let html =
+      '<div class="pagination-info">' +
+      `<span>Total: ${this.totalRecords} users</span>` +
+      `<span>Page ${this.currentPage}</span>` +
+      '</div>' +
+      '<div class="pagination-controls">';
+    if (this.currentPage > 1) {
+      html += `<button onclick="app.loadUsers(${this.currentPage - 1})">Previous</button>`;
+    } else {
+      html += `<button disabled>Previous</button>`;
+    }
+    if (hasMore) {
+      html += `<button onclick="app.loadUsers(${this.currentPage + 1})">Next</button>`;
+    } else {
+      html += `<button disabled>Next</button>`;
+    }
+    html += '</div>';
+    return html;
+  }
+
+  async viewUser(userId) {
+    try {
+      const response = await fetch(`${this.apiBase}/get/${userId}`, {
+        method: 'GET',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200 && result.data) {
+        this.showUserDetail(result.data);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to load user',
+          (msg, type) => toast[type](msg),
+        )
+      ) {
+        return;
+      } else {
+        toast.error(result.message || 'Failed to load user');
+      }
+    } catch (error) {
+      toast.error('Network error: ' + error.message);
+    }
+  }
+
+  showUserDetail(user) {
+    this.currentUserId = user.id;
+    const modal = document.getElementById('detailModal');
+    const content = document.getElementById('modalContent');
+    const createdAt = user.created_at
+      ? new Date(user.created_at).toLocaleString()
+      : 'N/A';
+    content.innerHTML = `
+      <div id="detailView">
+        <div class="detail-row">
+          <span class="detail-label">ID</span>
+          <span class="detail-value">${this.escapeHtml(user.id)}</span>
+        </div>
+        <div class="detail-row">
+          <span class="detail-label">Username</span>
+          <span class="detail-value">${this.escapeHtml(user.username)}</span>
+        </div>
+        <div class="detail-row">
+          <span class="detail-label">Email</span>
+          <span class="detail-value">${user.email ? this.escapeHtml(user.email) : 'N/A'}</span>
+        </div>
+        <div class="detail-row">
+          <span class="detail-label">Phone</span>
+          <span class="detail-value">${user.phone ? this.escapeHtml(user.phone) : 'N/A'}</span>
+        </div>
+        <div class="detail-row">
+          <span class="detail-label">Role</span>
+          <span class="detail-value">${user.role}</span>
+        </div>
+        <div class="detail-row">
+          <span class="detail-label">Status</span>
+          <span class="detail-value">${user.status}</span>
+        </div>
+        <div class="detail-row">
+          <span class="detail-label">Created At</span>
+          <span class="detail-value">${createdAt}</span>
+        </div>
+        <div class="detail-actions">
+          <button class="btn btn-primary" onclick="app.showEditForm()">Edit</button>
+          <button class="btn btn-secondary" onclick="app.showPasswordForm()">Password</button>
+        </div>
+      </div>
+      <div id="editForm" style="display:none">
+        <div class="form-group">
+          <label class="form-label">Email</label>
+          <input type="email" class="form-input" id="editEmail" value="${this.escapeHtml(user.email || '')}" placeholder="Enter email" />
+        </div>
+        <div class="form-group">
+          <label class="form-label">Phone</label>
+          <input type="text" class="form-input" id="editPhone" value="${this.escapeHtml(user.phone || '')}" placeholder="Enter phone" />
+        </div>
+        <div class="detail-actions">
+          <button class="btn" onclick="app.showDetailView()">Cancel</button>
+          <button class="btn btn-primary" onclick="app.submitEdit()">Save</button>
+        </div>
+      </div>
+      <div id="passwordForm" style="display:none">
+        <div class="form-group">
+          <label class="form-label">Old Password</label>
+          <input type="password" class="form-input" id="oldPassword" placeholder="Enter old password" />
+        </div>
+        <div class="form-group">
+          <label class="form-label">New Password</label>
+          <input type="password" class="form-input" id="newPassword" placeholder="Enter new password" />
+        </div>
+        <div class="detail-actions">
+          <button class="btn" onclick="app.showDetailView()">Cancel</button>
+          <button class="btn btn-primary" onclick="app.submitPassword()">Change</button>
+        </div>
+      </div>
+    `;
+    modal.classList.add('active');
+  }
+
+  showDetailView() {
+    document.getElementById('detailView').style.display = 'block';
+    document.getElementById('editForm').style.display = 'none';
+    document.getElementById('passwordForm').style.display = 'none';
+  }
+
+  showEditForm() {
+    document.getElementById('detailView').style.display = 'none';
+    document.getElementById('editForm').style.display = 'block';
+    document.getElementById('passwordForm').style.display = 'none';
+  }
+
+  showPasswordForm() {
+    document.getElementById('detailView').style.display = 'none';
+    document.getElementById('editForm').style.display = 'none';
+    document.getElementById('passwordForm').style.display = 'block';
+    document.getElementById('oldPassword').value = '';
+    document.getElementById('newPassword').value = '';
+  }
+
+  async submitEdit() {
+    if (!this.currentUserId) return;
+    const email = document.getElementById('editEmail').value || null;
+    const phone = document.getElementById('editPhone').value || null;
+    try {
+      const response = await fetch(
+        `${this.apiBase}/update/${this.currentUserId}`,
+        {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          credentials: 'include',
+          body: JSON.stringify({ email, phone }),
+        },
+      );
+      const result = await response.json();
+      if (result.code === 200) {
+        toast.success('User updated successfully');
+        const user = this.users.find((u) => u.id === this.currentUserId);
+        if (user) {
+          user.email = email;
+          user.phone = phone;
+        }
+        this.showDetailView();
+        await this.loadUsers(this.currentPage);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to update user',
+          (msg, type) => toast[type](msg),
+        )
+      ) {
+        return;
+      } else {
+        toast.error(result.message || 'Failed to update user');
+      }
+    } catch (error) {
+      toast.error('Network error: ' + error.message);
+    }
+  }
+
+  async submitPassword() {
+    if (!this.currentUserId) return;
+    const oldPassword = document.getElementById('oldPassword').value;
+    const newPassword = document.getElementById('newPassword').value;
+    if (!oldPassword || !newPassword) {
+      toast.error('Please fill in both passwords');
+      return;
+    }
+    try {
+      const response = await fetch(
+        `${this.apiBase}/change_password/${this.currentUserId}`,
+        {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          credentials: 'include',
+          body: JSON.stringify({
+            old_password: oldPassword,
+            new_password: newPassword,
+          }),
+        },
+      );
+      const result = await response.json();
+      if (result.code === 200) {
+        toast.success('Password changed successfully');
+        this.showDetailView();
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to change password',
+          (msg, type) => toast[type](msg),
+        )
+      ) {
+        return;
+      } else {
+        toast.error(result.message || 'Failed to change password');
+      }
+    } catch (error) {
+      toast.error('Network error: ' + error.message);
+    }
+  }
+
+  async updateUserStatus(userId, approved) {
+    const action = approved ? 'approve' : 'reject';
+    const confirmed = await hyperlaneConfirm.show(
+      `Are you sure you want to ${action} this user?`,
+    );
+    if (!confirmed) return;
+    try {
+      const response = await fetch(`${this.apiBase}/update_status/${userId}`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+        body: JSON.stringify({ approved }),
+      });
+      const result = await response.json();
+      if (result.code === 200) {
+        toast.success(`User ${action}d successfully`);
+        await this.loadUsers(this.currentPage);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          `Failed to ${action} user`,
+          (msg, type) => toast[type](msg),
+        )
+      ) {
+        return;
+      } else {
+        toast.error(result.message || `Failed to ${action} user`);
+      }
+    } catch (error) {
+      toast.error('Network error: ' + error.message);
+    }
+  }
+
+  async deleteUser(userId) {
+    const confirmed = await hyperlaneConfirm.show(
+      'Are you sure you want to delete this user? This action cannot be undone.',
+    );
+    if (!confirmed) return;
+    try {
+      const response = await fetch(`${this.apiBase}/delete/${userId}`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+      });
+      const result = await response.json();
+      if (result.code === 200) {
+        toast.success('User deleted successfully');
+        await this.loadUsers(this.currentPage);
+      } else if (
+        HyperlaneErrorHandler.handleResponse(
+          result,
+          'Failed to delete user',
+          (msg, type) => toast[type](msg),
+        )
+      ) {
+        return;
+      } else {
+        toast.error(result.message || 'Failed to delete user');
+      }
+    } catch (error) {
+      toast.error('Network error: ' + error.message);
+    }
+  }
+
+  onSearchInput() {
+    clearTimeout(this.searchDebounceTimer);
+    this.searchDebounceTimer = setTimeout(() => {
+      this.currentPage = 1;
+      this.loadUsers(1);
+    }, 400);
+  }
+
+  showLoading() {
+    document.getElementById('resultsContainer').innerHTML =
+      '<div class="loading-state"><div class="loading-spinner"></div><div class="loading-text">Loading users...</div></div>';
+  }
+
+  showError(message) {
+    document.getElementById('resultsContainer').innerHTML =
+      `<div class="no-data">${message}</div>`;
+  }
+
+  closeModal() {
+    document.getElementById('detailModal').classList.remove('active');
+  }
+
+  escapeHtml(text) {
+    if (!text) return '';
+    const div = document.createElement('div');
+    div.textContent = text;
+    return div.innerHTML;
+  }
+}
+
+const toast = Toast;
+const hyperlaneConfirm = window.HLConfirm;
+const app = new UserApp();
+document.addEventListener('DOMContentLoaded', () => app.init());

From 5dd63b2004b4af0b5a168879e84be99e243c05d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=A4=E9=9B=A8=E4=B8=9C?= <root@ltpp.vip>
Date: Thu, 7 May 2026 21:47:26 +0800
Subject: [PATCH 2/3] feat: v21.3.0

---
 application/controller/auth/impl.rs         |  8 +++---
 application/controller/blog/impl.rs         | 18 ++++++-------
 application/controller/order/impl.rs        |  6 ++---
 application/controller/user/impl.rs         |  6 ++---
 resources/static/common/js/error-handler.js | 28 ++++++++++++++++++++-
 5 files changed, 46 insertions(+), 20 deletions(-)

diff --git a/application/controller/auth/impl.rs b/application/controller/auth/impl.rs
index 28f2cb61..6b967782 100644
--- a/application/controller/auth/impl.rs
+++ b/application/controller/auth/impl.rs
@@ -152,7 +152,7 @@ impl ServerHook for UserUpdateRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -328,7 +328,7 @@ impl ServerHook for UserListRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -441,7 +441,7 @@ impl ServerHook for UserDeleteRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -556,7 +556,7 @@ impl ServerHook for UserInfoRoute {
             },
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
             }
diff --git a/application/controller/blog/impl.rs b/application/controller/blog/impl.rs
index dd67a79e..33f720a2 100644
--- a/application/controller/blog/impl.rs
+++ b/application/controller/blog/impl.rs
@@ -26,7 +26,7 @@ impl ServerHook for BlogPostCreateRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -92,7 +92,7 @@ impl ServerHook for BlogPostUpdateRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -148,7 +148,7 @@ impl ServerHook for BlogPostDeleteRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -287,7 +287,7 @@ impl ServerHook for BlogPostMyListRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -357,7 +357,7 @@ impl ServerHook for BlogPostLikeRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -413,7 +413,7 @@ impl ServerHook for BlogPostFavoriteRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -450,7 +450,7 @@ impl ServerHook for BlogPostFavoriteListRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -509,7 +509,7 @@ impl ServerHook for BlogCommentCreateRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -565,7 +565,7 @@ impl ServerHook for BlogCommentDeleteRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
diff --git a/application/controller/order/impl.rs b/application/controller/order/impl.rs
index 648672fd..951c667b 100644
--- a/application/controller/order/impl.rs
+++ b/application/controller/order/impl.rs
@@ -22,7 +22,7 @@ impl ServerHook for RecordCreateRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -113,7 +113,7 @@ impl ServerHook for RecordListRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -253,7 +253,7 @@ impl ServerHook for OverviewStatisticsRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
diff --git a/application/controller/user/impl.rs b/application/controller/user/impl.rs
index bd7409bd..f174a7c1 100644
--- a/application/controller/user/impl.rs
+++ b/application/controller/user/impl.rs
@@ -15,7 +15,7 @@ impl ServerHook for UserListRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -146,7 +146,7 @@ impl ServerHook for UserUpdateRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
@@ -317,7 +317,7 @@ impl ServerHook for UserDeleteRoute {
             Ok(id) => id,
             Err(error) => {
                 let mut response: ApiResponse<String> =
-                    ApiResponse::new(ApiResponseStatus::BusinessLogicError, error.clone());
+                    ApiResponse::new(ApiResponseStatus::Unauthorized, error.clone());
                 response.set_message(&error);
                 ctx.get_mut_response().set_body(response.to_json_bytes());
                 return;
diff --git a/resources/static/common/js/error-handler.js b/resources/static/common/js/error-handler.js
index caa5d790..a1415cd7 100644
--- a/resources/static/common/js/error-handler.js
+++ b/resources/static/common/js/error-handler.js
@@ -12,6 +12,19 @@ const HyperlaneErrorHandler = {
   },
 
   handleResponse: function (result, defaultMessage, toastCallback) {
+    if (result.code === 401) {
+      if (typeof Toast !== 'undefined') {
+        Toast.error(
+          result.message || 'Authentication failed, please login again',
+        );
+      } else if (toastCallback) {
+        toastCallback(
+          result.message || 'Authentication failed, please login again',
+          'error',
+        );
+      }
+      return true;
+    }
     if (result.code === 500) {
       if (typeof Toast !== 'undefined') {
         Toast.error(result.message || 'Server error, please try again later');
@@ -27,6 +40,20 @@ const HyperlaneErrorHandler = {
   },
 
   handleResponseWithLogout: function (result, defaultMessage, toastCallback) {
+    if (result.code === 401) {
+      if (typeof Toast !== 'undefined') {
+        Toast.error(
+          result.message || 'Authentication expired, please login again',
+        );
+      } else if (toastCallback) {
+        toastCallback(
+          result.message || 'Authentication expired, please login again',
+          'error',
+        );
+      }
+      this.logout();
+      return true;
+    }
     if (result.code === 500) {
       if (typeof Toast !== 'undefined') {
         Toast.error(result.message || 'Server error, please try again later');
@@ -36,7 +63,6 @@ const HyperlaneErrorHandler = {
           'error',
         );
       }
-      this.logout();
       return true;
     }
     return false;

From 66626af1499297f8db76bc860f92d40d27bc6330 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=A4=E9=9B=A8=E4=B8=9C?= <root@ltpp.vip>
Date: Thu, 7 May 2026 21:56:36 +0800
Subject: [PATCH 3/3] feat: v21.3.0

---
 resources/static/common/js/error-handler.js | 28 ---------------------
 resources/static/notification/js/app.js     | 12 ++++-----
 2 files changed, 6 insertions(+), 34 deletions(-)

diff --git a/resources/static/common/js/error-handler.js b/resources/static/common/js/error-handler.js
index a1415cd7..de636b6a 100644
--- a/resources/static/common/js/error-handler.js
+++ b/resources/static/common/js/error-handler.js
@@ -23,34 +23,6 @@ const HyperlaneErrorHandler = {
           'error',
         );
       }
-      return true;
-    }
-    if (result.code === 500) {
-      if (typeof Toast !== 'undefined') {
-        Toast.error(result.message || 'Server error, please try again later');
-      } else if (toastCallback) {
-        toastCallback(
-          result.message || 'Server error, please try again later',
-          'error',
-        );
-      }
-      return true;
-    }
-    return false;
-  },
-
-  handleResponseWithLogout: function (result, defaultMessage, toastCallback) {
-    if (result.code === 401) {
-      if (typeof Toast !== 'undefined') {
-        Toast.error(
-          result.message || 'Authentication expired, please login again',
-        );
-      } else if (toastCallback) {
-        toastCallback(
-          result.message || 'Authentication expired, please login again',
-          'error',
-        );
-      }
       this.logout();
       return true;
     }
diff --git a/resources/static/notification/js/app.js b/resources/static/notification/js/app.js
index f2f71afa..615c34c7 100644
--- a/resources/static/notification/js/app.js
+++ b/resources/static/notification/js/app.js
@@ -24,7 +24,7 @@ class NotificationApp {
       if (result.code === 200 && result.data) {
         document.getElementById('unreadCount').textContent = result.data.count;
       } else if (
-        HyperlaneErrorHandler.handleResponseWithLogout(
+        HyperlaneErrorHandler.handleResponse(
           result,
           'Failed to load unread count',
           Toast.error.bind(Toast),
@@ -59,7 +59,7 @@ class NotificationApp {
       if (result.code === 200 && result.data) {
         this.displayNotifications(result.data);
       } else if (
-        HyperlaneErrorHandler.handleResponseWithLogout(
+        HyperlaneErrorHandler.handleResponse(
           result,
           'Failed to load notifications',
           Toast.error.bind(Toast),
@@ -171,7 +171,7 @@ class NotificationApp {
         await this.loadUnreadCount();
         await this.loadNotifications(this.currentPage);
       } else if (
-        HyperlaneErrorHandler.handleResponseWithLogout(
+        HyperlaneErrorHandler.handleResponse(
           result,
           'Failed to mark as read',
           Toast.error.bind(Toast),
@@ -199,7 +199,7 @@ class NotificationApp {
         await this.loadUnreadCount();
         await this.loadNotifications(1);
       } else if (
-        HyperlaneErrorHandler.handleResponseWithLogout(
+        HyperlaneErrorHandler.handleResponse(
           result,
           'Failed to mark all as read',
           Toast.error.bind(Toast),
@@ -232,7 +232,7 @@ class NotificationApp {
         await this.loadUnreadCount();
         await this.loadNotifications(this.currentPage);
       } else if (
-        HyperlaneErrorHandler.handleResponseWithLogout(
+        HyperlaneErrorHandler.handleResponse(
           result,
           'Failed to delete notification',
           Toast.error.bind(Toast),
@@ -328,7 +328,7 @@ class NotificationApp {
         await this.loadUnreadCount();
         await this.loadNotifications(1);
       } else if (
-        HyperlaneErrorHandler.handleResponseWithLogout(
+        HyperlaneErrorHandler.handleResponse(
           result,
           'Failed to create notification',
           Toast.error.bind(Toast),