feat: check password and delete account

src/pages/Settings/Settings.tsx

@@ -8,19 +8,28 @@ import { FiUserMinus } from "react-icons/fi";
 import { IoKeyOutline } from "react-icons/io5";
 import { MdOutlineLogout } from "react-icons/md";
 import { useTranslation } from "react-i18next";
-import { useAppDispatch } from "../../stores/store";
+import {
+  useAppDispatch,
+  useAppSelector,
+  type RootState,
+} from "../../stores/store";
 import { logout } from "../../stores/slices/authSlice";
 import CModal from "../../components/CModal";
 import CButton from "../../components/CButton";
 import { Link } from "react-router-dom";
 import CInput from "../../components/CInput";
+import { checkPassword } from "../../stores/slices/accountSlice";
 
 const Settings: React.FC = () => {
+  const [password, setPassword] = useState("");
   const [isOpenLogoutModal, setIsOpenLogoutModal] = useState(false);
   const [isOpenDeleteAccountModal, setIsOpenDeleteAccountModal] =
     useState(false);
   const { language, changeLanguage } = useLanguage();
   const { t } = useTranslation();
+  const { isCheckPasswordLoading, errorCheckPassword } = useAppSelector(
+    (state: RootState) => state.account
+  );
   const dispatch = useAppDispatch();
 
   const toggleLogoutModal = () => {
@@ -118,13 +127,25 @@ const Settings: React.FC = () => {
               placeholder={t("common.passwordPlaceholder")}
               label={t("common.password")}
               type="password"
+              value={password}
+              onChange={(e) => setPassword(e.target.value)}
             />
+
+            {errorCheckPassword && (
+              <p className="text-danger text-center">{errorCheckPassword}</p>
+            )}
+
             <div className="modal__box__actions">
               <CButton
                 title={t("button.cancel")}
                 onClick={toggleDeleteAccountModal}
               />
-              <CButton title={t("button.confirm")} variant="danger" />
+              <CButton
+                title={t("button.confirm")}
+                variant="danger"
+                isLoading={isCheckPasswordLoading}
+                onClick={() => dispatch(checkPassword(password))}
+              />
             </div>
           </div>
         }

src/stores/slices/accountSlice.ts

 import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
 import { sendRpcRequest } from "../../services/apiClient";
+import { TG_USER_ID } from "../../constants/constants";
 
 interface ISession {
   login: string;
@@ -10,6 +11,8 @@ interface ISession {
 interface IAccountState {
   session: ISession;
   loading: boolean;
+  isCheckPasswordLoading: boolean;
+  errorCheckPassword: string | null;
 }
 
 const initialState: IAccountState = {
@@ -19,6 +22,8 @@ const initialState: IAccountState = {
     subDateEnd: "",
   },
   loading: false,
+  isCheckPasswordLoading: false,
+  errorCheckPassword: null,
 };
 
 export const accountSession = createAsyncThunk(
@@ -38,6 +43,45 @@ export const accountSession = createAsyncThunk(
   }
 );
 
+export const checkPassword = createAsyncThunk(
+  "account/checkPassword",
+  async (password: string, { rejectWithValue }) => {
+    try {
+      const response = await sendRpcRequest<{
+        message: string;
+        success: boolean;
+      }>("account.checkpwd", {
+        password,
+      });
+
+      console.log("response", response);
+
+      if (response?.message === "valid") {
+        const deleteAccountResponse = await sendRpcRequest<{
+          message: string;
+          success: boolean;
+        }>("account.deleteaccount");
+
+        if (deleteAccountResponse.success) {
+          localStorage.removeItem(`token-${TG_USER_ID}`);
+          localStorage.removeItem(`pincode-${TG_USER_ID}`);
+          sessionStorage.removeItem(`pincode-${TG_USER_ID}`);
+          window.location.href = "/";
+        }
+
+        return response;
+      }
+
+      return response;
+    } catch (error: unknown) {
+      if (typeof error === "object" && error !== null && "message" in error) {
+        return rejectWithValue(error.message);
+      }
+      return rejectWithValue("Unknown error occurred");
+    }
+  }
+);
+
 const accountSlice = createSlice({
   name: "account",
   initialState,
@@ -53,6 +97,18 @@ const accountSlice = createSlice({
       })
       .addCase(accountSession.rejected, (state) => {
         state.loading = false;
+      })
+
+      .addCase(checkPassword.pending, (state) => {
+        state.isCheckPasswordLoading = true;
+      })
+      .addCase(checkPassword.fulfilled, (state) => {
+        state.isCheckPasswordLoading = false;
+        state.errorCheckPassword = null;
+      })
+      .addCase(checkPassword.rejected, (state, action) => {
+        state.isCheckPasswordLoading = false;
+        state.errorCheckPassword = action.payload as string;
       });
   },
 });