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

Add Basic Prompt image to UndrawCardComponent and create switch to select image

Browse source
This commit is contained in:
anovazzi1 2024-03-06 20:18:15 -03:00
commit 69819fe59f
2 changed files with 18 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/frontend/src/assets/undraw_design_components_9vy6.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 9.8 KiB

18
src/frontend/src/components/undrawCards/index.tsx
View file

@ -3,6 +3,9 @@ import { useNavigate } from "react-router-dom";
/// <reference types="vite-plugin-svgr/client" />
//@ts-ignore
import { ReactComponent as TransferFiles } from "../../assets/undraw_transfer_files_re_a2a9.svg"
//@ts-ignore
import { ReactComponent as BasicPrompt } from "../../assets/undraw_design_components_9vy6.svg"
import useFlowsManagerStore from "../../stores/flowsManagerStore";
import { FlowType } from "../../types/flow"
import { updateIds } from "../../utils/reactflowUtils";
@ -14,6 +17,18 @@ export default function UndrawCardComponent({
}: { flow: FlowType }) {
const addFlow = useFlowsManagerStore((state) => state.addFlow);
const navigate = useNavigate();
function selectImage() {
switch (flow.name) {
case "Data Ingestion":
return <TransferFiles style={{ width: '80%', height: '80%', preserveAspectRatio: 'xMidYMid meet' }} />
case "Basic Prompting":
return <BasicPrompt style={{ width: '80%', height: '80%', preserveAspectRatio: 'xMidYMid meet' }} />
default:
return <TransferFiles style={{ width: '80%', height: '80%', preserveAspectRatio: 'xMidYMid meet' }} />
}
}
return (
<Card onClick={() => {
updateIds(flow.data!);
@ -23,7 +38,8 @@ export default function UndrawCardComponent({
}} className="pt-4 w-80 h-72 cursor-pointer">
<CardContent className="w-full h-full">
<div className="rounded-md border border-border bg-background w-full h-full flex flex-col items-center align-middle justify-center">
<TransferFiles style={{ width: '80%', height: '80%', preserveAspectRatio: 'xMidYMid meet' }} /> </div>
{selectImage()}
</div>
</CardContent>
<CardDescription className="px-4 pb-4">
<CardTitle>{flow.name}</CardTitle>