Fix share page feedback auth (#3284)

* fix: share page mark auth

* perf: lang check

* perf: load share

packages/global/core/chat/api.d.ts

-export type UpdateChatFeedbackProps = {
+import { OutLinkChatAuthProps } from '../../support/permission/chat';
+
+export type UpdateChatFeedbackProps = OutLinkChatAuthProps & {
   appId: string;
   chatId: string;
   dataId: string;
-  shareId?: string;
-  teamId?: string;
-  teamToken?: string;
-  outLinkUid?: string;
   userBadFeedback?: string;
   userGoodFeedback?: string;
 };

projects/app/src/components/core/chat/ChatContainer/ChatBox/components/FeedbackModal.tsx

@@ -4,30 +4,25 @@ import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
 import { useTranslation } from 'next-i18next';
 import { updateChatUserFeedback } from '@/web/core/chat/api';
+import { useContextSelector } from 'use-context-selector';
+import { ChatBoxContext } from '../Provider';
 
 const FeedbackModal = ({
   appId,
   chatId,
   dataId,
-  teamId,
-  teamToken,
-  shareId,
-  outLinkUid,
   onSuccess,
   onClose
 }: {
   appId: string;
   chatId: string;
   dataId: string;
-  shareId?: string;
-  teamId?: string;
-  teamToken?: string;
-  outLinkUid?: string;
   onSuccess: (e: string) => void;
   onClose: () => void;
 }) => {
   const ref = useRef<HTMLTextAreaElement>(null);
   const { t } = useTranslation();
+  const outLinkAuthData = useContextSelector(ChatBoxContext, (v) => v.outLinkAuthData);
 
   const { mutate, isLoading } = useRequest({
     mutationFn: async () => {
@@ -36,11 +31,8 @@ const FeedbackModal = ({
         appId,
         chatId,
         dataId,
-        shareId,
-        teamId,
-        teamToken,
-        outLinkUid,
-        userBadFeedback: val
+        userBadFeedback: val,
+        ...outLinkAuthData
       });
     },
     onSuccess() {

projects/app/src/components/core/chat/ChatContainer/ChatBox/index.tsx

@@ -137,10 +137,6 @@ const ChatBox = ({
   const chatRecords = useContextSelector(ChatRecordContext, (v) => v.chatRecords);
   const setChatRecords = useContextSelector(ChatRecordContext, (v) => v.setChatRecords);
   const isChatRecordsLoaded = useContextSelector(ChatRecordContext, (v) => v.isChatRecordsLoaded);
-  const setIsChatRecordsLoaded = useContextSelector(
-    ChatRecordContext,
-    (v) => v.setIsChatRecordsLoaded
-  );
   const ScrollData = useContextSelector(ChatRecordContext, (v) => v.ScrollData);
 
   const appId = useContextSelector(ChatBoxContext, (v) => v.appId);
@@ -687,12 +683,9 @@ const ChatBox = ({
         updateChatUserFeedback({
           appId,
           chatId,
-          teamId,
-          teamToken,
           dataId: chat.dataId,
-          shareId,
-          outLinkUid,
-          userGoodFeedback: isGoodFeedback ? undefined : 'yes'
+          userGoodFeedback: isGoodFeedback ? undefined : 'yes',
+          ...outLinkAuthData
         });
       } catch (error) {}
     };
@@ -708,11 +701,10 @@ const ChatBox = ({
       );
       updateChatUserFeedback({
         appId,
-        teamId,
-        teamToken,
         chatId,
         dataId: chat.dataId,
-        userGoodFeedback: undefined
+        userGoodFeedback: undefined,
+        ...outLinkAuthData
       });
     };
   });
@@ -737,10 +729,7 @@ const ChatBox = ({
             appId,
             chatId,
             dataId: chat.dataId,
-            shareId,
-            teamId,
-            teamToken,
-            outLinkUid
+            ...outLinkAuthData
           });
         } catch (error) {}
       };
@@ -864,7 +853,6 @@ const ChatBox = ({
       abortRequest();
 
       setChatRecords([]);
-      setIsChatRecordsLoaded(false);
       setValue('chatStarted', false);
     },
     scrollToBottom(behavior = 'auto') {
@@ -1040,12 +1028,8 @@ const ChatBox = ({
       {!!feedbackId && chatId && (
         <FeedbackModal
           appId={appId}
-          teamId={teamId}
-          teamToken={teamToken}
           chatId={chatId}
           dataId={feedbackId}
-          shareId={shareId}
-          outLinkUid={outLinkUid}
           onClose={() => setFeedbackId(undefined)}
           onSuccess={(content: string) => {
             setChatRecords((state) =>

projects/app/src/pages/app/detail/components/Publish/Link/SelectUsingWayModal.tsx

@@ -50,8 +50,8 @@ const SelectUsingWayModal = ({ share, onClose }: { share: OutLinkSchema; onClose
     defaultValues: {
       usingWay: UsingWayEnum.link,
       showHistory: true,
-      scriptIconCanDrag: true,
-      scriptDefaultOpen: true,
+      scriptIconCanDrag: false,
+      scriptDefaultOpen: false,
       scriptOpenIcon:
         'data:image/svg+xml;base64,PHN2ZyB0PSIxNjkwNTMyNzg1NjY0IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQxMzIiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48cGF0aCBkPSJNNTEyIDMyQzI0Ny4wNCAzMiAzMiAyMjQgMzIgNDY0QTQxMC4yNCA0MTAuMjQgMCAwIDAgMTcyLjQ4IDc2OEwxNjAgOTY1LjEyYTI1LjI4IDI1LjI4IDAgMCAwIDM5LjA0IDIyLjRsMTY4LTExMkE1MjguNjQgNTI4LjY0IDAgMCAwIDUxMiA4OTZjMjY0Ljk2IDAgNDgwLTE5MiA0ODAtNDMyUzc3Ni45NiAzMiA1MTIgMzJ6IG0yNDQuOCA0MTZsLTM2MS42IDMwMS43NmExMi40OCAxMi40OCAwIDAgMS0xOS44NC0xMi40OGw1OS4yLTIzMy45MmgtMTYwYTEyLjQ4IDEyLjQ4IDAgMCAxLTcuMzYtMjMuMzZsMzYxLjYtMzAxLjc2YTEyLjQ4IDEyLjQ4IDAgMCAxIDE5Ljg0IDEyLjQ4bC01OS4yIDIzMy45MmgxNjBhMTIuNDggMTIuNDggMCAwIDEgOCAyMi4wOHoiIGZpbGw9IiM0ZTgzZmQiIHAtaWQ9IjQxMzMiPjwvcGF0aD48L3N2Zz4=',
       scriptCloseIcon:
@@ -96,6 +96,7 @@ const SelectUsingWayModal = ({ share, onClose }: { share: OutLinkSchema; onClose
     [UsingWayEnum.script]: {
       blockTitle: t('common:core.app.outLink.Script block title'),
       code: `<script
+  type="text/javascript"
   src="${baseUrl}/js/iframe.js"
   id="chatbot-iframe" 
   data-bot-src="${linkUrl}" 
@@ -104,10 +105,7 @@ const SelectUsingWayModal = ({ share, onClose }: { share: OutLinkSchema; onClose
   data-open-icon="${getValues('scriptOpenIcon')}"
   data-close-icon="${getValues('scriptCloseIcon')}"
   defer
-></script>
-<script>
-console.log("Chat box loaded")
-</script>`
+></script>`
     }
   };
 

projects/app/src/pages/chat/share.tsx

@@ -84,10 +84,11 @@ const OutLink = (props: Props) => {
 
   const chatRecords = useContextSelector(ChatRecordContext, (v) => v.chatRecords);
   const totalRecordsCount = useContextSelector(ChatRecordContext, (v) => v.totalRecordsCount);
+  const isChatRecordsLoaded = useContextSelector(ChatRecordContext, (v) => v.isChatRecordsLoaded);
 
   const initSign = useRef(false);
   const [chatData, setChatData] = useState<InitChatResponse>(defaultChatData);
-  const { loading: isLoading } = useRequest2(
+  const { data, loading: isLoading } = useRequest2(
     async () => {
       const shareId = outLinkAuthData.shareId;
       const outLinkUid = outLinkAuthData.outLinkUid;
@@ -104,19 +105,12 @@ const OutLink = (props: Props) => {
       resetVariables({
         variables: res.variables
       });
+
+      return res;
     },
     {
       manual: false,
       refreshDeps: [shareId, outLinkAuthData, chatId],
-      onSuccess() {
-        // send init message
-        if (!initSign.current) {
-          initSign.current = true;
-          if (window !== top) {
-            window.top?.postMessage({ type: 'shareChatReady' }, '*');
-          }
-        }
-      },
       onError(e: any) {
         if (chatId) {
           onChangeChatId('');
@@ -127,6 +121,14 @@ const OutLink = (props: Props) => {
       }
     }
   );
+  useEffect(() => {
+    if (initSign.current === false && data && isChatRecordsLoaded) {
+      initSign.current = true;
+      if (window !== top) {
+        window.top?.postMessage({ type: 'shareChatReady' }, '*');
+      }
+    }
+  }, [data, isChatRecordsLoaded]);
 
   const startChat = useCallback(
     async ({
@@ -295,8 +297,6 @@ const Render = (props: Props) => {
   const { localUId, loaded } = useShareChatStore();
   const { source, chatId, setSource, setAppId, setOutLinkAuthData } = useChatStore();
 
-  const [isLoaded, setIsLoaded] = useState(false);
-
   const chatHistoryProviderParams = useMemo(() => {
     return { shareId, outLinkUid: authToken || customUid || localUId };
   }, [authToken, customUid, localUId, shareId]);
@@ -311,11 +311,8 @@ const Render = (props: Props) => {
   }, [appId, chatHistoryProviderParams.outLinkUid, chatId, shareId]);
 
   useMount(() => {
-    setIsLoaded(true);
-
     setSource('share');
   });
-  const systemLoaded = isLoaded && loaded && chatHistoryProviderParams.outLinkUid;
 
   // Set outLinkAuthData
   useEffect(() => {

projects/app/src/web/common/utils/i18n.ts

@@ -22,5 +22,6 @@ export const langMap = {
 };
 
 export const serviceSideProps = (content: any, ns: I18nNsType = []) => {
-  return serverSideTranslations(content.locale, ['common', 'error', ...ns], null, content.locales);
+  const lang = content.req?.cookies?.NEXT_LOCALE || content.locale;
+  return serverSideTranslations(lang, ['common', 'error', ...ns], null, content.locales);
 };

projects/app/src/web/core/chat/context/chatRecordContext.tsx

@@ -2,7 +2,7 @@ import { getPaginationRecordsBody } from '@/pages/api/core/chat/getPaginationRec
 import { ChatSiteItemType } from '@fastgpt/global/core/chat/type';
 import { PaginationResponse } from '@fastgpt/web/common/fetch/type';
 import { useScrollPagination } from '@fastgpt/web/hooks/useScrollPagination';
-import React, { ReactNode, useMemo, useState } from 'react';
+import React, { ReactNode, useEffect, useMemo, useState } from 'react';
 import { createContext, useContextSelector } from 'use-context-selector';
 import { ChatItemContext } from './chatItemContext';
 import { getChatRecords } from '../api';
@@ -14,7 +14,6 @@ type ChatRecordContextType = {
   chatRecords: ChatSiteItemType[];
   setChatRecords: React.Dispatch<React.SetStateAction<ChatSiteItemType[]>>;
   isChatRecordsLoaded: boolean;
-  setIsChatRecordsLoaded: React.Dispatch<React.SetStateAction<boolean>>;
   totalRecordsCount: number;
   ScrollData: ({
     children,
@@ -31,9 +30,7 @@ export const ChatRecordContext = createContext<ChatRecordContextType>({
     throw new Error('Function not implemented.');
   },
   isChatRecordsLoaded: false,
-  setIsChatRecordsLoaded: function (value: React.SetStateAction<boolean>): void {
-    throw new Error('Function not implemented.');
-  },
+
   totalRecordsCount: 0,
   ScrollData: function ({
     children,
@@ -59,6 +56,10 @@ const ChatRecordContextProvider = ({
   const ChatBoxRef = useContextSelector(ChatItemContext, (v) => v.ChatBoxRef);
   const [isChatRecordsLoaded, setIsChatRecordsLoaded] = useState(false);
 
+  useEffect(() => {
+    setIsChatRecordsLoaded(false);
+  }, [params]);
+
   const {
     data: chatRecords,
     ScrollData,
@@ -104,17 +105,9 @@ const ChatRecordContextProvider = ({
       setChatRecords,
       totalRecordsCount,
       ScrollData,
-      isChatRecordsLoaded,
-      setIsChatRecordsLoaded
+      isChatRecordsLoaded
     };
-  }, [
-    ScrollData,
-    chatRecords,
-    setChatRecords,
-    totalRecordsCount,
-    isChatRecordsLoaded,
-    setIsChatRecordsLoaded
-  ]);
+  }, [ScrollData, chatRecords, setChatRecords, totalRecordsCount, isChatRecordsLoaded]);
   return <ChatRecordContext.Provider value={contextValue}>{children}</ChatRecordContext.Provider>;
 };