perf: member tableui (#4353)

projects/app/src/pageComponents/account/team/MemberTable.tsx

@@ -17,7 +17,6 @@ import {
 import { useTranslation } from 'next-i18next';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import { useConfirm } from '@fastgpt/web/hooks/useConfirm';
-import { useEditTextarea } from '@fastgpt/web/hooks/useEditTextarea';
 import {
   delRemoveMember,
   getTeamMembers,
@@ -50,6 +49,7 @@ import { useScrollPagination } from '@fastgpt/web/hooks/useScrollPagination';
 import { PaginationResponse } from '@fastgpt/web/common/fetch/type';
 import _ from 'lodash';
 import MySelect from '@fastgpt/web/components/common/MySelect';
+import { useEditTitle } from '@/web/common/hooks/useEditTitle';
 
 const InviteModal = dynamic(() => import('./Invite/InviteModal'));
 const TeamTagModal = dynamic(() => import('@/components/support/user/team/TeamTagModal'));
@@ -157,11 +157,10 @@ function MemberTable({ Tabs }: { Tabs: React.ReactNode }) {
 
   const isLoading = loadingMembers || isSyncing;
 
-  const { EditModal: EditMemberNameModal, onOpenModal: openEditMemberName } = useEditTextarea({
+  const { EditModal: EditMemberNameModal, onOpenModal: openEditMemberName } = useEditTitle({
     title: t('account_team:edit_member'),
     tip: t('account_team:edit_member_tip'),
-    canEmpty: false,
-    rows: 1
+    canEmpty: false
   });
   const handleEditMemberName = (tmbId: string, memberName: string) => {
     openEditMemberName({
@@ -323,8 +322,8 @@ function MemberTable({ Tabs }: { Tabs: React.ReactNode }) {
                         member.tmbId !== userInfo?.team.tmbId &&
                         (member.status === TeamMemberStatusEnum.active ? (
                           <>
-                            {' '}
                             <Icon
+                              mr={2}
                               name={'edit'}
                               cursor={'pointer'}
                               w="1rem"

projects/app/src/web/common/hooks/useEditTitle.tsx

@@ -4,6 +4,7 @@ import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useTranslation } from 'next-i18next';
 import { useRequest2 } from '@fastgpt/web/hooks/useRequest';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 export const useEditTitle = ({
   title,
@@ -89,11 +90,7 @@ export const useEditTitle = ({
       return (
         <MyModal isOpen={isOpen} onClose={onClose} iconSrc={iconSrc} title={title} maxW={'500px'}>
           <ModalBody>
-            {!!tip && (
-              <Box mb={2} color={'myGray.500'} fontSize={'sm'}>
-                {tip}
-              </Box>
-            )}
+            {!!tip && <FormLabel mb={2}>{tip}</FormLabel>}
 
             <Input
               ref={inputRef}