data model tweaks

apps/formbricks-com/.env.example

@@ -1,3 +1,6 @@
 NEXT_PUBLIC_FORMBRICKS_COM_API_HOST=http://localhost:3000
 NEXT_PUBLIC_FORMBRICKS_COM_ENVIRONMENT_ID=
-NEXT_PUBLIC_FORMBRICKS_COM_DOCS_FEEDBACK_SURVEY_ID=
+NEXT_PUBLIC_FORMBRICKS_COM_DOCS_FEEDBACK_SURVEY_ID=
+
+# Strapi API Key
+STRAPI_API_KEY=

apps/formbricks-com/pages/learn/[slug].tsx

@@ -4,16 +4,68 @@ import Image from "next/image";
 import fetch from "node-fetch";
 import ReactMarkdown from "react-markdown";
 
+type Article = {
+  id?: number;
+  attributes?: {
+    author?: string;
+    title?: string;
+    text?: string;
+    slug?: string;
+    createdAt?: string;
+    updatedAt?: string;
+    publishedAt?: string;
+    meta?: {
+      id?: number;
+      description?: string;
+      title?: string;
+      publisher?: string;
+      section?: string;
+      tags?: {
+        id?: number;
+        tag?: string;
+      }[];
+    };
+    faq?: {
+      id?: number;
+      question?: string;
+      answer?: string;
+    }[];
+  };
+};
+
+type ArticlePageProps = {
+  article?: Article;
+};
+
+interface ArticleResponse {
+  data: Article[];
+  meta: {
+    pagination: {
+      page: number;
+      pageSize: number;
+      pageCount: number;
+      total: number;
+    };
+  };
+}
+
 export async function getStaticPaths() {
   const response = await fetch(
-    "http://127.0.0.1:1337/api/articles?populate[meta][populate]=*&filters[category][name][$eq]=learn"
+    "https://strapi.formbricks.com/api/articles?populate[meta][populate]=*&filters[category][name][$eq]=learn",
+    {
+      headers: {
+        Authorization: `Bearer ${process.env.STRAPI_API_KEY}`,
+      },
+    }
   );
-  const articles = await response.json();
-
   if (!response.ok) {
     throw new Error(`HTTP error! Status: ${response.status}`);
   }
 
+  const articles = (await response.json()) as ArticleResponse;
+
+  console.log("articles", articles);
+
   const paths = articles.data.map((article) => ({
     params: { slug: article.attributes.slug },
   }));
@@ -23,17 +75,22 @@ export async function getStaticPaths() {
 
 export async function getStaticProps({ params }) {
   const res = await fetch(
-    `http://127.0.0.1:1337/api/articles?populate[meta][populate]=*&populate[faq][populate]=*&filters[slug][$eq]=${params.slug}`
+    `https://strapi.formbricks.com/api/articles?populate[meta][populate]=*&populate[faq][populate]=*&filters[slug][$eq]=${params.slug}`,
+    {
+      headers: {
+        Authorization: `Bearer ${process.env.STRAPI_API_KEY}`,
+      },
+    }
   );
   if (!res.ok) {
     throw new Error("Something went wrong");
   }
-  const resData = await res.json();
+  const resData = (await res.json()) as ArticleResponse;
   const article = resData.data[0];
   return { props: { article } };
 }
 
-export default function ArticlePage({ article = {} }) {
+export default function ArticlePage({ article = {} }: ArticlePageProps) {
   if (!article || !article.attributes) return <div>Loading...</div>;
 
   // Use next/image to render images in markdown

apps/formbricks-com/pages/newblog/[slug].tsx

@@ -1,52 +0,0 @@
-import fetch from 'node-fetch';
-import MetaInformation from "../../components/shared/MetaInformation";
-
-export async function getStaticPaths() {
-  const response = await fetch("http://localhost:1337/api/blog-articles?populate=*");
-  const articles = await response.json();
-
-  console.log("articles.data", JSON.stringify(articles.data, null, 2));
-  console.log("articles", articles);
-
-  const paths = articles.data.map((article) => ({
-    params: { slug: article.attributes.article[0].slug },
-  }));
-
-  return { paths, fallback: true };
-}
-
-export async function getStaticProps({ params }) {
-  const res = await fetch(`http://localhost:1337/api/blog-articles?populate=*`);
-  if (!res.ok) {
-    throw new Error("Something went wrong");
-  }
-  const resData = await res.json();
-  const articles = resData.data;
-  // find article by slug attribute
-  const article = articles.find((a) => a.attributes.article[0].slug === params.slug);
-  return { props: { article } };
-}
-
-export default function ArticlePage({ article }) {
-  if (!article) return <div>Loading...</div>; // Render a loading state if data hasn't been fetched yet
-
-  return (
-    <div>
-      <MetaInformation
-        title={article.attributes.metadata[0].metaTitle}
-        description={article.attributes.metadata[0].metaDescription}
-        publishedTime={article.attributes.publishedAt} // Or however you want to handle this
-        authors={undefined} // You'll need to provide this value
-        section={article.attributes.metadata[0].metaSection}
-        tags={[
-          article.attributes.metadata[0].tag1,
-          article.attributes.metadata[0].tag2,
-          article.attributes.metadata[0].tag3,
-          article.attributes.metadata[0].tag3,
-          article.attributes.metadata[0].tag3,
-        ]}
-      />
-      <pre>{JSON.stringify(article, null, 2)}</pre>
-    </div>
-  );
-}

turbo.json

@@ -75,6 +75,7 @@
         "RAILWAY_STATIC_URL",
         "RENDER_EXTERNAL_URL",
         "SENTRY_DSN",
+        "STRAPI_API_KEY",
         "STRIPE_SECRET_KEY",
         "STRIPE_WEBHOOK_SECRET",
         "TELEMETRY_DISABLED",