Merge pull request #132 from SciPhi-AI/Nolan/UpdateUI

Updated UI and Fix Settings Page

package.json

@@ -114,7 +114,6 @@
     "sharp": "^0.33.5",
     "tailwind-merge": "^2.5.5",
     "tailwindcss-animate": "^1.0.7",
-    "toml": "^3.0.0",
     "topojson-client": "^3.1.0",
     "uuid": "^10.0.0",
     "zustand": "^4.5.5"

src/components/ChatDemo/UploadDialog.tsx

@@ -56,7 +56,7 @@ export const UploadDialog: React.FC<UploadDialogProps> = ({
         <div
           {...getRootProps()}
           className={`border-2 border-dashed rounded-lg p-8 text-center cursor-pointer ${
-            isDragActive ? 'border-indigo-500 bg-indigo-50' : 'border-gray-300'
+            isDragActive ? 'border-accent-dark bg-indigo-50' : 'border-gray-300'
           }`}
         >
           <input {...getInputProps()} />

src/components/ChatDemo/answer.tsx

@@ -98,7 +98,6 @@ export const Answer: FC<{
         const communitiesArray = kgLocalResult.filter(
           (item: any) => item.result_type === 'community'
         );
-        console.log('communitiesArray = ', communitiesArray);
         setParsedEntities(entitiesArray);
         setParsedCommunities(communitiesArray);
         count += entitiesArray.length + communitiesArray.length;

src/components/ChatDemo/result.tsx

@@ -200,7 +200,6 @@ export const Result: FC<{
       if (!currentConversationId) {
         try {
           const newConversation = await client.conversations.create();
-          console.log('newConversation:', newConversation);
 
           if (!newConversation || !newConversation.results) {
             throw new Error('Failed to create a new conversation');
@@ -212,7 +211,6 @@ export const Result: FC<{
             throw new Error('Invalid conversation ID received');
           }
 
-          console.log('New conversation ID:', currentConversationId);
           setSelectedConversationId(currentConversationId);
         } catch (error) {
           console.error('Error creating new conversation:', error);
@@ -226,8 +224,6 @@ export const Result: FC<{
         return;
       }
 
-      console.log('Using conversation ID:', currentConversationId);
-
       const ragGenerationConfig: GenerationConfig = {
         stream: true,
         temperature: ragTemperature ?? undefined,
@@ -360,7 +356,6 @@ export const Result: FC<{
             role: 'assistant',
             content: assistantResponse,
           });
-          console.log('Added assistant message to conversation');
         } catch (error) {
           console.error(
             'Error adding assistant message to conversation:',
@@ -453,7 +448,7 @@ export const Result: FC<{
         pipelineUrl &&
         mode === 'rag' && (
           <div className="absolute inset-4 flex items-center justify-center backdrop-blur-sm">
-            <div className="flex items-center p-4 bg-white shadow-2xl rounded text-indigo-500 font-medium gap-4">
+            <div className="flex items-center p-4 bg-white shadow-2xl rounded text-text-accent-base font-medium gap-4">
               Please upload at least one document to submit queries.{' '}
               <UploadButton setUploadedDocuments={setUploadedDocuments} />
             </div>

src/components/ChatDemo/search.tsx

@@ -51,7 +51,7 @@ export const Search: FC<SearchProps> = ({
 
   return (
     <form onSubmit={handleSubmit} className="w-full">
-      <div className="relative flex items-center focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-zinc-800 rounded-full">
+      <div className="relative flex items-center focus-within:ring-2 focus-within:ring-accent-base focus-within:ring-offset-2 focus-within:ring-offset-zinc-800 rounded-full">
         <input
           id="search-bar"
           value={value}

src/components/ChatDemo/title.tsx

@@ -37,7 +37,7 @@ export const Title = ({
             router.push(getSearchUrl(encodeURIComponent(query)));
           }}
           type="button"
-          className="rounded flex gap-2 items-center bg-transparent px-2 py-1 text-md font-semibold text-indigo-500 hover:bg-zinc-900"
+          className="rounded flex gap-2 items-center bg-transparent px-2 py-1 text-md font-semibold text-accent-base hover:bg-zinc-900"
         >
           {model}
         </button> */}
@@ -46,7 +46,7 @@ export const Title = ({
             router.push(getSearchUrl(encodeURIComponent(query)));
           }}
           type="button"
-          className="rounded flex gap-2 items-center bg-transparent px-2 py-1 text-md font-semibold text-indigo-500 hover:bg-zinc-900"
+          className="rounded flex gap-2 items-center bg-transparent px-2 py-1 text-md font-semibold text-accent-base hover:bg-zinc-900"
         >
           {/* <RefreshCcw size={12}></RefreshCcw>Rewrite */}
         </button>

src/components/ChatDemo/update.tsx

@@ -88,7 +88,7 @@ export const UpdateButton: React.FC<UpdateButtonProps> = ({
           className={`${
             isUpdating
               ? 'bg-gray-400 cursor-not-allowed'
-              : 'hover:bg-indigo-700 bg-indigo-500'
+              : 'hover:bg-indigo-700 bg-accent-dark'
           } text-white font-bold py-1 px-2 rounded`}
         >
           {isUpdating ? <span className="animate-spin">↻</span> : '↺'}

src/components/ChatDemo/utils/documentDialogInfo.tsx

@@ -520,7 +520,7 @@ const ExpandableDocumentChunks: React.FC<{
       <div className="flex justify-end items-center mb-4">
         <button
           onClick={toggleAllExpanded}
-          className="text-indigo-500 hover:text-indigo-600 transition-colors"
+          className="text-accent-base hover:text-accent-dark transition-colors"
         >
           {allExpanded ? 'Collapse All' : 'Expand All'}
         </button>
@@ -725,7 +725,7 @@ const ExpandableChunk: React.FC<{
               <textarea
                 value={editText}
                 onChange={(e) => setEditText(e.target.value)}
-                className="w-full h-32 bg-zinc-900 text-gray-300 p-2 rounded-md border border-gray-700 focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500"
+                className="w-full h-32 bg-zinc-900 text-gray-300 p-2 rounded-md border border-gray-700 focus:border-accent-dark focus:ring-1 focus:ring-accent-dark"
               />
             ) : (
               <p className="pl-4 pr-2 py-2 text-gray-300 leading-relaxed">
@@ -801,7 +801,7 @@ const ExpandableDocumentEntities: React.FC<{
       <div className="flex justify-end items-center mb-4">
         <button
           onClick={toggleAllExpanded}
-          className="text-indigo-500 hover:text-indigo-600 transition-colors"
+          className="text-accent-base hover:text-accent-dark transition-colors"
         >
           {allExpanded ? 'Collapse All' : 'Expand All'}
         </button>
@@ -926,7 +926,7 @@ const ExpandableDocumentRelationships: React.FC<{
       <div className="flex justify-end items-center mb-4">
         <button
           onClick={toggleAllExpanded}
-          className="text-indigo-500 hover:text-indigo-600 transition-colors"
+          className="text-accent-base hover:text-accent-dark transition-colors"
         >
           {allExpanded ? 'Collapse All' : 'Expand All'}
         </button>

src/components/ContainerObjectCard.tsx

@@ -38,7 +38,7 @@ function ResourcePattern({
         />
       </div>
       <motion.div
-        className="absolute inset-0 rounded-2xl bg-gradient-to-r from-[rgb(7,7,7)] to-[rgb(16,255,3)] opacity-0 transition duration-300 group-hover:opacity-90 dark:from-indigo-600 dark:to-[#262b3c]"
+        className="absolute inset-0 rounded-2xl bg-gradient-to-r from-[rgb(7,7,7)] to-[rgb(16,255,3)] opacity-0 transition duration-300 group-hover:opacity-90 dark:from-accent-base dark:to-text-accent-dark"
         style={style}
       />
       <motion.div