Skip to content

Commit

Permalink
refactor: Refactor agent message tile rendering logic
Browse files Browse the repository at this point in the history
- Updated the regular expression pattern to include matching fenced code blocks in addition to headers.
- Set the `dotAll` parameter to `true` to match across multiple lines in the regular expression.
- Wrapped the message container with a `SingleChildScrollView` widget to enable scrolling when the message content exceeds the available space.
- Implemented logic to conditionally render the message as markdown or selectable text based on the value of `hasMarkdown`.
- Modified the `MarkdownStyleSheet` to customize the appearance of blockquotes and code blocks.
- Updated the child widget of the message container to reflect the changes.
  • Loading branch information
hunteraraujo committed Oct 31, 2023
1 parent c65b71d commit 2f187a8
Showing 1 changed file with 42 additions and 6 deletions.
48 changes: 42 additions & 6 deletions frontend/lib/views/chat/agent_message_tile.dart
Original file line number Diff line number Diff line change
Expand Up @@ -34,8 +34,9 @@ class _AgentMessageTileState extends State<AgentMessageTile> {
r'(?:\*|_).*?(?:\*|_)|' + // Italic
r'\[.*?\]\(.*?\)|' + // Links
r'!\[.*?\]\(.*?\)|' + // Images
r'#{1,6}.*', // Headers
multiLine: true,
r'#{1,6}.*|' + // Headers
r'```.*?```', // Fenced code blocks
dotAll: true, // To match across multiple lines
caseSensitive: false,
);

Expand Down Expand Up @@ -80,10 +81,45 @@ class _AgentMessageTileState extends State<AgentMessageTile> {
Expanded(
child: Container(
padding: const EdgeInsets.fromLTRB(0, 10, 20, 10),
child: false
? Markdown(data: widget.chat.message)
: SelectableText(widget.chat.message,
maxLines: null),
child: SingleChildScrollView(
child: hasMarkdown
? Markdown(
data: widget.chat.message,
shrinkWrap: true,
styleSheet: MarkdownStyleSheet.fromTheme(
Theme.of(context))
.copyWith(
blockquoteDecoration: BoxDecoration(
color: Colors
.black, // Background color for blockquotes
border: Border(
left: BorderSide(
color: Colors.grey,
width: 4.0,
),
),
),
blockquoteAlign: WrapAlignment.start,
blockquotePadding: const EdgeInsets.all(
10.0), // Padding for blockquotes
codeblockDecoration: BoxDecoration(
color: Colors.grey[
200], // Background color for code blocks
borderRadius:
BorderRadius.circular(4.0),
),
codeblockPadding: const EdgeInsets.all(
10.0), // Padding for code blocks
code: TextStyle(
backgroundColor: Colors.grey[
200], // Background color for inline code
fontFamily: 'monospace',
),
),
)
: SelectableText(widget.chat.message,
maxLines: null),
),
),
),
ElevatedButton(
Expand Down

0 comments on commit 2f187a8

Please sign in to comment.