use ReactMarkdown plugins

client/src/components/Message.tsx

@@ -1,12 +1,11 @@
 import * as React from 'react';
-import ReactMarkdown from 'react-markdown';
-import { MathJax } from "better-react-mathjax";
 import '@fontsource/roboto/300.css';
 import '@fontsource/roboto/400.css';
 import '@fontsource/roboto/500.css';
 import '@fontsource/roboto/700.css';
 
 import { Button, Dialog, DialogContent, DialogContentText, DialogActions } from '@mui/material';
+import Markdown from './Markdown';
 
 function Message({ isOpen, content, close }) {
 
@@ -14,7 +13,7 @@ function Message({ isOpen, content, close }) {
     <Dialog open={isOpen} onClose={close}>
       <DialogContent>
         <DialogContentText id="alert-dialog-description">
-          <MathJax><ReactMarkdown>{content}</ReactMarkdown></MathJax>
+          <Markdown>{content}</Markdown>
         </DialogContentText>
       </DialogContent>
       <DialogActions>
@@ -26,4 +25,4 @@ function Message({ isOpen, content, close }) {
   )
 }
 
-export default Message
+export default Message