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

add hsitory tab section to playground

Browse source
This commit is contained in:
anovazzi1 2024-06-05 15:46:52 -03:00
commit b32c02671d
1 changed files with 173 additions and 164 deletions
Download patch file Download diff file Expand all files Collapse all files

65
src/frontend/src/modals/IOModal/index.tsx
View file

@ -19,7 +19,7 @@ import { InputOutput } from "../../constants/enums";
import useFlowStore from "../../stores/flowStore";
import useFlowsManagerStore from "../../stores/flowsManagerStore";
import { IOModalPropsType } from "../../types/components";
import { NodeType } from "../../types/flow";
import { NodeDataType, NodeType } from "../../types/flow";
import { updateVerticesOrder } from "../../utils/buildUtils";
import { cn } from "../../utils/utils";
import BaseModal from "../baseModal";
@ -113,13 +113,17 @@ export default function IOModal({
setSelectedTab(inputs.length > 0 ? 1 : outputs.length > 0 ? 2 : 0);
}, [allNodes.length]);
const flow_sessions = allNodes
.map((node) => (node.data as NodeDataType).node?.template["session_id"])
.filter((session) => session !== undefined);
useEffect(() => {
setSelectedViewField(startView());
// if (haveChat) {
// getSessions().then((sessions) => {
// setSessions(sessions);
// });
// }
if (haveChat) {
getSessions().then((sessions) => {
setSessions(sessions);
});
}
}, [open]);
return (
@ -144,7 +148,6 @@ export default function IOModal({
<BaseModal.Content>
<div className="flex h-full flex-col ">
<div className="flex-max-width h-full">
{selectedTab !== 0 && (
<div
className={cn(
"mr-6 flex h-full w-2/6 flex-shrink-0 flex-col justify-start transition-all duration-300",
@ -167,20 +170,11 @@ export default function IOModal({
{outputs.length > 0 && (
<TabsTrigger value={"2"}>Outputs</TabsTrigger>
)}
{/* {haveChat && (
<TabsTrigger value={"3"}>History</TabsTrigger>
)} */}
{haveChat && <TabsTrigger value={"0"}>History</TabsTrigger>}
</TabsList>
</div>
<TabsContent
value={"1"}
className="api-modal-tabs-content mt-4"
>
<div className="mx-2 mb-2 flex items-center gap-2 text-sm font-bold">
<IconComponent className="h-4 w-4" name={"Type"} />
{TEXT_INPUT_MODAL_TITLE}
</div>
<TabsContent value={"1"} className="api-modal-tabs-content">
{nodes
.filter((node) =>
inputs.some((input) => input.id === node.id),
@ -241,14 +235,7 @@ export default function IOModal({
);
})}
</TabsContent>
<TabsContent
value={"2"}
className="api-modal-tabs-content mt-4"
>
<div className="mx-2 mb-2 flex items-center gap-2 text-sm font-bold">
<IconComponent className="h-4 w-4" name={"Type"} />
{OUTPUTS_MODAL_TITLE}
</div>
<TabsContent value={"2"} className="api-modal-tabs-content">
{nodes
.filter((node) =>
outputs.some((output) => output.id === node.id),
@ -309,10 +296,32 @@ export default function IOModal({
);
})}
</TabsContent>
<TabsContent value={"0"} className="api-modal-tabs-content">
{sessions.map((session, index) => {
return (
<div className="flex items-center justify-between border-b px-2 align-middle">
{session}
<div className="flex items-center justify-center gap-2 align-middle">
<Button variant="ghost" onClick={() => {}}>
<ShadTooltip content={"delete"}>
<IconComponent
name="Trash2"
className="h-4 w-4"
></IconComponent>
</ShadTooltip>
</Button>
<div>
<ShadTooltip content>
<div className="h-2 w-2 rounded-full bg-red-500"></div>
</ShadTooltip>
</div>
</div>
</div>
);
})}
</TabsContent>
</Tabs>
</div>
)}
<div className="flex h-full min-w-96 flex-grow">
{selectedViewField && (
<div