From af59f29944a5a7a086755af81229a0943b4c3bf1 Mon Sep 17 00:00:00 2001
From: Nate Kelley <nate@buster.so>
Date: Mon, 10 Mar 2025 12:49:45 -0600
Subject: [PATCH] update some UI animations

---
 .../new-user/_NewUserController.tsx                 |  1 -
 web/src/app/app/layout.tsx                          |  1 +
 .../StreamingMessageCode/StreamingMessageCode.tsx   |  1 +
 .../ui/typography/AppCodeBlock/AppCodeBlock.tsx     | 13 ++-----------
 .../ui/typography/AppMarkdown/AppMarkdownCommon.tsx |  7 +------
 .../NewChatProvider/chatStreamMessageHelper.ts      |  4 ++--
 .../ReasoningMessage_Text/ReasoningMessage_Text.tsx |  2 +-
 .../ChatContainer/ChatContent/ChatUserMessage.tsx   |  4 ++--
 8 files changed, 10 insertions(+), 23 deletions(-)

diff --git a/web/src/app/app/(primary_layout)/new-user/_NewUserController.tsx b/web/src/app/app/(primary_layout)/new-user/_NewUserController.tsx
index 01ecf2e59..a236c8b00 100644
--- a/web/src/app/app/(primary_layout)/new-user/_NewUserController.tsx
+++ b/web/src/app/app/(primary_layout)/new-user/_NewUserController.tsx
@@ -93,7 +93,6 @@ export const NewUserController = () => {
             value={company || ''}
             onChange={(e) => setCompany(e.target.value)}
             onPressEnter={handleSubmit}
-            defaultValue={userOrganizations?.name || ''}
           />
           <Button
             variant="black"
diff --git a/web/src/app/app/layout.tsx b/web/src/app/app/layout.tsx
index f7df92e04..cdf2367a3 100644
--- a/web/src/app/app/layout.tsx
+++ b/web/src/app/app/layout.tsx
@@ -7,6 +7,7 @@ import { ClientRedirect } from '../../components/ui/layouts/ClientRedirect';
 import { LayoutClient } from './layoutClient';
 import { prefetchGetMyUserInfo } from '@/api/buster_rest';
 import { dehydrate, HydrationBoundary } from '@tanstack/react-query';
+import path from 'path';
 
 export const dynamic = 'force-dynamic';
 
diff --git a/web/src/components/ui/streaming/StreamingMessageCode/StreamingMessageCode.tsx b/web/src/components/ui/streaming/StreamingMessageCode/StreamingMessageCode.tsx
index 7d7984c94..3f8e98f88 100644
--- a/web/src/components/ui/streaming/StreamingMessageCode/StreamingMessageCode.tsx
+++ b/web/src/components/ui/streaming/StreamingMessageCode/StreamingMessageCode.tsx
@@ -47,6 +47,7 @@ export const StreamingMessageCode: React.FC<
   status,
   isCompletedStream,
   file,
+  id,
   file_name,
   version_number,
   file_type,
diff --git a/web/src/components/ui/typography/AppCodeBlock/AppCodeBlock.tsx b/web/src/components/ui/typography/AppCodeBlock/AppCodeBlock.tsx
index 5ab240a4a..297ae9a12 100644
--- a/web/src/components/ui/typography/AppCodeBlock/AppCodeBlock.tsx
+++ b/web/src/components/ui/typography/AppCodeBlock/AppCodeBlock.tsx
@@ -12,7 +12,7 @@ export const AppCodeBlock: React.FC<{
   wrapperClassName?: string;
   children?: React.ReactNode;
   style?: React.CSSProperties;
-  showLoader?: boolean;
+
   showCopyButton?: boolean;
   title?: string;
   buttons?: React.ReactNode;
@@ -22,13 +22,10 @@ export const AppCodeBlock: React.FC<{
     className = '',
     wrapperClassName = '',
     language,
-    showLoader,
     showCopyButton = true,
     ...rest
   } = props;
-  const [style, setStyle] = useState<{
-    [key: string]: React.CSSProperties;
-  }>(lightTheme);
+  const style = lightTheme;
   const code = String(children).replace(/\n$/, '');
 
   //this is a huge assumption, but if there is no language, it is probably an inline code block
@@ -57,12 +54,6 @@ export const AppCodeBlock: React.FC<{
               {children}
             </code>
           )}
-
-          {showLoader && (
-            <div className="-mt-2 pl-3">
-              <PulseLoader />
-            </div>
-          )}
         </div>
       </div>
     </AppCodeBlockWrapper>
diff --git a/web/src/components/ui/typography/AppMarkdown/AppMarkdownCommon.tsx b/web/src/components/ui/typography/AppMarkdown/AppMarkdownCommon.tsx
index 337a3db05..a01b5c5ed 100644
--- a/web/src/components/ui/typography/AppMarkdown/AppMarkdownCommon.tsx
+++ b/web/src/components/ui/typography/AppMarkdown/AppMarkdownCommon.tsx
@@ -18,14 +18,9 @@ export const CustomCode: React.FC<
 > = ({ children, markdown, showLoader, className, node, ...rest }) => {
   const matchRegex = /language-(\w+)/.exec(className || '');
   const language = matchRegex ? matchRegex[1] : undefined;
-  const showStreamingLoader = showLoader && node?.position?.end.line === rest.numberOfLineMarkdown;
 
   return (
-    <AppCodeBlock
-      wrapperClassName="my-2.5"
-      className="leading-1.3"
-      language={language}
-      showLoader={showStreamingLoader}>
+    <AppCodeBlock wrapperClassName="my-2.5" className="leading-1.3" language={language}>
       {children}
     </AppCodeBlock>
   );
diff --git a/web/src/context/Chats/NewChatProvider/chatStreamMessageHelper.ts b/web/src/context/Chats/NewChatProvider/chatStreamMessageHelper.ts
index da01005aa..13540dead 100644
--- a/web/src/context/Chats/NewChatProvider/chatStreamMessageHelper.ts
+++ b/web/src/context/Chats/NewChatProvider/chatStreamMessageHelper.ts
@@ -179,14 +179,14 @@ export const updateReasoningMessage = (
               }
 
               const existingFile = existingReasoningMessageFiles?.files[fileId];
-              const newFile = reasoning.files[fileId];
+              const newFile: BusterChatMessageReasoning_file | undefined = reasoning.files[fileId];
 
               draft.files[fileId] = create(draft.files[fileId], (fileDraft) => {
                 // Merge existing and new file data
                 Object.assign(fileDraft, existingFile || {}, newFile);
 
                 // Handle file text specifically
-                if (newFile.file) {
+                if (newFile?.file) {
                   fileDraft.file = create(fileDraft.file, (fileContentDraft) => {
                     Object.assign(fileContentDraft, existingFile?.file || {});
                     fileContentDraft.text = newFile.file.text_chunk
diff --git a/web/src/controllers/ReasoningController/ReasoningMessages/ReasoningMessage_Text/ReasoningMessage_Text.tsx b/web/src/controllers/ReasoningController/ReasoningMessages/ReasoningMessage_Text/ReasoningMessage_Text.tsx
index 9eb8a6132..9a55599c7 100644
--- a/web/src/controllers/ReasoningController/ReasoningMessages/ReasoningMessage_Text/ReasoningMessage_Text.tsx
+++ b/web/src/controllers/ReasoningController/ReasoningMessages/ReasoningMessage_Text/ReasoningMessage_Text.tsx
@@ -11,7 +11,7 @@ export const ReasoningMessage_Text: React.FC<ReasoningMessageProps> = React.memo
       (x) => (x?.reasoning_messages[reasoningMessageId] as BusterChatMessageReasoning_text)?.message
     )!;
 
-    return <AppMarkdown markdown={message} showLoader={!isCompletedStream} />;
+    return <AppMarkdown markdown={message} showLoader={!isCompletedStream} stripFormatting />;
   }
 );
 
diff --git a/web/src/layouts/ChatLayout/ChatContainer/ChatContent/ChatUserMessage.tsx b/web/src/layouts/ChatLayout/ChatContainer/ChatContent/ChatUserMessage.tsx
index 81712a490..6e6b330d8 100644
--- a/web/src/layouts/ChatLayout/ChatContainer/ChatContent/ChatUserMessage.tsx
+++ b/web/src/layouts/ChatLayout/ChatContainer/ChatContent/ChatUserMessage.tsx
@@ -1,6 +1,6 @@
 import type { BusterChatMessageRequest } from '@/api/asset_interfaces';
 import React from 'react';
-import { Text } from '@/components/ui/typography';
+import { Paragraph } from '@/components/ui/typography';
 import { MessageContainer } from './MessageContainer';
 
 export const ChatUserMessage: React.FC<{ requestMessage: BusterChatMessageRequest }> = React.memo(
@@ -11,7 +11,7 @@ export const ChatUserMessage: React.FC<{ requestMessage: BusterChatMessageReques
 
     return (
       <MessageContainer senderName={sender_name} senderId={sender_id} senderAvatar={sender_avatar}>
-        <Text>{request}</Text>
+        <Paragraph className="text-sm">{request}</Paragraph>
       </MessageContainer>
     );
   }