v4.6.2-alpah (#511)

projects/app/src/components/support/apikey/Table.tsx

@@ -219,16 +219,23 @@ const ApiKeyTable = ({ tips, appId }: { tips: string; appId?: string }) => {
           }}
         />
       )}
-      <MyModal isOpen={!!apiKey} w={['400px', '600px']} onClose={() => setApiKey('')}>
-        <Box py={3} px={5}>
-          <Box fontWeight={'bold'} fontSize={'2xl'}>
-            新的 API 秘钥
+      <MyModal
+        isOpen={!!apiKey}
+        w={['400px', '600px']}
+        iconSrc="/imgs/modal/key.svg"
+        title={
+          <Box>
+            <Box fontWeight={'bold'} fontSize={'xl'}>
+              新的 API 秘钥
+            </Box>
+            <Box fontSize={'sm'} color={'myGray.600'}>
+              请保管好你的秘钥，秘钥不会再次展示~
+            </Box>
           </Box>
-          <Box fontSize={'sm'} color={'myGray.600'}>
-            请保管好你的秘钥，秘钥不会再次展示~
-          </Box>
-        </Box>
-        <ModalBody>
+        }
+        onClose={() => setApiKey('')}
+      >
+        <ModalBody pt={5}>
           <Flex
             bg={'myGray.100'}
             px={3}
@@ -236,6 +243,7 @@ const ApiKeyTable = ({ tips, appId }: { tips: string; appId?: string }) => {
             whiteSpace={'pre-wrap'}
             wordBreak={'break-all'}
             cursor={'pointer'}
+            borderRadius={'md'}
             onClick={() => copyData(apiKey)}
           >
             <Box flex={1}>{apiKey}</Box>
@@ -292,7 +300,11 @@ function EditKeyModal({
   });
 
   return (
-    <MyModal isOpen={true} title={isEdit ? t('outlink.Edit API Key') : t('outlink.Create API Key')}>
+    <MyModal
+      isOpen={true}
+      iconSrc="/imgs/modal/key.svg"
+      title={isEdit ? t('outlink.Edit API Key') : t('outlink.Create API Key')}
+    >
       <ModalBody>
         <Flex alignItems={'center'}>
           <Box flex={'0 0 90px'}>{t('Name')}:</Box>