From b5681a67f77d3377a5468ee6eabf8ad9e05c53c0 Mon Sep 17 00:00:00 2001
From: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Thu, 24 Jul 2025 21:15:17 +0000
Subject: [PATCH] Fix BUS-1522: Replace AnimatedMarkdown with
 AppMarkdownStreaming and default stripFormatting to true

- Replace AnimatedMarkdown with AppMarkdownStreaming in AssumptionSummary and AssumptionCard components
- Set isStreamFinished=true and stripFormatting=true for both instances
- Update AppMarkdownStreaming component to default stripFormatting to true
- Update AnimatedMarkdown component to default stripFormatting to true for consistency
- Update useMarkdownComponents to default stripFormatting to true
- Remove unused AnimatedMarkdown import from MessageAssumptions.tsx

Co-Authored-By: nate@buster.so <nate@buster.so>
---
 .../features/sheets/MessageAssumptions.tsx    | 23 +++++++++++--------
 .../AppMarkdownStreaming.tsx                  |  4 ++--
 .../AnimatedMarkdown/AnimatedMarkdown.tsx     |  2 +-
 .../useMarkdownComponents.tsx                 |  2 +-
 4 files changed, 17 insertions(+), 14 deletions(-)

diff --git a/apps/web/src/components/features/sheets/MessageAssumptions.tsx b/apps/web/src/components/features/sheets/MessageAssumptions.tsx
index 05991baf5..89d94ae52 100644
--- a/apps/web/src/components/features/sheets/MessageAssumptions.tsx
+++ b/apps/web/src/components/features/sheets/MessageAssumptions.tsx
@@ -13,8 +13,7 @@ import {
 } from '@/lib/messages/confidence-translations';
 import { CircleCheck, OctagonWarning } from '@/components/ui/icons';
 import { Pill } from '@/components/ui/pills/Pill';
-import { AppMarkdownStreaming } from '@/components/ui/streaming/AppMarkdownStreaming';
-import { AnimatedMarkdown } from '../../ui/typography/AnimatedMarkdown';
+import AppMarkdownStreaming from '@/components/ui/streaming/AppMarkdownStreaming/AppMarkdownStreaming';
 
 type MessageAssumptionsProps = Pick<
   PostProcessingMessage,
@@ -151,13 +150,12 @@ const AssumptionSummary = ({
           {summary_title}
         </Title>
       </div>
-      <div className="mt-2">
-        <AnimatedMarkdown
-          content={summary_message}
-          className="text-text-secondary"
-          animation="none"
-        />
-      </div>
+      <AppMarkdownStreaming
+        content={summary_message}
+        isStreamFinished={true}
+        stripFormatting={true}
+        className="mt-2 text-text-secondary"
+      />
     </div>
   );
 };
@@ -273,7 +271,12 @@ const AssumptionCard = ({
         <Title as={'h4'} className="text-base">
           {title}
         </Title>
-        <AnimatedMarkdown content={explanation} animation="none" className="text-text-secondary" />
+        <AppMarkdownStreaming
+          content={explanation}
+          isStreamFinished={true}
+          stripFormatting={true}
+          className="text-text-secondary text-sm"
+        />
       </div>
 
       <div className="flex items-center justify-between border-t px-3.5 py-2">
diff --git a/apps/web/src/components/ui/streaming/AppMarkdownStreaming/AppMarkdownStreaming.tsx b/apps/web/src/components/ui/streaming/AppMarkdownStreaming/AppMarkdownStreaming.tsx
index ef72d9ab4..8f4e3e369 100644
--- a/apps/web/src/components/ui/streaming/AppMarkdownStreaming/AppMarkdownStreaming.tsx
+++ b/apps/web/src/components/ui/streaming/AppMarkdownStreaming/AppMarkdownStreaming.tsx
@@ -16,7 +16,7 @@ const AppMarkdownStreaming = ({
   animationDuration = 300,
   animationTimingFunction = 'linear',
   className,
-  stripFormatting = false
+  stripFormatting = true
 }: {
   content: string;
   isStreamFinished: boolean;
@@ -66,7 +66,7 @@ const AppMarkdownStreamingContext = createContext<{
   animationTimingFunction: 'ease-in-out',
   isStreamFinished: false,
   isThrottleStreamingFinished: false,
-  stripFormatting: false
+  stripFormatting: true
 });
 
 export const useAppMarkdownStreaming = () => {
diff --git a/apps/web/src/components/ui/typography/AnimatedMarkdown/AnimatedMarkdown.tsx b/apps/web/src/components/ui/typography/AnimatedMarkdown/AnimatedMarkdown.tsx
index 74e33af80..ca1f8fc3d 100644
--- a/apps/web/src/components/ui/typography/AnimatedMarkdown/AnimatedMarkdown.tsx
+++ b/apps/web/src/components/ui/typography/AnimatedMarkdown/AnimatedMarkdown.tsx
@@ -26,7 +26,7 @@ const AnimatedMarkdown: React.FC<AnimatedMarkdownProps> = ({
   animationDuration = 300,
   animationTimingFunction = 'ease-in-out',
   isStreamFinished = true,
-  stripFormatting = false,
+  stripFormatting = true,
   className
 }) => {
   const { components } = useMarkdownComponents({
diff --git a/apps/web/src/components/ui/typography/AnimatedMarkdown/useMarkdownComponents.tsx b/apps/web/src/components/ui/typography/AnimatedMarkdown/useMarkdownComponents.tsx
index fc716ae8d..02ba641fd 100644
--- a/apps/web/src/components/ui/typography/AnimatedMarkdown/useMarkdownComponents.tsx
+++ b/apps/web/src/components/ui/typography/AnimatedMarkdown/useMarkdownComponents.tsx
@@ -37,7 +37,7 @@ export const useMarkdownComponents = ({
   animationDuration = 700,
   animationTimingFunction = 'ease-in-out',
   isStreamFinished = true,
-  stripFormatting = false
+  stripFormatting = true
 }: UseMarkdownComponentsProps) => {
   const commonProps = useMemo(() => {
     return {