4.6.9-production (#952)

* move components to web package (#37) * move components * fix * fix: cq connection * fix pagination (#41) * doc * openapi config * fix team share app lose (#42) * fix: ts * doc * doc --------- Co-authored-by: heheer <71265218+newfish-cmyk@users.noreply.github.com> Co-authored-by: yst <77910600+yu-and-liu@users.noreply.github.com>
2025-07-27 08:25:07 +00:00 · 2024-03-08 13:33:45 +08:00
parent 46d9a6461f
commit 4d66e0f828
61 changed files with 290 additions and 141 deletions
--- a/projects/app/public/docs/versionIntro.md
+++ b/projects/app/public/docs/versionIntro.md
@@ -1,4 +1,4 @@
-### Fast GPT V4.6.8
+### Fast GPT V4.6.9

 1. 新增 - 知识库新增“增强处理”训练模式，可生成更多类型索引。
 2. 新增 - 完善了HTTP模块的变量提示。
--- a/projects/app/src/components/ChatBox/index.tsx
+++ b/projects/app/src/components/ChatBox/index.tsx
@@ -53,7 +53,6 @@ import type { AdminMarkType } from './SelectMarkCollection';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import Avatar from '@/components/Avatar';
 import Markdown, { CodeClassName } from '@/components/Markdown';
-import MySelect from '@/components/Select';
 import MyTooltip from '../MyTooltip';
 import dynamic from 'next/dynamic';
 const ResponseTags = dynamic(() => import('./ResponseTags'));
@@ -69,6 +68,7 @@ import MessageInput from './MessageInput';
 import { ModuleOutputKeyEnum } from '@fastgpt/global/core/module/constants';
 import ChatBoxDivider from '../core/chat/Divider';
 import { OutLinkChatAuthProps } from '@fastgpt/global/support/permission/chat';
+import MySelect from '@fastgpt/web/components/common/MySelect';

 const nanoid = customAlphabet('abcdefghijklmnopqrstuvwxyz1234567890', 24);

--- a/projects/app/src/components/DateRangePicker/index.tsx
+++ b/projects/app/src/components/DateRangePicker/index.tsx
@@ -1,125 +0,0 @@
-import React, { useState, useMemo, useRef } from 'react';
-import { Box, Card, Flex, useTheme, useOutsideClick, Button } from '@chakra-ui/react';
-import { addDays, format } from 'date-fns';
-import { type DateRange, DayPicker } from 'react-day-picker';
-import MyIcon from '@fastgpt/web/components/common/Icon';
-import 'react-day-picker/dist/style.css';
-import zhCN from 'date-fns/locale/zh-CN';
-import { useTranslation } from 'next-i18next';
-
-const DateRangePicker = ({
-  onChange,
-  onSuccess,
-  position = 'bottom',
-  defaultDate = {
-    from: addDays(new Date(), -30),
-    to: new Date()
-  }
-}: {
-  onChange?: (date: DateRange) => void;
-  onSuccess?: (date: DateRange) => void;
-  position?: 'bottom' | 'top';
-  defaultDate?: DateRange;
-}) => {
-  const { t } = useTranslation();
-  const theme = useTheme();
-  const OutRangeRef = useRef(null);
-  const [range, setRange] = useState<DateRange | undefined>(defaultDate);
-  const [showSelected, setShowSelected] = useState(false);
-
-  const formatSelected = useMemo(() => {
-    if (range?.from && range.to) {
-      return `${format(range.from, 'y-MM-dd')} ~ ${format(range.to, 'y-MM-dd')}`;
-    }
-    return `${format(new Date(), 'y-MM-dd')} ~ ${format(new Date(), 'y-MM-dd')}`;
-  }, [range]);
-
-  useOutsideClick({
-    ref: OutRangeRef,
-    handler: () => {
-      setShowSelected(false);
-    }
-  });
-
-  return (
-    <Box position={'relative'} ref={OutRangeRef}>
-      <Flex
-        border={theme.borders.base}
-        px={3}
-        py={1}
-        borderRadius={'sm'}
-        cursor={'pointer'}
-        bg={'myWhite.600'}
-        fontSize={'sm'}
-        onClick={() => setShowSelected(true)}
-      >
-        <Box>{formatSelected}</Box>
-        <MyIcon ml={2} name={'date'} w={'16px'} color={'myGray.600'} />
-      </Flex>
-      {showSelected && (
-        <Card
-          position={'absolute'}
-          zIndex={1}
-          css={{
-            '--rdp-background-color': '#d6e8ff',
-            ' --rdp-accent-color': '#0000ff'
-          }}
-          {...(position === 'top'
-            ? {
-                bottom: '40px'
-              }
-            : {})}
-        >
-          <DayPicker
-            locale={zhCN}
-            id="test"
-            mode="range"
-            defaultMonth={defaultDate.to}
-            selected={range}
-            disabled={[
-              { from: new Date(2022, 3, 1), to: addDays(new Date(), -90) },
-              { from: addDays(new Date(), 1), to: new Date(2099, 1, 1) }
-            ]}
-            onSelect={(date) => {
-              if (date?.from === undefined) {
-                date = {
-                  from: range?.from,
-                  to: range?.from
-                };
-              }
-              if (date?.to === undefined) {
-                date.to = date.from;
-              }
-              setRange(date);
-              onChange && onChange(date);
-            }}
-            footer={
-              <Flex justifyContent={'flex-end'}>
-                <Button
-                  variant={'outline'}
-                  size={'sm'}
-                  mr={2}
-                  onClick={() => setShowSelected(false)}
-                >
-                  {t('common.Close')}
-                </Button>
-                <Button
-                  size={'sm'}
-                  onClick={() => {
-                    onSuccess && onSuccess(range || defaultDate);
-                    setShowSelected(false);
-                  }}
-                >
-                  {t('common.Confirm')}
-                </Button>
-              </Flex>
-            }
-          />
-        </Card>
-      )}
-    </Box>
-  );
-};
-
-export default DateRangePicker;
-export type DateRangeType = DateRange;
--- a/projects/app/src/components/Layout/index.tsx
+++ b/projects/app/src/components/Layout/index.tsx
@@ -1,7 +1,7 @@
 import React, { useEffect, useMemo } from 'react';
 import { Box, useColorMode, Flex } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { throttle } from 'lodash';
 import { useQuery } from '@tanstack/react-query';
--- a/projects/app/src/components/Loading/index.tsx
+++ b/projects/app/src/components/Loading/index.tsx
@@ -1,45 +0,0 @@
-import React from 'react';
-import { Spinner, Flex, Box } from '@chakra-ui/react';
-
-const Loading = ({
-  fixed = true,
-  text = '',
-  bg = 'rgba(255,255,255,0.5)',
-  zIndex = 1000
-}: {
-  fixed?: boolean;
-  text?: string;
-  bg?: string;
-  zIndex?: number;
-}) => {
-  return (
-    <Flex
-      position={fixed ? 'fixed' : 'absolute'}
-      zIndex={zIndex}
-      bg={bg}
-      borderRadius={'md'}
-      top={0}
-      left={0}
-      right={0}
-      bottom={0}
-      alignItems={'center'}
-      justifyContent={'center'}
-      flexDirection={'column'}
-    >
-      <Spinner
-        thickness="4px"
-        speed="0.65s"
-        emptyColor="myGray.100"
-        color="primary.500"
-        size="xl"
-      />
-      {text && (
-        <Box mt={2} color="primary.600" fontWeight={'bold'}>
-          {text}
-        </Box>
-      )}
-    </Flex>
-  );
-};
-
-export default Loading;
--- a/projects/app/src/components/Select/SelectAiModel.tsx
+++ b/projects/app/src/components/Select/SelectAiModel.tsx
@@ -1,10 +1,10 @@
 import React, { useMemo } from 'react';

-import MySelect, { type SelectProps } from './index';
 import { useTranslation } from 'next-i18next';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useRouter } from 'next/router';
 import { AI_POINT_USAGE_CARD_ROUTE } from '@/web/support/wallet/sub/constants';
+import MySelect, { SelectProps } from '@fastgpt/web/components/common/MySelect';

 const SelectAiModel = ({ list, ...props }: SelectProps) => {
  const { t } = useTranslation();
--- a/projects/app/src/components/Select/index.tsx
+++ b/projects/app/src/components/Select/index.tsx
@@ -1,130 +0,0 @@
-import React, { useRef, forwardRef, useMemo } from 'react';
-import {
-  Menu,
-  MenuList,
-  MenuItem,
-  Button,
-  useDisclosure,
-  MenuButton,
-  Box,
-  css
-} from '@chakra-ui/react';
-import type { ButtonProps, MenuItemProps } from '@chakra-ui/react';
-import { ChevronDownIcon } from '@chakra-ui/icons';
-
-export type SelectProps = ButtonProps & {
-  value?: string;
-  placeholder?: string;
-  list: {
-    alias?: string;
-    label: string | React.ReactNode;
-    value: string;
-  }[];
-  onchange?: (val: any) => void;
-};
-
-const MySelect = (
-  { placeholder, value, width = '100%', list, onchange, ...props }: SelectProps,
-  selectRef: any
-) => {
-  const ref = useRef<HTMLButtonElement>(null);
-  const menuItemStyles: MenuItemProps = {
-    borderRadius: 'sm',
-    py: 2,
-    display: 'flex',
-    alignItems: 'center',
-    _hover: {
-      backgroundColor: 'myWhite.600'
-    },
-    _notLast: {
-      mb: 2
-    }
-  };
-  const { isOpen, onOpen, onClose } = useDisclosure();
-  const selectItem = useMemo(() => list.find((item) => item.value === value), [list, value]);
-
-  return (
-    <Box
-      css={css({
-        '& div': {
-          width: 'auto !important'
-        }
-      })}
-    >
-      <Menu
-        autoSelect={false}
-        isOpen={isOpen}
-        onOpen={onOpen}
-        onClose={onClose}
-        strategy={'fixed'}
-        matchWidth
-      >
-        <MenuButton
-          as={Button}
-          ref={ref}
-          width={width}
-          px={3}
-          rightIcon={<ChevronDownIcon />}
-          variant={'whitePrimary'}
-          textAlign={'left'}
-          _active={{
-            transform: 'none'
-          }}
-          {...(isOpen
-            ? {
-                boxShadow: '0px 0px 4px #A8DBFF',
-                borderColor: 'primary.500'
-              }
-            : {})}
-          {...props}
-        >
-          {selectItem?.alias || selectItem?.label || placeholder}
-        </MenuButton>
-
-        <MenuList
-          minW={(() => {
-            const w = ref.current?.clientWidth;
-            if (w) {
-              return `${w}px !important`;
-            }
-            return Array.isArray(width)
-              ? width.map((item) => `${item} !important`)
-              : `${width} !important`;
-          })()}
-          w={'auto'}
-          p={'6px'}
-          border={'1px solid #fff'}
-          boxShadow={
-            '0px 2px 4px rgba(161, 167, 179, 0.25), 0px 0px 1px rgba(121, 141, 159, 0.25);'
-          }
-          zIndex={99}
-          maxH={'40vh'}
-          overflowY={'auto'}
-        >
-          {list.map((item) => (
-            <MenuItem
-              key={item.value}
-              {...menuItemStyles}
-              {...(value === item.value
-                ? {
-                    color: 'primary.500',
-                    bg: 'myWhite.300'
-                  }
-                : {})}
-              onClick={() => {
-                if (onchange && value !== item.value) {
-                  onchange(item.value);
-                }
-              }}
-              whiteSpace={'pre-wrap'}
-            >
-              {item.label}
-            </MenuItem>
-          ))}
-        </MenuList>
-      </Menu>
-    </Box>
-  );
-};
-
-export default React.memo(forwardRef(MySelect));
--- a/projects/app/src/components/common/MyBox/index.tsx
+++ b/projects/app/src/components/common/MyBox/index.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { Box, BoxProps } from '@chakra-ui/react';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';

 type Props = BoxProps & {
  isLoading?: boolean;
--- a/projects/app/src/components/core/module/DatasetParamsModal.tsx
+++ b/projects/app/src/components/core/module/DatasetParamsModal.tsx
@@ -26,9 +26,9 @@ import MyRadio from '@/components/common/MyRadio';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import Tabs from '@/components/Tabs';
 import PromptEditor from '@fastgpt/web/components/common/Textarea/PromptEditor';
-import SelectAiModel from '@/components/Select/SelectAiModel';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import { useToast } from '@fastgpt/web/hooks/useToast';
+import SelectAiModel from '@/components/Select/SelectAiModel';

 export type DatasetParamsProps = {
  searchMode: `${DatasetSearchModeEnum}`;
--- a/projects/app/src/components/core/module/DatasetSelectModal.tsx
+++ b/projects/app/src/components/core/module/DatasetSelectModal.tsx
@@ -19,7 +19,7 @@ import { DatasetTypeEnum } from '@fastgpt/global/core/dataset/constants';
 import { useTranslation } from 'next-i18next';
 import { useDatasetStore } from '@/web/core/dataset/store/dataset';
 import DatasetSelectContainer, { useDatasetSelect } from '@/components/core/dataset/SelectModal';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import EmptyTip from '@/components/EmptyTip';

 export const DatasetSelectModal = ({
--- a/projects/app/src/components/core/module/Flow/FlowProvider.tsx
+++ b/projects/app/src/components/core/module/Flow/FlowProvider.tsx
@@ -177,7 +177,11 @@ export const FlowProvider = ({
    ({ connect }: { connect: Connection }) => {
      const source = nodes.find((node) => node.id === connect.source)?.data;
      const sourceType = (() => {
-        if (source?.flowType === FlowNodeTypeEnum.classifyQuestion) {
+        const type = source?.outputs.find(
+          (output) => output.key === connect.sourceHandle
+        )?.valueType;
+        console.log(type);
+        if (source?.flowType === FlowNodeTypeEnum.classifyQuestion && !type) {
          return ModuleIOValueTypeEnum.boolean;
        }
        if (source?.flowType === FlowNodeTypeEnum.pluginInput) {
--- a/projects/app/src/components/core/module/Flow/SelectAppModal.tsx
+++ b/projects/app/src/components/core/module/Flow/SelectAppModal.tsx
@@ -5,7 +5,7 @@ import { useQuery } from '@tanstack/react-query';
 import type { SelectAppItemType } from '@fastgpt/global/core/module/type';
 import Avatar from '@/components/Avatar';
 import { useTranslation } from 'next-i18next';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { useAppStore } from '@/web/core/app/store/useAppStore';

 const SelectAppModal = ({
--- a/projects/app/src/components/core/module/Flow/components/modules/TTSSelect.tsx
+++ b/projects/app/src/components/core/module/Flow/components/modules/TTSSelect.tsx
@@ -4,13 +4,13 @@ import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import { Box, Button, Flex, ModalBody, useDisclosure, Image } from '@chakra-ui/react';
 import React, { useCallback, useMemo } from 'react';
 import { useTranslation } from 'next-i18next';
-import MySelect from '@/components/Select';
 import { TTSTypeEnum } from '@/constants/app';
 import type { AppTTSConfigType } from '@fastgpt/global/core/module/type.d';
 import { useAudioPlay } from '@/web/common/utils/voice';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import MyModal from '@/components/MyModal';
 import MySlider from '@/components/Slider';
+import MySelect from '@fastgpt/web/components/common/MySelect';

 const TTSSelect = ({
  value,
--- a/projects/app/src/components/core/module/Flow/components/nodes/NodeHttp/index.tsx
+++ b/projects/app/src/components/core/module/Flow/components/nodes/NodeHttp/index.tsx
@@ -19,7 +19,6 @@ import {
  TableContainer,
  Button
 } from '@chakra-ui/react';
-import MySelect from '@/components/Select';
 import { ModuleInputKeyEnum } from '@fastgpt/global/core/module/constants';
 import { onChangeNode, useFlowProviderStore } from '../../../FlowProvider';
 import { useTranslation } from 'next-i18next';
@@ -38,6 +37,7 @@ import {
 import { EditorVariablePickerType } from '@fastgpt/web/components/common/Textarea/PromptEditor/type';
 import HttpInput from '@fastgpt/web/components/common/Input/HttpInput';
 import dynamic from 'next/dynamic';
+import MySelect from '@fastgpt/web/components/common/MySelect';
 const OpenApiImportModal = dynamic(() => import('./OpenApiImportModal'));

 enum TabEnum {
--- a/projects/app/src/components/core/module/Flow/components/render/FieldEditModal.tsx
+++ b/projects/app/src/components/core/module/Flow/components/render/FieldEditModal.tsx
@@ -13,7 +13,6 @@ import { useForm } from 'react-hook-form';
 import MyModal from '@/components/MyModal';
 import { DYNAMIC_INPUT_KEY, ModuleIOValueTypeEnum } from '@fastgpt/global/core/module/constants';
 import { useTranslation } from 'next-i18next';
-import MySelect from '@/components/Select';
 import { FlowValueTypeMap } from '@/web/core/modules/constants/dataType';
 import {
  FlowNodeInputTypeEnum,
@@ -21,6 +20,7 @@ import {
 } from '@fastgpt/global/core/module/node/constant';
 import { EditInputFieldMap, EditNodeFieldType } from '@fastgpt/global/core/module/node/type.d';
 import { useToast } from '@fastgpt/web/hooks/useToast';
+import MySelect from '@fastgpt/web/components/common/MySelect';

 const FieldEditModal = ({
  editField = {
--- a/projects/app/src/components/core/module/Flow/components/render/RenderInput/templates/Select.tsx
+++ b/projects/app/src/components/core/module/Flow/components/render/RenderInput/templates/Select.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import type { RenderInputProps } from '../type';
 import { onChangeNode } from '../../../../FlowProvider';
-import MySelect from '@/components/Select';
+import MySelect from '@fastgpt/web/components/common/MySelect';

 const SelectRender = ({ item, moduleId }: RenderInputProps) => {
  return (
--- a/projects/app/src/components/core/module/Flow/components/render/RenderInput/templates/SelectAiModel.tsx
+++ b/projects/app/src/components/core/module/Flow/components/render/RenderInput/templates/SelectAiModel.tsx
@@ -1,8 +1,8 @@
 import React, { useCallback, useEffect } from 'react';
 import type { RenderInputProps } from '../type';
 import { onChangeNode } from '../../../../FlowProvider';
-import SelectAiModel from '@/components/Select/SelectAiModel';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
+import SelectAiModel from '@/components/Select/SelectAiModel';

 const SelectAiModelRender = ({ item, inputs = [], moduleId }: RenderInputProps) => {
  const { llmModelList } = useSystemStore();
--- a/projects/app/src/components/support/apikey/Table.tsx
+++ b/projects/app/src/components/support/apikey/Table.tsx
@@ -28,7 +28,7 @@ import {
 } from '@/web/support/openapi/api';
 import type { EditApiKeyProps } from '@/global/support/openapi/api.d';
 import { useQuery, useMutation } from '@tanstack/react-query';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import dayjs from 'dayjs';
 import { AddIcon, QuestionOutlineIcon } from '@chakra-ui/icons';
 import { useCopyData } from '@/web/common/hooks/useCopyData';
--- a/projects/app/src/components/support/user/team/TeamManageModal/InviteModal.tsx
+++ b/projects/app/src/components/support/user/team/TeamManageModal/InviteModal.tsx
@@ -3,12 +3,12 @@ import MyModal from '@/components/MyModal';
 import { useTranslation } from 'next-i18next';
 import { ModalCloseButton, ModalBody, Box, ModalFooter, Button } from '@chakra-ui/react';
 import TagTextarea from '@/components/common/Textarea/TagTextarea';
-import MySelect from '@/components/Select';
 import { TeamMemberRoleEnum } from '@fastgpt/global/support/user/team/constant';
 import { useRequest } from '@/web/common/hooks/useRequest';
 import { postInviteTeamMember } from '@/web/support/user/team/api';
 import { useConfirm } from '@/web/common/hooks/useConfirm';
 import type { InviteMemberResponse } from '@fastgpt/global/support/user/team/controller.d';
+import MySelect from '@fastgpt/web/components/common/MySelect';

 const InviteModal = ({
  teamId,
--- a/projects/app/src/components/support/user/team/TeamManageModal/index.tsx
+++ b/projects/app/src/components/support/user/team/TeamManageModal/index.tsx
@@ -38,7 +38,7 @@ import {
 import dynamic from 'next/dynamic';
 import { useRequest } from '@/web/common/hooks/useRequest';
 import { setToken } from '@/web/support/user/auth';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { FormDataType, defaultForm } from './EditModal';
 import MyMenu from '@/components/MyMenu';
 import { useConfirm } from '@/web/common/hooks/useConfirm';
--- a/projects/app/src/pages/account/components/BillTable.tsx
+++ b/projects/app/src/pages/account/components/BillTable.tsx
@@ -19,18 +19,19 @@ import { formatStorePrice2Read } from '@fastgpt/global/support/wallet/usage/tool
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
-import MySelect from '@/components/Select';
 import {
  BillTypeEnum,
  billPayWayMap,
  billStatusMap,
  billTypeMap
 } from '@fastgpt/global/support/wallet/bill/constants';
-import { usePagination } from '@/web/common/hooks/usePagination';
+// import { usePagination } from '@/web/common/hooks/usePagination';
 import MyBox from '@/components/common/MyBox';
 import { useRequest } from '@/web/common/hooks/useRequest';
-import MyModal from '@/components/MyModal';
 import { standardSubLevelMap, subModeMap } from '@fastgpt/global/support/wallet/sub/constants';
+import MySelect from '@fastgpt/web/components/common/MySelect';
+import MyModal from '@fastgpt/web/components/common/CustomModal';
+import { usePagination } from '@fastgpt/web/hooks/usePagination';

 const BillTable = () => {
  const { t } = useTranslation();
--- a/projects/app/src/pages/account/components/Individuation.tsx
+++ b/projects/app/src/pages/account/components/Individuation.tsx
@@ -9,8 +9,8 @@ import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useForm } from 'react-hook-form';
 import { UserUpdateParams } from '@/types/user';
 import { langMap, setLngStore } from '@/web/common/utils/i18n';
-import MySelect from '@/components/Select';
 import { useRouter } from 'next/router';
+import MySelect from '@fastgpt/web/components/common/MySelect';

 const Individuation = () => {
  const { t, i18n } = useTranslation();
--- a/projects/app/src/pages/account/components/InformTable.tsx
+++ b/projects/app/src/pages/account/components/InformTable.tsx
@@ -1,12 +1,12 @@
 import React from 'react';
 import { Box, Flex, useTheme } from '@chakra-ui/react';
 import { getInforms, readInform } from '@/web/support/user/inform/api';
-import { usePagination } from '@/web/common/hooks/usePagination';
-import { useLoading } from '@/web/common/hooks/useLoading';
 import type { UserInformSchema } from '@fastgpt/global/support/user/inform/type';
 import { formatTimeToChatTime } from '@/utils/tools';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import MyIcon from '@fastgpt/web/components/common/Icon';
+import { usePagination } from '@fastgpt/web/hooks/usePagination';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';

 const BillTable = () => {
  const theme = useTheme();
--- a/projects/app/src/pages/account/components/Promotion.tsx
+++ b/projects/app/src/pages/account/components/Promotion.tsx
@@ -18,15 +18,15 @@ import { useTranslation } from 'next-i18next';
 import { useQuery } from '@tanstack/react-query';
 import { getPromotionInitData, getPromotionRecords } from '@/web/support/activity/promotion/api';
 import { useUserStore } from '@/web/support/user/useUserStore';
-import { useLoading } from '@/web/common/hooks/useLoading';

 import MyTooltip from '@/components/MyTooltip';
 import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import { useCopyData } from '@/web/common/hooks/useCopyData';
-import { usePagination } from '@/web/common/hooks/usePagination';
 import type { PromotionRecordType } from '@/global/support/api/userRes.d';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import dayjs from 'dayjs';
+import { usePagination } from '@fastgpt/web/hooks/usePagination';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';

 const Promotion = () => {
  const { t } = useTranslation();
--- a/projects/app/src/pages/account/components/UsageTable.tsx
+++ b/projects/app/src/pages/account/components/UsageTable.tsx
@@ -14,21 +14,23 @@ import {
 import { UsageSourceEnum, UsageSourceMap } from '@fastgpt/global/support/wallet/usage/constants';
 import { getUserUsages } from '@/web/support/wallet/usage/api';
 import type { UsageItemType } from '@fastgpt/global/support/wallet/usage/type';
-import { usePagination } from '@/web/common/hooks/usePagination';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { usePagination } from '@fastgpt/web/hooks/usePagination';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import dayjs from 'dayjs';
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import DateRangePicker, { type DateRangeType } from '@/components/DateRangePicker';
+import DateRangePicker, {
+  type DateRangeType
+} from '@fastgpt/web/components/common/DateRangePicker';
 import { addDays } from 'date-fns';
 import dynamic from 'next/dynamic';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useTranslation } from 'next-i18next';
-import MySelect from '@/components/Select';
 import { useQuery } from '@tanstack/react-query';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import { getTeamMembers } from '@/web/support/user/team/api';
 import Avatar from '@/components/Avatar';
-import { formatNumber } from '../../../../../../packages/global/common/math/tools';
+import MySelect from '@fastgpt/web/components/common/MySelect';
+import { formatNumber } from '@fastgpt/global/common/math/tools';
 const UsageDetail = dynamic(() => import('./UsageDetail'));

 const UsageTable = () => {
--- a/projects/app/src/pages/account/components/standardDetailModal.tsx
+++ b/projects/app/src/pages/account/components/standardDetailModal.tsx
@@ -14,7 +14,7 @@ import {
 import MyModal from '@/components/MyModal';
 import { useTranslation } from 'next-i18next';
 import { useQuery } from '@tanstack/react-query';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { getTeamPlans } from '@/web/support/user/team/api';
 import { subTypeMap, standardSubLevelMap } from '@fastgpt/global/support/wallet/sub/constants';
--- a/projects/app/src/pages/app/detail/components/Logs.tsx
+++ b/projects/app/src/pages/app/detail/components/Logs.tsx
@@ -15,7 +15,6 @@ import {
 } from '@chakra-ui/react';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
-import { usePagination } from '@/web/common/hooks/usePagination';
 import { getAppChatLogs } from '@/web/core/app/api';
 import dayjs from 'dayjs';
 import { ChatSourceMap } from '@fastgpt/global/core/chat/constants';
@@ -27,9 +26,10 @@ import { useQuery } from '@tanstack/react-query';
 import { getInitChatInfo } from '@/web/core/chat/api';
 import Tag from '@/components/Tag';
 import MyModal from '@/components/MyModal';
-import DateRangePicker, { type DateRangeType } from '@/components/DateRangePicker';
 import { addDays } from 'date-fns';
 import MyBox from '@/components/common/MyBox';
+import { usePagination } from '@fastgpt/web/hooks/usePagination';
+import DateRangePicker, { DateRangeType } from '@fastgpt/web/components/common/DateRangePicker';

 const Logs = ({ appId }: { appId: string }) => {
  const { t } = useTranslation();
--- a/projects/app/src/pages/app/detail/components/OutLink/Share.tsx
+++ b/projects/app/src/pages/app/detail/components/OutLink/Share.tsx
@@ -18,7 +18,7 @@ import {
 } from '@chakra-ui/react';
 import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { useQuery } from '@tanstack/react-query';
 import {
  getShareChatList,
--- a/projects/app/src/pages/app/detail/components/SimpleEdit/EditForm.tsx
+++ b/projects/app/src/pages/app/detail/components/SimpleEdit/EditForm.tsx
@@ -31,10 +31,10 @@ import Avatar from '@/components/Avatar';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import VariableEdit from '@/components/core/module/Flow/components/modules/VariableEdit';
 import MyTextarea from '@/components/common/Textarea/MyTextarea/index';
-import SelectAiModel from '@/components/Select/SelectAiModel';
 import PromptEditor from '@fastgpt/web/components/common/Textarea/PromptEditor';
 import { formatEditorVariablePickerIcon } from '@fastgpt/global/core/module/utils';
 import SearchParamsTip from '@/components/core/dataset/SearchParamsTip';
+import SelectAiModel from '@/components/Select/SelectAiModel';

 const DatasetSelectModal = dynamic(() => import('@/components/core/module/DatasetSelectModal'));
 const DatasetParamsModal = dynamic(() => import('@/components/core/module/DatasetParamsModal'));
--- a/projects/app/src/pages/app/detail/index.tsx
+++ b/projects/app/src/pages/app/detail/index.tsx
@@ -11,7 +11,7 @@ import SideTabs from '@/components/SideTabs';
 import Avatar from '@/components/Avatar';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import PageContainer from '@/components/PageContainer';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';
 import SimpleEdit from './components/SimpleEdit';
 import { serviceSideProps } from '@/web/common/utils/i18n';
 import { useAppStore } from '@/web/core/app/store/useAppStore';
--- a/projects/app/src/pages/appStore/index.tsx
+++ b/projects/app/src/pages/appStore/index.tsx
@@ -1,11 +1,11 @@
 import React, { useState, useRef, useCallback } from 'react';
-import { Box, Flex, Card, Grid, Input } from '@chakra-ui/react';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { Box, Flex, Grid } from '@chakra-ui/react';
 import { getShareModelList, triggerModelCollection } from '@/web/core/app/api';
-import { usePagination } from '@/web/common/hooks/usePagination';
 import type { ShareAppItem } from '@/types/app';
 import ShareModelList from './components/list';
 import { serviceSideProps } from '@/web/common/utils/i18n';
+import { usePagination } from '@fastgpt/web/hooks/usePagination';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';

 const modelList = () => {
  const { Loading } = useLoading();
--- a/projects/app/src/pages/chat/components/ChatHistorySlider.tsx
+++ b/projects/app/src/pages/chat/components/ChatHistorySlider.tsx
@@ -20,8 +20,8 @@ import { useTranslation } from 'next-i18next';
 import { useConfirm } from '@/web/common/hooks/useConfirm';
 import Tabs from '@/components/Tabs';
 import { useUserStore } from '@/web/support/user/useUserStore';
+import { AppListItemType } from '@fastgpt/global/core/app/type';
 import { useQuery } from '@tanstack/react-query';
-import { useAppStore } from '@/web/core/app/store/useAppStore';
 import { TeamMemberRoleEnum } from '@fastgpt/global/support/user/team/constant';

 type HistoryItemType = {
@@ -41,6 +41,8 @@ const ChatHistorySlider = ({
  appName,
  appAvatar,
  history,
+  apps = [],
+  confirmClearText,
  activeChatId,
  onChangeChat,
  onDelHistory,
@@ -54,6 +56,8 @@ const ChatHistorySlider = ({
  appAvatar: string;
  history: HistoryItemType[];
  activeChatId: string;
+  apps?: AppListItemType[];
+  confirmClearText: string;
  onChangeChat: (chatId?: string) => void;
  onDelHistory: (e: { chatId: string }) => void;
  onClearHistory: () => void;
@@ -65,22 +69,18 @@ const ChatHistorySlider = ({
  const router = useRouter();
  const { t } = useTranslation();
  const { isPc } = useSystemStore();
-  const { myApps, loadMyApps } = useAppStore();
  const { userInfo } = useUserStore();

  const [currentTab, setCurrentTab] = useState<`${TabEnum}`>(TabEnum.history);

-  const isShare = useMemo(() => !appId || !userInfo, [appId, userInfo]);
-
+  const showApps = apps?.length > 0;
  // custom title edit
  const { onOpenModal, EditModal: EditTitleModal } = useEditTitle({
    title: t('core.chat.Custom History Title'),
    placeholder: t('core.chat.Custom History Title Description')
  });
  const { openConfirm, ConfirmModal } = useConfirm({
-    content: isShare
-      ? t('core.chat.Confirm to clear share chat history')
-      : t('core.chat.Confirm to clear history')
+    content: confirmClearText
  });

  const concatHistory = useMemo<HistoryItemType[]>(
@@ -92,11 +92,11 @@ const ChatHistorySlider = ({
  );

  useQuery(['init'], () => {
-    if (isShare) {
+    if (!showApps) {
      setCurrentTab(TabEnum.history);
      return null;
    }
-    return loadMyApps(false);
+    return;
  });

  const canRouteToDetail = useMemo(
@@ -140,7 +140,7 @@ const ChatHistorySlider = ({

      {/* menu */}
      <Flex w={'100%'} px={[2, 5]} h={'36px'} my={5} alignItems={'center'}>
-        {!isPc && !isShare && (
+        {!isPc && appId && (
          <Tabs
            w={'120px'}
            mr={2}
@@ -165,7 +165,7 @@ const ChatHistorySlider = ({
          {t('core.chat.New Chat')}
        </Button>

-        {(isPc || isShare) && (
+        {(isPc || !showApps) && (
          <IconButton
            ml={3}
            h={'100%'}
@@ -286,36 +286,37 @@ const ChatHistorySlider = ({
        )}
        {currentTab === TabEnum.app && !isPc && (
          <>
-            {myApps.map((item) => (
-              <Flex
-                key={item._id}
-                py={2}
-                px={3}
-                mb={3}
-                borderRadius={'md'}
-                alignItems={'center'}
-                {...(item._id === appId
-                  ? {
-                      backgroundColor: 'primary.50 !important',
-                      color: 'primary.600'
-                    }
-                  : {
-                      onClick: () => {
-                        router.replace({
-                          query: {
-                            appId: item._id
-                          }
-                        });
-                        onClose();
+            {Array.isArray(apps) &&
+              apps.map((item) => (
+                <Flex
+                  key={item._id}
+                  py={2}
+                  px={3}
+                  mb={3}
+                  borderRadius={'md'}
+                  alignItems={'center'}
+                  {...(item._id === appId
+                    ? {
+                        backgroundColor: 'primary.50 !important',
+                        color: 'primary.600'
                      }
-                    })}
-              >
-                <Avatar src={item.avatar} w={'24px'} />
-                <Box ml={2} className={'textEllipsis'}>
-                  {item.name}
-                </Box>
-              </Flex>
-            ))}
+                    : {
+                        onClick: () => {
+                          router.replace({
+                            query: {
+                              appId: item._id
+                            }
+                          });
+                          onClose();
+                        }
+                      })}
+                >
+                  <Avatar src={item.avatar} w={'24px'} />
+                  <Box ml={2} className={'textEllipsis'}>
+                    {item.name}
+                  </Box>
+                </Flex>
+              ))}
          </>
        )}
      </Box>
--- a/projects/app/src/pages/chat/index.tsx
+++ b/projects/app/src/pages/chat/index.tsx
@@ -15,7 +15,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useQuery } from '@tanstack/react-query';
 import { streamFetch } from '@/web/common/api/fetch';
 import { useChatStore } from '@/web/core/chat/storeChat';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import { customAlphabet } from 'nanoid';
 const nanoid = customAlphabet('abcdefghijklmnopqrstuvwxyz1234567890', 12);
@@ -277,6 +277,8 @@ const Chat = ({ appId, chatId }: { appId: string; chatId: string }) => {
            );
          })(
            <ChatHistorySlider
+              apps={myApps}
+              confirmClearText={t('core.chat.Confirm to clear history')}
              appId={appId}
              appName={chatData.app.name}
              appAvatar={chatData.app.avatar}
--- a/projects/app/src/pages/chat/share.tsx
+++ b/projects/app/src/pages/chat/share.tsx
@@ -298,6 +298,7 @@ const OutLink = ({
              <ChatHistorySlider
                appName={chatData.app.name}
                appAvatar={chatData.app.avatar}
+                confirmClearText={t('core.chat.Confirm to clear share chat history')}
                activeChatId={chatId}
                history={histories.map((item) => ({
                  id: item.chatId,
--- a/projects/app/src/pages/chat/team.tsx
+++ b/projects/app/src/pages/chat/team.tsx
@@ -85,7 +85,6 @@ const OutLink = ({
        onMessage: generatingMessage,
        abortCtrl: controller
      });
-      console.log(responseData);
      const newTitle =
        chatContentReplaceBlock(prompts[0].content).slice(0, 20) ||
        prompts[1]?.value?.slice(0, 20) ||
@@ -291,9 +290,11 @@ const OutLink = ({
          })(
            <ChatHistorySlider
              appId={appId}
+              apps={myApps}
              appName={chatData.app.name}
              appAvatar={chatData.app.avatar}
              activeChatId={chatId}
+              confirmClearText={t('core.chat.Confirm to clear history')}
              onClose={onCloseSlider}
              history={histories.map((item, i) => ({
                id: item.chatId,
--- a/projects/app/src/pages/dataset/detail/components/CollectionCard.tsx
+++ b/projects/app/src/pages/dataset/detail/components/CollectionCard.tsx
@@ -32,9 +32,8 @@ import MyIcon from '@fastgpt/web/components/common/Icon';
 import MyInput from '@/components/MyInput';
 import dayjs from 'dayjs';
 import { useRequest } from '@/web/common/hooks/useRequest';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { useRouter } from 'next/router';
-import { usePagination } from '@/web/common/hooks/usePagination';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import MyMenu from '@/components/MyMenu';
 import { useEditTitle } from '@/web/common/hooks/useEditTitle';
@@ -64,6 +63,7 @@ import { DatasetSchemaType } from '@fastgpt/global/core/dataset/type';
 import { DatasetCollectionSyncResultEnum } from '@fastgpt/global/core/dataset/constants';
 import MyBox from '@/components/common/MyBox';
 import { ImportDataSourceEnum } from './Import';
+import { usePagination } from '@fastgpt/web/hooks/usePagination';

 const WebSiteConfigModal = dynamic(() => import('./Import/WebsiteConfig'), {});
 const FileSourceSelector = dynamic(() => import('./Import/sourceSelector/FileSourceSelector'), {});
--- a/projects/app/src/pages/dataset/detail/components/DataCard.tsx
+++ b/projects/app/src/pages/dataset/detail/components/DataCard.tsx
@@ -15,7 +15,6 @@ import {
  DrawerContent,
  useDisclosure
 } from '@chakra-ui/react';
-import { usePagination } from '@/web/common/hooks/usePagination';
 import {
  getDatasetDataList,
  delOneDatasetDataById,
@@ -31,7 +30,7 @@ import { useTranslation } from 'next-i18next';
 import { useRouter } from 'next/router';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import MyInput from '@/components/MyInput';
-import { useLoading } from '@/web/common/hooks/useLoading';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import InputDataModal from '../components/InputDataModal';
 import RawSourceBox from '@/components/core/dataset/RawSourceBox';
 import type { DatasetDataListItemType } from '@/global/core/dataset/type.d';
@@ -48,6 +47,7 @@ import { formatTime2YMDHM } from '@fastgpt/global/common/string/time';
 import { formatFileSize } from '@fastgpt/global/common/file/tools';
 import { getFileAndOpen } from '@/web/core/dataset/utils';
 import MyTooltip from '@/components/MyTooltip';
+import { usePagination } from '@fastgpt/web/hooks/usePagination';

 const DataCard = () => {
  const BoxRef = useRef<HTMLDivElement>(null);
--- a/projects/app/src/pages/dataset/detail/components/Import/diffSource/FileCustomText.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Import/diffSource/FileCustomText.tsx
@@ -7,7 +7,7 @@ import { useTranslation } from 'next-i18next';
 import { useForm } from 'react-hook-form';
 import { Box, Button, Flex, Input, Textarea } from '@chakra-ui/react';
 import { getNanoid } from '@fastgpt/global/common/string/tools';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';

 const DataProcess = dynamic(() => import('../commonProgress/DataProcess'), {
  loading: () => <Loading fixed={false} />
--- a/projects/app/src/pages/dataset/detail/components/Import/diffSource/FileLink.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Import/diffSource/FileLink.tsx
@@ -11,7 +11,7 @@ import MyIcon from '@fastgpt/web/components/common/Icon';
 import { LinkCollectionIcon } from '@fastgpt/global/core/dataset/constants';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { getDocPath } from '@/web/common/system/doc';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';

 const DataProcess = dynamic(() => import('../commonProgress/DataProcess'), {
  loading: () => <Loading fixed={false} />
--- a/projects/app/src/pages/dataset/detail/components/Import/diffSource/FileLocal.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Import/diffSource/FileLocal.tsx
@@ -18,7 +18,7 @@ import { useImportStore } from '../Provider';
 import { useSystemStore } from '@/web/common/system/useSystemStore';

 import dynamic from 'next/dynamic';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';

 const DataProcess = dynamic(() => import('../commonProgress/DataProcess'), {
  loading: () => <Loading fixed={false} />
--- a/projects/app/src/pages/dataset/detail/components/Info.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Info.tsx
@@ -13,10 +13,10 @@ import Avatar from '@/components/Avatar';
 import MyTooltip from '@/components/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import PermissionRadio from '@/components/support/permission/Radio';
-import MySelect from '@/components/Select';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useRequest } from '@/web/common/hooks/useRequest';
 import { MongoImageTypeEnum } from '@fastgpt/global/common/file/image/constants';
+import MySelect from '@fastgpt/web/components/common/MySelect';

 const Info = ({ datasetId }: { datasetId: string }) => {
  const { t } = useTranslation();
--- a/projects/app/src/pages/dataset/detail/components/Test.tsx
+++ b/projects/app/src/pages/dataset/detail/components/Test.tsx
@@ -33,7 +33,7 @@ import {
 } from '@fastgpt/global/core/dataset/constants';
 import dynamic from 'next/dynamic';
 import { useForm } from 'react-hook-form';
-import MySelect from '@/components/Select';
+import MySelect from '@fastgpt/web/components/common/MySelect';
 import { useSelectFile } from '@/web/common/file/hooks/useSelectFile';
 import { fileDownload } from '@/web/common/file/utils';
 import { readCsvContent } from '@fastgpt/web/common/file/read/csv';
--- a/projects/app/src/pages/dataset/list/component/CreateModal.tsx
+++ b/projects/app/src/pages/dataset/list/component/CreateModal.tsx
@@ -13,12 +13,12 @@ import MyTooltip from '@/components/MyTooltip';
 import MyModal from '@/components/MyModal';
 import { postCreateDataset } from '@/web/core/dataset/api';
 import type { CreateDatasetParams } from '@/global/core/dataset/api.d';
-import MySelect from '@/components/Select';
 import { useTranslation } from 'next-i18next';
 import MyRadio from '@/components/common/MyRadio';
 import { DatasetTypeEnum } from '@fastgpt/global/core/dataset/constants';
 import { MongoImageTypeEnum } from '@fastgpt/global/common/file/image/constants';
 import { QuestionOutlineIcon } from '@chakra-ui/icons';
+import MySelect from '@fastgpt/web/components/common/MySelect';

 const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: string }) => {
  const { t } = useTranslation();
--- a/projects/app/src/pages/index.tsx
+++ b/projects/app/src/pages/index.tsx
@@ -1,6 +1,6 @@
 import { serviceSideProps } from '@/web/common/utils/i18n';
 import React, { useEffect } from 'react';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';
 import { useRouter } from 'next/router';

 const index = () => {
--- a/projects/app/src/pages/login/components/LoginForm/WechatForm.tsx
+++ b/projects/app/src/pages/login/components/LoginForm/WechatForm.tsx
@@ -9,7 +9,7 @@ import { useRouter } from 'next/router';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import FormLayout from './components/FormLayout';
 import { useTranslation } from 'next-i18next';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';

 interface Props {
  loginSuccess: (e: ResLogin) => void;
--- a/projects/app/src/pages/login/fastlogin.tsx
+++ b/projects/app/src/pages/login/fastlogin.tsx
@@ -7,7 +7,7 @@ import { useUserStore } from '@/web/support/user/useUserStore';
 import { clearToken, setToken } from '@/web/support/user/auth';
 import { postFastLogin } from '@/web/support/user/api';
 import { useToast } from '@fastgpt/web/hooks/useToast';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';
 import { serviceSideProps } from '@/web/common/utils/i18n';
 import { useQuery } from '@tanstack/react-query';
 import { getErrText } from '@fastgpt/global/common/error/utils';
--- a/projects/app/src/pages/login/index.tsx
+++ b/projects/app/src/pages/login/index.tsx
@@ -12,7 +12,7 @@ import { serviceSideProps } from '@/web/common/utils/i18n';
 import { clearToken, setToken } from '@/web/support/user/auth';
 import CommunityModal from '@/components/CommunityModal';
 import Script from 'next/script';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';

 const RegisterForm = dynamic(() => import('./components/RegisterForm'));
 const ForgetPasswordForm = dynamic(() => import('./components/ForgetPasswordForm'));
--- a/projects/app/src/pages/login/provider.tsx
+++ b/projects/app/src/pages/login/provider.tsx
@@ -7,7 +7,7 @@ import { useUserStore } from '@/web/support/user/useUserStore';
 import { clearToken, setToken } from '@/web/support/user/auth';
 import { oauthLogin } from '@/web/support/user/api';
 import { useToast } from '@fastgpt/web/hooks/useToast';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';
 import { serviceSideProps } from '@/web/common/utils/i18n';
 import { getErrText } from '@fastgpt/global/common/error/utils';
 import { useTranslation } from 'next-i18next';
--- a/projects/app/src/pages/plugin/edit/index.tsx
+++ b/projects/app/src/pages/plugin/edit/index.tsx
@@ -10,7 +10,7 @@ import { serviceSideProps } from '@/web/common/utils/i18n';
 import { useQuery } from '@tanstack/react-query';
 import { getOnePlugin } from '@/web/core/plugin/api';
 import { useToast } from '@fastgpt/web/hooks/useToast';
-import Loading from '@/components/Loading';
+import Loading from '@fastgpt/web/components/common/MyLoading';
 import { getErrText } from '@fastgpt/global/common/error/utils';
 import { useTranslation } from 'next-i18next';
 import { usePluginStore } from '@/web/core/plugin/store/plugin';
--- a/projects/app/src/web/common/hooks/useLoading.tsx
+++ b/projects/app/src/web/common/hooks/useLoading.tsx
@@ -1,31 +0,0 @@
-import { useState, useCallback } from 'react';
-import LoadingComponent from '@/components/Loading';
-
-export const useLoading = (props?: { defaultLoading: boolean }) => {
-  const [isLoading, setIsLoading] = useState(props?.defaultLoading || false);
-
-  const Loading = useCallback(
-    ({
-      loading,
-      fixed = true,
-      text = '',
-      zIndex
-    }: {
-      loading?: boolean;
-      fixed?: boolean;
-      text?: string;
-      zIndex?: number;
-    }): JSX.Element | null => {
-      return isLoading || loading ? (
-        <LoadingComponent fixed={fixed} text={text} zIndex={zIndex} />
-      ) : null;
-    },
-    [isLoading]
-  );
-
-  return {
-    isLoading,
-    setIsLoading,
-    Loading
-  };
-};
--- a/projects/app/src/web/common/hooks/usePagination.tsx
+++ b/projects/app/src/web/common/hooks/usePagination.tsx
@@ -1,187 +0,0 @@
-import { useRef, useState, useCallback, useMemo, useEffect } from 'react';
-import type { PagingData } from '@/types/index.d';
-import { IconButton, Flex, Box, Input } from '@chakra-ui/react';
-import { ArrowBackIcon, ArrowForwardIcon } from '@chakra-ui/icons';
-import { useMutation } from '@tanstack/react-query';
-import { useToast } from '@fastgpt/web/hooks/useToast';
-import { throttle } from 'lodash';
-
-const thresholdVal = 100;
-
-export function usePagination<T = any>({
-  api,
-  pageSize = 10,
-  params = {},
-  defaultRequest = true,
-  type = 'button',
-  onChange
-}: {
-  api: (data: any) => any;
-  pageSize?: number;
-  params?: Record<string, any>;
-  defaultRequest?: boolean;
-  type?: 'button' | 'scroll';
-  onChange?: (pageNum: number) => void;
-}) {
-  const elementRef = useRef<HTMLDivElement>(null);
-  const { toast } = useToast();
-  const [pageNum, setPageNum] = useState(1);
-  const [total, setTotal] = useState(0);
-  const [data, setData] = useState<T[]>([]);
-  const maxPage = useMemo(() => Math.ceil(total / pageSize) || 1, [pageSize, total]);
-
-  const { mutate, isLoading } = useMutation({
-    mutationFn: async (num: number = pageNum) => {
-      try {
-        const res: PagingData<T> = await api({
-          pageNum: num,
-          pageSize,
-          ...params
-        });
-        setPageNum(num);
-        res.total !== undefined && setTotal(res.total);
-        setData(res.data);
-        onChange && onChange(num);
-      } catch (error: any) {
-        toast({
-          title: error?.message || '获取数据异常',
-          status: 'error'
-        });
-        console.log(error);
-      }
-      return null;
-    }
-  });
-
-  const Pagination = useCallback(() => {
-    return (
-      <Flex alignItems={'center'} justifyContent={'end'}>
-        <IconButton
-          isDisabled={pageNum === 1}
-          icon={<ArrowBackIcon />}
-          aria-label={'left'}
-          size={'smSquare'}
-          isLoading={isLoading}
-          onClick={() => mutate(pageNum - 1)}
-        />
-        <Flex mx={2} alignItems={'center'}>
-          <Input
-            defaultValue={pageNum}
-            w={'50px'}
-            h={'30px'}
-            size={'xs'}
-            type={'number'}
-            min={1}
-            max={maxPage}
-            onBlur={(e) => {
-              const val = +e.target.value;
-              if (val === pageNum) return;
-              if (val >= maxPage) {
-                mutate(maxPage);
-              } else if (val < 1) {
-                mutate(1);
-              } else {
-                mutate(+e.target.value);
-              }
-            }}
-            onKeyDown={(e) => {
-              // @ts-ignore
-              const val = +e.target.value;
-              if (val && e.keyCode === 13) {
-                if (val === pageNum) return;
-                if (val >= maxPage) {
-                  mutate(maxPage);
-                } else if (val < 1) {
-                  mutate(1);
-                } else {
-                  mutate(val);
-                }
-              }
-            }}
-          />
-          <Box mx={2}>/</Box>
-          {maxPage}
-        </Flex>
-        <IconButton
-          isDisabled={pageNum === maxPage}
-          icon={<ArrowForwardIcon />}
-          aria-label={'left'}
-          size={'sm'}
-          isLoading={isLoading}
-          w={'28px'}
-          h={'28px'}
-          onClick={() => mutate(pageNum + 1)}
-        />
-      </Flex>
-    );
-  }, [isLoading, maxPage, mutate, pageNum]);
-
-  const ScrollData = useCallback(
-    ({ children, ...props }: { children: React.ReactNode }) => {
-      const loadText = useMemo(() => {
-        if (isLoading) return '请求中……';
-        if (total <= data.length) return '已加载全部';
-        return '点击加载更多';
-      }, []);
-
-      return (
-        <Box {...props} ref={elementRef} overflow={'overlay'}>
-          {children}
-          <Box
-            mt={2}
-            fontSize={'xs'}
-            color={'blackAlpha.500'}
-            textAlign={'center'}
-            cursor={loadText === '点击加载更多' ? 'pointer' : 'default'}
-            onClick={() => {
-              if (loadText !== '点击加载更多') return;
-              mutate(pageNum + 1);
-            }}
-          >
-            {loadText}
-          </Box>
-        </Box>
-      );
-    },
-    [data.length, isLoading, mutate, pageNum, total]
-  );
-
-  useEffect(() => {
-    if (!elementRef.current || type !== 'scroll') return;
-
-    const scrolling = throttle((e: Event) => {
-      const element = e.target as HTMLDivElement;
-      if (!element) return;
-      // 当前滚动位置
-      const scrollTop = element.scrollTop;
-      // 可视高度
-      const clientHeight = element.clientHeight;
-      // 内容总高度
-      const scrollHeight = element.scrollHeight;
-      // 判断是否滚动到底部
-      if (scrollTop + clientHeight + thresholdVal >= scrollHeight) {
-        mutate(pageNum + 1);
-      }
-    }, 100);
-    elementRef.current.addEventListener('scroll', scrolling);
-    return () => {
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-      elementRef.current?.removeEventListener('scroll', scrolling);
-    };
-  }, [elementRef, mutate, pageNum, type]);
-
-  useEffect(() => {
-    defaultRequest && mutate(1);
-  }, []);
-
-  return {
-    pageNum,
-    pageSize,
-    total,
-    data,
-    isLoading,
-    Pagination,
-    ScrollData,
-    getData: mutate
-  };
-}
--- a/projects/app/src/web/core/dataset/components/SelectCollections.tsx
+++ b/projects/app/src/web/core/dataset/components/SelectCollections.tsx
@@ -1,26 +1,16 @@
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import MyModal from '@/components/MyModal';
 import ParentPaths from '@/components/common/ParentPaths';
-import { useLoading } from '@/web/common/hooks/useLoading';
 import { useRequest } from '@/web/common/hooks/useRequest';
 import { getDatasetCollectionPathById, getDatasetCollections } from '@/web/core/dataset/api';
 import { useDatasetStore } from '@/web/core/dataset/store/dataset';
-import {
-  Box,
-  Flex,
-  ModalFooter,
-  Button,
-  useTheme,
-  Grid,
-  Card,
-  Image,
-  ModalBody
-} from '@chakra-ui/react';
+import { Box, Flex, ModalFooter, Button, useTheme, Grid, Card, ModalBody } from '@chakra-ui/react';
 import { DatasetCollectionTypeEnum } from '@fastgpt/global/core/dataset/constants';
 import { getCollectionIcon } from '@fastgpt/global/core/dataset/utils';
 import { useQuery } from '@tanstack/react-query';
 import React, { useMemo, useState } from 'react';
 import { useTranslation } from 'next-i18next';
+import { useLoading } from '@fastgpt/web/hooks/useLoading';

 const SelectCollections = ({
  datasetId,