Restore TextStyle

src/components/Chat/MessageItem.tsx

@@ -34,6 +34,7 @@ import { Spacer } from '../../common/Spacer';
 import { ReactionPicker } from '../ReactionPicker';
 import KeyOffIcon from '@mui/icons-material/KeyOff';
 import EditIcon from '@mui/icons-material/Edit';
+import TextStyle from '@tiptap/extension-text-style';
 import level0Img from '../../assets/badges/level-0.png';
 import level1Img from '../../assets/badges/level-1.png';
 import level2Img from '../../assets/badges/level-2.png';
@@ -139,6 +140,7 @@ export const MessageItem = memo(
           Underline,
           Highlight,
           Mention,
+          TextStyle,
         ]);
       }
     }, [message?.editTimestamp]);
@@ -150,6 +152,7 @@ export const MessageItem = memo(
           Underline,
           Highlight,
           Mention,
+          TextStyle,
         ]);
       }
     }, [reply?.editTimestamp]);
@@ -670,6 +673,7 @@ export const ReplyPreview = ({ message, isEdit = false }) => {
               Underline,
               Highlight,
               Mention,
+              TextStyle,
             ])}
           />
         )}

src/components/Chat/TipTap.tsx

@@ -3,6 +3,7 @@ import { EditorProvider, useCurrentEditor } from '@tiptap/react';
 import StarterKit from '@tiptap/starter-kit';
 import { Color } from '@tiptap/extension-color';
 import ListItem from '@tiptap/extension-list-item';
+import TextStyle from '@tiptap/extension-text-style';
 import Placeholder from '@tiptap/extension-placeholder';
 import IconButton from '@mui/material/IconButton';
 import FormatBoldIcon from '@mui/icons-material/FormatBold';
@@ -354,7 +355,8 @@ const MenuBar = memo(
 );
 
 const extensions = [
-  Color.configure({ types: [ListItem.name] }),
+  Color.configure({ types: [TextStyle.name, ListItem.name] }),
+  TextStyle.configure({ types: [ListItem.name] }),
   StarterKit.configure({
     bulletList: {
       keepMarks: true,