4.6.2-production (#518)

projects/app/src/components/ChatBox/MessageInput.tsx

@@ -8,7 +8,7 @@ import MyIcon from '../Icon';
 import styles from './index.module.scss';
 import { useRouter } from 'next/router';
 import { useSelectFile } from '@/web/common/file/hooks/useSelectFile';
-import { compressImgAndUpload } from '@/web/common/file/controller';
+import { compressImgFileAndUpload } from '@/web/common/file/controller';
 import { useToast } from '@/web/common/hooks/useToast';
 import { customAlphabet } from 'nanoid';
 import { IMG_BLOCK_KEY } from '@fastgpt/global/core/chat/constants';
@@ -72,7 +72,7 @@ const MessageInput = ({
   const uploadFile = async (file: FileItemType) => {
     if (file.type === FileTypeEnum.image) {
       try {
-        const src = await compressImgAndUpload({
+        const src = await compressImgFileAndUpload({
           file: file.rawFile,
           maxW: 1000,
           maxH: 1000,

projects/app/src/components/Markdown/img/Image.tsx

@@ -1,5 +1,6 @@
 import React, { useState } from 'react';
 import {
+  Box,
   Image,
   Modal,
   ModalCloseButton,
@@ -8,6 +9,7 @@ import {
   Skeleton,
   useDisclosure
 } from '@chakra-ui/react';
+import MyModal from '@/components/MyModal';
 
 const MdImage = ({ src }: { src?: string }) => {
   const [isLoading, setIsLoading] = useState(true);
@@ -43,17 +45,21 @@ const MdImage = ({ src }: { src?: string }) => {
           onOpen();
         }}
       />
-      <Modal isOpen={isOpen} onClose={onClose}>
+      <Modal isOpen={isOpen} onClose={onClose} isCentered>
         <ModalOverlay />
-        <ModalContent m={'auto'}>
-          <Image
-            src={src}
-            alt={''}
-            fallbackSrc={'/imgs/errImg.png'}
-            fallbackStrategy={'onError'}
-            loading="eager"
-            objectFit={'contain'}
-          />
+        <ModalContent maxW={'80vw'} maxH={'auto'}>
+          <Box>
+            <Image
+              borderRadius={'md'}
+              src={src}
+              alt={''}
+              w={'auto'}
+              h={'auto'}
+              fallbackSrc={'/imgs/errImg.png'}
+              fallbackStrategy={'onError'}
+              objectFit={'contain'}
+            />
+          </Box>
         </ModalContent>
         <ModalCloseButton bg={'myWhite.500'} zIndex={999999} />
       </Modal>

projects/app/src/components/support/user/team/TeamManageModal/EditModal.tsx

@@ -2,7 +2,7 @@ import React, { useCallback, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { useTranslation } from 'next-i18next';
 import { useSelectFile } from '@/web/common/file/hooks/useSelectFile';
-import { compressImgAndUpload } from '@/web/common/file/controller';
+import { compressImgFileAndUpload } from '@/web/common/file/controller';
 import { useToast } from '@/web/common/hooks/useToast';
 import { getErrText } from '@fastgpt/global/common/error/utils';
 import { useRequest } from '@/web/common/hooks/useRequest';
@@ -49,7 +49,7 @@ function EditModal({
       const file = e[0];
       if (!file) return;
       try {
-        const src = await compressImgAndUpload({
+        const src = await compressImgFileAndUpload({
           file,
           maxW: 100,
           maxH: 100