feat(users): add reset password functionality for users and implement forgot password page

src/pages/Manager/User/index.tsx

@@ -1,4 +1,4 @@
-import IconFont from '@/components/IconFont';
+import TooltipIconFontButton from '@/components/shared/TooltipIconFontButton';
 import TreeGroup from '@/components/shared/TreeGroup';
 import { DEFAULT_PAGE_SIZE } from '@/constants';
 import {
@@ -19,12 +19,16 @@ import {
   ProTable,
 } from '@ant-design/pro-components';
 import { FormattedMessage, history, useIntl } from '@umijs/max';
-import { Button, Grid, Popconfirm, theme } from 'antd';
+import { Button, Grid, Popconfirm, Space, theme } from 'antd';
 import message from 'antd/es/message';
 import Paragraph from 'antd/lib/typography/Paragraph';
 import { useRef, useState } from 'react';
 import CreateUser from './components/CreateUser';
-
+import ResetPassword from './components/ResetPassword';
+type ResetUserPaswordProps = {
+  user: MasterModel.UserResponse | null;
+  isOpen: boolean;
+};
 const ManagerUserPage = () => {
   const { useBreakpoint } = Grid;
   const intl = useIntl();
@@ -41,11 +45,21 @@ const ManagerUserPage = () => {
     string | string[] | null
   >(null);
 
+  const [resetPasswordUser, setResetPasswordUser] =
+    useState<ResetUserPaswordProps>({
+      user: null,
+      isOpen: false,
+    });
+
   const handleClickAssign = (user: MasterModel.UserResponse) => {
     const path = `${ROUTE_MANAGER_USERS}/${user.id}/${ROUTE_MANAGER_USERS_PERMISSIONS}`;
     history.push(path);
   };
 
+  const handleClickResetPassword = (user: MasterModel.UserResponse) => {
+    setResetPasswordUser({ user: user, isOpen: true });
+  };
+
   const columns: ProColumns<MasterModel.UserResponse>[] = [
     {
       key: 'email',
@@ -123,14 +137,28 @@ const ManagerUserPage = () => {
       hideInSearch: true,
       render: (_, user) => {
         return (
-          <>
-            <Button
+          <Space>
+            <TooltipIconFontButton
               shape="default"
               size="small"
-              icon={<IconFont type="icon-assign" />}
+              iconFontName="icon-assign"
+              tooltip={intl.formatMessage({
+                id: 'master.users.change_role.title',
+                defaultMessage: 'Set Permissions',
+              })}
               onClick={() => handleClickAssign(user)}
             />
-          </>
+            <TooltipIconFontButton
+              shape="default"
+              size="small"
+              iconFontName="icon-reset-password"
+              tooltip={intl.formatMessage({
+                id: 'master.users.resetPassword.title',
+                defaultMessage: 'Reset Password',
+              })}
+              onClick={() => handleClickResetPassword(user)}
+            />
+          </Space>
         );
       },
     },
@@ -181,6 +209,19 @@ const ManagerUserPage = () => {
   return (
     <>
       {contextHolder}
+      {resetPasswordUser.user && (
+        <ResetPassword
+          message={messageApi}
+          isOpen={resetPasswordUser.isOpen}
+          user={resetPasswordUser.user}
+          setIsOpen={(isOpen) =>
+            setResetPasswordUser((prev) => ({ ...prev, isOpen }))
+          }
+          onSuccess={(isSuccess) => {
+            if (isSuccess) actionRef.current?.reload();
+          }}
+        />
+      )}
       <ProCard split={screens.md ? 'vertical' : 'horizontal'}>
         <ProCard colSpan={{ xs: 24, sm: 24, md: 6, lg: 6, xl: 6 }}>
           <TreeGroup