chore: updated Input prop from hasSilverBorder to colorVariant

frontend/src/components/Input.tsx

@@ -9,7 +9,7 @@ const Input = ({
   placeholder,
   maxLength,
   className,
-  hasSilverBorder,
+  colorVariant = 'silver',
   children,
   onChange,
   onPaste,
@@ -17,9 +17,12 @@ const Input = ({
 }: InputProps) => {
   return (
     <input
-      className={`h-[42px] w-full rounded-full border-2 px-3 outline-none dark:bg-transparent dark:text-white ${
-        hasSilverBorder ? 'border-silver dark:border-silver/40' : ''
-      } ${className}`}
+      className={`h-[42px] w-full rounded-full border-2 px-3 outline-none dark:bg-transparent dark:text-white ${className} ${
+        colorVariant === 'silver' ? 'border-silver dark:border-silver/40' : ''
+      } ${colorVariant === 'jet' ? 'border-jet' : ''} ${
+        colorVariant === 'gray' ? 'border-gray-5000 dark:text-silver' : ''
+      }
+      }`}
       type={type}
       id={id}
       name={name}

frontend/src/components/types/index.ts

@@ -20,5 +20,5 @@ export type TextAreaProps = {
 
 export type InputProps = TextAreaProps & {
   type: 'text' | 'number';
-  hasSilverBorder?: boolean;
+  colorVariant?: 'silver' | 'jet' | 'gray';
 };

frontend/src/conversation/Conversation.tsx

@@ -184,8 +184,6 @@ export default function Conversation() {
     document.execCommand('insertText', false, text);
   };
 
-  // console.log('inputRef: ', inputRef);
-
   return (
     <div className="flex h-screen flex-col gap-7 pb-2">
       <div

frontend/src/preferences/APIKeyModal.tsx

@@ -69,7 +69,8 @@ export default function APIKeyModal({
             </p>
             <Input
               type="text"
-              className="h-10 border-b-2 border-jet focus:outline-none"
+              colorVariant="jet"
+              className="h-10 border-b-2 focus:outline-none"
               value={key}
               maxLength={100}
               placeholder="API Key"

frontend/src/preferences/PromptsModal.tsx

@@ -39,7 +39,6 @@ function AddPrompt({
             placeholder="Prompt Name"
             type="text"
             className="h-10 rounded-lg"
-            hasSilverBorder
             value={newPromptName}
             onChange={(e) => setNewPromptName(e.target.value)}
           ></Input>
@@ -111,7 +110,6 @@ function EditPrompt({
             placeholder="Prompt Name"
             type="text"
             className="h-10 rounded-lg"
-            hasSilverBorder
             value={editPromptName}
             onChange={(e) => setEditPromptName(e.target.value)}
           ></Input>

frontend/src/settings/APIKeys.tsx

@@ -241,7 +241,6 @@ const CreateAPIKeyModal: React.FC<CreateAPIKeyModalProps> = ({
           <Input
             type="text"
             className="rounded-md"
-            hasSilverBorder
             value={APIKeyName}
             onChange={(e) => setAPIKeyName(e.target.value)}
           ></Input>

frontend/src/upload/Upload.tsx

@@ -328,7 +328,7 @@ function Upload({
           <>
             <Input
               type="text"
-              className="border-gray-5000 dark:text-silver"
+              colorVariant="gray"
               value={docName}
               onChange={(e) => setDocName(e.target.value)}
             ></Input>
@@ -379,7 +379,6 @@ function Upload({
                 <Input
                   placeholder={`Enter ${t('modals.uploadDoc.name')}`}
                   type="text"
-                  hasSilverBorder
                   value={urlName}
                   onChange={(e) => setUrlName(e.target.value)}
                 ></Input>
@@ -391,7 +390,6 @@ function Upload({
                 <Input
                   placeholder={t('modals.uploadDoc.urlLink')}
                   type="text"
-                  hasSilverBorder
                   value={url}
                   onChange={(e) => setUrl(e.target.value)}
                 ></Input>
@@ -406,7 +404,6 @@ function Upload({
                 <Input
                   placeholder="Enter client ID"
                   type="text"
-                  hasSilverBorder
                   name="client_id"
                   value={redditData.client_id}
                   onChange={handleChange}
@@ -419,7 +416,6 @@ function Upload({
                 <Input
                   placeholder="Enter client secret"
                   type="text"
-                  hasSilverBorder
                   name="client_secret"
                   value={redditData.client_secret}
                   onChange={handleChange}
@@ -432,7 +428,6 @@ function Upload({
                 <Input
                   placeholder="Enter user agent"
                   type="text"
-                  hasSilverBorder
                   name="user_agent"
                   value={redditData.user_agent}
                   onChange={handleChange}
@@ -445,7 +440,6 @@ function Upload({
                 <Input
                   placeholder="Enter search queries"
                   type="text"
-                  hasSilverBorder
                   name="search_queries"
                   value={redditData.search_queries}
                   onChange={handleChange}
@@ -458,7 +452,6 @@ function Upload({
                 <Input
                   placeholder="Enter number of posts"
                   type="number"
-                  hasSilverBorder
                   name="number_posts"
                   value={redditData.number_posts}
                   onChange={handleChange}