diff --git a/web/src/components/Settings/MemberSection.tsx b/web/src/components/Settings/MemberSection.tsx
index a5651d41..6bb0eac3 100644
--- a/web/src/components/Settings/MemberSection.tsx
+++ b/web/src/components/Settings/MemberSection.tsx
@@ -1,9 +1,11 @@
 import { Button, Dropdown, Input, Menu, MenuButton } from "@mui/joy";
 import React, { useEffect, useState } from "react";
 import { toast } from "react-hot-toast";
+import { userServiceClient } from "@/grpcweb";
 import * as api from "@/helpers/api";
 import { useUserStore } from "@/store/module";
 import { UserNamePrefix } from "@/store/v1";
+import { User_Role } from "@/types/proto/api/v2/user_service";
 import { useTranslate } from "@/utils/i18n";
 import showChangeMemberPasswordDialog from "../ChangeMemberPasswordDialog";
 import { showCommonDialog } from "../Dialog/CommonDialog";
@@ -53,16 +55,16 @@ const MemberSection = () => {
       return;
     }
 
-    const userCreate: UserCreate = {
-      username: state.createUserUsername,
-      password: state.createUserPassword,
-      role: "USER",
-    };
-
     try {
-      await api.createUser(userCreate);
+      await userServiceClient.createUser({
+        user: {
+          name: `${UserNamePrefix}${state.createUserUsername}`,
+          password: state.createUserPassword,
+          role: User_Role.USER,
+        },
+      });
     } catch (error: any) {
-      toast.error(error.response.data.message);
+      toast.error(error.details);
     }
     await fetchUserList();
     setState({
diff --git a/web/src/helpers/api.ts b/web/src/helpers/api.ts
index a4353472..5c330eaf 100644
--- a/web/src/helpers/api.ts
+++ b/web/src/helpers/api.ts
@@ -44,10 +44,6 @@ export function signout() {
   return axios.post("/api/v1/auth/signout");
 }
 
-export function createUser(userCreate: UserCreate) {
-  return axios.post<User>("/api/v1/user", userCreate);
-}
-
 export function getMyselfUser() {
   return axios.get<User>("/api/v1/user/me");
 }