fix: fix bugs

src/pages/user/edit/List.tsx

@@ -1,4 +1,4 @@
-import { Button, Input, message, Modal, Table } from 'antd';
+import { Button, Input, message, Modal, Space, Table } from 'antd';
 import { Fragment, useEffect, useMemo, useState } from 'react';
 import { useUserStore } from '../store';
 import { useShallow } from 'zustand/react/shallow';
@@ -81,6 +81,7 @@ const FormModal = () => {
 };
 export const List = () => {
   const navicate = useNewNavigate();
+  const [modal, contextHolder] = Modal.useModal();
   const userStore = useUserStore(
     useShallow((state) => {
       return {
@@ -137,7 +138,7 @@ export const List = () => {
                         <div className='font-light text-xs mt-2'>{item.description ? item.description : '-'}</div>
                       </div>
                       <div className='flex mt-2 '>
-                        <Button.Group>
+                        <Space.Compact>
                           <Button
                             onClick={(e) => {
                               userStore.setFormData(item);
@@ -148,7 +149,7 @@ export const List = () => {
                             icon={<EditOutlined />}></Button>
                           <Button
                             onClick={(e) => {
-                              Modal.confirm({
+                              modal.confirm({
                                 title: 'Delete',
                                 content: 'Are you sure delete this data?',
                                 onOk: () => {
@@ -158,7 +159,7 @@ export const List = () => {
                               e.stopPropagation();
                             }}
                             icon={<DeleteOutlined />}></Button>
-                        </Button.Group>
+                        </Space.Compact>
                       </div>
                     </div>
                   </Fragment>
@@ -202,6 +203,7 @@ export const List = () => {
         </div>
       </div>
       <FormModal />
+      {contextHolder}
     </div>
   );
 };