diff --git a/src/components/Player/GridBuffer.jsx b/src/components/Player/GridBuffer.jsx index c6ca879..73dab74 100644 --- a/src/components/Player/GridBuffer.jsx +++ b/src/components/Player/GridBuffer.jsx @@ -44,22 +44,27 @@ export default function GridBuffer ({ inbox, currentWindow }) { const rawMessagesContent = rawMessages .map((x) => x.content) - .map(([x]) => x) - .map(({ text }) => text) - .map((text) => text.trim()) + .flat() + .map((message) => ({ + ...message, + text: message.text.trim(), + })) const isEmpty = rawMessagesContent - .map((text) => text.length) + .map(({text}) => text.length) .every((l) => l === 0) + const getGridStyle = ({style}) => { + if (['alert', 'normal'].includes(style)) return 'grid' + else return style || 'grid' + } + const messages = rawMessagesContent - .map((text) => - text.replace(' ', ' / ')) - .map((text) => ({ - style: 'grid', - text, + .map((message) => ({ + style: getGridStyle(message), + text: message.text.replace(' ', ' / '), })) setMessages(isEmpty ? [] : messages) diff --git a/src/components/Player/TextMessage.jsx b/src/components/Player/TextMessage.jsx index e97e6a7..e9e1e0b 100644 --- a/src/components/Player/TextMessage.jsx +++ b/src/components/Player/TextMessage.jsx @@ -7,7 +7,7 @@ export default function TextMessage ({ style, text }) { ) return ({ - grid: (
{text} 
), + grid: (text?.length > 0 ?
{text}
:
), input: (> {text}), subheader: ({text}), emphasized: ({text}), diff --git a/src/components/Player/player.css b/src/components/Player/player.css index 11eda07..6b1b8c2 100644 --- a/src/components/Player/player.css +++ b/src/components/Player/player.css @@ -84,8 +84,11 @@ } .ifplayer .output .textBuffer > br:first-child, +.ifplayer .output .gridBuffer > br:first-child, .ifplayer .output .textBuffer > br:last-child, -.ifplayer .output .textBuffer > br + br + br { +.ifplayer .output .gridBuffer > br:last-child, +.ifplayer .output .textBuffer > br + br + br, +.ifplayer .output .gridBuffer > br + br + br { display: none; }