diff --git a/src/components/Message/Message.tsx b/src/components/Message/Message.tsx index fdb1f67..ec71486 100644 --- a/src/components/Message/Message.tsx +++ b/src/components/Message/Message.tsx @@ -1,4 +1,8 @@ -import Typography from '@mui/material/Typography' +import { HTMLAttributes } from 'react' +import Box from '@mui/material/Box' +import Typography, { TypographyProps } from '@mui/material/Typography' +import Link, { LinkProps } from '@mui/material/Link' +import Markdown from 'react-markdown' import { Message as IMessage, isMessageReceived } from 'models/chat' @@ -7,6 +11,31 @@ export interface MessageProps { userId: string } +const typographyFactory = + (overrides: TypographyProps) => (args: HTMLAttributes) => { + return + } + +const linkFactory = + (overrides: LinkProps) => (args: HTMLAttributes) => { + return + } + +const componentMap = { + h1: typographyFactory({ variant: 'h1' }), + h2: typographyFactory({ variant: 'h2' }), + h3: typographyFactory({ variant: 'h3' }), + h4: typographyFactory({ variant: 'h4' }), + h5: typographyFactory({ variant: 'h5' }), + h6: typographyFactory({ variant: 'h6' }), + p: typographyFactory({ variant: 'body1' }), + a: linkFactory({ + variant: 'body1', + underline: 'always', + color: 'primary.light', + }), +} + export const Message = ({ message, userId }: MessageProps) => { let backgroundColor: string @@ -20,8 +49,7 @@ export const Message = ({ message, userId }: MessageProps) => { return (
- { wordBreak: 'break-all', }} > - {message.text} - + + {message.text} + +
) }