From 5cb59885ecd217463218ec3da57e0214de1baab0 Mon Sep 17 00:00:00 2001
From: Wentao Lyu <35-wentao.lyu@users.noreply.git.stereye.tech>
Date: Sat, 1 Apr 2023 03:02:16 +0800
Subject: [PATCH] fix : endpoint option should hide on exist conversation

---
 .../components/Input/BingAIOptions/index.jsx  | 39 ++-----------------
 .../components/Input/OpenAIOptions/index.jsx  | 33 +++++++++-------
 client/src/components/Input/index.jsx         | 16 --------
 3 files changed, 23 insertions(+), 65 deletions(-)

diff --git a/client/src/components/Input/BingAIOptions/index.jsx b/client/src/components/Input/BingAIOptions/index.jsx
index c17a125334..b1f5783455 100644
--- a/client/src/components/Input/BingAIOptions/index.jsx
+++ b/client/src/components/Input/BingAIOptions/index.jsx
@@ -1,38 +1,16 @@
-import React, { useState, useEffect, forwardRef } from 'react';
+import React from 'react';
 import { useRecoilValue, useRecoilState } from 'recoil';
 import { cn } from '~/utils';
-import { Button } from '../../ui/Button.tsx';
 import { Tabs, TabsList, TabsTrigger } from '../../ui/Tabs.tsx';
 
 import store from '~/store';
 
-// function BingStyles(props, ref) {
-//   const [conversation, setConversation] = useRecoilState(store.conversation) || {};
-//   const { endpoint, conversationId, jailbreak, toneStyle } = conversation;
-//   const messages = useRecoilValue(store.messages);
-
-//   const isBing = endpoint === 'bingAI';
-
-//   const show = isBing && (!conversationId || messages?.length === 0 || props.show);
-//   const defaultClasses =
-//     'p-2 rounded-md min-w-[75px] font-normal bg-white/[.60] dark:bg-gray-700 text-black text-xs';
-//   const defaultSelected = cn(defaultClasses, 'font-medium data-[state=active]:text-white text-xs text-white');
-
-//   const selectedClass = val => val + '-tab ' + defaultSelected;
-
-//   const changeHandler = value => {
-//     setConversation(prevState => ({ ...prevState, toneStyle: value }));
-//   };
-
-function BingAIOptions({ ref }) {
+function BingAIOptions() {
   const [conversation, setConversation] = useRecoilState(store.conversation) || {};
-  const messages = useRecoilValue(store.messages);
   const { endpoint, conversationId } = conversation;
 
   if (endpoint !== 'bingAI') return null;
-
-  const isBing = endpoint === 'bingAI';
-  const show = isBing && (!conversationId || messages?.length === 0);
+  if (conversationId !== 'new') return null;
 
   const changeHandler = value => {
     setConversation(prevState => ({ ...prevState, toneStyle: value }));
@@ -47,16 +25,6 @@ function BingAIOptions({ ref }) {
   const defaultSelected = cn(defaultClasses, 'font-medium data-[state=active]:text-white text-xs text-white');
   const selectedClass = val => val + '-tab ' + defaultSelected;
 
-  //   <Button
-  //   type="button"
-  //   className={
-  //     cardStyle +
-  //     ' flex h-[40px] items-center justify-center px-4 hover:bg-slate-50 dark:hover:bg-gray-600'
-  //   }
-  //   onClick={triggerAdvancedMode}
-  // >
-  //   <span className="w-full text-center text-xs font-medium font-normal">More</span>
-  // </Button>
   return (
     <div className={' flex w-full items-center justify-center gap-2'}>
       <Tabs
@@ -66,7 +34,6 @@ function BingAIOptions({ ref }) {
           ' flex h-[40px] items-center justify-center px-0 hover:bg-slate-50 dark:hover:bg-gray-600'
         }
         onValueChange={changeHandler}
-        // ref={ref}
       >
         <TabsList className="bg-white/[.60] dark:bg-gray-700">
           <TabsTrigger
diff --git a/client/src/components/Input/OpenAIOptions/index.jsx b/client/src/components/Input/OpenAIOptions/index.jsx
index bce4b5fc33..0fcfb34258 100644
--- a/client/src/components/Input/OpenAIOptions/index.jsx
+++ b/client/src/components/Input/OpenAIOptions/index.jsx
@@ -8,7 +8,7 @@ import store from '~/store';
 function OpenAIOptions() {
   const [advancedMode, setAdvancedMode] = useState(false);
   const [conversation, setConversation] = useRecoilState(store.conversation) || {};
-  const { endpoint } = conversation;
+  const { endpoint, conversationId } = conversation;
 
   const triggerAdvancedMode = () => setAdvancedMode(prev => !prev);
 
@@ -47,6 +47,7 @@ function OpenAIOptions() {
   }, [conversation, advancedMode]);
 
   if (endpoint !== 'openAI') return null;
+  if (conversationId !== 'new') return null;
 
   const { model } = conversation;
 
@@ -83,22 +84,28 @@ function OpenAIOptions() {
       </div>
       <div
         className={
-          cardStyle +
-          ' p-b-[40px] openAIOptions-advanced-container absolute left-4 right-4 bottom-[40px] flex flex-col overflow-hidden rounded-md bg-slate-100 bg-white px-0' +
+          ' openAIOptions-advanced-container absolute bottom-[-10px] flex w-full flex-col items-center justify-center px-4' +
           (advancedMode ? ' show' : '')
         }
       >
-        <div className="flex w-full items-center justify-between bg-slate-100 px-4 py-2 dark:bg-white/10">
-          <span className="text-xs font-medium font-normal">Advanced settings for OpenAI endpoint</span>
-          <Button
-            type="button"
-            className="h-auto bg-transparent px-2 py-1 text-xs font-medium font-normal text-black hover:bg-slate-200 hover:text-black dark:bg-transparent dark:text-white dark:hover:bg-gray-700 dark:hover:text-white"
-            onClick={switchToSimpleMode}
-          >
-            Switch to simple mode
-          </Button>
+        <div
+          className={
+            cardStyle +
+            ' flex w-full flex-col overflow-hidden rounded-md border bg-slate-200 px-0 pb-[10px] dark:border-white/10 lg:w-[736px]'
+          }
+        >
+          <div className="flex w-full items-center justify-between bg-slate-100 px-4 py-2 dark:bg-gray-800/60">
+            <span className="text-xs font-medium font-normal">Advanced settings for OpenAI endpoint</span>
+            <Button
+              type="button"
+              className="h-auto bg-transparent px-2 py-1 text-xs font-medium font-normal text-black hover:bg-slate-200 hover:text-black dark:bg-transparent dark:text-white dark:hover:bg-gray-700 dark:hover:text-white"
+              onClick={switchToSimpleMode}
+            >
+              Switch to simple mode
+            </Button>
+          </div>
+          <div className="h-[200px]">content</div>
         </div>
-        <div className="h-[200px]">content</div>
       </div>
     </>
   );
diff --git a/client/src/components/Input/index.jsx b/client/src/components/Input/index.jsx
index 5a25db5efe..c33e230da3 100644
--- a/client/src/components/Input/index.jsx
+++ b/client/src/components/Input/index.jsx
@@ -130,25 +130,9 @@ export default function TextChat({ isSearchView = false }) {
     <>
       <div className="fixed bottom-0 left-0 w-full md:absolute">
         <div className="relative py-2 md:mb-[-16px] md:py-4 lg:mb-[-32px]">
-          {/* <span className="order-last ml-1 flex flex-col items-center justify-center gap-0 md:order-none md:m-auto md:w-full md:gap-2">
-            { : latestMessage && !latestMessage?.isCreatedByUser ? (
-              <button
-                onClick={handleRegenerate}
-                className="input-panel-button btn btn-neutral flex w-fit justify-center gap-2 border-0 md:border"
-                type="button"
-              >
-                <RegenerateIcon />
-                <span className="hidden md:block">Regenerate response</span>
-              </button>
-            ) : null}
-          </span> */}
           <span className="ml-1 flex flex-col items-center justify-center gap-0 md:order-none md:m-auto md:w-full md:gap-2">
             <OpenAIOptions />
             <BingAIOptions />
-            {/* <BingStyles
-                ref={bingStylesRef}
-                show={showBingToneSetting}
-              /> */}
           </span>
         </div>
         <div className="input-panel md:bg-vert-light-gradient dark:md:bg-vert-dark-gradient relative w-full border-t bg-white py-2 dark:border-white/20 dark:bg-gray-800 md:border-t-0 md:border-transparent md:bg-transparent md:dark:border-transparent md:dark:bg-transparent">