From 16697b3ce1a5b2c5386bb7c79a328045bc975d74 Mon Sep 17 00:00:00 2001
From: Baptiste Arnaud <baptiste.arnaud95@gmail.com>
Date: Thu, 23 Jan 2025 18:12:10 +0100
Subject: [PATCH] fix(landing-page): fetch ossFriends data in server fn

To fix crash on navigate from footer
---
 .../app/routes/_layout/oss-friends.tsx        | 34 +++++++++++--------
 1 file changed, 19 insertions(+), 15 deletions(-)

diff --git a/apps/landing-page/app/routes/_layout/oss-friends.tsx b/apps/landing-page/app/routes/_layout/oss-friends.tsx
index e998e13f7..38c76df49 100644
--- a/apps/landing-page/app/routes/_layout/oss-friends.tsx
+++ b/apps/landing-page/app/routes/_layout/oss-friends.tsx
@@ -2,7 +2,24 @@ import { Card } from "@/components/Card";
 import { ContentPageWrapper } from "@/components/ContentPageWrapper";
 import { createMetaTags } from "@/lib/createMetaTags";
 import { Link, createFileRoute } from "@tanstack/react-router";
+import { createServerFn } from "@tanstack/start";
 import { ArrowUpRightIcon } from "@typebot.io/ui/icons/ArrowUpRightIcon";
+import { z } from "@typebot.io/zod";
+
+export const getAndParseOssFriends = createServerFn().handler(async () => {
+  const res = await fetch("https://formbricks.com/api/oss-friends");
+  const data = await res.json();
+  return z
+    .array(
+      z.object({
+        href: z.string(),
+        name: z.string(),
+        description: z.string(),
+      }),
+    )
+    .parse(data.data)
+    .filter((friend) => friend.name !== "Typebot");
+});
 
 export const Route = createFileRoute("/_layout/oss-friends")({
   head: () => ({
@@ -15,24 +32,11 @@ export const Route = createFileRoute("/_layout/oss-friends")({
     }),
   }),
   component: RouteComponent,
-  loader: async () => {
-    const res = await fetch("https://formbricks.com/api/oss-friends");
-    const data = await res.json();
-
-    return {
-      ossFriends: (
-        data.data as {
-          href: string;
-          name: string;
-          description: string;
-        }[]
-      ).filter((friend) => friend.name !== "Typebot"),
-    };
-  },
+  loader: () => getAndParseOssFriends(),
 });
 
 function RouteComponent() {
-  const { ossFriends } = Route.useLoaderData();
+  const ossFriends = Route.useLoaderData();
   return (
     <ContentPageWrapper>
       <div className="flex flex-col gap-4">