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
+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>