diff --git a/app/docs/page.tsx b/app/docs/page.tsx index ca0e3b0..41d2782 100644 --- a/app/docs/page.tsx +++ b/app/docs/page.tsx @@ -1,8 +1,2407 @@ -import Link from "next/link"; -import { getArticleContent } from "../services/articleService"; + +"use client"; +import { useState } from "react"; export default function Docs() { - const articleContent = getArticleContent(); + const [currentPage, setCurrentPage] = useState("main"); + const [selectedOperator, setSelectedOperator] = useState("Accumulator"); + const [selectedPostgresItem, setSelectedPostgresItem] = + useState("Components"); + const [selectedGettingStartedItem, setSelectedGettingStartedItem] = useState( + "Python Setup Guide", + ); + + const operatorCategories = [ + "Accumulator", + "Aggregation", + "Arithmetic Expression", + "Array Expression", + "Array Query", + "Array Update", + "Bitwise", + "Bitwise Query", + "Bitwise Update", + "Boolean Expression", + "Comparison Query", + "Conditional Expression", + "Date Expression", + "Data Size", + "Element Query", + "Evaluation Query", + "Field Update", + "Geospatial", + "Logical Query", + "Miscellaneous", + "Object Expression", + "Projection", + "Timestamp Expression", + "Set Expression", + "Variable Expression", + "Window" + ]; + + const postgresMenuItems = ["Components", "Functions"]; + + const gettingStartedMenuItems = [ + "Python Setup Guide", + "VS Code Extension Quick Start", + "MongoDB Shell Quick Start" + ]; + + if (currentPage === "postgres-api") { + return ( +
+ Comprehensive documentation for PostgreSQL extension{" "} + {selectedPostgresItem.toLowerCase()} and their usage + patterns. +
+ )} ++ pg_documentdb_core is a PostgreSQL extension that + introduces BSON datatype support and operations for native + Postgres. This core component is essential for enabling + document-oriented NoSQL capabilities within a PostgreSQL + environment. It provides the foundational data structures + and functions required to handle BSON data types, which + are crucial for performing CRUD operations on documents. +
+ ++ pg_documentdb_api is the public API surface for + DocumentDB, providing CRUD functionality on documents + stored in the database. This component leverages the + capabilities of pg_documentdb_core to offer a + comprehensive set of APIs for managing document data + within PostgreSQL. +
+ ++ To use pg_documentdb_api, you need to have + pg_documentdb_core installed and configured in your + PostgreSQL environment. Once set up, you can leverage the + APIs provided by pg_documentdb_api to perform various + document operations. +
++ The {selectedPostgresItem} section provides comprehensive + information about PostgreSQL extension capabilities. These + components are essential for building robust database + applications with document storage features. +
++ Example usage: +
+
+ SELECT * FROM pg_extension WHERE extname = 'documentdb';
+
+ + Quick start guide for{" "} + {selectedGettingStartedItem.toLowerCase()}. +
++ Get started with DocumentDB using the Visual Studio Code + extension for a seamless development experience. +
+
+ Ctrl+Shift+X
+ {" "}
+ or{" "}
+
+ Cmd+Shift+X
+
+ )
+
+
+ {`docker pull ghcr.io/microsoft/documentdb/documentdb-local:latest
+docker tag ghcr.io/microsoft/documentdb/documentdb-local:latest documentdb
+docker run -dt -p 10260:10260 --name documentdb-container documentdb --username --password
+docker image rm -f ghcr.io/microsoft/documentdb/documentdb-local:latest || echo "No existing documentdb image to remove"`}
+
+
+ Note: Replace{" "}
+
+ <YOUR_USERNAME>
+ {" "}
+ and{" "}
+
+ <YOUR_PASSWORD>
+ {" "}
+ with your desired credentials. You must set these
+ when creating the container for authentication to
+ work.
+
+ Port Note: Port{" "}
+
+ 10260
+ {" "}
+ is used by default in these instructions to avoid
+ conflicts with other local database services. You
+ can use port{" "}
+
+ 27017
+ {" "}
+ (the standard MongoDB port) or any other available
+ port if you prefer. If you do, be sure to update the
+ port number in both your{" "}
+
+ docker run
+ {" "}
+ command and your connection string accordingly.
+
+ mongodb://<YOUR_USERNAME>:<YOUR_PASSWORD>@localhost:10260/?tls=true&tlsAllowInvalidCertificates=true&authMechanism=SCRAM-SHA-256
+
+
+ {`{
+ "name": "Test Document",
+ "type": "example",
+ "created_at": new Date()
+}`}
+
+ + Get started with DocumentDB using the MongoDB shell for a + familiar MongoDB-compatible experience. +
+
+ {`# Pull the latest DocumentDB Docker image
+docker pull ghcr.io/microsoft/documentdb/documentdb-local:latest
+
+# Tag the image for convenience
+docker tag ghcr.io/microsoft/documentdb/documentdb-local:latest documentdb
+
+# Run the container with your chosen username and password
+docker run -dt -p 10260:10260 --name documentdb-container documentdb --username --password
+docker image rm -f ghcr.io/microsoft/documentdb/documentdb-local:latest || echo "No existing documentdb image to remove"`}
+
+
+ Note: Replace{" "}
+
+ <YOUR_USERNAME>
+ {" "}
+ and{" "}
+
+ <YOUR_PASSWORD>
+ {" "}
+ with your desired credentials. You must set these
+ when creating the container for authentication to
+ work.
+
+ Port Note: Port{" "}
+
+ 10260
+ {" "}
+ is used by default in these instructions to avoid
+ conflicts with other local database services. You
+ can use port{" "}
+
+ 27017
+ {" "}
+ (the standard MongoDB port) or any other available
+ port if you prefer. If you do, be sure to update the
+ port number in both your{" "}
+
+ docker run
+ {" "}
+ command and your connection string accordingly.
+
+ {`# The server will be available at localhost:10260 (or your chosen port)
+# You can verify the server is running using:
+docker ps`}
+
+ + Connection string format +
+
+ {`mongosh "mongodb://:@localhost:10260/?tls=true&tlsAllowInvalidCertificates=true"`}
+
+
+ {`// Create/switch to a database
+use mydb
+
+// Create a collection
+db.createCollection("users")
+
+// Create another collection
+db.createCollection("logs")`}
+
+
+ {`// Insert a single document
+db.users.insertOne({ name: "John Doe", email: "john@example.com", created_at: new Date() })
+
+// Insert multiple documents
+db.users.insertMany([
+ { name: "Jane Smith", email: "jane@example.com" },
+ { name: "Bob Johnson", email: "bob@example.com" }
+])`}
+
+
+ {`// Find all documents
+db.users.find()
+
+// Find with criteria
+db.users.find({ name: "John Doe" })
+
+// Find with projection
+db.users.find({}, { name: 1, email: 1, _id: 0 })
+
+// Complex queries
+db.users.find(
+{ $and:
+ [{
+ created_at: { $gte: new Date("2025-01-01") }
+ },
+ {
+ email: { $regex: "@example.com$" }
+ }
+ ]
+})`}
+
+
+ {`// Update a single document
+db.users.updateOne({ name: "John Doe" }, { $set: { status: "active" } })
+
+// Update multiple documents
+db.users.updateMany({ email: { $regex: "@example.com$" } }, { $set: { domain: "example.com" } })`}
+
+
+ {`// Delete a single document
+db.users.deleteOne({ name: "John Doe" })
+
+// Delete multiple documents
+db.users.deleteMany({ status: "inactive" })`}
+
+
+ {`// Available index types:
+// - Single field
+// - Compound
+// - Multi-key
+// - Text
+// - Geospatial
+// - Vector`}
+
+
+ {`// Single field index
+db.users.createIndex({ email: 1 })
+
+// Compound index
+db.users.createIndex({ name: 1, email: 1 })
+`}
+
+
+ {`// Get database stats
+db.stats()
+
+// Get collection stats
+db.users.stats()`}
+
+
+ {`// Get collection size
+db.users.dataSize()
+
+// Get index sizes
+db.users.stats().indexSizes`}
+
+ + Learn how to set up and use DocumentDB with Python using the MongoDB Python driver (PyMongo). +
+
+ {`pip install pymongo`}
+
+
+ {`pip install dnspython`}
+
+
+ {`# Pull the latest DocumentDB Docker image
+docker pull ghcr.io/microsoft/documentdb/documentdb-local:latest
+
+# Tag the image for convenience
+docker tag ghcr.io/microsoft/documentdb/documentdb-local:latest documentdb
+
+# Run the container with your chosen username and password
+docker run -dt -p 10260:10260 --name documentdb-container documentdb --username --password
+docker image rm -f ghcr.io/microsoft/documentdb/documentdb-local:latest || echo "No existing documentdb image to remove"`}
+
+ + Note: During the transition to the Linux Foundation, Docker images may still be hosted on Microsoft's container registry. These will be migrated to the new DocumentDB organization as the transition completes. +
+
+ Note: Replace{" "}
+
+ <YOUR_USERNAME>
+ {" "}
+ and{" "}
+
+ <YOUR_PASSWORD>
+ {" "}
+ with your desired credentials. You must set these when creating the container for authentication to work.
+
+ Port Note: Port{" "}
+
+ 10260
+ {" "}
+ is used by default in these instructions to avoid conflicts with other local database services. You can use port{" "}
+
+ 27017
+ {" "}
+ (the standard MongoDB port) or any other available port if you prefer. If you do, be sure to update the port number in both your{" "}
+
+ docker run
+ {" "}
+ command and your connection string accordingly.
+
+ {`import pymongo
+from pymongo import MongoClient
+
+# Create a MongoDB client and open a connection to DocumentDB
+client = pymongo.MongoClient(
+ 'mongodb://:@localhost:10260/?tls=true&tlsAllowInvalidCertificates=true'
+ )`}
+
+
+ {`quickStartDatabase = client["quickStartDatabase"]
+quickStartCollection = quickStartDatabase.create_collection("quickStartCollection")`}
+
+
+ {`# Insert a single document
+quickStartCollection.insert_one({
+ 'name': 'John Doe',
+ 'email': 'john@email.com',
+ 'address': '123 Main St, Anytown, USA',
+ 'phone': '555-1234'
+ })
+
+# Insert multiple documents
+quickStartCollection.insert_many([
+ {
+ 'name': 'Jane Smith',
+ 'email': 'jane@email.com',
+ 'address': '456 Elm St, Othertown, USA',
+ 'phone': '555-5678'
+ },
+ {
+ 'name': 'Alice Johnson',
+ 'email': 'alice@email.com',
+ 'address': '789 Oak St, Sometown, USA',
+ 'phone': '555-8765'
+ }
+])`}
+
+
+ {`# Read all documents
+for document in quickStartCollection.find():
+ print(document)
+
+# Read a specific document
+singleDocumentReadResult = quickStartCollection.find_one({'name': 'John Doe'})
+ print(singleDocumentReadResult)`}
+
+
+ {`pipeline = [
+ {'$match': {'name': 'Alice Johnson'}},
+ {'$project': {
+ '_id': 0,
+ 'name': 1,
+ 'email': 1
+ }}
+]
+
+results = quickStartCollection.aggregate(pipeline)
+print("Aggregation results:")
+for eachDocument in results:
+ print(eachDocument)`}
+
+ + Welcome to the {selectedGettingStartedItem} guide. This + section will help you get up and running quickly. +
+ +
+ # Installation instructions for{" "}
+ {selectedGettingStartedItem}
+
+ + Configure your environment for optimal use with + DocumentDB. +
+ ++ Start building with DocumentDB using{" "} + {selectedGettingStartedItem}. +
++ List of supported {selectedOperator} operators. Detailed + usage samples coming soon! +
++ The {selectedOperator} category provides powerful + operators for document manipulation and querying. These + operators are essential for building complex database + operations and data transformations. +
++ Example usage: +
+
+ db.collection.find(
+ {`{${selectedOperator.toLowerCase()}_operator: value}`})
+
+ + Description of operator {i} functionality and use + cases. +
+
+ {`{ $operator${i}: { field: "value" } }`}
+
+ + We're building something amazing! The technical architecture + documentation is coming soon. +
+ +- {articleContent.landing.description} + Everything you need to build with DocumentDB - from getting started + guides to deep architectural insights