feat(AccountsPage): add userEdit

client/src/pages/AccountsPage.tsx

@@ -7,13 +7,28 @@ import UserCreate from '@/components/UserCreate';
 import { Avatar, Table } from 'antd';
 import { TableProps } from 'antd/lib';
 import { UserService } from '@/services/userService';
+import UserEdit from '@/components/UserEdit';
 
 export default function AccountsPage() {
   const { t } = useTranslation();
-  const [open, setOpen] = useState(false);
+  const [openCreate, setOpenCreate] = useState(false);
 
-  const showDrawer = () => setOpen(true);
-  const closeDrawer = () => setOpen(false);
+  const [activeAccount, setActiveAccount] = useState<
+    { login: string; id: number; name: string; email: string } | undefined
+  >(undefined);
+
+  const showCreateDrawer = () => setOpenCreate(true);
+  const closeCreateDrawer = () => {
+    setActiveAccount(undefined);
+    setOpenCreate(false);
+  };
+  const [openEdit, setOpenEdit] = useState(false);
+
+  const showEditDrawer = () => setOpenEdit(true);
+  const closeEditDrawer = () => {
+    setActiveAccount(undefined);
+    setOpenEdit(false);
+  };
 
   const [accounts, setAccounts] = useState<AllUserResponse>({
     amountCount: 0,
@@ -49,7 +64,23 @@ export default function AccountsPage() {
       dataIndex: 'nameLogin',
       key: 'nameLogin',
       render: (text, record) => (
-        <div style={{ display: 'flex', alignItems: 'center', gap: '16px' }}>
+        <div
+          onClick={() => {
+            setActiveAccount({
+              login: record.login,
+              id: record.id,
+              name: record.name,
+              email: record.email || '',
+            });
+            showEditDrawer();
+          }}
+          style={{
+            display: 'flex',
+            alignItems: 'center',
+            gap: '16px',
+            cursor: 'pointer',
+          }}
+        >
           <div
             style={{
               height: '32px',
@@ -124,7 +155,7 @@ export default function AccountsPage() {
               width: '18px',
               cursor: 'pointer',
             }}
-            onClick={showDrawer}
+            onClick={showCreateDrawer}
           />
         }
       />
@@ -140,9 +171,23 @@ export default function AccountsPage() {
         rowKey={'id'}
       />
 
-      <ContentDrawer open={open} closeDrawer={closeDrawer} type="create">
+      <ContentDrawer
+        open={openCreate}
+        closeDrawer={closeCreateDrawer}
+        type="create"
+      >
         <UserCreate />
       </ContentDrawer>
+      <ContentDrawer
+        login={activeAccount?.login}
+        name={activeAccount?.name}
+        email={activeAccount?.email}
+        open={openEdit}
+        closeDrawer={closeEditDrawer}
+        type="edit"
+      >
+        <UserEdit userId={activeAccount?.id} />
+      </ContentDrawer>
     </>
   );
 }