Openstatus www.openstatus.dev

๐ŸŒ (#306)

* ๐ŸŒ

* ๐Ÿ”ฅ

authored by

Thibault Le Ouay and committed by
GitHub
3d1bd681 a35bd7b4

+13 -19
+13 -19
apps/web/src/app/oss-friends/page.tsx
··· 1 1 import Link from "next/link"; 2 + import { z } from "zod"; 2 3 3 4 import { Icons } from "@/components/icons"; 4 5 import { MarketingLayout } from "@/components/layout/marketing-layout"; 5 - import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; 6 6 import { 7 7 Card, 8 8 CardDescription, ··· 10 10 CardHeader, 11 11 CardTitle, 12 12 } from "@/components/ui/card"; 13 - import { openSourceFriends } from "@/config/oss-friends"; 14 13 15 - const OpenSourceFriends = () => { 14 + const OSSFriendSchema = z.object({ 15 + href: z.string(), 16 + name: z.string(), 17 + description: z.string(), 18 + }); 19 + 20 + const OpenSourceFriends = async () => { 21 + const res = await fetch("https://formbricks.com/api/oss-friends"); 22 + const data = await res.json(); 23 + const openSourceFriends = z.array(OSSFriendSchema).parse(data.data); 16 24 return ( 17 25 <MarketingLayout> 18 26 <h1 className="text-foreground font-cal mb-5 text-4xl"> ··· 23 31 <Card key={friend.name} className="group"> 24 32 <CardHeader> 25 33 <div className="flex items-center gap-2"> 26 - <Avatar> 27 - <AvatarImage src={friend.logo} alt={friend.name} /> 28 - <AvatarFallback>{friend.name}</AvatarFallback> 29 - </Avatar> 30 34 <CardTitle> 31 35 <Link 32 - href={friend.website} 36 + href={friend.href} 33 37 target="_blank" 34 38 className="relative cursor-pointer duration-200 after:absolute after:bottom-0 after:left-0 after:h-1 after:w-0 after:bg-white after:transition-all after:duration-300 hover:after:w-full group-hover:underline" 35 39 > ··· 41 45 </CardHeader> 42 46 <CardFooter> 43 47 <div className="flex items-center gap-2.5"> 44 - <Link href={friend.website} target="_blank"> 48 + <Link href={friend.href} target="_blank"> 45 49 <Icons.globe className="text-muted-foreground h-5 w-5 hover:text-black" /> 46 50 </Link> 47 - {Object.entries(friend.socialLinks).map(([key, value]) => { 48 - if (value) { 49 - const Icon = Icons[value.icon]; 50 - return ( 51 - <Link href={value.link} target="_blank" key={key}> 52 - <Icon className="text-muted-foreground h-5 w-5 hover:text-black" /> 53 - </Link> 54 - ); 55 - } 56 - })} 57 51 </div> 58 52 </CardFooter> 59 53 </Card>