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

Results and order by design implemented

Browse source
This commit is contained in:
Lucas Oliveira 2023-11-02 00:40:20 -03:00
commit 843244604d
1 changed files with 32 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/frontend/src/pages/StorePage/index.tsx
View file

@ -255,9 +255,9 @@ export default function StorePage(): JSX.Element {
</ShadTooltip> </ShadTooltip>
</div> </div>
</div> </div>
<div className="flex items-center gap-3 text-sm"> {/* <div className="flex items-center gap-3 text-sm">
<button className="flex h-8 items-center justify-between rounded-md border border-ring/60 px-4 py-2 text-sm text-primary hover:bg-muted"> <button className="flex h-8 items-center justify-between rounded-md border border-ring/60 px-4 py-2 text-sm text-primary hover:bg-muted">
<IconComponent name="CheckCircle2" className="mr-2 h-4 w-4" /> <IconComponent name="CheckCircle2" className="mr-2 h-4 w-4 " />
Installed Locally Installed Locally
</button> </button>
<Select <Select
@ -352,7 +352,7 @@ export default function StorePage(): JSX.Element {
<SelectItem value="Component">Components</SelectItem> <SelectItem value="Component">Components</SelectItem>
</SelectContent> </SelectContent>
</Select> </Select>
</div> </div> */}
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
{!loading && {!loading &&
tags.map((i, idx) => ( tags.map((i, idx) => (
@ -381,8 +381,36 @@ export default function StorePage(): JSX.Element {
</Badge> </Badge>
))} ))}
</div> </div>
<div className="flex items-end justify-between">
<span className="px-0.5 text-sm text-muted-foreground">
2,117 results
</span>
<Select
onValueChange={(value) => {
if (value === "Flow") {
filterComponent.current = false;
} else if (value === "Component") {
filterComponent.current = true;
} else {
filterComponent.current = null;
}
setPageIndex(1);
setPageSize(10);
handleGetComponents();
}}
>
<SelectTrigger>
<SelectValue placeholder="Order by" />
</SelectTrigger>
<SelectContent>
<SelectItem value="">Most Popular</SelectItem>
<SelectItem value="Flow">Most Recent</SelectItem>
<SelectItem value="Component">Alphabetical</SelectItem>
</SelectContent>
</Select>
</div>
<div className="mt-2 grid w-full gap-4 md:grid-cols-2 lg:grid-cols-3"> <div className="grid w-full gap-4 md:grid-cols-2 lg:grid-cols-3">
{loading ? ( {loading ? (
<> <>
<SkeletonCardComponent /> <SkeletonCardComponent />