add faqs

Author: sparrow-js

components/faqs/index.tsx

@@ -0,0 +1,52 @@
+import {
+    Accordion,
+    AccordionContent,
+    AccordionItem,
+    AccordionTrigger,
+} from "../components/ui/accordion"
+  
+  
+
+export default function Faqs() {
+    return (
+        <div className="flex flex-col items-center py-20 sm:py-32 lg:pb-32 xl:pb-36">
+            <div className="max-w-xl">
+                <div className="text-center">
+                    <h2 className="text-2xl">
+                    Frequently Asked Questions
+                    </h2>
+                    <p className="text-gray-400 mt-2">
+                    Get answers to frequently asked questions about ancodeai's new generative UI tool.
+                    </p>
+                </div>
+                <div className="mt-6">
+                <Accordion type="multiple" className="w-full">
+                    <AccordionItem value="item-1">
+                    <AccordionTrigger>What is ancodeai?</AccordionTrigger>
+                    <AccordionContent>
+                        By using OpenAI and Gemini technologies to generate highly available code, it supports web (React, Vue, Tailwind CSS, shadcn/ui), native (react native) and other codes. It is generated using GPT-4 Vision. Code is generated by taking screenshots, drawing drafts, and inputting ideas.
+                    </AccordionContent>
+                    </AccordionItem>
+                    <AccordionItem value="item-2">
+                    <AccordionTrigger>Can I see a history of all my generations?</AccordionTrigger>
+                    <AccordionContent>
+                    ancodeai currently does not store your historical data, you need to save it yourself after generating it.                    </AccordionContent>
+                    </AccordionItem>
+                    <AccordionItem value="item-3">
+                    <AccordionTrigger>Can I deploy independently?</AccordionTrigger>
+                    <AccordionContent>
+                        This is an open source project, so you can deploy your own version.<a className="text-blue-500" target="_blank" href="https://github.com/sparrow-js/an-codeAI">➡️ here</a>
+                    </AccordionContent>
+                    </AccordionItem>
+                    <AccordionItem value="item-4">
+                    <AccordionTrigger>Can ancodeai generate data fetching code?</AccordionTrigger>
+                    <AccordionContent>
+                    While in Beta, ancodeai is focused on frontend code generation. As we continue to build ancodeai and prepare for general availability, we will explore adding support for data fetching code.
+                    </AccordionContent>
+                    </AccordionItem>
+                </Accordion>
+                </div>
+            </div>
+        </div>
+    )
+}

pages/index.tsx

@@ -13,6 +13,7 @@ import Footer from '@/components/footer';
 import Hero from '@/components/hero';
 import HeroWhiteboard from '@/components/hero-whiteboard';
 import HeroText from '@/components/hero-text';
+import Faqs from '@/components/faqs';
 
 import dynamic from "next/dynamic";
 import { GeneratedCodeConfig } from '@/components/types';
@@ -206,6 +207,9 @@ export default function Dashboard() {
                     <HeroWhiteboard />
                     <HeroText />
                 </div>
+                <div>
+                    <Faqs />
+                </div>
                 <div className='mt-6'>
                     <Footer />
                 </div>