make ordered and unordered lists

web/src/components/ui/typography/AppMarkdown/AppMarkdown.tsx

@@ -8,7 +8,9 @@ import {
   CustomListItem,
   CustomParagraph,
   CustomBlockquote,
-  CustomSpan
+  CustomSpan,
+  CustomOrderedList,
+  CustomUnorderedList
 } from './AppMarkdownCommon';
 import { useMemoizedFn } from '@/hooks';
 import styles from './AppMarkdown.module.css';
@@ -40,6 +42,8 @@ const AppMarkdownBase: React.FC<{
   const listItem = useMemoizedFn((props) => <CustomListItem {...props} {...commonProps} />);
   const blockquote = useMemoizedFn((props) => <CustomBlockquote {...props} {...commonProps} />);
   const span = useMemoizedFn((props) => <CustomSpan {...props} {...commonProps} />);
+  const ol = useMemoizedFn((props) => <CustomOrderedList {...props} {...commonProps} />);
+  const ul = useMemoizedFn((props) => <CustomUnorderedList {...props} {...commonProps} />);
   const li = useMemoizedFn((props) => <CustomListItem {...props} {...commonProps} />);
   const p = useMemoizedFn((props) => <CustomParagraph {...props} {...commonProps} />);
   const h1 = useMemoizedFn((props) => <CustomHeading level={1} {...props} {...commonProps} />);
@@ -65,7 +69,9 @@ const AppMarkdownBase: React.FC<{
       h4,
       h5,
       h6,
-      li
+      li,
+      ol,
+      ul
     };
   }, []);
 

web/src/components/ui/typography/AppMarkdown/AppMarkdownCommon.tsx

@@ -114,6 +114,42 @@ export const CustomList: React.FC<
   );
 };
 
+export const CustomOrderedList: React.FC<
+  {
+    children?: React.ReactNode;
+    markdown: string;
+    showLoader: boolean;
+  } & ExtraPropsExtra
+> = ({ children, markdown, showLoader, ...rest }) => {
+  return (
+    <ol
+      className={cn(
+        'leading-1.3 list-decimal space-y-1',
+        showLoader && 'animate-in fade-in duration-700'
+      )}>
+      {children}
+    </ol>
+  );
+};
+
+export const CustomUnorderedList: React.FC<
+  {
+    children?: React.ReactNode;
+    markdown: string;
+    showLoader: boolean;
+  } & ExtraPropsExtra
+> = ({ children, markdown, showLoader, ...rest }) => {
+  return (
+    <ul
+      className={cn(
+        'leading-1.3 mt-1 list-inside list-disc space-y-1',
+        showLoader && 'animate-in fade-in duration-700'
+      )}>
+      {children}
+    </ul>
+  );
+};
+
 export const CustomListItem: React.FC<
   {
     children?: React.ReactNode;
@@ -124,7 +160,7 @@ export const CustomListItem: React.FC<
   return (
     <li
       className={cn(
-        'leading-1.3 list-inside list-disc',
+        'leading-1.3 list-inside space-y-1',
         showLoader && 'animate-in fade-in duration-700'
       )}>
       {children}

web/src/controllers/ReasoningController/ReasoningMessages/ReasoningMessage_Text/ReasoningMessage_Text.tsx

@@ -11,6 +11,8 @@ export const ReasoningMessage_Text: React.FC<ReasoningMessageProps> = React.memo
       (x) => (x?.reasoning_messages[reasoningMessageId] as BusterChatMessageReasoning_text)?.message
     )!;
 
+    console.log('message', message);
+
     return (
       <AppMarkdown
         markdown={message}