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

Feat: Add Dropdown Button to main page

Browse source
This commit is contained in:
igorrCarvalho 2023-08-29 18:47:36 -03:00
commit 6240991e0c
2 changed files with 14 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

11
src/frontend/src/components/DropdownButtonComponent/index.tsx
View file

@ -37,9 +37,14 @@ export default function DropdownButton({
</div> </div>
{showOptions && ( {showOptions && (
<div className="absolute top-10 w-full"> <div className="absolute top-10 w-full">
{options.map((optionName) => ( {options.map(({ name, onBtnClick }) => (
<Button className="w-full" variant="primary"> <Button
{optionName} className="w-full"
variant="primary"
onClick={onBtnClick}
key={name}
>
{name}
</Button> </Button>
))} ))}
</div> </div>

13
src/frontend/src/pages/MainPage/index.tsx
View file

@ -6,6 +6,7 @@ import Header from "../../components/headerComponent";
import { Button } from "../../components/ui/button"; import { Button } from "../../components/ui/button";
import { USER_PROJECTS_HEADER } from "../../constants/constants"; import { USER_PROJECTS_HEADER } from "../../constants/constants";
import { TabsContext } from "../../contexts/tabsContext"; import { TabsContext } from "../../contexts/tabsContext";
import DropdownButton from "../../components/DropdownButtonComponent";
export default function HomePage(): JSX.Element { export default function HomePage(): JSX.Element {
const { flows, setTabId, downloadFlows, uploadFlows, addFlow, removeFlow } = const { flows, setTabId, downloadFlows, uploadFlows, addFlow, removeFlow } =
useContext(TabsContext); useContext(TabsContext);
@ -45,17 +46,15 @@ export default function HomePage(): JSX.Element {
<IconComponent name="Upload" className="main-page-nav-button" /> <IconComponent name="Upload" className="main-page-nav-button" />
Upload Collection Upload Collection
</Button> </Button>
<Button <DropdownButton
variant="primary" firstButtonName="New Project"
onClick={() => { onFirstBtnClick={() => {
addFlow(null!, true).then((id) => { addFlow(null!, true).then((id) => {
navigate("/flow/" + id); navigate("/flow/" + id);
}); });
}} }}
> options={[{name: "yesyes", onBtnClick: () => console.log('dips')}, {name: "dips", onBtnClick: () => console.log('yesyes')}]}
<IconComponent name="Plus" className="main-page-nav-button" /> />
New Project
</Button>
</div> </div>
</div> </div>
<span className="main-page-description-text"> <span className="main-page-description-text">