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

🐛 fix(chatMessage): fix styling issue in ChatMessage component to ensure proper alignment and text wrapping

Browse source 
🐛 fix(chatMessage): add max height and overflow to AccordionContent in ChatMessage component to prevent content overflow
🐛 fix(formModal): adjust width of left panel in FormModal component to improve layout
🐛 fix(formModal): fix flexbox alignment issue in right panel of FormModal component
This commit is contained in:
Lucas Oliveira 2023-07-06 00:29:05 -03:00
commit 0bb664f3ad
2 changed files with 8 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -149,9 +149,9 @@ export default function ChatMessage({
</div> </div>
</div> </div>
) : ( ) : (
<div className="flex w-full flex-1 items-center"> <div className="flex w-full items-center">
<div className="inline-block text-start"> <div className="inline-block w-full text-start">
<span className="text-primary"> <span className="w-full break-all text-primary">
<Accordion <Accordion
type="multiple" type="multiple"
className="my-2 w-full rounded-md bg-muted p-2" className="my-2 w-full rounded-md bg-muted p-2"
@ -161,7 +161,9 @@ export default function ChatMessage({
.map((key) => ( .map((key) => (
<AccordionItem value={key}> <AccordionItem value={key}>
<AccordionTrigger>{key}</AccordionTrigger> <AccordionTrigger>{key}</AccordionTrigger>
<AccordionContent>{chat.message[key]}</AccordionContent> <AccordionContent className="max-h-96 overflow-auto break-all">
{chat.message[key]}
</AccordionContent>
</AccordionItem> </AccordionItem>
))} ))}
</Accordion> </Accordion>

4
src/frontend/src/modals/formModal/index.tsx
View file

@ -404,7 +404,7 @@ export default function FormModal({
</DialogHeader> </DialogHeader>
<div className="mt-2 flex h-[80vh] w-full "> <div className="mt-2 flex h-[80vh] w-full ">
<div className="mr-6 flex h-full w-2/5 flex-col justify-start overflow-auto scrollbar-hide"> <div className="mr-6 flex h-full w-2/6 flex-col justify-start overflow-auto scrollbar-hide">
<div className="flex items-center py-2"> <div className="flex items-center py-2">
<Variable className=" -ml-px mr-1 h-4 w-4 text-primary"></Variable> <Variable className=" -ml-px mr-1 h-4 w-4 text-primary"></Variable>
<span className="text-md font-semibold text-primary"> <span className="text-md font-semibold text-primary">
@ -496,7 +496,7 @@ export default function FormModal({
))} ))}
</Accordion> </Accordion>
</div> </div>
<div className="w-full"> <div className="flex w-full flex-1 flex-col">
<div className="relative flex h-full w-full flex-col rounded-md border bg-muted"> <div className="relative flex h-full w-full flex-col rounded-md border bg-muted">
<div className="absolute right-3 top-3 z-50"> <div className="absolute right-3 top-3 z-50">
<button disabled={lockChat} onClick={() => clearChat()}> <button disabled={lockChat} onClick={() => clearChat()}>