jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

🐛 fix(chatMessage/index.tsx): remove unnecessary div wrapper around matched text in AccordionContent

Browse source 
🔨 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:
Lucas Oliveira 2023-07-07 11:35:50 -03:00
commit 07276523a3
1 changed files with 14 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/frontend/src/modals/formModal/chatMessage/index.tsx
View file

@ -138,15 +138,15 @@ export default function ChatMessage({
<div className="flex w-full items-center"> <div className="flex w-full items-center">
<div className="inline-block text-start"> <div className="inline-block text-start">
<span className=" break-all text-primary"> <span className=" break-all text-primary">
<Accordion type="single" collapsible className="mb-4"> <Accordion type="single" collapsible className="mb-2 flex">
<AccordionItem <AccordionItem
className=" rounded-md border border-ring/60 bg-muted px-4" className=" rounded-md border border-ring/60 bg-muted px-4"
value="prompt" value="prompt"
> >
<AccordionTrigger className="flex gap-4 text-base font-semibold"> <AccordionTrigger className="gap-4 text-base font-semibold">
Initial Prompt Initial Prompt
</AccordionTrigger> </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 // Make all the variables that are inside curly braces bold
template.split("\n").map((line, index) => { template.split("\n").map((line, index) => {
@ -160,24 +160,14 @@ export default function ChatMessage({
parts.push(line.substring(lastIndex, match.index)); parts.push(line.substring(lastIndex, match.index));
} }
// Push div with matched text // Push div with matched text
parts.push( if (chat.message[match[1]]) {
<div> parts.push(
<div className="my-1 inline-block rounded-md bg-indigo-100 px-2"> <span className="my-1 rounded-md bg-indigo-100">
<span key={match.index}> {chat.message[match[1]]}
<span className=" text-xs font-semibold text-high-indigo"> </span>
{match[1]} );
</span> }
{chat.message[match[1]] ? (
<span>
&nbsp;&nbsp;{chat.message[match[1]]}
</span>
) : (
""
)}
</span>
</div>
</div>
);
// Update last index // Update last index
lastIndex = regex.lastIndex; lastIndex = regex.lastIndex;
} }
@ -191,7 +181,9 @@ export default function ChatMessage({
</AccordionContent> </AccordionContent>
</AccordionItem> </AccordionItem>
</Accordion> </Accordion>
{chat.message[chat.chatKey]} <span className="prose text-primary dark:prose-invert">
{chat.message[chat.chatKey]}
</span>
</span> </span>
</div> </div>
</div> </div>