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

Installing flows and components done

Browse source
This commit is contained in:
Lucas Oliveira 2023-11-09 20:16:27 -03:00
commit b3327f5ed5
1 changed files with 20 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

32
src/frontend/src/pages/StorePage/components/market-card.tsx
View file

@ -1,4 +1,5 @@
import { useContext, useEffect, useRef, useState } from "react"; import { useContext, useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import ShadTooltip from "../../../components/ShadTooltipComponent"; import ShadTooltip from "../../../components/ShadTooltipComponent";
import IconComponent from "../../../components/genericIconComponent"; import IconComponent from "../../../components/genericIconComponent";
import { Badge } from "../../../components/ui/badge"; import { Badge } from "../../../components/ui/badge";
@ -18,7 +19,6 @@ import {
postLikeComponent, postLikeComponent,
saveFlowStore, saveFlowStore,
} from "../../../controllers/API"; } from "../../../controllers/API";
import { FlowType } from "../../../types/flow";
import { storeComponent } from "../../../types/store"; import { storeComponent } from "../../../types/store";
import cloneFLowWithParent from "../../../utils/storeUtils"; import cloneFLowWithParent from "../../../utils/storeUtils";
import { classNames } from "../../../utils/utils"; import { classNames } from "../../../utils/utils";
@ -40,10 +40,11 @@ export const MarketCardComponent = ({
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const { addFlow } = useContext(TabsContext); const { addFlow } = useContext(TabsContext);
const { setSuccessData, setErrorData } = useContext(alertContext); const { setSuccessData, setErrorData } = useContext(alertContext);
const flowData = useRef<FlowType>();
const [liked_by_user, setLiked_by_user] = useState(data.liked_by_user); const [liked_by_user, setLiked_by_user] = useState(data.liked_by_user);
const [likes_count, setLikes_count] = useState(data.liked_by_count ?? 0); const [likes_count, setLikes_count] = useState(data.liked_by_count ?? 0);
const name = data.is_component ? "Component" : "Flow";
useEffect(() => { useEffect(() => {
setAdded(savedFlows.has(data.id) ? true : false); setAdded(savedFlows.has(data.id) ? true : false);
}, [savedFlows]); }, [savedFlows]);
@ -54,7 +55,6 @@ export const MarketCardComponent = ({
(res) => { (res) => {
console.log(res); console.log(res);
const newFLow = cloneFLowWithParent(res, res.id, data.is_component); const newFLow = cloneFLowWithParent(res, res.id, data.is_component);
flowData.current = newFLow;
console.log(newFLow); console.log(newFLow);
saveFlowStore( saveFlowStore(
newFLow, newFLow,
@ -63,12 +63,12 @@ export const MarketCardComponent = ({
.then(() => { .then(() => {
setAdded(true); setAdded(true);
setLoading(false); setLoading(false);
setSuccessData({ title: "Component Added to account" }); setSuccessData({ title: `${name} added to account.` });
}) })
.catch((error) => { .catch((error) => {
console.error(error); console.error(error);
setErrorData({ setErrorData({
title: "Error on adding Component", title: `Error on adding ${name}`,
list: [error["response"]["data"]["detail"]], list: [error["response"]["data"]["detail"]],
}); });
}); });
@ -79,13 +79,21 @@ export const MarketCardComponent = ({
); );
} }
const navigate = useNavigate();
function handleInstall() { function handleInstall() {
console.log("installed");
setLoading(true); setLoading(true);
setTimeout(() => { getComponent(data.id).then((res) => {
setInstalled(true); const newFlow = cloneFLowWithParent(res, res.id, data.is_component);
setLoading(false); addFlow(true, newFlow).then((id) => {
}, 500); setSuccessData({ title: `${name} Installed` });
setLoading(false);
setInstalled(true);
setTimeout(() => {
navigate("/flow/" + id);
}, 500);
});
});
} }
function handleLike() { function handleLike() {
@ -105,7 +113,7 @@ export const MarketCardComponent = ({
setLiked_by_user(temp); setLiked_by_user(temp);
setLikes_count(tempNum); setLikes_count(tempNum);
setErrorData({ setErrorData({
title: "Error on liking component", title: `Error on liking ${name}.`,
list: [error["response"]["data"]["detail"]], list: [error["response"]["data"]["detail"]],
}); });
}) })