AeThex-Corporation/aethex-forge
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

completionId: cgen-117f04d5fe214ddca509b6fc72fbedd6

Browse source 
cgen-117f04d5fe214ddca509b6fc72fbedd6
This commit is contained in:
Builder.io 2025-11-13 07:11:12 +00:00
parent b42cf8b7fc
commit 660d52b9fc
1 changed files with 68 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

108
client/pages/Feed.tsx
View file

@ -431,46 +431,74 @@ export default function Feed() {
</div> </div>
</div> </div>
<div className="flex flex-wrap items-center gap-2"> <div className="space-y-3">
{[ <div className="flex flex-wrap items-center gap-2">
{ {[
key: "all" as const, {
label: "All stories", key: "all" as const,
icon: Sparkles, label: "All stories",
description: "Latest community activity", icon: Sparkles,
}, description: "Latest community activity",
{ },
key: "following" as const, {
label: "Following", key: "following" as const,
icon: Users, label: "Following",
description: "People you follow", icon: Users,
}, description: "People you follow",
{ },
key: "trending" as const, {
label: "Trending", key: "trending" as const,
icon: Flame, label: "Trending",
description: "Most engagement", icon: Flame,
}, description: "Most engagement",
].map(({ key, label, icon: Icon, description }) => ( },
<Button ].map(({ key, label, icon: Icon, description }) => (
key={key} <Button
variant={activeFilter === key ? "default" : "outline"} key={key}
size="sm" variant={activeFilter === key ? "default" : "outline"}
onClick={() => setActiveFilter(key)} size="sm"
className={cn( onClick={() => setActiveFilter(key)}
"flex items-center gap-2 rounded-full border-border/50 px-4", className={cn(
activeFilter === key "flex items-center gap-2 rounded-full border-border/50 px-4",
? "bg-gradient-to-r from-aethex-500 to-neon-blue text-white shadow-lg" activeFilter === key
: "bg-background/80 text-muted-foreground backdrop-blur", ? "bg-gradient-to-r from-aethex-500 to-neon-blue text-white shadow-lg"
)} : "bg-background/80 text-muted-foreground backdrop-blur",
> )}
<Icon className="h-4 w-4" /> >
<span className="font-medium">{label}</span> <Icon className="h-4 w-4" />
<span className="hidden text-xs sm:inline"> <span className="font-medium">{label}</span>
{description} <span className="hidden text-xs sm:inline">
</span> {description}
</Button> </span>
))} </Button>
))}
</div>
<div className="flex flex-wrap items-center gap-2">
{ARMS.map((arm) => (
<Button
key={arm.id}
variant={selectedArms.includes(arm.id) ? "default" : "outline"}
size="sm"
onClick={() =>
setSelectedArms((prev) =>
prev.includes(arm.id)
? prev.filter((a) => a !== arm.id)
: [...prev, arm.id],
)
}
className={cn(
"flex items-center gap-2 rounded-full border-border/50 px-3 py-1.5 text-xs sm:text-sm",
selectedArms.includes(arm.id)
? "bg-gradient-to-r from-aethex-600 to-neon-blue text-white shadow-md"
: "bg-background/60 text-muted-foreground backdrop-blur hover:border-border",
)}
>
<arm.icon className={cn("h-3.5 w-3.5", arm.color)} />
<span className="font-medium">{arm.label}</span>
</Button>
))}
</div>
</div> </div>
</div> </div>
</section> </section>