Fix share page whisper auth (#1161)

Co-authored-by: heheer <71265218+newfish-cmyk@users.noreply.github.com>
2025-08-01 20:27:45 +00:00 · 2024-04-09 21:38:47 +08:00
parent adfad8ff7f
commit 2991c07467
55 changed files with 466 additions and 251 deletions
--- a/projects/app/src/components/ChatBox/components/ChatItem.tsx
+++ b/projects/app/src/components/ChatBox/components/ChatItem.tsx
@@ -94,7 +94,7 @@ const ChatItem = ({

    /* AI */
    return (
-      <Flex flexDirection={'column'} gap={2}>
+      <Flex flexDirection={'column'} key={chat.dataId} gap={2}>
        {chat.value.map((value, i) => {
          const key = `${chat.dataId}-ai-${i}`;
          if (value.text) {
--- a/projects/app/src/components/core/module/Flow/ChatTest.tsx
+++ b/projects/app/src/components/core/module/Flow/ChatTest.tsx
@@ -8,6 +8,7 @@ import React, {
  useImperativeHandle,
  ForwardedRef
 } from 'react';
+import { SmallCloseIcon } from '@chakra-ui/icons';
 import { Box, Flex, IconButton } from '@chakra-ui/react';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { streamFetch } from '@/web/common/api/fetch';
@@ -18,6 +19,7 @@ import type { ComponentRef, StartChatFnProps } from '@/components/ChatBox/type.d
 import { getGuideModule } from '@fastgpt/global/core/module/utils';
 import { checkChatSupportSelectFileByModules } from '@/web/core/chat/utils';
 import { ModuleInputKeyEnum } from '@fastgpt/global/core/module/constants';
+import { useTranslation } from 'next-i18next';

 export type ChatTestComponentRef = {
  resetChatTest: () => void;
@@ -35,6 +37,7 @@ const ChatTest = (
  },
  ref: ForwardedRef<ChatTestComponentRef>
 ) => {
+  const { t } = useTranslation();
  const ChatBoxRef = useRef<ComponentRef>(null);
  const { userInfo } = useUserStore();
  const isOpen = useMemo(() => modules && modules.length > 0, [modules]);
@@ -100,9 +103,9 @@ const ChatTest = (
      >
        <Flex py={4} px={5} whiteSpace={'nowrap'}>
          <Box fontSize={'xl'} fontWeight={'bold'} flex={1}>
-            调试预览
+            {t('core.chat.Debug test')}
          </Box>
-          <MyTooltip label={'重置'}>
+          <MyTooltip label={t('core.chat.Restart')}>
            <IconButton
              className="chat"
              size={'smSquare'}
@@ -117,6 +120,16 @@ const ChatTest = (
              }}
            />
          </MyTooltip>
+          <MyTooltip label={t('common.Close')}>
+            <IconButton
+              ml={[3, 6]}
+              icon={<SmallCloseIcon fontSize={'22px'} />}
+              variant={'grayBase'}
+              size={'smSquare'}
+              aria-label={''}
+              onClick={onClose}
+            />
+          </MyTooltip>
        </Flex>
        <Box flex={1}>
          <ChatBox
@@ -132,7 +145,7 @@ const ChatTest = (
          />
        </Box>
      </Flex>
-      <Box
+      {/* <Box
        zIndex={2}
        display={isOpen ? 'block' : 'none'}
        position={'fixed'}
@@ -141,7 +154,7 @@ const ChatTest = (
        bottom={0}
        right={0}
        onClick={onClose}
-      />
+      /> */}
    </>
  );
 };
--- a/projects/app/src/components/core/module/Flow/FlowProvider.tsx
+++ b/projects/app/src/components/core/module/Flow/FlowProvider.tsx
@@ -166,7 +166,7 @@ export const FlowProvider = ({
  }, [nodes]);

  const onFixView = useCallback(() => {
-    const btn = document.querySelector('.react-flow__controls-fitview') as HTMLButtonElement;
+    const btn = document.querySelector('.custom-workflow-fix_view') as HTMLButtonElement;

    setTimeout(() => {
      btn && btn.click();
--- a/projects/app/src/components/core/module/Flow/components/nodes/NodeUserGuide.tsx
+++ b/projects/app/src/components/core/module/Flow/components/nodes/NodeUserGuide.tsx
@@ -15,8 +15,10 @@ import NodeCard from '../render/NodeCard';
 import type { VariableItemType } from '@fastgpt/global/core/app/type.d';
 import QGSwitch from '@/components/core/app/QGSwitch';
 import TTSSelect from '@/components/core/app/TTSSelect';
+import WhisperConfig from '@/components/core/app/WhisperConfig';
 import { splitGuideModule } from '@fastgpt/global/core/module/utils';
 import { useTranslation } from 'next-i18next';
+import { TTSTypeEnum } from '@/constants/app';

 const NodeUserGuide = ({ data, selected }: NodeProps<FlowModuleItemType>) => {
  const theme = useTheme();
@@ -31,6 +33,9 @@ const NodeUserGuide = ({ data, selected }: NodeProps<FlowModuleItemType>) => {
          <Box pt={3} borderTop={theme.borders.base}>
            <TTSGuide data={data} />
          </Box>
+          <Box mt={3} pt={3} borderTop={theme.borders.base}>
+            <WhisperGuide data={data} />
+          </Box>
          <Box mt={3} pt={3} borderTop={theme.borders.base}>
            <QuestionGuide data={data} />
          </Box>
@@ -164,3 +169,26 @@ function TTSGuide({ data }: { data: FlowModuleItemType }) {
    />
  );
 }
+
+function WhisperGuide({ data }: { data: FlowModuleItemType }) {
+  const { inputs, moduleId } = data;
+  const { ttsConfig, whisperConfig } = splitGuideModule({ inputs } as ModuleItemType);
+
+  return (
+    <WhisperConfig
+      isOpenAudio={ttsConfig.type !== TTSTypeEnum.none}
+      value={whisperConfig}
+      onChange={(e) => {
+        onChangeNode({
+          moduleId,
+          key: ModuleInputKeyEnum.whisper,
+          type: 'updateInput',
+          value: {
+            ...inputs.find((item) => item.key === ModuleInputKeyEnum.whisper),
+            value: e
+          }
+        });
+      }}
+    />
+  );
+}
--- a/projects/app/src/components/core/module/Flow/components/render/NodeCard.tsx
+++ b/projects/app/src/components/core/module/Flow/components/render/NodeCard.tsx
@@ -261,7 +261,7 @@ const NodeCard = (props: Props) => {
      }}
    >
      {Header}
-      {children}
+      <Box className="nowheel">{children}</Box>
      {RenderModal}
    </Box>
  );
--- a/projects/app/src/components/core/module/Flow/index.tsx
+++ b/projects/app/src/components/core/module/Flow/index.tsx
@@ -3,8 +3,11 @@ import ReactFlow, {
  Background,
  Connection,
  Controls,
+  ControlButton,
+  MiniMap,
  NodeProps,
-  ReactFlowProvider
+  ReactFlowProvider,
+  useReactFlow
 } from 'reactflow';
 import { Box, Flex, IconButton, useDisclosure } from '@chakra-ui/react';
 import { SmallCloseIcon } from '@chakra-ui/icons';
@@ -20,6 +23,8 @@ import 'reactflow/dist/style.css';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useTranslation } from 'next-i18next';
 import { FlowModuleItemType } from '@fastgpt/global/core/module/type';
+import MyIcon from '@fastgpt/web/components/common/Icon';
+import MyTooltip from '@/components/MyTooltip';

 const NodeSimple = dynamic(() => import('./components/nodes/NodeSimple'));
 const nodeTypes: Record<`${FlowNodeTypeEnum}`, any> = {
@@ -54,19 +59,10 @@ const edgeTypes = {
 const Container = React.memo(function Container() {
  const { toast } = useToast();
  const { t } = useTranslation();
+
  const { reactFlowWrapper, nodes, onNodesChange, edges, onEdgesChange, onConnect } =
    useFlowProviderStore();

-  const memoRenderTools = useMemo(
-    () => (
-      <>
-        <Background />
-        <Controls position={'bottom-right'} style={{ display: 'flex' }} showInteractive={false} />
-      </>
-    ),
-    []
-  );
-
  const customOnConnect = useCallback(
    (connect: Connection) => {
      if (!connect.sourceHandle || !connect.targetHandle) {
@@ -105,7 +101,7 @@ const Container = React.memo(function Container() {
      onEdgesChange={onEdgesChange}
      onConnect={customOnConnect}
    >
-      {memoRenderTools}
+      <FlowController />
    </ReactFlow>
  );
 });
@@ -168,3 +164,40 @@ const Flow = ({ Header, ...data }: { Header: React.ReactNode }) => {
 };

 export default React.memo(Flow);
+
+const FlowController = React.memo(function FlowController() {
+  const { fitView } = useReactFlow();
+  return (
+    <>
+      <MiniMap
+        style={{
+          height: 78,
+          width: 126,
+          marginBottom: 35
+        }}
+        pannable
+      />
+      <Controls
+        position={'bottom-right'}
+        style={{
+          display: 'flex',
+          marginBottom: 5,
+          background: 'white',
+          borderRadius: '6px',
+          overflow: 'hidden',
+          boxShadow:
+            '0px 0px 1px 0px rgba(19, 51, 107, 0.20), 0px 12px 16px -4px rgba(19, 51, 107, 0.20)'
+        }}
+        showInteractive={false}
+        showFitView={false}
+      >
+        <MyTooltip label={'页面居中'}>
+          <ControlButton className="custom-workflow-fix_view" onClick={() => fitView()}>
+            <MyIcon name={'core/modules/fixview'} w={'14px'} />
+          </ControlButton>
+        </MyTooltip>
+      </Controls>
+      <Background />
+    </>
+  );
+});
--- a/projects/app/src/components/support/laf/LafAccountModal.tsx
+++ b/projects/app/src/components/support/laf/LafAccountModal.tsx
@@ -18,7 +18,8 @@ import { getDocPath } from '@/web/common/system/doc';
 const LafAccountModal = ({
  defaultData = {
    token: '',
-    appid: ''
+    appid: '',
+    pat: ''
  },
  onClose
 }: {
@@ -140,7 +141,7 @@ const LafAccountModal = ({
                onResetForm();
                putUpdateTeam({
                  teamId: userInfo?.team.teamId || '',
-                  lafAccount: { token: '', appid: '' }
+                  lafAccount: { token: '', appid: '', pat: '' }
                });
              }}
            >