From bafb95d920eb8d7210e4b4e1be56a2b9ec8d2b74 Mon Sep 17 00:00:00 2001
From: pablodanswer <pablo@danswer.ai>
Date: Sun, 3 Nov 2024 15:57:11 -0800
Subject: [PATCH] Misc color clean up (#3026)

* misc color clean up

* additional nits

* nit

* nit

* additional minor nits

* ensure tailwind config evaluates properly + update textarea -> input

* ensure tool call renders

* formatting
---
 web/components.json                           |  2 +-
 web/package-lock.json                         | 17 +--------------
 .../admin/bot/SlackBotConfigCreationForm.tsx  |  1 +
 .../llm/ConfiguredLLMProviderDisplay.tsx      |  2 +-
 .../[ccPairId]/IndexingAttemptsTable.tsx      |  1 -
 .../pages/DynamicConnectorCreationForm.tsx    |  1 -
 web/src/app/admin/documents/sets/page.tsx     |  8 +++++--
 .../status/CCPairIndexingStatusTable.tsx      | 14 ++++++-------
 .../assistants/gallery/AssistantsGallery.tsx  |  6 ++++--
 .../app/assistants/mine/AssistantsList.tsx    |  6 ++++--
 web/src/app/chat/ChatPage.tsx                 |  2 +-
 web/src/app/chat/RegenerateOption.tsx         |  2 +-
 web/src/components/admin/connectors/Field.tsx | 21 ++++++++++++-------
 web/src/components/ui/button.tsx              |  2 +-
 web/src/components/ui/select.tsx              | 10 +++++++--
 web/src/lib/connectors/connectors.tsx         |  2 --
 web/tailwind.config.js                        | 17 +++++++--------
 17 files changed, 56 insertions(+), 58 deletions(-)

diff --git a/web/components.json b/web/components.json
index bfcba8e4a85..cbde1f415b0 100644
--- a/web/components.json
+++ b/web/components.json
@@ -17,4 +17,4 @@
     "lib": "@/lib",
     "hooks": "@/hooks"
   }
-}
\ No newline at end of file
+}
diff --git a/web/package-lock.json b/web/package-lock.json
index 2c72891b7cb..2b02ef81659 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -14851,21 +14851,6 @@
         "type": "github",
         "url": "https://github.com/sponsors/wooorm"
       }
-    },
-    "node_modules/@next/swc-win32-ia32-msvc": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.3.tgz",
-      "integrity": "sha512-vga40n1q6aYb0CLrM+eEmisfKCR45ixQYXuBXxOOmmoV8sYST9k7E3US32FsY+CkkF7NtzdcebiFT4CHuMSyZw==",
-      "cpu": [
-        "ia32"
-      ],
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">= 10"
-      }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/web/src/app/admin/bot/SlackBotConfigCreationForm.tsx b/web/src/app/admin/bot/SlackBotConfigCreationForm.tsx
index cf4e018dc66..e7113717949 100644
--- a/web/src/app/admin/bot/SlackBotConfigCreationForm.tsx
+++ b/web/src/app/admin/bot/SlackBotConfigCreationForm.tsx
@@ -370,6 +370,7 @@ export const SlackBotCreationForm = ({
                 <div className="flex">
                   <Button
                     type="submit"
+                    variant="submit"
                     disabled={isSubmitting}
                     className="mx-auto w-64"
                   >
diff --git a/web/src/app/admin/configuration/llm/ConfiguredLLMProviderDisplay.tsx b/web/src/app/admin/configuration/llm/ConfiguredLLMProviderDisplay.tsx
index ea6149e08ad..5921a9a2ada 100644
--- a/web/src/app/admin/configuration/llm/ConfiguredLLMProviderDisplay.tsx
+++ b/web/src/app/admin/configuration/llm/ConfiguredLLMProviderDisplay.tsx
@@ -122,7 +122,7 @@ function LLMProviderDisplay({
 
         <div className="ml-auto">
           <Button
-            variant={existingLlmProvider ? "outline" : "next"}
+            variant={existingLlmProvider ? "success-reverse" : "navigate"}
             onClick={() => setFormIsVisible(true)}
           >
             {existingLlmProvider ? "Edit" : "Set up"}
diff --git a/web/src/app/admin/connector/[ccPairId]/IndexingAttemptsTable.tsx b/web/src/app/admin/connector/[ccPairId]/IndexingAttemptsTable.tsx
index 4494e782ded..ac39f3c93d4 100644
--- a/web/src/app/admin/connector/[ccPairId]/IndexingAttemptsTable.tsx
+++ b/web/src/app/admin/connector/[ccPairId]/IndexingAttemptsTable.tsx
@@ -206,7 +206,6 @@ export function IndexingAttemptsTable({ ccPair }: { ccPair: CCPairFullInfo }) {
       <Callout
         className="mt-4"
         title="No indexing attempts scheduled yet"
-        icon={"info"}
         type="notice"
       >
         Index attempts are scheduled in the background, and may take some time
diff --git a/web/src/app/admin/connectors/[connector]/pages/DynamicConnectorCreationForm.tsx b/web/src/app/admin/connectors/[connector]/pages/DynamicConnectorCreationForm.tsx
index a6ac93441e6..dc7f75e0632 100644
--- a/web/src/app/admin/connectors/[connector]/pages/DynamicConnectorCreationForm.tsx
+++ b/web/src/app/admin/connectors/[connector]/pages/DynamicConnectorCreationForm.tsx
@@ -104,7 +104,6 @@ const RenderField: FC<RenderFieldProps> = ({
           type={field.type}
           label={label}
           name={field.name}
-          isTextArea={true}
         />
       )}
     </>
diff --git a/web/src/app/admin/documents/sets/page.tsx b/web/src/app/admin/documents/sets/page.tsx
index 9db9c15ee7b..2d5296d33f2 100644
--- a/web/src/app/admin/documents/sets/page.tsx
+++ b/web/src/app/admin/documents/sets/page.tsx
@@ -207,13 +207,17 @@ const DocumentSetTable = ({
                   </TableCell>
                   <TableCell>
                     {documentSet.is_public ? (
-                      <Badge size="md" variant="success" icon={FiUnlock}>
+                      <Badge
+                        size="md"
+                        variant={isEditable ? "success" : "default"}
+                        icon={FiUnlock}
+                      >
                         Public
                       </Badge>
                     ) : (
                       <Badge
                         size="md"
-                        variant={isEditable ? "purple" : "outline"}
+                        variant={isEditable ? "in_progress" : "outline"}
                         icon={FiLock}
                       >
                         Private
diff --git a/web/src/app/admin/indexing/status/CCPairIndexingStatusTable.tsx b/web/src/app/admin/indexing/status/CCPairIndexingStatusTable.tsx
index 7ade9b0cfd7..833f1de674e 100644
--- a/web/src/app/admin/indexing/status/CCPairIndexingStatusTable.tsx
+++ b/web/src/app/admin/indexing/status/CCPairIndexingStatusTable.tsx
@@ -168,7 +168,7 @@ function ConnectorRow({
         );
       case "not_started":
         return (
-          <Badge circle variant="secondary">
+          <Badge circle variant="purple">
             Scheduled
           </Badge>
         );
@@ -183,7 +183,7 @@ function ConnectorRow({
 
   return (
     <TableRow
-      className={`border hover:bg-hover-light ${
+      className={`hover:bg-hover-light ${
         invisible ? "invisible !h-0 !-mb-10" : "!border !border-border"
       }  w-full cursor-pointer relative `}
       onClick={() => {
@@ -202,21 +202,19 @@ function ConnectorRow({
       {isPaidEnterpriseFeaturesEnabled && (
         <TableCell>
           {ccPairsIndexingStatus.access_type === "public" ? (
-            <Badge variant="success" icon={FiUnlock}>
+            <Badge variant={isEditable ? "success" : "default"} icon={FiUnlock}>
               Public
             </Badge>
           ) : ccPairsIndexingStatus.access_type === "sync" ? (
             <Badge
-              variant="outline"
-              color={isEditable ? "orange" : "gray"}
+              variant={isEditable ? "orange" : "default"}
               icon={FiRefreshCw}
             >
               Sync
             </Badge>
           ) : (
             <Badge
-              size="md"
-              variant={isEditable ? "outline" : "default"}
+              variant={isEditable ? "in_progress" : "default"}
               icon={FiLock}
             >
               Private
@@ -419,7 +417,7 @@ export function CCPairIndexingStatusTable({
           placeholder="Search connectors..."
           value={searchTerm}
           onChange={(e) => setSearchTerm(e.target.value)}
-          className="ml-1 w-96 h-9 flex-none rounded-md border border-border bg-background-50 px-3 py-1 text-sm shadow-sm transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
+          className="ml-1 w-96 h-9 flex-none rounded-md bg-background-50 px-3 py-1 text-sm shadow-sm transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
         />
 
         <Button className="h-9" onClick={() => toggleSources()}>
diff --git a/web/src/app/assistants/gallery/AssistantsGallery.tsx b/web/src/app/assistants/gallery/AssistantsGallery.tsx
index e2d2e17004d..cf5b81a9a28 100644
--- a/web/src/app/assistants/gallery/AssistantsGallery.tsx
+++ b/web/src/app/assistants/gallery/AssistantsGallery.tsx
@@ -179,7 +179,8 @@ export function AssistantsGallery() {
         <div className="grid grid-cols-2 gap-4 mt-4 mb-6">
           <Button
             onClick={() => router.push("/assistants/new")}
-            className="w-full py-3 text-lg rounded-full bg-background-800 text-white hover:bg-background-800 transition duration-300 ease-in-out"
+            variant="default"
+            className="p-6 text-base"
             icon={FiPlus}
           >
             Create New Assistant
@@ -187,7 +188,8 @@ export function AssistantsGallery() {
 
           <Button
             onClick={() => router.push("/assistants/mine")}
-            className="w-full hover:border-border-strong py-3 text-lg rounded-full bg-white border border-border shadow text-text-700 hover:bg-background-50 transition duration-300 ease-in-out"
+            variant="outline"
+            className="text-base py-6"
             icon={FiList}
           >
             Your Assistants
diff --git a/web/src/app/assistants/mine/AssistantsList.tsx b/web/src/app/assistants/mine/AssistantsList.tsx
index 0af7a98fd20..0290973067e 100644
--- a/web/src/app/assistants/mine/AssistantsList.tsx
+++ b/web/src/app/assistants/mine/AssistantsList.tsx
@@ -394,8 +394,9 @@ export function AssistantsList() {
 
         <div className="grid grid-cols-2 gap-4 mt-4 mb-8">
           <Button
+            variant="default"
+            className="p-6 text-base"
             onClick={() => router.push("/assistants/new")}
-            className="w-full py-3 text-lg rounded-full bg-background-800 text-white hover:bg-background-800 transition duration-300 ease-in-out"
             icon={FiPlus}
           >
             Create New Assistant
@@ -403,7 +404,8 @@ export function AssistantsList() {
 
           <Button
             onClick={() => router.push("/assistants/gallery")}
-            className="w-full hover:border-border-strong py-3 text-lg rounded-full bg-white border !border-border shadow text-text-700 hover:bg-background-50 transition duration-300 ease-in-out"
+            variant="outline"
+            className="text-base py-6"
             icon={FiList}
           >
             Assistant Gallery
diff --git a/web/src/app/chat/ChatPage.tsx b/web/src/app/chat/ChatPage.tsx
index 43ce519a13b..53df687f2ff 100644
--- a/web/src/app/chat/ChatPage.tsx
+++ b/web/src/app/chat/ChatPage.tsx
@@ -1355,7 +1355,7 @@ export function ChatPage({
                   finalMessage?.context_docs?.top_documents || documents,
                 citations: finalMessage?.citations || {},
                 files: finalMessage?.files || aiMessageImages || [],
-                toolCall: finalMessage?.tool_call || null,
+                toolCall: finalMessage?.tool_call || toolCall,
                 parentMessageId: regenerationRequest
                   ? regenerationRequest?.parentMessage?.messageId!
                   : initialFetchDetails.user_message_id,
diff --git a/web/src/app/chat/RegenerateOption.tsx b/web/src/app/chat/RegenerateOption.tsx
index 606f5ed589d..dd92bee0dbc 100644
--- a/web/src/app/chat/RegenerateOption.tsx
+++ b/web/src/app/chat/RegenerateOption.tsx
@@ -97,7 +97,7 @@ export function RegenerateDropdown({
           ) : (
             <Hoverable
               size={16}
-              icon={StarFeedback as IconType}
+              icon={FiRefreshCw as IconType}
               hoverText={getDisplayNameForModel(alternate)}
             />
           )}
diff --git a/web/src/components/admin/connectors/Field.tsx b/web/src/components/admin/connectors/Field.tsx
index 601d4d5ffdd..56431954552 100644
--- a/web/src/components/admin/connectors/Field.tsx
+++ b/web/src/components/admin/connectors/Field.tsx
@@ -594,7 +594,6 @@ export function SelectorFormField({
   label,
   options,
   subtext,
-  includeDefault = false,
   side = "bottom",
   maxHeight,
   onSelect,
@@ -615,26 +614,34 @@ export function SelectorFormField({
       {subtext && <SubLabel>{subtext}</SubLabel>}
       <div className="mt-2">
         <Select
-          value={field.value}
+          value={field.value || defaultValue}
           onValueChange={
             onSelect || ((selected) => setFieldValue(name, selected))
           }
           defaultValue={defaultValue}
         >
           <SelectTrigger>
-            <SelectValue
-              placeholder={includeDefault ? "Select..." : undefined}
-            />
+            <SelectValue placeholder="Select...">
+              {field.value || defaultValue || ""}
+            </SelectValue>
           </SelectTrigger>
           <SelectContent
             side={side}
             className={maxHeight ? `max-h-[${maxHeight}]` : undefined}
           >
-            {includeDefault && (
+            {options.length == 0 && (
               <SelectItem value="default">Select...</SelectItem>
             )}
+            {defaultValue && (
+              <SelectItem value={defaultValue}>{defaultValue}</SelectItem>
+            )}
             {options.map((option) => (
-              <SelectItem key={option.value} value={String(option.value)}>
+              <SelectItem
+                icon={option.icon}
+                key={option.value}
+                value={String(option.value)}
+                selected={field.value === option.value}
+              >
                 {option.name}
               </SelectItem>
             ))}
diff --git a/web/src/components/ui/button.tsx b/web/src/components/ui/button.tsx
index 91cffa3a926..bf0b3c448b3 100644
--- a/web/src/components/ui/button.tsx
+++ b/web/src/components/ui/button.tsx
@@ -12,7 +12,7 @@ const buttonVariants = cva(
         success:
           "bg-green-100 text-green-600 hover:bg-green-500/90 dark:bg-blue-500 dark:text-neutral-50 dark:hover:bg-green-900/90",
         "success-reverse":
-          "bg-green-500 text-green-100 hover:bg-green-600/90 dark:bg-neutral-50 dark:text-blue-500 dark:hover:bg-green-100/90",
+          "bg-green-500 text-white hover:bg-green-600/90 dark:bg-neutral-50 dark:text-blue-500 dark:hover:bg-green-100/90",
 
         default:
           "bg-neutral-900 border-border text-neutral-50 hover:bg-neutral-900/90 dark:bg-neutral-50 dark:text-neutral-900 dark:hover:bg-neutral-50/90",
diff --git a/web/src/components/ui/select.tsx b/web/src/components/ui/select.tsx
index 8bbcc971748..7f6941201c9 100644
--- a/web/src/components/ui/select.tsx
+++ b/web/src/components/ui/select.tsx
@@ -115,8 +115,9 @@ const SelectItem = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Item>,
   React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item> & {
     icon?: React.ElementType;
+    selected?: boolean;
   }
->(({ className, children, icon: Icon, ...props }, ref) => (
+>(({ className, children, icon: Icon, selected, ...props }, ref) => (
   <SelectPrimitive.Item
     ref={ref}
     className={cn(
@@ -127,9 +128,14 @@ const SelectItem = React.forwardRef<
   >
     <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
       <SelectPrimitive.ItemIndicator>
-        {Icon ? <Icon className="h-4 w-4" /> : <Check className="h-4 w-4" />}
+        <Check className="h-4 w-4" />
       </SelectPrimitive.ItemIndicator>
     </span>
+    {!selected && Icon && (
+      <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+        <Icon className="h-4 w-4" />
+      </span>
+    )}
 
     <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
   </SelectPrimitive.Item>
diff --git a/web/src/lib/connectors/connectors.tsx b/web/src/lib/connectors/connectors.tsx
index 1ec265049d0..3c4b015906a 100644
--- a/web/src/lib/connectors/connectors.tsx
+++ b/web/src/lib/connectors/connectors.tsx
@@ -950,7 +950,6 @@ For example, specifying .*-support.* as a "channel" will cause the connector to
     values: [],
     advanced_values: [],
   },
-  
 };
 export function createConnectorInitialValues(
   connector: ConfigurableSources
@@ -1210,7 +1209,6 @@ export interface AsanaConfig {
 
 export interface FreshdeskConfig {}
 
-
 export interface MediaWikiConfig extends MediaWikiBaseConfig {
   hostname: string;
 }
diff --git a/web/tailwind.config.js b/web/tailwind.config.js
index 4917e66c6ff..8d5c2f72704 100644
--- a/web/tailwind.config.js
+++ b/web/tailwind.config.js
@@ -3,16 +3,13 @@ var merge = require("lodash/merge");
 // Use relative paths for imports
 const baseThemes = require("./tailwind-themes/tailwind.config.js");
 
-let customThemes = null;
-try {
-  if (process.env.NEXT_PUBLIC_THEME) {
-    customThemes = require(
-      `./tailwind-themes/custom/${process.env.NEXT_PUBLIC_THEME}/tailwind.config.js`
-    );
-  }
-} catch (error) {
-  console.warn(`Custom theme not found for: ${process.env.NEXT_PUBLIC_THEME}`);
-}
+const customThemes = process.env.NEXT_PUBLIC_THEME
+  ? require(
+      process.env.NEXT_PUBLIC_THEME
+        ? `./tailwind-themes/custom/${process.env.NEXT_PUBLIC_THEME}/tailwind.config.js`
+        : "./tailwind-themes/custom/default/tailwind.config.js"
+    )
+  : null;
 
 /** @type {import('tailwindcss').Config} */
 module.exports = customThemes ? merge(baseThemes, customThemes) : baseThemes;