feat: faq section on landing page as well as docs

apps/formbricks-com/components/docs/Navigation.tsx

@@ -254,6 +254,7 @@ export const navigation: Array<NavGroup> = [
       { title: "Setup Dev Environment", href: "/docs/contributing/setup" },
       { title: "Demo App", href: "/docs/contributing/demo" },
       { title: "Troubleshooting", href: "/docs/contributing/troubleshooting" },
+      { title: "FaQ", href: "/docs/faq" },
     ],
   },
   {

apps/formbricks-com/components/docs/docsFaq.tsx

@@ -0,0 +1,60 @@
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@formbricks/ui";
+
+const FAQ_DATA = [
+  {
+    question: "What is an environment ID?",
+    answer: () => (
+      <>
+        The environment ID is a unique identifier associated with each Environment in Formbricks,
+        distinguishing between different setups like production, development, etc.
+      </>
+    ),
+  },
+  {
+    question: "How can I implement authentication for the Formbricks API?",
+    answer: () => (
+      <>
+        Formbricks provides 2 types of API keys for each environment ie development and production. You can
+        generate, view, and manage these keys in the Settings section on the Admin dashboard. Include the API
+        key in your requests to authenticate and gain access to Formbricks functionalities.
+      </>
+    ),
+  },
+  {
+    question: "Can I run the deployment shell script on any server?",
+    answer: () => (
+      <>
+        You can run it on any machine you own as long as its running a <b> Linux Ubuntu </b> distribution. And
+        to forward the requests, make sure you have an <b>A record</b> setup for your domain pointing to the
+        server.
+      </>
+    ),
+  },
+  {
+    question: "Can I self-host Formbricks?",
+    answer: () => (
+      <>
+        Absolutely! We provide an option for users to host Formbricks on their own server, ensuring even more
+        control over data and compliance. And the best part? Self-hosting is available for free, always. For
+        documentation on self hosting, click{" "}
+        <a href="/docs/self-hosting/deployment" className="text-brand-dark dark:text-brand-light">
+          here
+        </a>
+        .
+      </>
+    ),
+  },
+];
+
+export default function FaQ() {
+  return (
+    <Accordion type="single" collapsible>
+      {FAQ_DATA.map((faq, index) => (
+        <AccordionItem key={`item-${index}`} value={`item-${index + 1}`} className="not-prose mb-0 mt-0">
+          <AccordionTrigger>{faq.question}</AccordionTrigger>
+          <AccordionContent>{faq.answer()}</AccordionContent>
+        </AccordionItem>
+      ))}
+    </Accordion>
+  );
+}