docs: add features and architecture pages

Author: Boburmirzo

content/docs/guides/gibsonai-features.md

@@ -0,0 +1,58 @@
+---
+title: GibsonAI features
+subtitle: Explore GibsonAI's features
+enableTableOfContents: true
+updatedOn: '2025-06-17T00:37:35.166Z'
+---
+
+## AI-Powered Schema Design and Data Modeling
+
+GibsonAI lets you create and modify database schemas using natural language. Simply describe your needs, and it generates executable SQL, Python models, and Pydantic schemas instantly from scratch or from existing schemas.
+
+## Instant ERD (Entity-Relationship Diagram) Generation
+
+As you build or change schemas, GibsonAI generates live ERDs so you can visualize table relationships and structures.
+
+## Zero-Downtime Migrations
+
+GibsonAI supports seamless schema migrations. You can evolve your data model in production without interruptions, updating the schema live.
+
+## Fully Deployed APIs Out of the Box
+
+For each new schema, GibsonAI automatically provides CRUD endpoints and comprehensive API documentation, including pagination, filtering, and sorting support.
+
+## Native Natural Language to SQL
+
+You can interact with your database using plain English. Ask a question and GibsonAI generates the SQL query for you to run instantly.
+
+## Instant Provisioning of Cloud or On-Prem Databases
+
+Deploy development and production serverless SQL instances with a single command. Instances autoscale to match your workload, only charging you for what you use.
+
+## Autoscaling On Demand
+
+Handling sudden traffic spikes is automatic—compute and storage adjust without intervention.
+
+## AI-Driven Query Optimization
+
+GibsonAI monitors query performance and offers recommendations on indexes, rewrites, or caching to improve speed.
+
+## Connection Strings & Full Schema Export
+
+You can retrieve production-grade connection strings and view the complete SQL schema for external use or deeper inspection.
+
+## Support for Local Studio Tools
+
+A dedicated "Studio" web interface (powered by Drizzle ORM) runs locally for browsing and querying your database within your browser.
+
+## Deployment Environments and Database Cloning
+
+GibsonAI now separates development and production environments and offers easy schema cloning via URL sharing—ideal for forking or collaborating.
+
+## CLI-Based SQL Runner
+
+A built-in SQL runner allows you to query databases directly from your terminal using the Gibson CLI.
+
+## Continuous Updates to Schema Agent & Performance
+
+Regular improvements include faster schema design, enhanced accuracy, upgraded ERD readability, and better error handling in APIs

content/docs/guides/neon-features.md

@@ -1,30 +1,27 @@
 ---
-title: Neon architecture
-redirectFrom:
-  - /docs/storage-engine/architecture-overview
-  - /docs/conceptual-guides/architecture-overview
-updatedOn: '2024-11-21T16:16:13.439Z'
+title: GibsonAI Architecture
+subtitle: Understand infrastructure behind GibsonAI
+updatedOn: '2025-06-17T16:16:13.439Z'
 ---
 
-Neon architecture is based on the separation of compute and storage and is orchestrated by the Neon Control Plane, which manages cloud resources across both storage and compute.
+GibsonAI is built on a modern, scalable infrastructure designed to support dynamic database engineering
 
-A Neon compute runs Postgres, and storage is a multi-tenant key-value store for Postgres pages that is custom-built for the cloud.
+## Cloud-Native Architecture
 
-![Neon architecture diagram](/docs/introduction/neon_architecture_5.jpg)
+GibsonAI runs on a robust cloud platform to ensure high availability and security. 
 
-Neon storage consists of three main components: Safekeepers, Pageservers, and cloud object storage.
+## Modular Microservices
 
-Safekeepers are responsible for durability of recent updates.
-Postgres streams [Write-Ahead Log (WAL)](/docs/reference/glossary#wal) to the Safekeepers, and the Safekeepers store the WAL durably until it has been processed by the Pageservers and uploaded to a cloud object store.
+Each component (ERD generation, schema management, API deployment) is handled by specialized microservices. This makes everything faster and easier to manage or improve.
 
-Pageservers are responsible for serving read requests. To do that, Pageservers process the incoming WAL stream into a custom storage format that makes all [page](/docs/reference/glossary#page) versions easily accessible. Pageservers also upload data to cloud object storage, and download the data on demand.
+## Containerization
 
-Safekeepers can be thought of as an ultra-reliable write buffer that holds the latest data until it is processed and uploaded to cloud storage. Safekeepers implement the Paxos protocol for reliability. Pageservers also function as a read cache for cloud storage, providing fast random access to data pages.
+Utilizes Docker and Kubernetes for easy scaling and reliable deployments.
 
-## Durability
+## Data Security
 
-Durability is at the core of Neon's architecture. As described earlier, incoming WAL data is initially stored across multiple availability zones in a [Paxos](<https://en.wikipedia.org/wiki/Paxos_(computer_science)>) cluster before being uploaded to a cloud object store, such as [Amazon S3](https://aws.amazon.com/s3/) (99.999999999% durability), both in raw WAL and materialized form. Additional copies are maintained across Pageservers to enhance the read performance of frequently accessed data. Consequently, there are always multiple copies of your data in Neon, ensuring durability.
+GibsonAI takes your data seriously. It uses strong encryption to make sure no one can read your data without permission. It also controls who can access what, so only the right people can see or change things.
 
-## Archive storage
+## Continuous Monitoring
 
-Archive storage in Neon, which enables [branch archiving](/docs/guides/branch-archiving) on the Free Plan, optimizes storage resources by offloading data that's not being used. As described above, Neon’s architecture includes Safekeepers, Pageservers, and cloud object storage. In this setup, the Pageservers are responsible for processing and uploading data to cloud object storage as soon as it's written. When a branch is archived, it does not involve moving data; instead, the branch's data is simply evicted from the Pageserver, freeing up Pageserver storage. This approach ensures that while archived data is readily available on demand in cost-efficient object storage, it's no longer taking up space in the more performant storage used by Neon's Pageservers.
+Real-time monitoring and logging using smart monitoring tools. These tools track how well everything is working and alert the team if something goes wrong. This helps fix problems fast and keep the service running smoothly.

content/docs/introduction/architecture-overview.md

@@ -209,11 +209,11 @@
     #       items:
     #         - title: Sample data
     #           slug: import/import-sample-data
-# - section: Platform
-#   items:
-#     - title: Architecture
-#       icon: architecture
-#       slug: introduction/architecture-overview
+- section: Platform
+  items:
+    - title: Architecture
+      icon: architecture
+      slug: introduction/architecture-overview
 #       items:
 #         - title: Overview
 #           slug: introduction/architecture-overview
@@ -223,9 +223,9 @@
 #           slug: introduction/compute-lifecycle
 #         - title: High availability
 #           slug: introduction/high-availability
-#     - title: Features
-#       slug: guides/neon-features
-#       icon: features
+    - title: Features
+      slug: guides/gibsonai-features
+      icon: features
 #       items:
 #         - title: Serverless
 #           slug: introduction/serverless

content/docs/sidebar.yaml

@@ -107,7 +107,7 @@ const icons = {
 const Icon = ({ title, className = null }) => {
   const IconTag = icons[title];
 
-  return <IconTag className={className} />;
+  return <IconTag className={className} style={{ color: '#c0f910' }} />;
 };
 
 Icon.propTypes = {

src/components/pages/doc/menu/icon/icon.jsx

@@ -55,7 +55,6 @@ const Hero = ({ title, text, reset }) => {
       >
         <div className="col-start-2 col-end-6 flex flex-col 2xl:col-start-1 lg:col-end-7 md:col-span-full">
           <h1 className="font-title text-[58px] font-medium leading-none xl:text-5xl xl:leading-none lg:text-4xl">
-            Ooops!
             <br />
             {title}
           </h1>
@@ -65,7 +64,7 @@ const Hero = ({ title, text, reset }) => {
           </div>
         </div>
 
-        <div className="col-start-6 col-end-12 2xl:col-end-13 lg:col-start-7 md:col-span-full">
+        {/* <div className="col-start-6 col-end-12 2xl:col-end-13 lg:col-start-7 md:col-span-full">
           <Image
             className="w-full md:mx-auto md:max-w-xl"
             width={860}
@@ -75,7 +74,7 @@ const Hero = ({ title, text, reset }) => {
             quality={75}
             priority
           />
-        </div>
+        </div> */}
       </Container>
     </section>
   );

src/components/pages/error/hero/hero.jsx

@@ -19,7 +19,7 @@ const styles = {
     xxs: 'h-8 px-4 text-sm tracking-extra-tight',
   },
   theme: {
-    primary: 'bg-primary-1 text-black hover:bg-[#00e5bf]',
+    primary: 'bg-[#c0f910] text-black hover:bg-[#c0f910]',
     secondary: 'bg-black text-white hover:bg-[#292929] disabled:bg-[#292929]',
     tertiary: 'bg-transparent text-white border border-white hover:border-primary-2',
     quaternary: 'bg-white text-black border border-black hover:border-primary-2',
@@ -33,7 +33,7 @@ const styles = {
     'gray-dark-outline-black':
       'text-black border border-gray-new-90 bg-gray-new-98 hover:border-gray-new-70 dark:text-white dark:bg-gray-new-10 dark:border-[#37393D] dark:hover:border-white',
     'green-outline':
-      'bg-[#0D0D0D] text-white border transition-shadow duration-500 border-green-45 hover:shadow-[0px_8px_30px_0px_rgba(0,229,153,.16)]',
+      'bg-[#c0f910] text-white border transition-shadow duration-500 border-green-45 hover:shadow-[0px_8px_30px_0px_rgba(0,229,153,.16)]',
     'green-underlined':
       'underline decoration-green-45/40 hover:decoration-green-45/100 text-green-45 transition-colors duration-500',
     blue: 'bg-blue-80 text-black hover:bg-[#C6EAF1]',

src/components/shared/button/button.jsx

@@ -81,7 +81,7 @@ const Header = ({
               priority
               isHeader
             />
-            <Navigation isDarkTheme={isDarkTheme} />
+            {/* <Navigation isDarkTheme={isDarkTheme} /> */}
           </div>
           <Sidebar isDarkTheme={isDarkTheme} isClient={isClient} />
         </Container>