🐛 fix(chatMessage/index.tsx): remove unnecessary div wrapper around matched text in AccordionContent
🔨 refactor(chatMessage/index.tsx): simplify rendering of matched text in AccordionContent by using a span instead of a div 🔨 refactor(chatMessage/index.tsx): remove unnecessary div wrapper around chat.message[chat.chatKey]
This commit is contained in:
parent
5b2cc6f68a
commit
07276523a3
1 changed files with 14 additions and 22 deletions
|
|
@ -138,15 +138,15 @@ export default function ChatMessage({
|
|||
<div className="flex w-full items-center">
|
||||
<div className="inline-block text-start">
|
||||
<span className=" break-all text-primary">
|
||||
<Accordion type="single" collapsible className="mb-4">
|
||||
<Accordion type="single" collapsible className="mb-2 flex">
|
||||
<AccordionItem
|
||||
className=" rounded-md border border-ring/60 bg-muted px-4"
|
||||
value="prompt"
|
||||
>
|
||||
<AccordionTrigger className="flex gap-4 text-base font-semibold">
|
||||
<AccordionTrigger className="gap-4 text-base font-semibold">
|
||||
Initial Prompt
|
||||
</AccordionTrigger>
|
||||
<AccordionContent className="max-h-96 overflow-auto break-all p-2 text-base">
|
||||
<AccordionContent className="max-h-96 overflow-auto break-all p-2">
|
||||
{
|
||||
// Make all the variables that are inside curly braces bold
|
||||
template.split("\n").map((line, index) => {
|
||||
|
|
@ -160,24 +160,14 @@ export default function ChatMessage({
|
|||
parts.push(line.substring(lastIndex, match.index));
|
||||
}
|
||||
// Push div with matched text
|
||||
parts.push(
|
||||
<div>
|
||||
<div className="my-1 inline-block rounded-md bg-indigo-100 px-2">
|
||||
<span key={match.index}>
|
||||
<span className=" text-xs font-semibold text-high-indigo">
|
||||
{match[1]}
|
||||
</span>
|
||||
{chat.message[match[1]] ? (
|
||||
<span>
|
||||
{chat.message[match[1]]}
|
||||
</span>
|
||||
) : (
|
||||
""
|
||||
)}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
if (chat.message[match[1]]) {
|
||||
parts.push(
|
||||
<span className="my-1 rounded-md bg-indigo-100">
|
||||
{chat.message[match[1]]}
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
// Update last index
|
||||
lastIndex = regex.lastIndex;
|
||||
}
|
||||
|
|
@ -191,7 +181,9 @@ export default function ChatMessage({
|
|||
</AccordionContent>
|
||||
</AccordionItem>
|
||||
</Accordion>
|
||||
{chat.message[chat.chatKey]}
|
||||
<span className="prose text-primary dark:prose-invert">
|
||||
{chat.message[chat.chatKey]}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue