FlowPage refactored

This commit is contained in:
Lucas Oliveira 2023-02-28 20:25:06 -03:00
commit c51945b6c6
5 changed files with 9 additions and 11 deletions

View file

@ -10,7 +10,7 @@ import { alertContext } from "./contexts/alertContext";
import { locationContext } from "./contexts/locationContext"; import { locationContext } from "./contexts/locationContext";
import Sidebar from "./components/SidebarComponent"; import Sidebar from "./components/SidebarComponent";
import Header from "./components/HeaderComponent"; import Header from "./components/HeaderComponent";
import { TabsManager } from "./pages/FlowPage/flowManager"; import TabsManagerComponent from "./pages/FlowPage/components/tabsManagerComponent";
export default function App() { export default function App() {
var _ = require("lodash"); var _ = require("lodash");
@ -105,7 +105,7 @@ export default function App() {
<main className="min-w-0 flex-1 border-t border-gray-200 flex"> <main className="min-w-0 flex-1 border-t border-gray-200 flex">
{/* Primary column */} {/* Primary column */}
<div className="w-full h-full"> <div className="w-full h-full">
<TabsManager></TabsManager> <TabsManagerComponent></TabsManagerComponent>
</div> </div>
</main> </main>
</div> </div>

View file

@ -6,7 +6,7 @@ import { TabsContext } from "../../../../contexts/tabsContext";
var _ = require("lodash"); var _ = require("lodash");
export default function TabComponent({ selected, flow, onClick }) { export default function TabComponent({ selected, flow, onClick }) {
const { removeFlow, updateFlow, flows, downloadFlow } = const { removeFlow, updateFlow, flows } =
useContext(TabsContext); useContext(TabsContext);
const [isRename, setIsRename] = useState(false); const [isRename, setIsRename] = useState(false);
const [value, setValue] = useState(""); const [value, setValue] = useState("");

View file

@ -1,12 +1,10 @@
import { useContext, useEffect } from "react"; import { useContext, useEffect } from "react";
import { ReactFlowProvider } from "reactflow"; import { ReactFlowProvider } from "reactflow";
import FlowPage from ".."; import TabComponent from "../tabComponent";
import { TabsContext } from "../../../contexts/tabsContext"; import { TabsContext } from "../../../../contexts/tabsContext";
import TabComponent from "./tabComponent"; import FlowPage from "../..";
import { example } from "../../../data_assets/example";
var _ = require("lodash");
export function TabsManager() { export default function TabsManagerComponent() {
const { flows, addFlow, tabIndex, setTabIndex } = useContext(TabsContext); const { flows, addFlow, tabIndex, setTabIndex } = useContext(TabsContext);
useEffect(() => { useEffect(() => {
if (flows.length === 0) { if (flows.length === 0) {

View file

@ -13,7 +13,6 @@ import { locationContext } from "../../contexts/locationContext";
import ExtraSidebar from "./components/extraSidebarComponent"; import ExtraSidebar from "./components/extraSidebarComponent";
import Chat from "../../components/chatComponent"; import Chat from "../../components/chatComponent";
import GenericNode from "../../CustomNodes/GenericNode"; import GenericNode from "../../CustomNodes/GenericNode";
import connection from "./components/connection";
import ChatInputNode from "../../CustomNodes/ChatInputNode"; import ChatInputNode from "../../CustomNodes/ChatInputNode";
import ChatOutputNode from "../../CustomNodes/ChatOutputNode"; import ChatOutputNode from "../../CustomNodes/ChatOutputNode";
import InputNode from "../../CustomNodes/InputNode"; import InputNode from "../../CustomNodes/InputNode";
@ -25,6 +24,7 @@ import {
ArrowDownTrayIcon, ArrowDownTrayIcon,
ArrowUpTrayIcon, ArrowUpTrayIcon,
} from "@heroicons/react/24/outline"; } from "@heroicons/react/24/outline";
import ConnectionLineComponent from "./components/ConnectionLineComponent";
const nodeTypes = { const nodeTypes = {
genericNode: GenericNode, genericNode: GenericNode,
@ -170,7 +170,7 @@ export default function FlowPage({ flow }) {
onLoad={setReactFlowInstance} onLoad={setReactFlowInstance}
onInit={setReactFlowInstance} onInit={setReactFlowInstance}
nodeTypes={nodeTypes} nodeTypes={nodeTypes}
connectionLineComponent={connection} connectionLineComponent={ConnectionLineComponent}
onDragOver={onDragOver} onDragOver={onDragOver}
onDrop={onDrop} onDrop={onDrop}
> >