Code cleanup

client/src/components/Endpoints/BingAI/Settings.jsx

@@ -1,22 +1,14 @@
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import TextareaAutosize from 'react-textarea-autosize';
-import { Input } from '~/components/ui/Input.tsx';
 import { Label } from '~/components/ui/Label.tsx';
 import { Checkbox } from '~/components/ui/Checkbox.tsx';
 import SelectDropDown from '../../ui/SelectDropDown';
 import { axiosPost } from '~/utils/fetchers.js';
 import { cn } from '~/utils/';
 import debounce from 'lodash/debounce';
-// import ModelDropDown from '../../ui/ModelDropDown';
-// import { Slider } from '~/components/ui/Slider.tsx';
-// import OptionHover from './OptionHover';
-// import { HoverCard, HoverCardTrigger } from '~/components/ui/HoverCard.tsx';
 const defaultTextProps =
   'rounded-md border border-gray-200 focus:border-slate-400 focus:bg-gray-50 bg-transparent text-sm shadow-[0_0_10px_rgba(0,0,0,0.05)] outline-none placeholder:text-gray-400 focus:outline-none focus:ring-gray-400 focus:ring-opacity-20 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 dark:border-gray-500 dark:bg-gray-700 focus:dark:bg-gray-600 dark:text-gray-50 dark:shadow-[0_0_15px_rgba(0,0,0,0.10)] dark:focus:border-gray-400 dark:focus:outline-none dark:focus:ring-0 dark:focus:ring-gray-400 dark:focus:ring-offset-0';
 
-const optionText =
-  'p-0 shadow-none text-right pr-1 h-8 border-transparent focus:ring-[#10a37f] focus:ring-offset-0 focus:ring-opacity-100 hover:bg-gray-800/10 dark:hover:bg-white/10 focus:bg-gray-800/10 dark:focus:bg-white/10 transition-colors';
-
 function Settings(props) {
   const { readonly, context, systemMessage, jailbreak, toneStyle, setOption } = props;
   const [tokenCount, setTokenCount] = useState(0);
@@ -27,7 +19,6 @@ function Settings(props) {
   const setToneStyle = value => setOption('toneStyle')(value.toLowerCase());
 
   // useEffect to update token count
-
   useEffect(() => {
     if (!context || context.trim() === '') {
       setTokenCount(0);
@@ -49,8 +40,6 @@ function Settings(props) {
     return () => debouncedPost.cancel();
   }, [context]);
 
-  // console.log('data', data);
-
   return (
     <>
       <div className="grid gap-6 sm:grid-cols-2">
@@ -151,14 +140,6 @@ function Settings(props) {
               />
             </div>
           )}
-          {/* <HoverCard openDelay={300}>
-            <HoverCardTrigger className="grid w-full items-center gap-2"> 
-            </HoverCardTrigger>
-            <OptionHover
-              type="temp"
-              side="left"
-            />
-          </HoverCard> */}
         </div>
       </div>
     </>

client/src/components/Endpoints/OpenAI/Settings.jsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { useRecoilValue } from 'recoil';
 import TextareaAutosize from 'react-textarea-autosize';
 import SelectDropDown from '../../ui/SelectDropDown';
@@ -6,7 +5,6 @@ import { Input } from '~/components/ui/Input.tsx';
 import { Label } from '~/components/ui/Label.tsx';
 import { Slider } from '~/components/ui/Slider.tsx';
 import { InputNumber } from '~/components/ui/InputNumber.tsx';
-// import { InputNumber } from '../../ui/InputNumber';
 import OptionHover from './OptionHover';
 import { HoverCard, HoverCardTrigger } from '~/components/ui/HoverCard.tsx';
 import { cn } from '~/utils/';
@@ -49,23 +47,6 @@ function Settings(props) {
               )}
               containerClassName="flex w-full resize-none"
             />
-            {/* <Label
-              htmlFor="model"
-              className="text-left text-sm font-medium"
-            >
-              Model
-            </Label>
-            <Input
-              id="model"
-              value={model}
-              // ref={inputRef}
-              onChange={e => setModel(e.target.value)}
-              placeholder="Set a custom name for ChatGPT"
-              className={cn(
-                defaultTextProps,
-                'flex h-10 max-h-10 w-full resize-none px-3 py-2 focus:outline-none focus:ring-0 focus:ring-opacity-0 focus:ring-offset-0'
-              )}
-            /> */}
           </div>
           <div className="grid w-full items-center gap-2">
             <Label
@@ -78,7 +59,6 @@ function Settings(props) {
               id="chatGptLabel"
               disabled={readonly}
               value={chatGptLabel || ''}
-              // ref={inputRef}
               onChange={e => setChatGptLabel(e.target.value || null)}
               placeholder="Set a custom name for ChatGPT"
               className={cn(
@@ -104,15 +84,6 @@ function Settings(props) {
                 defaultTextProps,
                 'flex max-h-[300px] min-h-[100px] w-full resize-none px-3 py-2 '
               )}
-              // onFocus={() => {
-              //   textareaRef.current.classList.remove('max-h-10');
-              //   textareaRef.current.classList.add('max-h-52');
-              // }}
-              // onBlur={() => {
-              //   textareaRef.current.classList.remove('max-h-52');
-              //   textareaRef.current.classList.add('max-h-10');
-              // }}
-              // ref={textareaRef}
             />
           </div>
         </div>
@@ -160,43 +131,6 @@ function Settings(props) {
               side="left"
             />
           </HoverCard>
-
-          {/* <HoverCard openDelay={300}>
-            <HoverCardTrigger className="grid w-full items-center gap-2">
-              <div className="flex justify-between">
-                <Label
-                  htmlFor="chatGptLabel"
-                  className="text-left text-sm font-medium"
-                >
-                  Max tokens
-                </Label>
-                <Input
-                  id="max-tokens-int"
-                  disabled
-                  value={maxTokens}
-                  onChange={e => setMaxTokens(e.target.value)}
-                  className={cn(
-                    defaultTextProps,
-                    cn(optionText, 'h-auto w-12 border-0 group-hover/temp:border-gray-200')
-                  )}
-                />
-              </div>
-              <Slider
-              disabled={readonly}
-                value={[maxTokens]}
-                onValueChange={value => setMaxTokens(value[0])}
-                max={2048} // should be dynamic to the currently selected model
-                min={1}
-                step={1}
-                className="flex h-4 w-full"
-              />
-            </HoverCardTrigger>
-            <OptionHover
-              type="max"
-              side="left"
-            />
-          </HoverCard> */}
-
           <HoverCard openDelay={300}>
             <HoverCardTrigger className="grid w-full items-center gap-2">
               <div className="flex justify-between">

client/src/components/Input/BingAIOptions/index.jsx

@@ -1,5 +1,5 @@
-import React, { useState, useEffect } from 'react';
+import { useState } from 'react';
-import { useRecoilValue, useRecoilState } from 'recoil';
+import { useRecoilState } from 'recoil';
 import { cn } from '~/utils';
 import { Button } from '../../ui/Button.tsx';
 import { Settings2 } from 'lucide-react';
@@ -18,25 +18,12 @@ function BingAIOptions() {
   const { endpoint, conversationId } = conversation;
   const { toneStyle, context, systemMessage, jailbreak } = conversation;
 
-  // useEffect(() => {
-  //   if (endpoint !== 'bingAI') return;
-
-  //   const mustInAdvancedMode = context !== null || systemMessage !== null;
-
-  //   if (mustInAdvancedMode && !advancedMode) setAdvancedMode(true);
-  // }, [conversation, advancedMode]);
-
   if (endpoint !== 'bingAI') return null;
   if (conversationId !== 'new') return null;
 
   const triggerAdvancedMode = () => setAdvancedMode(prev => !prev);
 
   const switchToSimpleMode = () => {
-    // setConversation(prevState => ({
-    //   ...prevState,
-    //   context: null,
-    //   systemMessage: null
-    // }));
     setAdvancedMode(false);
   };
 

client/src/components/Input/ChatGPTOptions/index.jsx

@@ -12,21 +12,11 @@ function ChatGPTOptions() {
 
   const endpointsConfig = useRecoilValue(store.endpointsConfig);
 
-  // useEffect(() => {
-  //   if (endpoint !== 'chatGPTBrowser') return;
-  // }, [conversation]);
-
   if (endpoint !== 'chatGPTBrowser') return null;
   if (conversationId !== 'new') return null;
 
   const models = endpointsConfig?.['chatGPTBrowser']?.['availableModels'] || [];
 
-  // const modelMap = new Map([
-  //   ['Default (GPT-3.5)', 'text-davinci-002-render-sha'],
-  //   ['Legacy (GPT-3.5)', 'text-davinci-002-render-paid'],
-  //   ['GPT-4', 'gpt-4']
-  // ]);
-
   const setOption = param => newValue => {
     let update = {};
     update[param] = newValue;

client/src/components/Input/OpenAIOptions/index.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import { useState } from 'react';
 import { Settings2 } from 'lucide-react';
 import { useRecoilState, useRecoilValue } from 'recoil';
 import SelectDropDown from '../../ui/SelectDropDown';
@@ -21,20 +21,6 @@ function OpenAIOptions() {
 
   const endpointsConfig = useRecoilValue(store.endpointsConfig);
 
-  // useEffect(() => {
-  //   if (endpoint !== 'openAI') return;
-
-  //   const mustInAdvancedMode =
-  //     chatGptLabel !== null ||
-  //     promptPrefix !== null ||
-  //     temperature !== 1 ||
-  //     top_p !== 1 ||
-  //     presence_penalty !== 0 ||
-  //     frequency_penalty !== 0;
-
-  //   if (mustInAdvancedMode && !advancedMode) setAdvancedMode(true);
-  // }, [conversation, advancedMode]);
-
   if (endpoint !== 'openAI') return null;
   if (conversationId !== 'new') return null;
 
@@ -43,15 +29,6 @@ function OpenAIOptions() {
   const triggerAdvancedMode = () => setAdvancedMode(prev => !prev);
 
   const switchToSimpleMode = () => {
-    // setConversation(prevState => ({
-    //   ...prevState,
-    //   chatGptLabel: null,
-    //   promptPrefix: null,
-    //   temperature: 1,
-    //   top_p: 1,
-    //   presence_penalty: 0,
-    //   frequency_penalty: 0
-    // }));
     setAdvancedMode(false);
   };
 
@@ -79,16 +56,6 @@ function OpenAIOptions() {
           (!advancedMode ? ' show' : '')
         }
       >
-        {/* <ModelSelect
-          model={model}
-          availableModels={availableModels}
-          onChange={setOption('model')}
-          type="button"
-          className={cn(
-            cardStyle,
-            ' z-50 flex h-[40px] items-center justify-center px-4 hover:bg-slate-50 data-[state=open]:bg-slate-50 dark:hover:bg-gray-600 dark:data-[state=open]:bg-gray-600'
-          )}
-        /> */}
         <SelectDropDown
           value={model}
           setValue={setOption('model')}