fix: formbricks-com build errors (#1991)

.github/workflows/build-formbricks-com.yml

@@ -1,4 +1,4 @@
-name: Build
+name: Build formbricks-com
 on:
   workflow_call:
 jobs:
@@ -11,10 +11,10 @@ jobs:
       - name: Checkout repo
         uses: actions/checkout@v3
 
-      - name: Setup Node.js 18.x
+      - name: Setup Node.js 20.x
         uses: actions/setup-node@v3
         with:
-          node-version: 18.x
+          node-version: 20.x
 
       - name: Install pnpm
         uses: pnpm/action-setup@v2

.github/workflows/build-web.yml

@@ -1,4 +1,4 @@
-name: Build
+name: Build web
 on:
   workflow_call:
 jobs:

apps/formbricks-com/components/demo/HeaderLight.tsx

@@ -5,7 +5,7 @@ import { useRouter } from "next/router";
 
 import { Button } from "@formbricks/ui/Button";
 
-import { FooterLogo } from "../../components/shared/Logo";
+import { FooterLogo } from "../shared/Logo";
 
 export default function HeaderLight() {
   const plausible = usePlausible();

apps/formbricks-com/components/demo/LayoutLight.tsx

@@ -1,5 +1,5 @@
-import Footer from "../../components/shared/Footer";
-import MetaInformation from "../../components/shared/MetaInformation";
+import Footer from "../shared/Footer";
+import MetaInformation from "../shared/MetaInformation";
 import HeaderLight from "./HeaderLight";
 
 interface LayoutProps {

apps/formbricks-com/components/dummyUI/TemplateList.tsx

@@ -53,12 +53,11 @@ export default function TemplateList({ onTemplateClick, activeTemplate }: Templa
         {templates
           .filter((template) => selectedFilter === ALL_CATEGORY_NAME || template.category === selectedFilter)
           .map((template: TTemplate) => (
-            <button
-              type="button"
+            <div
+              key={template.name}
               onClick={() => {
                 onTemplateClick(template); // Pass the 'template' object instead of 'activeTemplate'
               }}
-              key={template.name}
               className={cn(
                 activeTemplate?.name === template.name && "ring-brand ring-2",
                 "duration-120  group  relative rounded-lg bg-white p-6 shadow transition-all duration-150 hover:scale-105 dark:bg-slate-700"
@@ -71,7 +70,7 @@ export default function TemplateList({ onTemplateClick, activeTemplate }: Templa
                 {template.name}
               </h3>
               <p className="text-left text-xs text-slate-600 dark:text-slate-400">{template.description}</p>
-            </button>
+            </div>
           ))}
       </div>
     </main>

apps/formbricks-com/components/dummyUI/templates.ts

@@ -1,6 +1,6 @@
 import { createId } from "@paralleldrive/cuid2";
 
-import { TSurveyHiddenFields, TSurveyQuestionType } from "@formbricks/types/surveys";
+import { TSurveyQuestionType } from "@formbricks/types/surveys";
 import { TTemplate } from "@formbricks/types/templates";
 import {
   AppPieChartIcon,
@@ -14,6 +14,7 @@ import {
   DashboardIcon,
   DogChaserIcon,
   DoorIcon,
+  EmailIcon,
   FeedbackIcon,
   GaugeSpeedFastIcon,
   HeartCommentIcon,
@@ -38,11 +39,6 @@ const welcomeCardDefault = {
   showResponseCount: false,
 };
 
-const hiddenFieldsDefault: TSurveyHiddenFields = {
-  enabled: true,
-  fieldIds: [],
-};
-
 export const customSurvey: TTemplate = {
   name: "Start from scratch",
   description: "Create a survey without template.",
@@ -1231,12 +1227,12 @@ export const templates: TTemplate[] = [
   },
   {
     name: "Improve Newsletter Content",
+    icon: EmailIcon,
     category: "Growth",
-    objectives: ["increase_conversion", "sharpen_marketing_messaging"],
     description: "Find out how your subscribers like your newsletter content.",
+    objectives: ["increase_conversion", "sharpen_marketing_messaging"],
     preset: {
       name: "Improve Newsletter Content",
-      welcomeCard: welcomeCardDefault,
       questions: [
         {
           id: createId(),
@@ -1277,8 +1273,11 @@ export const templates: TTemplate[] = [
           dismissButtonLabel: "Find your own friends",
         },
       ],
+      welcomeCard: welcomeCardDefault,
       thankYouCard: thankYouCardDefault,
-      hiddenFields: hiddenFieldsDefault,
+      hiddenFields: {
+        enabled: false,
+      },
     },
   },
 ];

apps/formbricks-com/components/shared/BestPracticeNavigation.tsx

@@ -81,7 +81,7 @@ export default function BestPracticeNavigation() {
     },
 
     {
-      name: "Improve Newsletter Cotent",
+      name: "Improve Newsletter Content",
       href: "/improve-newsletter-content",
       status: true,
       icon: FeedbackIcon,

apps/formbricks-com/pages/blog/join-the-formtribe/index.mdx

@@ -1,10 +1,11 @@
-import Image from "next/image";
-import LayoutMdx from "@/components/shared/LayoutMdx";
-import MonorepoImage from "./formbricks-monorepo-folder-structure.png";
-import HeaderImage from "./create-a-new-survey-with-formbricks.png";
-import GitpodImage from "./setup-formbricks-via-gitpod.png";
-import PackagesFolderImage from "./formbricks-packages-folder.png";
 import AuthorBox from "@/components/shared/AuthorBox";
+import LayoutMdx from "@/components/shared/LayoutMdx";
+import Image from "next/image";
+
+import HeaderImage from "./create-a-new-survey-with-formbricks.png";
+import MonorepoImage from "./formbricks-monorepo-folder-structure.png";
+import PackagesFolderImage from "./formbricks-packages-folder.png";
+import GitpodImage from "./setup-formbricks-via-gitpod.png";
 
 export const meta = {
   title: "Join the FormTribe 🔥",
@@ -16,7 +17,7 @@ export const meta = {
   tags: ["Open-Source", "No-Code", "Formbricks", "Geting started", "Welcome guide"],
 };
 
-<AuthorBox name="Johannes" title="Co-Founder" date="October 1st, 2023" duration="4" author={"Johannes"}/>
+<AuthorBox name="Johannes" title="Co-Founder" date="October 1st, 2023" duration="4" author={"Johannes"} />
 
 <Image src={HeaderImage} alt="Title Image" className="w-full rounded-lg" />
 
@@ -54,10 +55,10 @@ To get up and running we have 2 options: Gitpod and local.
 
 With Gitpod you can run all of Formbricks in the cloud. With one click you can start coding right away in your browser:
 
-[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/formbricks/formbricks)
-
 <Image src={GitpodImage} alt="Setup Formbricks via Gitpod" className="w-full rounded-lg" />
 
+[Read more in our docs](https://formbricks.com/docs/contributing/setup#gitpod-guide)
+
 #### Run on a local machine
 
 If you choose to get setup locally, we also have a well documented guide to hold you through the process, you can find it [here](https://formbricks.com/docs/contributing/setup)

apps/formbricks-com/pages/demo/index.tsx

@@ -1,12 +1,12 @@
+import Layout from "@/components/demo/LayoutLight";
 import DemoView from "@/components/dummyUI/DemoView";
-import LayoutWaitlist from "@/pages/demo/LayoutLight";
 
 export default function DemoPage() {
   return (
-    <LayoutWaitlist
+    <Layout
       title="Formbricks Demo"
       description="Play around with our pre-defined 30+ templates and them to kick-start your survey & experience management.">
       <DemoView />
-    </LayoutWaitlist>
+    </Layout>
   );
 }