diff --git a/.devcontainer/Dockerfile b/.devcontainer/Dockerfile new file mode 100644 index 000000000..df13f31ff --- /dev/null +++ b/.devcontainer/Dockerfile @@ -0,0 +1,3 @@ +FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:latest +RUN npm install -g pnpm vercel supabase +RUN npx playwright install --with-deps diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json new file mode 100644 index 000000000..5612cee32 --- /dev/null +++ b/.devcontainer/devcontainer.json @@ -0,0 +1,7 @@ +{ + "name": "Botsmann DevContainer", + "build": { + "dockerfile": "Dockerfile" + }, + "postCreateCommand": "pnpm install && vercel login --token $VERCEL_TOKEN" +} diff --git a/.env.example b/.env.example index c44afbf87..9fe200167 100644 --- a/.env.example +++ b/.env.example @@ -1,13 +1,15 @@ # MongoDB connection string -MONGODB_URI=mongodb://localhost:27017/botsmann +MONGODB_URI= -# API key for authentication -API_KEY=your-secure-api-key-here -NEXT_PUBLIC_API_KEY=your-secure-api-key-here +# API key for authentication (required for form submissions) +API_KEY= +NEXT_PUBLIC_API_KEY= + +# AWS SES Configuration +NEXT_AWS_ACCESS_KEY_ID= +NEXT_AWS_SECRET_ACCESS_KEY= +NEXT_AWS_REGION= # Email Configuration -SENDGRID_API_KEY=your_sendgrid_api_key -SENDGRID_WELCOME_TEMPLATE_ID=your_template_id -EMAIL_FROM=noreply@botsmann.com -ADMIN_EMAIL=admin@botsmann.com -DASHBOARD_URL=https://app.botsmann.com/dashboard +FROM_EMAIL= +ADMIN_EMAIL= diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml new file mode 100644 index 000000000..86ae6255d --- /dev/null +++ b/.github/workflows/ci.yml @@ -0,0 +1,23 @@ +name: CI +on: [push, pull_request] +jobs: + ts: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + - uses: pnpm/action-setup@v2 + with: + version: 8 + - uses: actions/setup-node@v3 + with: + node-version: lts/* + cache: pnpm + - run: pnpm install + - run: pnpm lint && pnpm type + - run: pnpm test -- --coverage + - run: node scripts/coverage-check.js + - run: pnpm test:e2e + - run: pnpm docs + - run: pnpm chromatic --exit-once-uploaded + - run: vercel deploy --prebuilt --token ${{ secrets.VERCEL_TOKEN }} --yes --json > url.txt + - run: echo "::notice title=Preview::https://$(cat url.txt)" diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml new file mode 100644 index 000000000..e9ff40f0e --- /dev/null +++ b/.github/workflows/codeql.yml @@ -0,0 +1,20 @@ +name: CodeQL +on: + push: + branches: [main] + pull_request: + # The branches for which pull requests will be built. + branches: [main] +permissions: + contents: read + security-events: write +jobs: + analyze: + name: Analyze + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + - uses: github/codeql-action/init@v2 + with: + languages: javascript + - uses: github/codeql-action/analyze@v2 diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml new file mode 100644 index 000000000..e628e807e --- /dev/null +++ b/.github/workflows/release.yml @@ -0,0 +1,21 @@ +name: Release +on: + push: + branches: [main] +jobs: + release: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + - uses: pnpm/action-setup@v2 + with: + version: 8 + - uses: actions/setup-node@v3 + with: + node-version: lts/* + cache: pnpm + - run: pnpm install + - run: npx sentry-cli sourcemaps upload --url-prefix ~/dist ./dist + - run: npx semantic-release + - run: vercel deploy --prod --token ${{ secrets.VERCEL_TOKEN }} --yes --json > url.txt + - run: curl -X POST -H 'Content-Type: application/json' -d '{"text":"New release deployed: https://$(cat url.txt)"}' ${{ secrets.SLACK_WEBHOOK }} diff --git a/.husky/commit-msg b/.husky/commit-msg new file mode 100755 index 000000000..e4ce4a513 --- /dev/null +++ b/.husky/commit-msg @@ -0,0 +1,4 @@ +#!/bin/sh +. "$(dirname "$0")/_/husky.sh" + +npx commitlint --edit "$1" diff --git a/.husky/pre-commit b/.husky/pre-commit new file mode 100755 index 000000000..36af21989 --- /dev/null +++ b/.husky/pre-commit @@ -0,0 +1,4 @@ +#!/bin/sh +. "$(dirname "$0")/_/husky.sh" + +npx lint-staged diff --git a/README-botsmann-blog-content.md b/README-botsmann-blog-content.md new file mode 100644 index 000000000..f39780a46 --- /dev/null +++ b/README-botsmann-blog-content.md @@ -0,0 +1,79 @@ +# Botsmann Blog Content + +This repository contains content for the Botsmann blog. Each post is stored as an MDX file in its own directory under `posts/`. + +## Post Structure + +Each post should follow this structure: +- A directory under `posts/` with a URL-friendly name +- An `index.mdx` file containing the post content and frontmatter +- Any media files (images, etc.) stored in the same directory or a `media/` subdirectory + +## Frontmatter Format + +Each MDX file should begin with frontmatter in this format: + +``` +--- +title: "Post Title" +date: "YYYY-MM-DD" +author: "Author Name" +excerpt: "Brief description of the post" +published: true # Set to true to publish at next 9am window +tags: ["tag1", "tag2"] # Optional +featuredImage: "./featured.jpg" # Optional +--- +``` + +## Publishing Workflow + +1. Create a new directory under `posts/` +2. Add your content as `index.mdx` with proper frontmatter +3. Add any images or media to the same directory +4. Set `published: true` when ready to publish +5. The post will go live at the next 9am publishing window + +## Rich Media Support + +The blog supports various rich media components: + +### Images + +```markdown +![Alt text](./media/image-name.jpg) +``` + +### YouTube Videos + +```markdown + +``` + +### Tweets + +```markdown + +``` + +### Callouts + +```markdown + + Important information goes here. + +``` + +Types: `info`, `warning`, `success` + +## Example Structure + +``` +posts/ +├── welcome-post/ +│ ├── index.mdx +│ └── featured.jpg +└── test-post/ + ├── index.mdx + └── media/ + └── example.png +``` \ No newline at end of file diff --git a/README-heidi-implementation.md b/README-heidi-implementation.md new file mode 100644 index 000000000..efddb6a44 --- /dev/null +++ b/README-heidi-implementation.md @@ -0,0 +1,72 @@ +# Heidi – Your Swiss German Companion + +This document outlines the implementation of Heidi, an AI-powered Swiss German language assistant integrated into the Botsmann platform. + +## Overview + +Heidi helps expats and learners master High German (Hochdeutsch) and Swiss German (Züridütsch), offering practical language tools, communication support, and cultural integration insights for Switzerland. + +## Implementation Details + +### Files Updated/Created + +1. **Data Files**: + - `data/bots.ts` - Updated with Heidi's information, including title, description, features, and tryLink + - `data/solutions.json` - Updated the swiss-german-teacher entry with Heidi's information + - `data/waitlist.json` - Created to store waitlist entries + +2. **UI Files**: + - `app/bots/swiss-german-teacher/page.tsx` - Redesigned to match the TDD requirements with responsive sections, including: + - In-page input field that redirects to the ChatGPT version of Heidi + - Waitlist form for collecting emails and preferences for future features + - Solutions pages use the dynamic routing via `app/solutions/individuals/[slug]/page.tsx` + +3. **Backend Logic**: + - `lib/nlp.ts` - Created but kept inactive as NLP processing occurs in the ChatGPT custom GPT + - `app/api/waitlist/route.ts` - API endpoint to handle waitlist form submissions + +### Features Implemented + +- **Input Redirection**: In-page input field that redirects to the ChatGPT version of Heidi +- **Waitlist Collection**: Form to collect email addresses and content preferences for future features +- **Integration with Try Link**: Direct links to ChatGPT version of Heidi throughout the interface +- **Local Data Storage**: Simple JSON-based storage for waitlist entries + +## Current Functionality + +Heidi's functionality is currently delivered via a ChatGPT custom GPT: + +1. **Main Interaction Flow**: + - Users enter input on the Botsmann website + - They are redirected to the ChatGPT version of Heidi with their input + - All NLP processing occurs within ChatGPT, not within Botsmann + +2. **Waitlist Collection**: + - Users can join a waitlist for future features + - Collected data includes email and content preferences + - Data is stored in a local JSON file (would be connected to CRM in production) + +## Future Enhancements + +As noted in the TDD, potential future enhancements (requiring approval) include: + +### Phase 2 (3-6 Months): +- Activate `lib/nlp.ts` for in-page demo (e.g., single-word tables via OpenAI API) + +### Phase 3 (12-18 Months): +- Full in-house NLP for all inputs +- Sign-up system for: + - Zurich Events: Post events in chat/section + - Newsletters: Personalized emails + - Blog: Züridütsch posts in /app/blog + - Videos/Audios: Daily content via text-to-speech + - Custom Communication: Tailored chat with user profiles + +## Testing + +To test the implementation: +1. Visit the bot page at `/bots/swiss-german-teacher` +2. Verify all sections display correctly, including the input field +3. Test the input field by entering text and confirming redirection to ChatGPT +4. Test the waitlist form by submitting an email and preferences +5. Check the solution page at `/solutions/individuals/swiss-german-teacher` \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 000000000..ac076daaa --- /dev/null +++ b/README.md @@ -0,0 +1,191 @@ +# Botsmann - AI Bot Platform + +## Overview + +Botsmann is a platform for creating, showcasing, and managing AI bots built with the OpenAI API. Each bot provides specialized functionality through a custom web interface that connects to a ChatGPT-powered backend. + +## Architecture + +The platform follows a Next.js-based architecture with the following structure: + +``` +botsmann/ +├── app/ # Main Next.js application +│ ├── api/ # API routes +│ ├── bots/ # Individual bot applications +│ │ ├── medical-expert/ # Medical Expert (Imhotep) bot +│ │ ├── research-assistant/ # Research Assistant (Nerd) bot +│ │ └── ... # Other specialized bots +│ └── ... # Other app directories +├── components/ # Shared UI components +├── data/ # Static data and configuration +├── lib/ # Shared utilities and helper functions +├── public/ # Static assets +│ └── images/ # Image assets used across the platform +└── types/ # TypeScript type definitions +``` + +## Technology Stack + +- **Frontend**: React, Next.js, TailwindCSS +- **Backend**: Next.js API routes, OpenAI API integration +- **Styling**: TailwindCSS with custom utility classes +- **Testing**: Jest, React Testing Library +- **Deployment**: Vercel + +## Getting Started + +### Prerequisites + +- Node.js 18+ and npm +- OpenAI API key + +### Installation + +1. Clone the repository: + ```bash + git clone https://github.com/yourusername/botsmann.git + cd botsmann + ``` + +2. Install dependencies: + ```bash + npm install + ``` + +3. Copy `.env.example` to `.env` and add your OpenAI API key: + ```bash + cp .env.example .env + ``` + Then edit `.env` to include your OpenAI API key: + ``` + OPENAI_API_KEY=your_api_key_here + ``` + +4. Start the development server: + ```bash + npm run dev + ``` + +5. Open [http://localhost:3000](http://localhost:3000) in your browser. + +## Development Workflow + +### Creating a New Bot + +1. Create a new directory in `app/bots/` with your bot's name (e.g., `app/bots/your-bot-name/`) +2. Create the following files: + - `page.tsx`: Main entry point for your bot's UI + - `README.md`: Documentation specific to your bot + - `styles.module.css`: Bot-specific styles (if needed) + - `/components/`: Directory for bot-specific components + +3. Add your bot's metadata to `data/bots.ts` to have it appear in the main directory + +### Code Conventions + +- Use TypeScript for all new code +- Use functional components with React hooks +- Follow the component organization pattern established in existing bots +- Document all components with JSDoc comments +- Keep components modular and reusable when possible + +### Testing + +Run tests with: + +```bash +npm test +``` + +Write tests for components in a `__tests__` directory alongside the component. + +## Contributing + +1. Create a new branch for your feature: + ```bash + git checkout -b feature/your-feature-name + ``` + +2. Make your changes and commit them: + ```bash + git commit -m "Add new feature/fix" + ``` + +3. Push to your branch: + ```bash + git push origin feature/your-feature-name + ``` + +4. Create a pull request against the main branch + +## Deployment + +### GitHub Setup + +The Botsmann platform uses GitHub for version control and as a deployment source: + +1. **Push to GitHub:** + ```bash + # Add all changes + git add . + + # Commit changes with a descriptive message + git commit -m "Your commit message" + + # Push to the GitHub repository + git push origin + ``` + +2. **Merge to Main Branch:** + - Create a pull request on GitHub + - Review code changes + - Merge into the main branch + +### Vercel Deployment + +The platform is configured for deployment on Vercel. Deployments are automatically triggered when changes are pushed to the main branch. + +1. **Initial Vercel Setup:** + - Create an account on [Vercel](https://vercel.com) + - Connect your GitHub account to Vercel + - Import the Botsmann repository + - Vercel will automatically detect the Next.js project + +2. **Environment Variables:** + Set the following environment variables in the Vercel project settings: + - `OPENAI_API_KEY`: Your OpenAI API key + - `NEXT_PUBLIC_BASE_URL`: The base URL of your deployment (e.g., https://botsmann.vercel.app) + +3. **Deployment Options:** + - **Production Deployment:** Automatically triggered when pushing to the main branch + - **Preview Deployments:** Automatically created for pull requests + - **Manual Deployment:** Can be triggered from the Vercel dashboard + +4. **Monitoring Deployments:** + - Monitor build logs in the Vercel dashboard + - Check deployment status in the GitHub repository + - View detailed analytics and performance metrics in Vercel + +5. **Rollback (if needed):** + - Use the Vercel dashboard to view deployment history + - Select a previous successful deployment to instantly rollback + +### Custom Domain Configuration (Optional) + +1. Purchase a domain through a domain registrar +2. Add the domain in your Vercel project settings +3. Configure DNS settings as instructed by Vercel +4. Verify domain ownership +5. Enable HTTPS for your custom domain + +## Bot Documentation + +For details on specific bots, see their individual README files: + +- [Medical Expert (Imhotep)](./app/bots/medical-expert/README.md) +- [Research Assistant (Nerd)](./app/bots/research-assistant/README.md) + +## License + +[MIT License](LICENSE) \ No newline at end of file diff --git a/app/about/page.tsx b/app/about/page.tsx index 3252eac13..a8cee2a67 100644 --- a/app/about/page.tsx +++ b/app/about/page.tsx @@ -1,21 +1,57 @@ import React from 'react'; import ConsultationForm from '@/components/ConsultationForm'; +import { NextSection } from '@/src/components/navigation/NextSection'; export default function About() { return ( -
-

About Botsmann

-

- We specialize in developing cutting-edge AI solutions that help businesses automate tasks, - enhance productivity, and unlock new possibilities. Our suite of specialized bots is designed - to tackle specific challenges across various industries. -

+
+

About Botsmann

+ +
+

Our Philosophy

+

+ We believe in the transformative power of transparency and automation. Our projects are driven by + three core principles: making processes transparent, automating redundant tasks, and empowering + individuals through technology. By building in public, financing in public, and transacting in + public, we create systems that are accountable and trustworthy. +

+

+ Our commitment to transparency extends beyond just making data visible – we believe in making + every process, decision, and transaction fully understandable and accessible. This philosophy + drives our project development, from government spending tracking to transparent project finance. +

+
+ +
+

Our Mission

+

+ At Botsmann, we are committed to methodically automating redundant, intransparent, and + labor-intensive processes. Our mission is to free people from unpleasant tasks, giving + them back their most precious resource: time and freedom to focus on what truly matters. +

+
+ +
+

Our Approach

+

+ Through innovative AI solutions and automation technologies, we transform complex, + time-consuming workflows into efficient, transparent processes. Our commitment to + transparency ensures that every automated decision is traceable and understandable, + building trust between humans and AI systems. +

+

Get in Touch

+ +
); } diff --git a/app/api/consultations/route.ts b/app/api/consultations/route.ts index 9e0a64b54..d5d6f457e 100644 --- a/app/api/consultations/route.ts +++ b/app/api/consultations/route.ts @@ -38,7 +38,21 @@ async function handler(req: NextRequest) { // Connect to DB (skipped in test environment) if (process.env.NODE_ENV !== 'test') { - await connectDB(); + try { + await connectDB(); + } catch (error) { + console.error('Failed to connect to database:', error); + return new Response( + JSON.stringify(createErrorResponse( + 'Database connection error', + 'INTERNAL_ERROR' + )), + { + status: 503, + headers: { 'Content-Type': 'application/json' } + } + ); + } } const consultation = await Consultation.create(validatedData); @@ -107,4 +121,4 @@ async function handler(req: NextRequest) { } } -export const POST = (req: NextRequest) => monitorRequest(req, handler); \ No newline at end of file +export const POST = (req: NextRequest) => monitorRequest(req, handler); \ No newline at end of file diff --git a/app/api/health/route.ts b/app/api/health/route.ts new file mode 100644 index 000000000..79038ea9d --- /dev/null +++ b/app/api/health/route.ts @@ -0,0 +1,24 @@ +import { NextResponse } from 'next/server'; +import { connectDB } from '../../../src/lib/mongodb'; + +export async function GET() { + try { + const conn = await connectDB(); + const isConnected = conn.connection.readyState === 1; + + if (!isConnected) { + throw new Error('Database not connected'); + } + + return NextResponse.json( + { status: 'healthy', mongodb: 'connected' }, + { status: 200 } + ); + } catch (error) { + console.error('Health check failed:', error); + return NextResponse.json( + { status: 'unhealthy', error: 'Database connection failed' }, + { status: 503 } + ); + } +} diff --git a/app/api/rebuild/route.ts b/app/api/rebuild/route.ts new file mode 100644 index 000000000..1ecd534ad --- /dev/null +++ b/app/api/rebuild/route.ts @@ -0,0 +1,20 @@ +import { revalidatePath } from 'next/cache'; +import { NextResponse } from 'next/server'; + +export async function GET() { + try { + // Revalidate the blog pages + revalidatePath('/blog'); + + return NextResponse.json({ + revalidated: true, + now: new Date().toISOString(), + message: 'Blog content has been refreshed.' + }); + } catch (error) { + return NextResponse.json( + { revalidated: false, message: 'Error revalidating content', error: String(error) }, + { status: 500 } + ); + } +} \ No newline at end of file diff --git a/app/api/waitlist/route.ts b/app/api/waitlist/route.ts new file mode 100644 index 000000000..5d69d6cfb --- /dev/null +++ b/app/api/waitlist/route.ts @@ -0,0 +1,91 @@ +import { NextRequest, NextResponse } from 'next/server'; +import fs from 'fs'; +import path from 'path'; + +interface WaitlistEntry { + email: string; + preferences: { + events: boolean; + newsletters: boolean; + blog: boolean; + videos: boolean; + }; + timestamp: string; +} + +export async function POST(req: NextRequest) { + try { + const data = await req.json(); + const { email, preferences } = data; + + // Validate email + if (!email || typeof email !== 'string' || !isValidEmail(email)) { + return NextResponse.json({ error: 'Invalid email address' }, { status: 400 }); + } + + // Create entry + const waitlistEntry: WaitlistEntry = { + email, + preferences: { + events: Boolean(preferences?.events), + newsletters: Boolean(preferences?.newsletters), + blog: Boolean(preferences?.blog), + videos: Boolean(preferences?.videos), + }, + timestamp: new Date().toISOString(), + }; + + // In a production environment, you would typically: + // 1. Store this in a database + // 2. Connect to a CRM or email marketing service + // 3. Implement email verification + + // For demo purposes, we'll save to a local JSON file + const waitlistFilePath = path.join(process.cwd(), 'data', 'waitlist.json'); + let waitlist: WaitlistEntry[] = []; + + try { + // Read existing file if it exists + if (fs.existsSync(waitlistFilePath)) { + const fileContent = fs.readFileSync(waitlistFilePath, 'utf8'); + waitlist = JSON.parse(fileContent); + } + } catch (error) { + console.error('Error reading waitlist file:', error); + // If file is corrupted, start with empty array + waitlist = []; + } + + // Check if email already exists + const emailExists = waitlist.some(entry => entry.email === email); + if (emailExists) { + return NextResponse.json( + { message: 'Email already registered for waitlist' }, + { status: 200 } + ); + } + + // Add new entry + waitlist.push(waitlistEntry); + + // Write back to file + fs.writeFileSync(waitlistFilePath, JSON.stringify(waitlist, null, 2), 'utf8'); + + return NextResponse.json( + { message: 'Successfully added to waitlist' }, + { status: 200 } + ); + } catch (error) { + console.error('Error processing waitlist submission:', error); + return NextResponse.json( + { error: 'Failed to process waitlist submission' }, + { status: 500 } + ); + } +} + +// Email validation helper +function isValidEmail(email: string): boolean { + const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; + return emailRegex.test(email); +} \ No newline at end of file diff --git a/app/blog/[slug]/page.tsx b/app/blog/[slug]/page.tsx new file mode 100644 index 000000000..33470027d --- /dev/null +++ b/app/blog/[slug]/page.tsx @@ -0,0 +1,133 @@ +import { notFound } from 'next/navigation'; +import Image from 'next/image'; +import { fetchBlogPosts, fetchBlogPostBySlug } from '@/lib/blog'; +import Comments from '@/components/blog/Comments'; +import ClientMDXContent from '@/components/blog/ClientMDXContent'; +import { Metadata } from 'next'; +import { format } from 'date-fns'; + +// Generate static paths for all blog posts +export async function generateStaticParams() { + try { + const posts = await fetchBlogPosts(); + return posts.map((post) => ({ + slug: post.slug, + })); + } catch (error) { + console.error("Error generating static params:", error); + return []; + } +} + +// Generate metadata for the page +export async function generateMetadata({ params }: { params: { slug: string } }): Promise { + try { + const post = await fetchBlogPostBySlug(params.slug); + + if (!post) { + return { + title: 'Post Not Found | Botsmann', + }; + } + + return { + title: `${post.title} | Botsmann Blog`, + description: post.excerpt, + openGraph: { + title: post.title, + description: post.excerpt, + type: 'article', + publishedTime: post.date, + authors: [post.author], + images: post.featuredImage ? [ + { + url: post.featuredImage, + width: 1200, + height: 630, + alt: post.title + } + ] : [], + }, + twitter: { + card: 'summary_large_image', + title: post.title, + description: post.excerpt, + images: post.featuredImage ? [post.featuredImage] : [], + } + }; + } catch (error) { + console.error("Error generating metadata:", error); + return { + title: 'Error | Botsmann', + }; + } +} + +export default async function BlogPost({ params }: { params: { slug: string } }) { + console.log('Rendering blog post for slug:', params.slug); + + try { + if (!params.slug) { + console.error('Missing slug parameter'); + notFound(); + } + + const post = await fetchBlogPostBySlug(params.slug); + + if (!post) { + console.error('Blog post not found for slug:', params.slug); + notFound(); + } + + return ( +
+
+
+ + • + {post.author} +
+ +

+ {post.title} +

+ + {post.tags && post.tags.length > 0 && ( +
+ {post.tags.map(tag => ( + + {tag} + + ))} +
+ )} + + {post.featuredImage && ( +
+ {post.title} +
+ )} +
+ + + + +
+ ); + } catch (error) { + console.error('Error rendering blog post:', error); + throw error; // Re-throw to let Next.js error handling take over + } +} \ No newline at end of file diff --git a/app/blog/future-of-shopping/page.mdx b/app/blog/future-of-shopping/page.mdx index 90aec66ea..ecba11ec1 100644 --- a/app/blog/future-of-shopping/page.mdx +++ b/app/blog/future-of-shopping/page.mdx @@ -1,10 +1,10 @@ # The Future of Shopping: One Word is All You Need -Shopping is about to become radically simpler with Roboshop's revolutionary one-word query system. Our AI-powered shopping assistant understands exactly what you need from a single word, making online shopping more efficient and intuitive than ever before. +Shopping is about to become radically simpler with our revolutionary one-word query system. Our AI-powered shopping assistant understands exactly what you need from a single word, making online shopping more efficient and intuitive than ever before. ## The Power of One Word -Traditional e-commerce requires you to navigate through multiple menus, filters, and search results. With Roboshop, you simply: +Traditional e-commerce requires you to navigate through multiple menus, filters, and search results. With our AI shopping assistant, you simply: 1. Enter a single word 2. Let our AI understand your intent @@ -14,7 +14,7 @@ Our natural language processing system understands context, preferences, and sho ## Multi-Platform Integration -Roboshop searches across multiple e-commerce platforms simultaneously: +Our AI shopping assistant searches across multiple e-commerce platforms simultaneously: - Amazon marketplace integration - Ricardo platform connectivity @@ -33,7 +33,7 @@ Our advanced AI system: ## Real-World Examples -Here's how Roboshop interprets different single-word queries: +Here's how our AI shopping assistant interprets different single-word queries: - "Laptop" → Understanding your need for portable computing - "Camera" → Matching your photography requirements @@ -41,6 +41,6 @@ Here's how Roboshop interprets different single-word queries: ## The Future is Here -Roboshop represents the next evolution in e-commerce, where complex shopping decisions are simplified through AI intelligence. Try it today and experience the future of shopping. +Our AI shopping assistant represents the next evolution in e-commerce, where complex shopping decisions are simplified through AI intelligence. Try it today and experience the future of shopping. -[Contact us](/about) to learn more about implementing Roboshop in your business. +[Contact us](/about) to learn more about implementing our AI shopping assistant in your business. diff --git a/app/blog/layout.tsx b/app/blog/layout.tsx index e63f54b4d..1eafb2050 100644 --- a/app/blog/layout.tsx +++ b/app/blog/layout.tsx @@ -1,5 +1,4 @@ import React from 'react'; -import { MDXProviderWrapper } from './mdx-provider'; export default function BlogLayout({ children, @@ -10,7 +9,7 @@ export default function BlogLayout({
- {children} + {children}
diff --git a/app/blog/mdx-provider.tsx b/app/blog/mdx-provider.tsx index f460a9798..8b1378917 100644 --- a/app/blog/mdx-provider.tsx +++ b/app/blog/mdx-provider.tsx @@ -1,35 +1 @@ -'use client'; -import React from 'react'; -import { MDXProvider } from '@mdx-js/react'; - -const components = { - h1: (props: any) => ( -

- ), - h2: (props: any) => ( -

- ), - h3: (props: any) => ( -

- ), - p: (props: any) => ( -

- ), - ul: (props: any) => ( -

); diff --git a/app/blog/welcome-to-botsmann/page.mdx b/app/blog/welcome-to-botsmann/page.mdx index 52220f834..a34af9a96 100644 --- a/app/blog/welcome-to-botsmann/page.mdx +++ b/app/blog/welcome-to-botsmann/page.mdx @@ -10,16 +10,16 @@ We believe in the power of AI to drive positive change in society. Through our s - Support healthcare professionals with our Medical Expert Assistant - Provide legal guidance through our Legal Expert Assistant - Foster creativity with our Artistic Advisor -- Promote government transparency with LiberTech -- Revolutionize shopping with Roboshop +- Promote government transparency through our Governance project +- Transform shopping with our AI Shopping Assistant ## Featured Projects -### LiberTech -Our flagship project dedicated to maximizing human liberty and minimizing government power. The centerpiece is our Venmo-style government spending tracker, bringing unprecedented transparency to public finance. +### Governance +Our flagship project dedicated to maximizing transparency and accountability in public finance. The centerpiece is our Venmo-style government spending tracker, bringing unprecedented visibility to public spending. -### Roboshop -An AI-powered shopping assistant that finds exactly what you need with just one word. By integrating with multiple e-commerce platforms and using advanced natural language processing, we're simplifying the online shopping experience. +### Shopping Assistant +An AI-powered shopping solution that finds exactly what you need with just one word. By integrating with multiple e-commerce platforms and using advanced natural language processing, we're simplifying the online shopping experience. ## Get Involved diff --git a/app/bots/BotNavigation.tsx b/app/bots/BotNavigation.tsx new file mode 100644 index 000000000..8be855db6 --- /dev/null +++ b/app/bots/BotNavigation.tsx @@ -0,0 +1,269 @@ +'use client'; + +import React, { useState, useEffect } from 'react'; +import Link from 'next/link'; +import { usePathname } from 'next/navigation'; + +interface MenuItem { + id: string; + label: string; + icon?: string; + section?: string; +} + +interface BotNavigationProps { + botTitle: string; + botEmoji: string; + botDescription?: string; + accentColor?: string; + menuItems: MenuItem[]; + chatLink?: string; + sections?: boolean; +} + +/** + * Reusable navigation component for bot detail pages + */ +const BotNavigation: React.FC = ({ + botTitle, + botEmoji, + botDescription = '', + accentColor = 'blue', + menuItems, + chatLink, + sections = true, +}) => { + const pathname = usePathname(); + const [activeSection, setActiveSection] = useState(''); + const [lastScrollY, setLastScrollY] = useState(0); + const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); + + // Handle scroll events to highlight active section + useEffect(() => { + const handleScroll = () => { + const currentScrollY = window.scrollY; + + // Determine active section when sections are enabled + if (sections) { + const sectionIds = menuItems + .filter(item => item.section) + .map(item => item.section as string); + + // Find which section is currently in view + const sectionElements = sectionIds + .map(id => document.getElementById(id)) + .filter(Boolean); + + for (let i = sectionElements.length - 1; i >= 0; i--) { + const section = sectionElements[i]; + if (section && section.getBoundingClientRect().top <= 300) { + setActiveSection(section.id); + break; + } + } + } + + setLastScrollY(currentScrollY); + }; + + window.addEventListener('scroll', handleScroll, { passive: true }); + handleScroll(); // Initial check + + return () => window.removeEventListener('scroll', handleScroll); + }, [lastScrollY, menuItems, sections]); + + // Handle smooth scrolling when clicking a menu item + const scrollToSection = (sectionId: string | undefined) => { + if (!sectionId) return; + + const element = document.getElementById(sectionId); + if (element) { + window.scrollTo({ + top: element.offsetTop - 100, + behavior: 'smooth', + }); + setActiveSection(sectionId); + // Close mobile menu after clicking + setIsMobileMenuOpen(false); + } + }; + + // Scroll to top function for logo click + const scrollToTop = () => { + window.scrollTo({ + top: 0, + behavior: 'smooth' + }); + setIsMobileMenuOpen(false); + }; + + const colorClasses = { + blue: { + logo: 'bg-blue-100', + title: 'text-blue-900', + active: 'text-blue-700 bg-blue-50', + hover: 'hover:text-blue-700 hover:bg-blue-50', + accent: 'bg-blue-600 hover:bg-blue-700', + border: 'border-blue-300', + }, + green: { + logo: 'bg-green-100', + title: 'text-green-900', + active: 'text-green-700 bg-green-50', + hover: 'hover:text-green-700 hover:bg-green-50', + accent: 'bg-green-600 hover:bg-green-700', + border: 'border-green-300', + }, + indigo: { + logo: 'bg-indigo-100', + title: 'text-indigo-900', + active: 'text-indigo-700 bg-indigo-50', + hover: 'hover:text-indigo-700 hover:bg-indigo-50', + accent: 'bg-indigo-600 hover:bg-indigo-700', + border: 'border-indigo-300', + }, + red: { + logo: 'bg-red-100', + title: 'text-red-900', + active: 'text-red-700 bg-red-50', + hover: 'hover:text-red-700 hover:bg-red-50', + accent: 'bg-red-600 hover:bg-red-700', + border: 'border-red-300', + }, + amber: { + logo: 'bg-amber-100', + title: 'text-amber-900', + active: 'text-amber-700 bg-amber-50', + hover: 'hover:text-amber-700 hover:bg-amber-50', + accent: 'bg-amber-600 hover:bg-amber-700', + border: 'border-amber-300', + }, + }; + + // Get the appropriate color classes or default to blue + const colors = colorClasses[accentColor as keyof typeof colorClasses] || colorClasses.blue; + + const navClasses = lastScrollY > 100 + ? 'bg-white shadow-md border-b border-gray-200' + : 'bg-white border-b border-gray-200'; + + return ( + + ); +}; + +export default BotNavigation; \ No newline at end of file diff --git a/app/bots/[slug]/route.ts b/app/bots/[slug]/route.ts new file mode 100644 index 000000000..33ba74774 --- /dev/null +++ b/app/bots/[slug]/route.ts @@ -0,0 +1,10 @@ +import { type NextRequest } from 'next/server'; +import bots from '@/data/bots'; + +export async function generateStaticParams() { + return bots.map((bot) => ({ + slug: bot.slug, + })); +} + +export const dynamic = 'force-static'; diff --git a/app/bots/artistic-advisor/page.tsx b/app/bots/artistic-advisor/page.tsx index cf7a8687b..3934aa5c7 100644 --- a/app/bots/artistic-advisor/page.tsx +++ b/app/bots/artistic-advisor/page.tsx @@ -3,74 +3,207 @@ import React from 'react'; import Link from 'next/link'; import bots from '../../../data/bots'; +import BotNavigation from '../BotNavigation'; export default function ArtisticAdvisor() { const bot = bots.find(b => b.slug === 'artistic-advisor'); + // Menu items for the navigation + const menuItems = [ + { id: 'features', label: 'Features', icon: '✨', section: 'features' }, + { id: 'how-it-works', label: 'How It Works', icon: '🔍', section: 'how-it-works' }, + { id: 'style-analysis', label: 'Style Analysis', icon: '🎨', section: 'style-analysis' }, + { id: 'art-styles', label: 'Art Styles', icon: '🖌️', section: 'art-styles' }, + { id: 'prompt-generator', label: 'Prompt Generator', icon: '💡', section: 'prompt-generator' }, + ]; + if (!bot) { return
Bot not found
; } return (
-
+ {/* Bot-specific Navigation */} + + +
+ {/* Title and Overview */}
-

{bot.title}

+

Artr

{bot.overview}

-
-
-

Features

-
    - {bot.features.map((feature, index) => ( -
  • - - - - {feature} + {/* Features Section */} +
    +
    +
    +

    Features

    +
      + {bot.features.map((feature, index) => ( +
    • + + + + {feature} +
      • + ))} +
    +
    + +
    +

    How It Works

    +
      +
    1. +
      + 1 +
      +
      +

      Describe your artistic vision

      +

      Share details about your creative project or style preferences.

      +
      +
      2. +
    2. +
      + 2 +
      +
      +

      AI Analysis

      +

      Our AI processes your input using art knowledge and creative principles.

      +
      3. - ))} -
+
  • +
    + 3 +
    +
    +

    Get Creative Insights

    +

    Receive tailored advice, inspiration, and techniques for your artistic endeavors.

    +
    +
    • + +
    + -
    -

    How It Works

    -

    {bot.details}

    - - Get Started - + {/* Style Analysis Tool */} +
    +

    Analyze Your Style

    +
    +

    Describe your artistic work or upload an image for style analysis.

    + +
    + +
    +
    +
    +
    +
    PM
    +
    DE
    +
    AR
    +
    + Powered by multi-AI collaboration +
    + +
    + + +
    +

    Example Requests

    +
    + {exampleQueries.map((example, index) => ( +
    setQuery(example.query)} + className="cursor-pointer rounded-lg border border-gray-200 p-4 hover:bg-gray-50" + > +

    {example.title}

    +

    {example.description}

    +
    + ))} +
    +
    +
    +
    + +
    +
    +

    Project Planning Approach

    +
    +
    +

    1. Project Analysis

    +

    Requirements gathering and scope definition

    +
    +
    +

    2. Technical Strategy

    +

    Architecture planning and technology selection

    +
    +
    +

    3. Development Roadmap

    +

    Milestones, tasks, and resource allocation

    +
    +
    +

    4. Implementation Guidance

    +

    Technical recommendations and code approaches

    +
    +
    +

    5. Quality Assurance

    +

    Testing strategies and validation criteria

    +
    +
    +

    6. Deployment Plan

    +

    Release strategy and post-launch monitoring

    +
    +
    +
    + + {/* Balance Section */} +
    +

    Trident's Approach

    +
      +
    • + + + + Comprehensive project planning with clear deliverables +
      • +
    • + + + + Cursor-specific technical guidance and best practices +
      • +
    • + + + + Optimization of workflows tailored to your team's needs +
      • +
    • + + + + No overly prescriptive development mandates +
      • +
    +
    +
    +
    + + ); +}; + +export default TryItSection; \ No newline at end of file diff --git a/app/bots/product-manager/layout.tsx b/app/bots/product-manager/layout.tsx new file mode 100644 index 000000000..7c8b9e378 --- /dev/null +++ b/app/bots/product-manager/layout.tsx @@ -0,0 +1,19 @@ +import React from 'react'; +import Header from '@/components/Header'; + +/** + * Layout for the Product Manager Bot pages. + * Includes the main site header to maintain navigation consistency. + */ +export default function ProductManagerLayout({ + children, +}: { + children: React.ReactNode; +}) { + return ( + <> +
    + {children} + + ); +} \ No newline at end of file diff --git a/app/bots/product-manager/metadata.ts b/app/bots/product-manager/metadata.ts new file mode 100644 index 000000000..96b0f0c08 --- /dev/null +++ b/app/bots/product-manager/metadata.ts @@ -0,0 +1,15 @@ +/** + * Metadata for the Trident Product Manager bot + */ + +import { Metadata } from 'next'; + +export const metadata: Metadata = { + title: 'Trident - AI Product Manager for Cursor', + description: 'Streamline your Cursor development workflow with AI-powered project management, technical guidance, and implementation planning.', + openGraph: { + title: 'Trident - AI Product Manager for Cursor', + description: 'Streamline your Cursor development workflow with AI-powered project management, technical guidance, and implementation planning.', + images: ['/images/trident-og.png'], + }, +}; \ No newline at end of file diff --git a/app/bots/product-manager/page.tsx b/app/bots/product-manager/page.tsx new file mode 100644 index 000000000..717df4548 --- /dev/null +++ b/app/bots/product-manager/page.tsx @@ -0,0 +1,130 @@ +'use client'; + +/** + * Trident - Product Manager for Cursor Workflow + * + * This is the main page component for Trident, an AI-powered product manager + * designed to streamline the Cursor workflow. It leverages the unique strengths + * of multiple AI models to provide comprehensive product documentation, + * development guidance, and workflow optimization for Cursor projects. + * + * @module TridentPage + */ + +import React from 'react'; +import Link from 'next/link'; +import bots from '../../../data/bots'; +import HeroSection from './components/hero/HeroSection'; +import FeaturesSection from './components/features/FeaturesSection'; +import TryItSection from './components/workflow/TryItSection'; +import BenefitsSection from './components/benefits/BenefitsSection'; +import ExampleSection from './components/examples/ExampleSection'; +import ShowcaseSection from './components/showcase/ShowcaseSection'; +import IntegrationSection from './components/integration/IntegrationSection'; +import DevelopmentRoadmap from './components/roadmap/DevelopmentRoadmap'; +import VisionSection from './components/vision/VisionSection'; +import JoinSection from './components/join/JoinSection'; +import BotNavigation from '../BotNavigation'; +import './styles.css'; + +export default function ProductManager() { + const bot = bots.find((b: { slug: string }) => b.slug === 'product-manager'); + + if (!bot) { + return
    Bot not found
    ; + } + + // Menu items organized by value proposition + const menuItems = [ + { id: 'features', label: 'Features', icon: '🛠️', section: 'features' }, + { id: 'examples', label: 'Examples', icon: '📝', section: 'examples' }, + { id: 'showcase', label: 'Showcase', icon: '🔍', section: 'showcase' }, + { id: 'try-it', label: 'Try It', icon: '🚀', section: 'try-it' }, + { id: 'integrations', label: 'Integrations', icon: '🔄', section: 'integrations' }, + { id: 'benefits', label: 'Benefits', icon: '✅', section: 'benefits' }, + { id: 'roadmap', label: '2025 Roadmap', icon: '📊', section: 'roadmap' }, + { id: 'vision', label: 'Vision', icon: '🔮', section: 'vision' }, + { id: 'join', label: 'Join Us', icon: '👥', section: 'join' } + ]; + + return ( +
    + {/* Bot-specific Navigation */} + + +
    + {/* Hero Section */} + + + {/* Features Section */} +
    + +
    + + {/* Examples Section */} +
    + +
    + + {/* Showcase Section */} +
    + +
    + + {/* Try It Section */} +
    + +
    + + {/* Integration Section */} +
    + +
    + + {/* Benefits Section */} +
    + +
    + + {/* Roadmap Section */} +
    + +
    + + {/* Vision Section */} +
    + +
    + + {/* Join Section */} +
    + +
    + + {/* CTA Section */} +
    +

    Ready to Optimize Your Cursor Workflow?

    +

    + Let Trident manage your product documentation and development process, optimized specifically for Cursor's implementation needs. +

    + +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/bots/product-manager/styles.css b/app/bots/product-manager/styles.css new file mode 100644 index 000000000..00a9a6d0a --- /dev/null +++ b/app/bots/product-manager/styles.css @@ -0,0 +1,425 @@ +/* TriadExtractor Bot - Styles */ + +/* Main container styling */ +.triad-container { + max-width: 1200px; + margin: 0 auto; + padding: 2rem 1rem; +} + +/* Navigation styles */ +.trident-nav { + position: fixed; + top: 0; + left: 0; + width: 100%; + z-index: 50; + background-color: white; + border-bottom: 1px solid #e5e7eb; + display: block !important; + opacity: 1 !important; + visibility: visible !important; +} + +.trident-nav-scrolled { + box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1); +} + +.trident-nav-container { + max-width: 1280px; + margin: 0 auto; + padding: 0.5rem 1rem; + display: flex; + justify-content: space-between; + align-items: center; +} + +.trident-nav-logo { + font-weight: 600; + font-size: 1.25rem; + color: #111827; + display: flex; + align-items: center; +} + +.trident-nav-items { + display: flex; + align-items: center; + gap: 1rem; +} + +.trident-nav-link { + font-size: 0.875rem; + color: #4b5563; + font-weight: 500; + transition: color 0.2s; + white-space: nowrap; +} + +.trident-nav-link:hover, .trident-nav-link-active { + color: #2563eb; +} + +.trident-mobile-menu { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100vh; + background-color: white; + z-index: 100; + padding: 1rem; + display: flex; + flex-direction: column; +} + +.trident-mobile-menu-header { + display: flex; + justify-content: space-between; + align-items: center; + padding-bottom: 1rem; + border-bottom: 1px solid #e5e7eb; + margin-bottom: 1rem; +} + +.trident-mobile-menu-links { + display: flex; + flex-direction: column; + gap: 1rem; + padding: 1rem 0; +} + +.trident-mobile-menu-link { + font-size: 1rem; + color: #4b5563; + font-weight: 500; + transition: color 0.2s; +} + +.trident-mobile-menu-link:hover, .trident-mobile-menu-link-active { + color: #2563eb; +} + +/* Hiding scrollbars but keeping functionality */ +.no-scrollbar { + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ +} + +.no-scrollbar::-webkit-scrollbar { + display: none; /* Chrome, Safari and Opera */ +} + +/* Hero section customizations */ +.triad-hero { + text-align: center; + margin-bottom: 4rem; +} + +.triad-hero h1 { + font-size: 2.5rem; + font-weight: 700; + color: #111827; + margin-bottom: 1rem; +} + +.triad-hero p { + font-size: 1.25rem; + color: #4b5563; + max-width: 800px; + margin: 0 auto 2rem; +} + +/* Card styling */ +.triad-card { + border: 1px solid #e5e7eb; + border-radius: 0.75rem; + box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1); + padding: 1.5rem; + background-color: white; + margin-bottom: 1.5rem; +} + +.triad-card h2 { + font-size: 1.25rem; + font-weight: 600; + margin-bottom: 1rem; + color: #111827; +} + +.triad-card h3 { + font-size: 1.125rem; + font-weight: 500; + margin-bottom: 0.75rem; + color: #111827; +} + +/* Form elements */ +.triad-textarea { + width: 100%; + padding: 0.75rem; + border: 1px solid #d1d5db; + border-radius: 0.5rem; + font-size: 1rem; + min-height: 120px; + color: #111827; + resize: vertical; +} + +.triad-textarea:focus { + outline: none; + border-color: #3b82f6; + ring: 2px; + ring-color: #bfdbfe; +} + +.triad-button { + display: inline-flex; + align-items: center; + padding: 0.625rem 1.25rem; + background-color: #2563eb; + color: white; + font-weight: 500; + font-size: 0.875rem; + border-radius: 0.5rem; + border: none; + cursor: pointer; + transition: background-color 0.2s; +} + +.triad-button:hover { + background-color: #1d4ed8; +} + +.triad-button:disabled { + background-color: #9ca3af; + cursor: not-allowed; +} + +/* AI icons */ +.ai-icons { + display: flex; + align-items: center; + margin-bottom: 1rem; +} + +.ai-icon { + width: 2rem; + height: 2rem; + border-radius: 9999px; + display: flex; + align-items: center; + justify-content: center; + color: white; + font-weight: 600; + font-size: 0.75rem; +} + +.ai-icon.chatgpt { + background-color: #10a37f; +} + +.ai-icon.claude { + background-color: #7c3aed; +} + +.ai-icon.grok { + background-color: #2563eb; +} + +.ai-icons-stacked { + display: flex; + margin-right: 0.75rem; +} + +.ai-icons-stacked .ai-icon:not(:first-child) { + margin-left: -0.5rem; +} + +/* Example queries */ +.example-query { + padding: 1rem; + border: 1px solid #e5e7eb; + border-radius: 0.5rem; + cursor: pointer; + transition: background-color 0.2s; +} + +.example-query:hover { + background-color: #f3f4f6; +} + +.example-query h4 { + font-weight: 500; + margin-bottom: 0.25rem; + color: #111827; +} + +.example-query p { + font-size: 0.875rem; + color: #6b7280; +} + +/* Documentation format section */ +.doc-format-item { + display: flex; + align-items: center; + margin-bottom: 0.5rem; +} + +.doc-format-dot { + width: 0.5rem; + height: 0.5rem; + border-radius: 9999px; + background-color: #3b82f6; + margin-right: 0.5rem; + flex-shrink: 0; +} + +/* Steps indicator */ +.step-indicator { + display: flex; + align-items: flex-start; + margin-bottom: 1rem; +} + +.step-number { + width: 2rem; + height: 2rem; + border-radius: 9999px; + background-color: #dbeafe; + color: #1d4ed8; + display: flex; + align-items: center; + justify-content: center; + font-weight: 600; + margin-right: 1rem; + flex-shrink: 0; +} + +.step-content h4 { + font-weight: 500; + margin-bottom: 0.25rem; + color: #111827; +} + +.step-content p { + font-size: 0.875rem; + color: #6b7280; +} + +/* Responsive adjustments */ +@media (max-width: 768px) { + .triad-hero h1 { + font-size: 2rem; + } + + .triad-hero p { + font-size: 1rem; + } +} + +/* Loading spinner animation */ +@keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} + +.spinner { + animation: spin 1s linear infinite; +} + +/* Animations */ +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(5px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +.animate-fadeIn { + animation: fadeIn 0.3s ease-in-out; +} + +/* Custom scrollbar for code sections */ +.code-scrollbar::-webkit-scrollbar { + width: 8px; + height: 8px; +} + +.code-scrollbar::-webkit-scrollbar-track { + background: #f1f1f1; + border-radius: 10px; +} + +.code-scrollbar::-webkit-scrollbar-thumb { + background: #d1d5db; + border-radius: 10px; +} + +.code-scrollbar::-webkit-scrollbar-thumb:hover { + background: #9ca3af; +} + +/* Service icons with gradient backgrounds */ +.service-icon-1 { + background: linear-gradient(135deg, #34d399 0%, #10b981 100%); +} + +.service-icon-2 { + background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%); +} + +.service-icon-3 { + background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%); +} + +/* Fixes for mobile responsiveness */ +@media (max-width: 768px) { + .responsive-grid { + grid-template-columns: 1fr; + } + + .mobile-stack { + flex-direction: column; + } + + .mobile-full-width { + width: 100%; + } +} + +/* Pulse animation for loading states */ +@keyframes pulse { + 0%, 100% { + opacity: 1; + } + 50% { + opacity: 0.5; + } +} + +.animate-pulse { + animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; +} + +/* Transition effects */ +.transition-shadow { + transition-property: box-shadow; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} + +.transition-transform { + transition-property: transform; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} \ No newline at end of file diff --git a/app/bots/research-assistant/README.md b/app/bots/research-assistant/README.md new file mode 100644 index 000000000..f5b0e2b78 --- /dev/null +++ b/app/bots/research-assistant/README.md @@ -0,0 +1,150 @@ +# Nerd - AI Research Assistant + +## Overview + +Nerd is an AI-powered research assistant designed to enhance research workflows by organizing data, providing real-time updates, generating content, posing thought-provoking questions, facilitating collaboration, and aiming for breakthrough discoveries. The platform supports academics, scientists, journalists, students, and industry professionals in their research endeavors. + +## Philosophy & Vision + +Nerd envisions a future where humans and machines collaborate fluidly in pursuit of truth and knowledge. The platform is built on three core principles: + +1. **Human-AI Symbiosis**: Developing intelligent systems that enhance human creativity and analytical capabilities, creating a relationship that elevates research beyond current limitations. + +2. **Decentralized Access**: Democratizing research through alternative systems and removing institutional barriers that prevent brilliant minds from contributing, regardless of formal credentials. + +3. **Accelerated Discovery**: Creating systems that identify promising connections across disciplines, surface overlooked research, and generate novel hypotheses—dramatically speeding the path to breakthrough discoveries. + +Our platform embodies principles of Decentralized Science (DeSci), contributing to a future where scientific progress is driven by merit and collaboration rather than credentials and institutional affiliations. + +## Core Features + +### 1. Research Organization +- **Automated Systematization**: Organize uploaded research materials (PDFs, texts, notes) with AI-powered categorization +- **Smart Tagging**: Automatically extract and organize key concepts, authors, and methodologies +- **Knowledge Graph**: Visualize connections between research elements + +### 2. Real-time Updates +- **Literature Monitoring**: Track new publications in your field from sources like arXiv and academic journals +- **News & Trends**: Stay informed about relevant developments in your research area +- **Custom Alerts**: Receive notifications for research that matches specific criteria + +### 3. Content Creation +- **Research Drafts**: Generate structured content like abstracts, literature reviews, and methodology sections +- **Citation Management**: Automatic formatting of citations in various styles +- **Social Media Content**: Create shareable summaries of your research for broader audiences + +### 4. Research Engagement +- **Research Rabbit Holes**: Explore thought-provoking questions related to your field +- **Discovery Mode**: Identify research gaps and suggest novel connections between concepts +- **Hypothesis Generation**: Propose testable hypotheses based on existing literature + +### 5. Collaboration +- **Tool Integration**: Seamless workflows with Zotero, Notion, Google Drive, and GitHub +- **Peer Connections**: Find researchers working in similar areas +- **Resource Sharing**: Access shared datasets, code, and methodologies + +### 6. Independent Research +- **Decentralized Funding**: Access alternative funding mechanisms for research projects +- **Anonymous Contributions**: Contribute to research without institutional constraints +- **Community Governance**: Participate in decision-making through decentralized structures + +## Component Architecture + +``` +research-assistant/ +├── page.tsx # Main bot page component +├── styles.css # Global styles +├── styles.module.css # Component-specific styles +├── README.md # This documentation +├── components/ # UI components organized by feature +│ ├── navigation/ # Navigation menu components +│ │ └── Navigation.tsx # Main navigation bar +│ ├── hero/ # Hero section components +│ │ └── HeroSection.tsx # Main hero introduction +│ ├── features/ # Core feature display components +│ │ ├── FeaturesSection.tsx # Overview of all features +│ │ ├── ResearchSystemSection.tsx # Research organization component +│ │ ├── WebScrapingSection.tsx # Real-time updates component +│ │ └── DraftGenerationSection.tsx # Content creation component +│ ├── questions/ # Research engagement components +│ │ ├── QuestionsSection.tsx # Main questions container +│ │ └── DailyQuestionsSection.tsx # Research Rabbit Holes component +│ ├── discovery/ # Discovery mode components +│ │ └── DiscoverySection.tsx # Discovery mode interface +│ └── integration/ # Integration and collaboration components +│ ├── IntegrationSection.tsx # Tool integration component +│ └── DevelopmentRoadmap.tsx # Timeline and vision component +``` + +## State Management + +Nerd uses React's built-in state management with hooks for component-level state. Components that need to share state use prop-drilling or context where appropriate. The primary state elements include: + +- **User Preferences**: Research fields, notification settings, tool connections +- **Content State**: Active sections, selected research materials, draft progress +- **UI State**: Navigation state, active tabs, mobile responsiveness + +## Technical Implementation Details + +### Component Documentation + +#### Navigation Component +The `Navigation` component provides a responsive menu that highlights the six core functions of Nerd. It implements scroll-based appearance/disappearance and smooth scrolling to sections. + +#### Hero Section +The `HeroSection` component introduces users to Nerd with a compelling value proposition and call-to-action. It animates key features and provides a visually engaging introduction. + +#### Feature Components +- `ResearchSystemSection`: Demonstrates how Nerd organizes research with interactive visualization +- `WebScrapingSection`: Shows real-time update capabilities with example feeds +- `DraftGenerationSection`: Showcases content creation with interactive examples of different document types + +#### Research Engagement Components +- `QuestionsSection`: Provides the container for research questions +- `DailyQuestionsSection`: Implements the Research Rabbit Holes feature with customizable questions by research field + +#### Discovery Component +The `DiscoverySection` demonstrates how Nerd identifies research gaps and suggests novel connections with interactive examples across different research domains. + +#### Integration Components +- `IntegrationSection`: Shows tool integration capabilities and collaboration features +- `DevelopmentRoadmap`: Displays development timeline, vision, and collaboration opportunities + +### Adding New Features + +To add new features to Nerd: + +1. Create a new component in the appropriate subdirectory of `components/` +2. Document the component with JSDoc comments +3. Update the relevant section in `page.tsx` to include your new component +4. If needed, add new styles in `styles.module.css` + +## Development Timeline + +Nerd is under active development with a planned launch in Q3 2027. Key milestones include: + +- **2025 Q1**: Concept Development (Complete) +- **2025 Q3**: Alpha Research Organizer +- **2026 Q1**: Beta Testing Program +- **2026 Q3**: Content Creation Engine +- **2026 Q4**: Engagement & Discovery Mode +- **2027 Q1**: Collaboration Platform +- **2027 Q2**: Independent Research Features +- **2027 Q3**: Full Launch + +## Integration with External Tools + +Nerd is designed to integrate with popular research tools: + +- **Zotero**: Reference management and paper organization +- **Notion**: Project management and collaborative notes +- **Google Drive**: Document storage and collaboration +- **GitHub**: Code management and version control + +## Contributing + +Nerd is developed by a team of engineers, researchers, and domain experts. If you're interested in contributing, please contact us at collaborate@nerd.ai. + +## License + +Nerd is proprietary software. All rights reserved. \ No newline at end of file diff --git a/app/bots/research-assistant/components/discovery/DiscoverySection.tsx b/app/bots/research-assistant/components/discovery/DiscoverySection.tsx new file mode 100644 index 000000000..72090d1cf --- /dev/null +++ b/app/bots/research-assistant/components/discovery/DiscoverySection.tsx @@ -0,0 +1,177 @@ +/** + * DiscoverySection.tsx + * + * This component showcases the Discovery Mode feature of the Nerd AI Research Assistant. + * It demonstrates how Nerd can identify research gaps, suggest novel connections + * between concepts, and generate hypotheses that could lead to significant breakthroughs. + */ + +import React, { useState } from 'react'; +import Image from 'next/image'; +import styles from '../../styles.module.css'; + +interface ResearchDomain { + id: string; + name: string; + description: string; + insights: string[]; +} + +const DiscoverySection: React.FC = () => { + const [activeDomain, setActiveDomain] = useState('ai-ethics'); + + const researchDomains: ResearchDomain[] = [ + { + id: 'ai-ethics', + name: 'AI Ethics & Governance', + description: 'Exploring the moral implications and regulatory frameworks for artificial intelligence systems.', + insights: [ + 'Cross-domain research suggests that combining indigenous knowledge systems with AI ethics could produce more culturally inclusive governance frameworks.', + 'Analysis of historical technology regulation reveals a pattern where narrow technical solutions fail when not paired with socio-cultural adaptation strategies.', + 'Unexplored connection between environmental law precedents and AI liability frameworks could address current gaps in algorithmic accountability.' + ] + }, + { + id: 'climate-solutions', + name: 'Climate Change Solutions', + description: 'Investigating innovative approaches to mitigate and adapt to global climate change.', + insights: [ + 'Traditional agricultural practices from three distinct geographical regions show unexplored potential for carbon sequestration when combined with modern soil science.', + "Overlooked research on deep ocean currents suggests possible mechanical intervention points for heat redistribution that haven't been modeled in climate simulations.", + 'Pattern analysis indicates that urban architectural designs inspired by certain biological structures could reduce city heat islands by up to 4°C while requiring minimal energy input.' + ] + }, + { + id: 'neuroscience', + name: 'Cognitive Neuroscience', + description: 'Studying the biological processes underlying cognition with a focus on neural connections.', + insights: [ + 'Previously unconnected research in mycology and neuroplasticity suggests fungal communication networks may provide new models for understanding brain resilience.', + 'Systematic gap analysis reveals that sleep studies have overlooked potential connections between dream states and specific protein synthesis patterns relevant to memory consolidation.', + 'Quantum physics principles applied to neurotransmitter behavior might explain anomalous results in consciousness studies that current models cannot account for.' + ] + }, + { + id: 'materials-science', + name: 'Advanced Materials', + description: 'Developing new materials with novel properties for technological applications.', + insights: [ + 'Bibliometric analysis reveals minimal overlap between biomimicry research and semiconductor development, suggesting unexplored territory for self-healing electronic components.', + 'Mathematical patterns in crystal formation studies parallel emerging theories in quantum computing, potentially enabling room-temperature quantum materials.', + 'Historical research on ancient metallurgical techniques contains unexploited insights that could revolutionize modern material fabrication with significantly lower energy requirements.' + ] + } + ]; + + const selectedDomain = researchDomains.find(domain => domain.id === activeDomain) || researchDomains[0]; + + return ( +
    +
    +

    Discovery Mode

    +

    + Uncover hidden connections and generate novel hypotheses with AI-powered research exploration + that identifies patterns across disparate sources and suggests promising new directions. +

    +
    + +
    +
    +
    +

    Research Domains

    +
    + {researchDomains.map(domain => ( + + ))} +
    +
    + +
    +
    +

    {selectedDomain.name}

    +

    {selectedDomain.description}

    +
    + +
    +

    Potential Breakthrough Insights

    +
      + {selectedDomain.insights.map((insight, index) => ( +
    • +
      {index + 1}
      +

      {insight}

      +
      • + ))} +
    +
    + +
    +
    +
    + {/* This would typically be a dynamic visualization */} +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +

    Knowledge Graph Showing Potential Connections Between Research Areas

    +
    +
    +
    +
    + +
    +

    How Discovery Works

    +
    +
    +
    + 1 +
    +

    Gap Analysis

    +

    Systematically identifies unexplored areas within and between research fields

    +
    +
    +
    + 2 +
    +

    Pattern Recognition

    +

    Detects meaningful patterns across disparate research domains

    +
    +
    +
    + 3 +
    +

    Cross-Disciplinary Connection

    +

    Suggests novel connections between seemingly unrelated concepts

    +
    +
    +
    + 4 +
    +

    Hypothesis Generation

    +

    Creates testable hypotheses based on identified gaps and connections

    +
    +
    +
    + +
    +

    Ready to make your next big discovery?

    + +
    +
    +
    + ); +}; + +export default DiscoverySection; \ No newline at end of file diff --git a/app/bots/research-assistant/components/features/DraftGenerationSection.tsx b/app/bots/research-assistant/components/features/DraftGenerationSection.tsx new file mode 100644 index 000000000..e2fe276c4 --- /dev/null +++ b/app/bots/research-assistant/components/features/DraftGenerationSection.tsx @@ -0,0 +1,217 @@ +/** + * DraftGenerationSection.tsx + * + * This component showcases Nerd's content creation capabilities, + * demonstrating how it transforms unstructured notes or voice-to-text musings + * into well-structured research content with proper formatting and citations. + */ + +import React, { useState } from 'react'; +import { FiFileText, FiBookOpen, FiClipboard, FiEdit, FiCheck } from 'react-icons/fi'; +import styles from '../../styles.module.css'; + +type DraftType = 'abstract' | 'literature' | 'methodology' | 'discussion'; + +interface DraftExample { + type: DraftType; + title: string; + content: string; + sources: string[]; +} + +const DraftGenerationSection: React.FC = () => { + const [selectedDraft, setSelectedDraft] = useState('abstract'); + + const draftExamples: Record = { + abstract: { + type: 'abstract', + title: 'Effects of Mindfulness Meditation on Cognitive Performance', + content: `This study investigates the impact of regular mindfulness meditation practices on cognitive performance metrics, including attention span, working memory, and problem-solving capabilities. Through a randomized controlled trial involving 120 participants over a 12-week period, we found significant improvements in sustained attention (p < 0.01) and working memory capacity (p < 0.05) among the meditation group compared to controls. The results suggest that even short daily meditation sessions (10-15 minutes) can yield measurable cognitive benefits, potentially offering a cost-effective intervention for cognitive enhancement in educational and clinical settings.`, + sources: [ + 'Davidson, R. J., & Kaszniak, A. W. (2015). Conceptual and methodological issues in research on mindfulness and meditation. American Psychologist, 70(7), 581-592.', + 'Zeidan, F., Johnson, S. K., Diamond, B. J., David, Z., & Goolkasian, P. (2010). Mindfulness meditation improves cognition: Evidence of brief mental training. Consciousness and Cognition, 19(2), 597-605.', + 'Lutz, A., Slagter, H. A., Dunne, J. D., & Davidson, R. J. (2008). Attention regulation and monitoring in meditation. Trends in Cognitive Sciences, 12(4), 163-169.' + ] + }, + literature: { + type: 'literature', + title: 'Climate Change Adaptation Strategies in Urban Planning', + content: `Recent research on climate change adaptation in urban environments has focused on three primary domains: infrastructure resilience, policy frameworks, and community engagement. Tang et al. (2022) found that cities implementing comprehensive adaptation policies experienced 23% less infrastructure damage during extreme weather events. Similarly, Hernandez & Wong (2021) documented successful community-based adaptation initiatives across 15 global cities, highlighting the importance of local knowledge and participation. Meanwhile, technical innovations in urban design were evaluated by Patel et al. (2023), who cataloged emerging green infrastructure solutions with measurable climate adaptation benefits. This review reveals a growing consensus that effective urban climate adaptation requires integrated approaches combining policy reform, infrastructure modernization, and inclusive planning processes that center vulnerable communities.`, + sources: [ + 'Tang, J., Chen, H., & Singh, P. (2022). Measuring outcomes of urban climate adaptation policies: A comparative analysis of 40 global cities. Urban Climate, 31, 100545.', + 'Hernandez, M., & Wong, K. (2021). Community-led climate adaptation: Case studies from the Global South. Journal of Environmental Planning and Management, 64(10), 1863-1882.', + 'Patel, R., Mahmood, A., & Johnson, T. (2023). Technical innovations in green infrastructure for climate resilient cities. Landscape and Urban Planning, 221, 104355.', + 'Carter, J.G., Cavan, G., Connelly, A., Guy, S., Handley, J., & Kazmierczak, A. (2015). Climate change and the city: Building capacity for urban adaptation. Progress in Planning, 95, 1-66.' + ] + }, + methodology: { + type: 'methodology', + title: 'Automated Detection of Misinformation in Social Media', + content: `This study employs a mixed-methods approach to detect and classify misinformation in social media content. First, we collected a dataset of 50,000 posts from multiple platforms (Twitter, Facebook, and Reddit) using API access and specialized scraping tools between January-March 2023. The dataset was balanced across political topics, health claims, and scientific statements. We implemented a two-stage classification system: (1) a BERT-based language model fine-tuned on established misinformation datasets (accuracy: 87.3%), followed by (2) a fact-verification module cross-referencing claims against trusted knowledge bases. For validation, a panel of 5 fact-checking experts manually verified a random subset of 1,000 posts, achieving an inter-rater reliability coefficient of κ=0.82. Statistical analysis was performed using Python's scikit-learn package, with significance thresholds set at p<0.05 for all comparisons between classification approaches.`, + sources: [ + 'Zhou, X., & Zafarani, R. (2020). A survey of fake news: Fundamental theories, detection methods, and opportunities. ACM Computing Surveys, 53(5), 1-40.', + 'Devlin, J., Chang, M. W., Lee, K., & Toutanova, K. (2018). BERT: Pre-training of deep bidirectional transformers for language understanding. arXiv preprint arXiv:1810.04805.', + 'Shaar, S., Babulkov, N., Da San Martino, G., & Nakov, P. (2020). That is a known lie: Detecting previously fact-checked claims. arXiv preprint arXiv:2005.06058.' + ] + }, + discussion: { + type: 'discussion', + title: 'Ethical Implications of Facial Recognition in Public Spaces', + content: `Our findings reveal a complex ethical landscape surrounding facial recognition technology (FRT) deployment in public spaces. The tension between security benefits and privacy concerns emerges as a central theme across stakeholder interviews. While law enforcement representatives emphasized crime reduction metrics (15-22% in pilot locations), privacy advocates highlighted the disproportionate impact on marginalized communities, with false positive rates 3-5 times higher for darker-skinned individuals in our technical evaluation. The regulatory gap identified in our policy analysis suggests current governance frameworks remain inadequate for addressing algorithmic bias and consent issues. These results support a moratorium on certain FRT applications until technical improvements and robust regulatory frameworks can be established. Future research should explore consent mechanisms for public surveillance and investigate alternative security approaches that present fewer ethical complications. These findings contribute to the growing literature on algorithmic governance and suggest that technological capability must be balanced with ethical considerations and social impact assessments before widespread implementation.`, + sources: [ + 'Buolamwini, J., & Gebru, T. (2018). Gender shades: Intersectional accuracy disparities in commercial gender classification. Proceedings of the 1st Conference on Fairness, Accountability and Transparency, 81, 77-91.', + 'Najibi, A. (2020). Racial discrimination in face recognition technology. Science in the News, Harvard University Graduate School of Arts and Sciences.', + 'European Union Agency for Fundamental Rights. (2021). Facial recognition technology: fundamental rights considerations in the context of law enforcement.', + 'Wang, Y., & Kosinski, M. (2018). Deep neural networks are more accurate than humans at detecting sexual orientation from facial images. Journal of Personality and Social Psychology, 114(2), 246-257.' + ] + } + }; + + const draftTypes = [ + { value: 'abstract', label: 'Abstract', icon: }, + { value: 'literature', label: 'Literature Review', icon: }, + { value: 'methodology', label: 'Methodology', icon: }, + { value: 'discussion', label: 'Discussion', icon: } + ]; + + const currentDraft = draftExamples[selectedDraft]; + + return ( +
    +
    +

    Transform Unstructured Notes into Polished Research

    +

    + Nerd helps you transform your unstructured notes, voice recordings, and casual musings into + well-structured, publication-ready research content with proper formatting and citations. +

    +
    + +
    +
    +

    Select Draft Type

    +
    + {draftTypes.map(type => ( + + ))} +
    +
    + +
    +
    +

    {currentDraft.title}

    + {draftTypes.find(t => t.value === selectedDraft)?.label} +
    + +
    +

    {currentDraft.content}

    +
    + +
    +

    References

    +
      + {currentDraft.sources.map((source, index) => ( +
    • {source}
      • + ))} +
    +
    + +
    +
    + Proper academic formatting +
    +
    + Automatic citations +
    +
    + Style customization +
    +
    + Export to multiple formats +
    +
    +
    +
    + +
    +
    +

    + Common Use Cases +

    +
    +
    +

    Voice to Research

    +

    + Record your thoughts and ideas as voice memos, and Nerd converts them into structured research outlines and drafts. +

    +
    +
    +

    Research Reports

    +

    + Transform raw data and analysis into structured reports with methodology sections, findings, and discussion + points that highlight key insights. +

    +
    +
    +

    Literature Reviews

    +

    + Generate comprehensive literature reviews that synthesize findings across multiple sources with consistent + formatting and proper attribution. +

    +
    +
    +
    +
    + +
    +

    + How It Works +

    +
      +
    1. + 1 + Upload notes, recordings, or share your research ideas +
      2. +
    2. + 2 + Select the type of content you need +
      3. +
    3. + 3 + Provide specific focus or requirements +
      4. +
    4. + 4 + Review, edit, and export your research draft +
      5. +
    + +
    +

    + Our AI-powered draft generation significantly reduces the time spent on formatting and structuring, + allowing you to focus on refining the content and developing your ideas. +

    + +
    +
    +
    + ); +}; + +export default DraftGenerationSection; \ No newline at end of file diff --git a/app/bots/research-assistant/components/features/FeaturesSection.tsx b/app/bots/research-assistant/components/features/FeaturesSection.tsx new file mode 100644 index 000000000..196f58a57 --- /dev/null +++ b/app/bots/research-assistant/components/features/FeaturesSection.tsx @@ -0,0 +1,127 @@ +import React, { useState } from 'react'; + +interface FeaturesSectionProps { + features: string[]; +} + +/** + * Features Section Component + * + * This component displays the core features and capabilities of the Research Assistant bot. + * + * @module FeaturesSection + */ +const FeaturesSection: React.FC = ({ features }) => { + const [expandedFeature, setExpandedFeature] = useState(null); + + // Core features with detailed explanations + const coreFeatures = [ + { + title: "Research Systematization", + shortDescription: "Organize your research into structured, accessible formats", + icon: "📑", + fullDescription: "Upload your PDFs, notes, and text files or manually enter data. We'll categorize everything by themes, relevance, or chronology in a searchable database.", + benefit: "Find any research insight in seconds rather than hours spent digging through files and notes." + }, + { + title: "Web Scraping", + shortDescription: "Stay updated with the latest research in your field", + icon: "🔍", + fullDescription: "Automatically scrape trusted web sources like news sites, arXiv, and Google Scholar for the latest content based on your keywords.", + benefit: "Never miss important developments in your field with daily or on-demand summarized reports." + }, + { + title: "AI-Generated Drafts", + shortDescription: "Transform your research into structured content", + icon: "✍️", + fullDescription: "Generate abstracts, literature reviews, and other structured content from your collected research with proper citations included.", + benefit: "Cut draft creation time by 80% while ensuring all key points and sources are properly included." + }, + { + title: "Daily Questions", + shortDescription: "Challenge your thinking with insightful prompts", + icon: "❓", + fullDescription: "Receive 5 tailored, thought-provoking questions daily that match your research focus and challenge you to explore new angles.", + benefit: "Break through research blocks and discover connections you may have overlooked." + }, + { + title: "Discovery Mode", + shortDescription: "Push the boundaries with novel connections", + icon: "💡", + fullDescription: "Our experimental 'big discovery' feature analyzes your research for patterns and missing links to suggest novel ideas and hypotheses.", + benefit: "Accelerate breakthrough moments by identifying non-obvious connections across your research database." + }, + { + title: "Team Collaboration", + shortDescription: "Seamless integration with your research workflow", + icon: "👥", + fullDescription: "Share your research with team members, integrate with tools like Zotero, Notion, and Google Drive, and collaborate in real-time.", + benefit: "Unite your research team with shared knowledge and coordinated insights regardless of location." + } + ]; + + const toggleFeature = (index: number) => { + if (expandedFeature === index) { + setExpandedFeature(null); + } else { + setExpandedFeature(index); + } + }; + + return ( +
    +

    Enhancing Your Research Workflow

    +

    + Our AI Research Assistant combines powerful features to transform how you collect, organize, and generate insights from your research. +

    + +
    + {coreFeatures.map((feature, index) => ( +
    toggleFeature(index)} + > +
    + {feature.icon} +
    +

    {feature.title}

    +

    {feature.shortDescription}

    + + {expandedFeature === index && ( +
    +

    {feature.fullDescription}

    +
    +

    Key Benefit: {feature.benefit}

    +
    +
    + )} + +
    + {expandedFeature === index ? 'Show less' : 'Learn more'} + + + +
    +
    + ))} +
    + +     +
    + ); +}; + +export default FeaturesSection; \ No newline at end of file diff --git a/app/bots/research-assistant/components/features/ResearchDraftsSection.tsx b/app/bots/research-assistant/components/features/ResearchDraftsSection.tsx new file mode 100644 index 000000000..3d02213e9 --- /dev/null +++ b/app/bots/research-assistant/components/features/ResearchDraftsSection.tsx @@ -0,0 +1,172 @@ +/** + * ResearchDraftsSection.tsx + * + * This component showcases the AI-Generated Research Drafts feature of the Research Assistant Bot. + * It demonstrates how the bot can synthesize information from various sources to generate + * structured research content like abstracts, literature reviews, and methodology sections + * with proper citations and formatting. + */ + +import React, { useState } from 'react'; +import { FiFileText, FiBookOpen, FiClipboard, FiEdit, FiCheck } from 'react-icons/fi'; +import styles from '../../styles.module.css'; + +type DraftType = 'abstract' | 'literature' | 'methodology' | 'discussion'; + +interface DraftExample { + type: DraftType; + title: string; + content: string; + sources: string[]; +} + +const ResearchDraftsSection: React.FC = () => { + const [selectedDraft, setSelectedDraft] = useState('abstract'); + + const draftExamples: Record = { + abstract: { + type: 'abstract', + title: 'Effects of Mindfulness Meditation on Cognitive Performance', + content: `This study investigates the impact of regular mindfulness meditation practices on cognitive performance metrics, including attention span, working memory, and problem-solving capabilities. Through a randomized controlled trial involving 120 participants over a 12-week period, we found significant improvements in sustained attention (p < 0.01) and working memory capacity (p < 0.05) among the meditation group compared to controls. The results suggest that even short daily meditation sessions (10-15 minutes) can yield measurable cognitive benefits, potentially offering a cost-effective intervention for cognitive enhancement in educational and clinical settings.`, + sources: [ + 'Davidson, R. J., & Kaszniak, A. W. (2015). Conceptual and methodological issues in research on mindfulness and meditation. American Psychologist, 70(7), 581-592.', + 'Zeidan, F., Johnson, S. K., Diamond, B. J., David, Z., & Goolkasian, P. (2010). Mindfulness meditation improves cognition: Evidence of brief mental training. Consciousness and Cognition, 19(2), 597-605.', + 'Lutz, A., Slagter, H. A., Dunne, J. D., & Davidson, R. J. (2008). Attention regulation and monitoring in meditation. Trends in Cognitive Sciences, 12(4), 163-169.' + ] + }, + literature: { + type: 'literature', + title: 'Climate Change Adaptation Strategies in Urban Planning', + content: `Recent research on climate change adaptation in urban environments has focused on three primary domains: infrastructure resilience, policy frameworks, and community engagement. Tang et al. (2022) found that cities implementing comprehensive adaptation policies experienced 23% less infrastructure damage during extreme weather events. Similarly, Hernandez & Wong (2021) documented successful community-based adaptation initiatives across 15 global cities, highlighting the importance of local knowledge and participation. Meanwhile, technical innovations in urban design were evaluated by Patel et al. (2023), who cataloged emerging green infrastructure solutions with measurable climate adaptation benefits. This review reveals a growing consensus that effective urban climate adaptation requires integrated approaches combining policy reform, infrastructure modernization, and inclusive planning processes that center vulnerable communities.`, + sources: [ + 'Tang, J., Chen, H., & Singh, P. (2022). Measuring outcomes of urban climate adaptation policies: A comparative analysis of 40 global cities. Urban Climate, 31, 100545.', + 'Hernandez, M., & Wong, K. (2021). Community-led climate adaptation: Case studies from the Global South. Journal of Environmental Planning and Management, 64(10), 1863-1882.', + 'Patel, R., Mahmood, A., & Johnson, T. (2023). Technical innovations in green infrastructure for climate resilient cities. Landscape and Urban Planning, 221, 104355.', + 'Carter, J.G., Cavan, G., Connelly, A., Guy, S., Handley, J., & Kazmierczak, A. (2015). Climate change and the city: Building capacity for urban adaptation. Progress in Planning, 95, 1-66.' + ] + }, + methodology: { + type: 'methodology', + title: 'Automated Detection of Misinformation in Social Media', + content: `This study employs a mixed-methods approach to detect and classify misinformation in social media content. First, we collected a dataset of 50,000 posts from multiple platforms (Twitter, Facebook, and Reddit) using API access and specialized scraping tools between January-March 2023. The dataset was balanced across political topics, health claims, and scientific statements. We implemented a two-stage classification system: (1) a BERT-based language model fine-tuned on established misinformation datasets (accuracy: 87.3%), followed by (2) a fact-verification module cross-referencing claims against trusted knowledge bases. For validation, a panel of 5 fact-checking experts manually verified a random subset of 1,000 posts, achieving an inter-rater reliability coefficient of κ=0.82. Statistical analysis was performed using Python's scikit-learn package, with significance thresholds set at p<0.05 for all comparisons between classification approaches.`, + sources: [ + 'Zhou, X., & Zafarani, R. (2020). A survey of fake news: Fundamental theories, detection methods, and opportunities. ACM Computing Surveys, 53(5), 1-40.', + 'Devlin, J., Chang, M. W., Lee, K., & Toutanova, K. (2018). BERT: Pre-training of deep bidirectional transformers for language understanding. arXiv preprint arXiv:1810.04805.', + 'Shaar, S., Babulkov, N., Da San Martino, G., & Nakov, P. (2020). That is a known lie: Detecting previously fact-checked claims. arXiv preprint arXiv:2005.06058.' + ] + }, + discussion: { + type: 'discussion', + title: 'Ethical Implications of Facial Recognition in Public Spaces', + content: `Our findings reveal a complex ethical landscape surrounding facial recognition technology (FRT) deployment in public spaces. The tension between security benefits and privacy concerns emerges as a central theme across stakeholder interviews. While law enforcement representatives emphasized crime reduction metrics (15-22% in pilot locations), privacy advocates highlighted the disproportionate impact on marginalized communities, with false positive rates 3-5 times higher for darker-skinned individuals in our technical evaluation. The regulatory gap identified in our policy analysis suggests current governance frameworks remain inadequate for addressing algorithmic bias and consent issues. These results support a moratorium on certain FRT applications until technical improvements and robust regulatory frameworks can be established. Future research should explore consent mechanisms for public surveillance and investigate alternative security approaches that present fewer ethical complications. These findings contribute to the growing literature on algorithmic governance and suggest that technological capability must be balanced with ethical considerations and social impact assessments before widespread implementation.`, + sources: [ + 'Buolamwini, J., & Gebru, T. (2018). Gender shades: Intersectional accuracy disparities in commercial gender classification. Proceedings of the 1st Conference on Fairness, Accountability and Transparency, 81, 77-91.', + 'Najibi, A. (2020). Racial discrimination in face recognition technology. Science in the News, Harvard University Graduate School of Arts and Sciences.', + 'European Union Agency for Fundamental Rights. (2021). Facial recognition technology: fundamental rights considerations in the context of law enforcement.', + 'Wang, Y., & Kosinski, M. (2018). Deep neural networks are more accurate than humans at detecting sexual orientation from facial images. Journal of Personality and Social Psychology, 114(2), 246-257.' + ] + } + }; + + const draftTypes = [ + { value: 'abstract', label: 'Abstract', icon: }, + { value: 'literature', label: 'Literature Review', icon: }, + { value: 'methodology', label: 'Methodology', icon: }, + { value: 'discussion', label: 'Discussion', icon: } + ]; + + const currentDraft = draftExamples[selectedDraft]; + + return ( +
    +
    +

    AI-Generated Research Drafts

    +

    + Transform your research notes and sources into polished, structured content with proper citations +

    + +
    +
    +

    Select Draft Type

    +
    + {draftTypes.map(type => ( + + ))} +
    +
    + +
    +
    +

    {currentDraft.title}

    + {draftTypes.find(t => t.value === selectedDraft)?.label} +
    + +
    +

    {currentDraft.content}

    +
    + +
    +

    References

    +
      + {currentDraft.sources.map((source, index) => ( +
    • {source}
      • + ))} +
    +
    + +
    +
    + Proper academic formatting +
    +
    + Automatic citations +
    +
    + Style customization +
    +
    + Export to multiple formats +
    +
    +
    +
    + +
    +

    How It Works

    +
      +
    1. + 1 + Upload your research materials and sources +
      2. +
    2. + 2 + Select the type of content you need +
      3. +
    3. + 3 + Provide specific focus or requirements +
      4. +
    4. + 4 + Review, edit, and export your research draft +
      5. +
    +
    +
    +
    + ); +}; + +export default ResearchDraftsSection; \ No newline at end of file diff --git a/app/bots/research-assistant/components/features/ResearchSystemSection.tsx b/app/bots/research-assistant/components/features/ResearchSystemSection.tsx new file mode 100644 index 000000000..4edc27451 --- /dev/null +++ b/app/bots/research-assistant/components/features/ResearchSystemSection.tsx @@ -0,0 +1,163 @@ +import React from 'react'; + +/** + * Research Systematization Section + * + * This component showcases the automated research systematization feature + * which helps users organize their research materials efficiently. + */ +const ResearchSystemSection: React.FC = () => { + // Sample organization categories + const organizationCategories = [ + { name: "By Theme", description: "Group research by topics and subtopics", icon: "🏷️" }, + { name: "By Relevance", description: "Prioritize based on importance to your core research", icon: "⭐" }, + { name: "By Chronology", description: "Organize materials along a timeline", icon: "📅" }, + { name: "By Source Type", description: "Group by papers, books, interviews, etc.", icon: "📚" }, + { name: "By Methodology", description: "Categorize by research methods used", icon: "🧪" }, + { name: "By Author", description: "Group research by key contributors", icon: "👩‍🔬" } + ]; + + // Data formats that can be processed + const acceptedFormats = [ + { format: "PDFs", icon: "📄" }, + { format: "Word Documents", icon: "📝" }, + { format: "Text Files", icon: "📋" }, + { format: "Web Articles", icon: "🌐" }, + { format: "Notes", icon: "📓" }, + { format: "Images (OCR)", icon: "🖼️" }, + { format: "Audio Transcripts", icon: "🎙️" } + ]; + + return ( +
    +
    +

    Automated Research Systematization

    +

    + Transform your scattered research materials into a well-organized, searchable knowledge base + that helps you find exactly what you need, when you need it. +

    + +
    +
    +

    Upload Once, Organize Automatically

    +

    + Simply upload your research materials in any format. Our AI system will automatically extract key information, + identify themes, tag content, and create a structured database tailored to your research needs. +

    +
    +

    Process Any Research Material

    +
    + {acceptedFormats.map((item, index) => ( +
    +
    {item.icon}
    +
    {item.format}
    +
    + ))} +
    +
    +
    + +
    +
    +
    + 📑 +

    Research Database

    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    QUANTUM COMPUTING / ALGORITHMS
    +
    Grover's Algorithm: Applications in Database Search
    +
    Source: arXiv:2103.12345 • Added: Mar 15, 2023
    +
    +
    +
    QUANTUM COMPUTING / THEORY
    +
    Quantum Supremacy: Theoretical Foundations
    +
    Source: Science Journal • Added: Feb 28, 2023
    +
    +
    +
    QUANTUM COMPUTING / HARDWARE
    +
    Superconducting Qubits: Recent Advances
    +
    Source: Nature Physics • Added: Apr 10, 2023
    +
    +
    +
    QUANTUM COMPUTING / ERROR CORRECTION
    +
    Topological Quantum Error Correction Codes
    +
    Source: Personal Notes • Added: May 5, 2023
    +
    +
    +
    +
    + + +
    +
    +
    + +
    +

    Multiple Organization Systems

    +

    + View your research through different lenses to gain new insights and find exactly what you're looking for. +

    +
    + {organizationCategories.map((category, index) => ( +
    +
    {category.icon}
    +

    {category.name}

    +

    {category.description}

    +
    + ))} +
    +
    + +
    +

    Key Features

    +
    +
    +

    Automatic Organization

    +
      +
    • Smart categorization based on content analysis
      • +
    • Automated tagging with research-specific keywords
      • +
    • Cross-referencing between related materials
      • +
    • Citation extraction and formatting
      • +
    +
    +
    +

    Powerful Search & Retrieval

    +
      +
    • Full-text semantic search across all materials
      • +
    • Filter by categories, dates, sources, or custom tags
      • +
    • Save complex search queries for repeated use
      • +
    • Export organized collections in multiple formats
      • +
    +
    +
    +
    + +
    +

    + Focus on your research, not on managing files. Our system handles the organization + so you can concentrate on generating insights and making discoveries. +

    +
    +
    +
    + ); +}; + +export default ResearchSystemSection; \ No newline at end of file diff --git a/app/bots/research-assistant/components/features/WebScrapingSection.tsx b/app/bots/research-assistant/components/features/WebScrapingSection.tsx new file mode 100644 index 000000000..70b67e4e2 --- /dev/null +++ b/app/bots/research-assistant/components/features/WebScrapingSection.tsx @@ -0,0 +1,220 @@ +import React from 'react'; + +/** + * Web Scraping Section + * + * This component showcases the web scraping feature that keeps + * researchers updated with the latest information in their field. + */ +const WebScrapingSection: React.FC = () => { + // Sample sources the system can scrape from + const scrapingSources = [ + { name: "ArXiv", category: "Academic", logo: "📑", description: "Preprint server for scientific papers" }, + { name: "Google Scholar", category: "Academic", logo: "🎓", description: "Search engine for scholarly literature" }, + { name: "PubMed", category: "Academic", logo: "🔬", description: "Biomedical literature and abstracts" }, + { name: "Science Daily", category: "News", logo: "📰", description: "Science news articles and summaries" }, + { name: "Nature", category: "Academic", logo: "🌿", description: "Leading multidisciplinary science journal" }, + { name: "MIT Technology Review", category: "News", logo: "💻", description: "Technology and innovation reporting" }, + { name: "Twitter/X", category: "Social", logo: "🐦", description: "Real-time updates from researchers and institutions" }, + { name: "Academic Blogs", category: "Blogs", logo: "✍️", description: "Expert commentary on recent developments" } + ]; + + // Sample recent updates + const recentUpdates = [ + { + title: "Quantum Error Correction Breakthrough", + source: "Nature Physics", + date: "2 days ago", + summary: "Researchers demonstrated a new approach to quantum error correction that reduces noise by 74%, potentially bringing fault-tolerant quantum computing closer to reality.", + url: "#", + relevance: 98 + }, + { + title: "New Algorithm for Database Search Optimization", + source: "arXiv", + date: "1 week ago", + summary: "A novel algorithm that combines quantum and classical approaches shows a 3x speedup for large database searches compared to previous methods.", + url: "#", + relevance: 87 + }, + { + title: "Quantum Computing Hardware Scaling Challenges", + source: "IEEE Spectrum", + date: "2 weeks ago", + summary: "Industry experts discuss the main engineering obstacles to scaling quantum processors beyond 1000 qubits, with superconducting materials emerging as a key focus area.", + url: "#", + relevance: 82 + } + ]; + + return ( +
    +
    +

    Web Scraping for Real-Time Updates

    +

    + Stay at the cutting edge of your research field with automated updates from trusted sources, + filtered and prioritized based on your specific interests. +

    + +
    +
    +

    Never Miss Important Developments

    +

    + Our AI research assistant continuously monitors key sources in your field, identifying new publications, + breakthroughs, and discussions relevant to your specific research focus. +

    + +
    +
    +

    Recent Updates in Quantum Computing

    +
    +
    + {recentUpdates.map((update, index) => ( +
    +
    +
    {update.title}
    + + {update.relevance}% Match + +
    +
    + {update.source} • {update.date} +
    +

    {update.summary}

    + Read more → +
    + ))} +
    +
    + +
    +
    + +
    +

    Delivery Options

    +
    +
    +
    📧
    +
    Daily Email Digest
    +
    +
    +
    🔔
    +
    Real-time Alerts
    +
    +
    +
    📱
    +
    Mobile Notifications
    +
    +
    +
    🔄
    +
    Dashboard Updates
    +
    +
    +
    +
    + +
    +

    Comprehensive Source Coverage

    +

    + We monitor a wide range of sources to ensure you have complete coverage of developments in your field, + from formal academic publications to cutting-edge discussions on social media. +

    + +
    +
    +
    +

    Information Sources

    +
    + +
    +
    +
    +
    + + + + + + + + + + {scrapingSources.map((source, index) => ( + + + + + + ))} + +
    SourceCategoryDescription
    +
    +
    {source.logo}
    +
    {source.name}
    +
    +     		+ + {source.category} + + + {source.description} +
    +
    +
    + Additional sources can be added upon request +
    +
    +
    +
    + +
    +

    Smart Filtering & Analysis

    +
    +
    +
    + 🔍 +
    +

    Keyword Relevance

    +

    + Set up custom keywords and phrases to ensure you only receive updates that matter to your specific research focus. +

    +
    +
    +
    + 📈 +
    +

    Trending Analysis

    +

    + Identify emerging trends in your field before they become mainstream, giving you a competitive edge in research. +

    +
    +
    +
    + 📊 +
    +

    Reputation Scoring

    +

    + Filter sources by academic credibility, citation count, and peer-review status to ensure quality information. +

    +
    +
    +
    + +
    +

    + Stop manually checking dozens of sources. Let our AI assistant bring the latest research directly to you, + precisely filtered to match your interests. +

    +
    +
    +
    + ); +}; + +export default WebScrapingSection; \ No newline at end of file diff --git a/app/bots/research-assistant/components/hero/HeroSection.tsx b/app/bots/research-assistant/components/hero/HeroSection.tsx new file mode 100644 index 000000000..fb2b47769 --- /dev/null +++ b/app/bots/research-assistant/components/hero/HeroSection.tsx @@ -0,0 +1,110 @@ +/** + * HeroSection Component + * + * This component renders the main hero section for the Nerd AI Research Assistant landing page. + * It introduces the six core functions and value propositions with a call-to-action. + * + * @component + * @param {object} props - Component properties + * @param {string} props.title - The main title for the hero section + * @param {string} props.overview - A brief overview of the tool's capabilities + * @param {Function} props.getTryLink - Function that returns the URL to join the waitlist + */ +import React from 'react'; +import Link from 'next/link'; + +interface HeroSectionProps { + title: string; + overview: string; + getTryLink: () => string; +} + +const HeroSection: React.FC = ({ title, overview, getTryLink }) => { + return ( +
    +
    +
    +
    + 🧠 Launching in 2026 +
    +

    + Nerd: Your AI Research Assistant +

    +

    + Transform your research with an AI companion that organizes, updates, creates, engages, connects, and empowers your independent research journey. +

    + + +
    +
    + 📚 + Research Organization +
    +
    + 🔄 + Real-time Updates +
    +
    + ✍️ + Content Creation +
    +
    + 🔍 + Research Engagement +
    +
    + 👥 + Research Collaboration +
    +
    + 🔒 + Independent Research +
    +
    +
    +
    +
    +
    + 🧠 +
    +
    +

    Nerd

    +

    AI Research Assistant

    +
    +
    +
    +
    +

    How can I transform your research experience today?

    +
    +
    +

    I need to organize my quantum computing research, stay updated on new papers, and create shareable content.

    +
    +
    +

    I'll organize your quantum research, set up real-time updates for new papers, and generate drafts for articles and social media. Would you like to connect with other quantum researchers too?

    +
    +
    +
    +
    +
    + ); +}; + +export default HeroSection; \ No newline at end of file diff --git a/app/bots/research-assistant/components/integration/DevelopmentRoadmap.tsx b/app/bots/research-assistant/components/integration/DevelopmentRoadmap.tsx new file mode 100644 index 000000000..a545bc093 --- /dev/null +++ b/app/bots/research-assistant/components/integration/DevelopmentRoadmap.tsx @@ -0,0 +1,283 @@ +/** + * DevelopmentRoadmap.tsx + * + * This component showcases the development timeline, vision, and collaboration + * opportunities for Nerd - the AI Research Assistant. It provides users with information + * about future plans and how they can contribute to the project. + */ + +import React, { useState } from 'react'; +import styles from '../../styles.module.css'; + +type CollaborationType = 'developer' | 'researcher' | 'domain-expert'; + +/** + * Combined section for vision, development timeline, and collaboration + */ +const DevelopmentRoadmap: React.FC = () => { + const [collaborationType, setCollaborationType] = useState('developer'); + + const roadmapItems = [ + { + title: "Concept Development", + description: "Initial concept development and research on AI-powered research assistants", + timeframe: "2025 Q1", + icon: "🧪", + completed: true + }, + { + title: "Alpha Research Organizer", + description: "First internal prototype focusing on research organization and tagging", + timeframe: "2025 Q3", + icon: "📁", + completed: false + }, + { + title: "Beta Testing Program", + description: "Limited beta with researchers for research organization and updates features", + timeframe: "2026 Q1", + icon: "🔍", + completed: false + }, + { + title: "Content Creation Engine", + description: "Development of AI-powered content creation capabilities for research papers and social media", + timeframe: "2026 Q3", + icon: "✍️", + completed: false + }, + { + title: "Engagement & Discovery Mode", + description: "Implementation of research engagement features and discovery mode for breakthrough insights", + timeframe: "2026 Q4", + icon: "💡", + completed: false + }, + { + title: "Collaboration Platform", + description: "Building tools for researcher collaboration and integration with existing tools", + timeframe: "2027 Q1", + icon: "👥", + completed: false + }, + { + title: "Independent Research Features", + description: "Final development of tools for anonymous research, fundraising, and collaboration", + timeframe: "2027 Q2", + icon: "🔒", + completed: false + }, + { + title: "Nerd Full Launch", + description: "Official public launch of the complete Nerd platform with all core features", + timeframe: "2027 Q3", + icon: "🚀", + completed: false + } + ]; + + return ( +
    +
    + {/* Vision Section */} +
    +

    Our Vision

    +
    +

    + Nerd envisions a future where humans and machines collaborate fluidly in pursuit of truth and knowledge. + We're building a platform that transcends traditional barriers of credentialism and institutional gatekeeping, + while leveraging the power of AI to accelerate research and discovery toward technological singularity. +

    + +
    +
    +

    Human-AI Symbiosis

    +

    Developing intelligent systems that enhance human creativity and analytical capabilities, creating a symbiotic relationship that elevates research beyond current limitations.

    +
    + +
    +

    Decentralized Access

    +

    Democratizing research through blockchain-based systems, alternative funding mechanisms like DAOs, and removing institutional barriers that prevent brilliant minds from contributing.

    +
    + +
    +

    Accelerated Discovery

    +

    Creating systems that identify promising connections across disciplines, surface overlooked research, and generate novel hypotheses—dramatically speeding the path to breakthrough discoveries.

    +
    +
    + +

    + By our 2027 launch, Nerd will provide a comprehensive platform where anyone with intellectual curiosity can contribute + to human knowledge advancement, regardless of formal credentials. We're building a future where AI amplifies human potential, + decentralized structures remove traditional gatekeepers, and collaborative intelligence drives us toward + an unprecedented acceleration of scientific and technological progress. +

    +
    +
    + + {/* Timeline Section - Mobile Responsive */} +
    +

    Development Timeline to 2027 Launch

    + + {/* Mobile Timeline (visible on small screens) */} +
    +
    + {roadmapItems.map((item, index) => ( +
    +
    + {item.icon} +
    +
    +

    {item.title}

    +

    {item.description}

    + + {item.timeframe} {item.completed && '✓'} + +
    +
    + ))} +
    +
    + + {/* Desktop Timeline (visible on medium screens and up) */} +
    +
    +
    + {roadmapItems.map((item, index) => ( +
    +
    +

    {item.title}

    +

    {item.description}

    + + {item.timeframe} {item.completed && '✓'} + +
    +
    +
    + {item.icon} +
    +
    +
    +
    + ))} +
    +
    +
    + + {/* Collaboration Section */} +
    +

    Collaborate With Nerd

    +

    + Join our collaborative community of engineers, researchers, and domain experts working together + to redefine what's possible in research. Help shape the future of Nerd before our 2026 launch. +

    + +
    +
    + + + +
    + + {collaborationType === 'developer' && ( +
    +

    Engineering Collaboration

    +

    + Help build Nerd's AI-powered tools that will transform how knowledge is discovered, organized, and shared. +

    +
    +
      +
    • Develop advanced knowledge graph systems for research organization
      • +
    • Create intuitive interfaces for real-time research updates
      • +
    • Build AI content creation systems for research papers and social media
      • +
    • Design engagement features and discovery mode algorithms
      • +
    • Implement secure systems for anonymous and independent research
      • +
    +
    +
    + )} + + {collaborationType === 'researcher' && ( +
    +

    Academic Collaboration

    +

    + Partner with us to ensure Nerd addresses real research challenges and fits seamlessly into academic workflows. +

    +
    +
      +
    • Test our research organization systems with your own materials
      • +
    • Provide feedback on real-time update relevance and quality
      • +
    • Evaluate content creation tools for research papers
      • +
    • Help refine the engagement questions and discovery mode
      • +
    • Advise on collaboration tools and independent research features
      • +
    +
    +
    + )} + + {collaborationType === 'domain-expert' && ( +
    +

    Specialized Knowledge

    +

    + Bring your unique expertise to help us develop Nerd's capabilities across different fields and disciplines. +

    +
    +
      +
    • Guide field-specific research organization approaches
      • +
    • Identify key sources for real-time updates in your domain
      • +
    • Provide templates and standards for research content creation
      • +
    • Share domain-specific research questions for engagement
      • +
    • Outline collaboration patterns specific to your field
      • +
    +
    +
    + )} + +
    +

    + Our 2027 launch will be shaped by collaborative input from experts across fields. + Join the Nerd community today to influence the development of tomorrow's research tools. +

    + + Join Our Beta Program + +
    +
    +
    +
    +
    + ); +}; + +export default DevelopmentRoadmap; \ No newline at end of file diff --git a/app/bots/research-assistant/components/integration/IntegrationSection.tsx b/app/bots/research-assistant/components/integration/IntegrationSection.tsx new file mode 100644 index 000000000..38424af45 --- /dev/null +++ b/app/bots/research-assistant/components/integration/IntegrationSection.tsx @@ -0,0 +1,278 @@ +/** + * IntegrationSection.tsx + * + * This component showcases the Collaboration features of the + * Nerd AI Research Assistant. It demonstrates how Nerd enables researchers + * to connect with peers, raise funding, find resources, and create + * collaborative workspaces that integrate with popular research tools. + */ + +import React, { useState } from 'react'; +import Image from 'next/image'; +import styles from '../../styles.module.css'; + +interface IntegrationTool { + id: string; + name: string; + icon: string; + description: string; + features: string[]; +} + +interface CollaborationFeature { + id: string; + title: string; + description: string; + icon: string; +} + +const IntegrationSection: React.FC = () => { + const [selectedTool, setSelectedTool] = useState('zotero'); + const [activeFeature, setActiveFeature] = useState('find-peers'); + + const collaborationFeatures: CollaborationFeature[] = [ + { + id: 'find-peers', + title: 'Find Research Peers', + description: 'Discover and connect with other researchers working in your field or on similar problems, regardless of institutional affiliation.', + icon: '👥' + }, + { + id: 'raise-funding', + title: 'Raise Research Funding', + description: 'Access decentralized funding mechanisms, grants, and crowdfunding opportunities to support your independent research projects.', + icon: '💰' + }, + { + id: 'find-resources', + title: 'Access Resources', + description: 'Find computational resources, datasets, specialized equipment, and other research assets shared by the community.', + icon: '🔍' + }, + { + id: 'create-workspaces', + title: 'Collaborative Workspaces', + description: 'Create shared research environments that integrate with your favorite tools and enable real-time collaboration across distributed teams.', + icon: '🔄' + } + ]; + + const integrationTools: IntegrationTool[] = [ + { + id: 'zotero', + name: 'Zotero', + icon: '/images/zotero-icon.svg', + description: 'Sync your Zotero library with Nerd for seamless citation management and literature organization.', + features: [ + 'Automatically extract key information from papers in your Zotero library', + 'Generate summaries of papers with one click', + 'Organize research by themes that cut across your manual collections', + 'Identify connections between papers that might not be obvious', + 'Streamline citation workflow with formatted references on demand' + ] + }, + { + id: 'notion', + name: 'Notion', + icon: '/images/notion-icon.svg', + description: 'Connect your Notion workspace to organize research notes, drafts, and findings in your existing knowledge management system.', + features: [ + 'Push research summaries directly to your Notion pages', + 'Create structured databases of research findings', + 'Generate literature review tables that update automatically', + 'Keep research notes synchronized across platforms', + 'Embed interactive research visualizations in your Notion documents' + ] + }, + { + id: 'google-drive', + name: 'Google Drive', + icon: '/images/google-drive-icon.svg', + description: 'Seamlessly integrate with Google Drive to access, analyze, and organize your research documents in the cloud.', + features: [ + 'Process multiple document formats including Google Docs, Sheets, and PDFs', + 'Maintain version history when generating new research content', + 'Collaborate with team members using shared Drive folders', + 'Auto-generate research reports in Google Docs format', + 'Extract and analyze data from spreadsheets to identify patterns' + ] + }, + { + id: 'github', + name: 'GitHub', + icon: '/images/github-icon.svg', + description: 'Connect with GitHub to manage research code, documentation, and collaborative projects with version control.', + features: [ + 'Generate documentation for research code automatically', + 'Track changes to research methods and results over time', + 'Facilitate code review and collaboration on computational research', + 'Create reproducible research environments with configuration files', + 'Publish research websites and interactive demonstrations' + ] + } + ]; + + const currentTool = integrationTools.find(tool => tool.id === selectedTool) || integrationTools[0]; + const currentFeature = collaborationFeatures.find(feature => feature.id === activeFeature) || collaborationFeatures[0]; + + return ( +
    +
    +

    DeSci Collaboration Platform

    +

    + Connect with researchers, raise funding, access resources, and create collaborative workspaces + free from institutional constraints and bureaucratic hurdles. +

    +
    + + {/* Collaboration Features */} +
    +

    Decentralized Science Infrastructure

    + +
    + {collaborationFeatures.map(feature => ( + + ))} +
    + +
    +

    {currentFeature.title}

    +

    {currentFeature.description}

    + + {activeFeature === 'find-peers' && ( +
    +
    How Nerd Connects Researchers
    +
      +
    • Semantic matching of research interests and expertise
      • +
    • Anonymous collaboration options to focus on ideas, not credentials
      • +
    • Discover researchers working on complementary problems
      • +
    • Connect across disciplines, institutions, and geographical boundaries
      • +
    • Build research networks based on shared interests, not institutional affiliations
      • +
    +
    + )} + + {activeFeature === 'raise-funding' && ( +
    +
    Decentralized Research Funding
    +
      +
    • Access to quadratic funding pools for community-valued research
      • +
    • Connect with research DAOs (Decentralized Autonomous Organizations)
      • +
    • Create transparent funding proposals with clear milestones
      • +
    • Crowdfund specific research initiatives from interested communities
      • +
    • Receive micropayments for incremental research contributions
      • +
    +
    + )} + + {activeFeature === 'find-resources' && ( +
    +
    Community Resource Sharing
    +
      +
    • Access shared computational resources for intensive research tasks
      • +
    • Discover open datasets relevant to your research questions
      • +
    • Find specialized equipment through peer-to-peer sharing networks
      • +
    • Access journal subscriptions and paywalled content through community pools
      • +
    • Share and discover specialized research software and tools
      • +
    +
    + )} + + {activeFeature === 'create-workspaces' && ( +
    +
    Integrated Research Environments
    +
      +
    • Create shared workspaces that integrate with your preferred tools
      • +
    • Real-time collaboration with version control and change tracking
      • +
    • Customizable permission systems for different team roles
      • +
    • Seamless data sharing across distributed research teams
      • +
    • Integrated communication channels for synchronous and asynchronous work
      • +
    +
    + )} +
    +
    + + {/* Tool Integration Section */} +
    +

    Integrate with Your Favorite Tools

    + +
    + {integrationTools.map(tool => ( + + ))} +
    + +
    +
    +
    +
    + {`${currentTool.name} +
    +

    {currentTool.name} Integration

    +
    +

    {currentTool.description}

    +
    + +
    +
    Key Features
    +
      + {currentTool.features.map((feature, index) => ( +
    • + ✓ + {feature} +
      • + ))} +
    +
    +
    +
    + +
    +

    + Join our decentralized science community and transform how research is conducted, + funded, and shared—free from traditional gatekeepers and institutional constraints. +

    + +
    +
    + ); +}; + +export default IntegrationSection; \ No newline at end of file diff --git a/app/bots/research-assistant/components/navigation/Navigation.tsx b/app/bots/research-assistant/components/navigation/Navigation.tsx new file mode 100644 index 000000000..f0319a604 --- /dev/null +++ b/app/bots/research-assistant/components/navigation/Navigation.tsx @@ -0,0 +1,177 @@ +import React, { useState, useEffect } from 'react'; +import Link from 'next/link'; + +/** + * Navigation component for Nerd - AI Research Assistant + * Structured around the six core value propositions + */ +const Navigation: React.FC<{ className?: string }> = ({ className = '' }) => { + const [activeSection, setActiveSection] = useState(''); + const [isVisible, setIsVisible] = useState(false); + const [lastScrollY, setLastScrollY] = useState(0); + const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); + + // Menu items organized by value proposition + const menuItems = [ + { id: 'organize', label: 'Organize Research', icon: '📚', section: 'research-system' }, + { id: 'updates', label: 'Stay Updated', icon: '🔄', section: 'web-scraping' }, + { id: 'create', label: 'Create Content', icon: '✍️', section: 'draft-generation' }, + { id: 'engage', label: 'Stay Engaged', icon: '🔍', section: 'daily-questions' }, + { id: 'collaborate', label: 'Collaborate', icon: '👥', section: 'integration' }, + { id: 'roadmap', label: '2026 Launch', icon: '🚀', section: 'roadmap' } + ]; + + // Handle scroll events to show/hide navigation and highlight active section + useEffect(() => { + const handleScroll = () => { + const currentScrollY = window.scrollY; + + // Show navigation after scrolling down 200px + if (currentScrollY > 200) { + setIsVisible(true); + } else { + setIsVisible(false); + } + + // Determine active section + if (currentScrollY > 100) { + const sectionIds = menuItems.map(item => item.section); + // Find which section is currently in view + const sections = sectionIds.map(id => document.getElementById(id)).filter(Boolean); + + for (let i = sections.length - 1; i >= 0; i--) { + const section = sections[i]; + if (section && section.offsetTop <= currentScrollY + 300) { + const menuItem = menuItems.find(item => item.section === section.id); + if (menuItem) { + setActiveSection(menuItem.id); + } + break; + } + } + } + + setLastScrollY(currentScrollY); + }; + + window.addEventListener('scroll', handleScroll, { passive: true }); + handleScroll(); // Initial check + + return () => window.removeEventListener('scroll', handleScroll); + }, [lastScrollY, menuItems]); + + // Handle smooth scrolling when clicking a menu item + const scrollToSection = (sectionId: string) => { + const element = document.getElementById(sectionId); + if (element) { + window.scrollTo({ + top: element.offsetTop - 100, + behavior: 'smooth', + }); + const menuItem = menuItems.find(item => item.section === sectionId); + if (menuItem) { + setActiveSection(menuItem.id); + } + // Close mobile menu after clicking + setIsMobileMenuOpen(false); + } + }; + + // Scroll to top function for logo click + const scrollToTop = () => { + window.scrollTo({ + top: 0, + behavior: 'smooth' + }); + setIsMobileMenuOpen(false); + }; + + return ( + + ); +}; + +export default Navigation; \ No newline at end of file diff --git a/app/bots/research-assistant/components/questions/DailyQuestionsSection.tsx b/app/bots/research-assistant/components/questions/DailyQuestionsSection.tsx new file mode 100644 index 000000000..96b467f0d --- /dev/null +++ b/app/bots/research-assistant/components/questions/DailyQuestionsSection.tsx @@ -0,0 +1,277 @@ +/** + * DailyQuestionsSection.tsx + * + * This component showcases the Research Rabbit Holes feature of the + * Nerd AI Research Assistant. It demonstrates how Nerd generates intellectually + * stimulating questions that lead researchers down unexpected but fruitful paths + * of inquiry, sparking creative thinking and new directions for exploration. + */ + +import React, { useState } from 'react'; +import { FiRotateCw, FiBookmark, FiMessageSquare, FiClock, FiPlus } from 'react-icons/fi'; +import styles from '../../styles.module.css'; + +interface ResearchField { + id: string; + name: string; + questions: string[]; +} + +const DailyQuestionsSection: React.FC = () => { + const [selectedField, setSelectedField] = useState('neuroscience'); + const [answering, setAnswering] = useState(null); + const [showPrevious, setShowPrevious] = useState(false); + const [customField, setCustomField] = useState(''); + + const researchFields: ResearchField[] = [ + { + id: 'neuroscience', + name: 'Neuroscience', + questions: [ + "How might the brain's default mode network influence creative problem-solving in ways we haven't yet measured?", + "What if neuroplasticity could be selectively enhanced in targeted brain regions – how might this change our approach to treating neurodegenerative disorders?", + "Could the mechanisms of memory consolidation during sleep be artificially replicated to enhance learning while awake?", + "What are the potential implications of recent findings on neuronal quantum effects for our understanding of consciousness?", + "How might glial cells, beyond their known supportive functions, be actively participating in cognitive processes?" + ] + }, + { + id: 'neurotechnology', + name: 'Neurotechnology', + questions: [ + "How might bidirectional brain-computer interfaces reshape our concept of personal identity and cognitive boundaries?", + "What novel approaches to neural dust technology could enable non-invasive deep brain monitoring?", + "Could neurofeedback systems be designed to operate at the level of individual neural circuits rather than broader brain regions?", + "What if synaptic-level brain-machine interfaces could selectively strengthen or weaken specific memory traces?", + "How might optogenetic techniques be combined with AI to create self-regulating neural intervention systems?" + ] + }, + { + id: 'psychedelics', + name: 'Psychedelics Research', + questions: [ + "How might the default mode network disruption observed during psychedelic experiences inform new treatments for rigid thinking patterns in conditions beyond depression?", + "What if psychedelic-induced neuroplasticity could be pharmacologically isolated from the subjective effects?", + "Could the temporary ego dissolution experienced during psychedelic therapy provide insights for AI consciousness research?", + "What novel biomarkers might predict individual responses to psychedelic therapy?", + "How might traditional indigenous knowledge about plant medicines inform modern psychedelic research protocols?" + ] + }, + { + id: 'climate-science', + name: 'Climate Science', + questions: [ + "What overlooked geological carbon sinks might we be failing to include in current climate models?", + "How might changing ocean circulation patterns interact with marine microbiomes to create feedback loops we haven't anticipated?", + "What if urban heat islands could be transformed into renewable energy collection systems – what technologies would make this possible?", + "Could traditional indigenous land management techniques be scaled to address modern carbon sequestration needs?", + "What unexpected ecological adaptations might emerge in response to increased atmospheric CO2 that could inform human adaptations?" + ] + }, + { + id: 'artificial-intelligence', + name: 'Artificial Intelligence', + questions: [ + "How might neuromorphic computing architectures address current limitations in AI's ability to handle contextual understanding?", + "What unexpected emergent behaviors might arise in multi-agent AI systems that operate without centralized control?", + "How could we design AI systems that explain their reasoning in ways that actually enhance human understanding rather than simply providing outputs?", + "What cognitive biases might we be unintentionally embedding in AI systems that haven't yet been identified?", + "Could AI systems be designed to deliberately optimize for scientific surprise rather than prediction accuracy?" + ] + }, + { + id: 'nuclear-fusion', + name: 'Nuclear Fusion', + questions: [ + "What materials or configurations might enable stable plasma confinement at lower magnetic field strengths?", + "How might biological systems that efficiently manage energy transfer inform new approaches to fusion engineering?", + "What if quantum computing could optimize fusion plasma dynamics in real-time?", + "Could hybrid fission-fusion systems provide a more practical intermediate step toward commercial fusion power?", + "What overlooked nuclear reactions or fuel cycles might offer unexpected advantages for fusion energy production?" + ] + }, + { + id: 'gene-editing', + name: 'Gene Editing', + questions: [ + "How might we develop gene editing systems that adapt to cellular context dynamically?", + "What if CRISPR-like systems could be trained to recognize and edit epigenetic modifications rather than DNA sequences?", + "Could synthetic genetic circuits be designed to self-regulate across multiple generations of cells?", + "What unexplored roles might non-coding RNAs play in improving the precision of gene editing techniques?", + "How might biomimetic approaches to error correction improve the safety profile of gene therapies?" + ] + }, + { + id: 'cosmic-structure', + name: 'Cosmic Structure Formation', + questions: [ + "What if the apparent acceleration of cosmic expansion is actually an artifact of inhomogeneous structure formation?", + "How might primordial magnetic fields have influenced the formation of the first stars and galaxies?", + "Could alternative dark matter models better explain observed galaxy rotation curves without requiring modification of gravity?", + "What novel observational techniques might reveal the detailed structure of cosmic filaments?", + "How might the interaction between baryonic feedback and dark matter halos resolve current tensions in cosmological simulations?" + ] + }, + { + id: 'quantum-computing', + name: 'Quantum Computing', + questions: [ + "What mathematical structures beyond tensor networks might prove useful for modeling quantum entanglement?", + "How might quantum algorithms specifically designed for simulation of biological systems open new frontiers in healthcare?", + "What if quantum error correction could be reimagined using biological self-repair mechanisms as inspiration?", + "Could quantum computing approaches reveal new patterns in seemingly chaotic economic or social systems?", + "What theoretical barriers might exist beyond quantum supremacy that we haven't yet anticipated?" + ] + } + ]; + + const currentField = researchFields.find(field => field.id === selectedField) || researchFields[0]; + + const handleAnswerClick = (index: number) => { + setAnswering(answering === index ? null : index); + }; + + const handleAddCustomField = () => { + // In a real implementation, this would add the field to the user's profile + // For now, we'll direct them to ChatGPT + window.open('https://chatgpt.com/g/research-assistant', '_blank'); + }; + + return ( +
    +
    +

    Research Rabbit Holes

    +

    + Venture down intellectually stimulating paths that challenge your thinking and lead to unexpected discoveries +

    + +
    +
    +

    Research Fields

    +
    + {researchFields.map(field => ( + + ))} + + {/* Custom field input */} +
    + setCustomField(e.target.value)} + placeholder="Enter your research field..." + className="flex-grow p-2 border border-gray-300 rounded-l-md focus:outline-none focus:ring-2 focus:ring-indigo-500" + /> + +
    +
    +
    + +
    +
    +

    Today's Questions for {currentField.name}

    +
    + + +
    +
    + +
    + {currentField.questions.map((question, index) => ( +
    +

    {question}

    +
    + + +
    + + {answering === index && ( +
    + + {error && ( + + )} +
    + +
    + +
    + +
    + ); +}; + +export default EmailGenerator; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/communication/TextGenerator.tsx b/app/bots/swiss-german-teacher/components/communication/TextGenerator.tsx new file mode 100644 index 000000000..b1c9615ca --- /dev/null +++ b/app/bots/swiss-german-teacher/components/communication/TextGenerator.tsx @@ -0,0 +1,85 @@ +import { useState } from 'react'; +import { btnPrimary } from '../../utils/constants'; + +interface TextGeneratorProps { + getTryLink: () => string; +} + +const TextGenerator = ({ getTryLink }: TextGeneratorProps) => { + const [prompt, setPrompt] = useState(''); + const [isLoading, setIsLoading] = useState(false); + const [error, setError] = useState(null); + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + if (!prompt.trim()) { + setError('Please enter a prompt'); + return; + } + + setIsLoading(true); + setError(null); + + // Simulate API call + setTimeout(() => { + setIsLoading(false); + // Redirect to ChatGPT with the prompt + window.open(`${getTryLink()}?q=${encodeURIComponent(`Write a Swiss German text message: ${prompt}`)}`, '_blank'); + }, 500); + }; + + // Quick suggestion buttons + const suggestions = [ + "I'll be 15 minutes late", + "Want to meet for lunch?", + "Thanks for yesterday" + ]; + + return ( +
    +
    + {suggestions.map(suggestion => ( + + ))} +
    + +
    +
    + + + {error &&

    {error}

    } +
    +
    + +
    +
    +
    + ); +}; + +export default TextGenerator; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/content/SwissContentSection.tsx b/app/bots/swiss-german-teacher/components/content/SwissContentSection.tsx new file mode 100644 index 000000000..4249666de --- /dev/null +++ b/app/bots/swiss-german-teacher/components/content/SwissContentSection.tsx @@ -0,0 +1,67 @@ +import React from 'react'; +import { btnSecondary } from '../../utils/constants'; + +const SwissContentSection: React.FC = () => { + return ( +
    +
    +
    + + + +
    +

    Swiss Content

    + + Coming Soon + +
    +

    + Enhance your learning with authentic Swiss German content curated to match your proficiency level. +

    + +
    +

    + Our team is currently developing a rich library of content to help you immerse yourself in Swiss German language and culture. +

    + +
    +
    + + + +

    Video Content

    +

    Short videos with subtitles in Standard and Swiss German

    +
    + +
    + + + +

    Podcasts

    +

    Audio content with transcripts for listening practice

    +
    + +
    + + + +

    Articles

    +

    News articles and blog posts with vocabulary assistance

    +
    +
    + +
    + +
    +
    +
    + ); +}; + +export default SwissContentSection; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/future/FutureVisionSection.tsx b/app/bots/swiss-german-teacher/components/future/FutureVisionSection.tsx new file mode 100644 index 000000000..f83bf19bb --- /dev/null +++ b/app/bots/swiss-german-teacher/components/future/FutureVisionSection.tsx @@ -0,0 +1,140 @@ +import React from 'react'; +import { featureNumberBadge, featureNumberText } from '../../utils/constants'; + +const FutureVisionSection = () => { + return ( +
    +
    +

    + The Future of Swiss German Learning +

    +

    + We're building Heidi to transform how people learn Swiss German and engage with Swiss culture. Our vision extends beyond language learning to create meaningful connections and authentic experiences. +

    + +
    +

    Help Us Build Heidi

    +

    + We're actively looking for Swiss German experts, linguists, and skilled engineers to join our team and help create the next generation of language learning technology. +

    +
    +
    +

    We're Looking For:

    +
      +
    • + + Swiss German native speakers and dialect experts +
      • +
    • + + Computational linguists with NLP experience +
      • +
    • + + Full-stack developers with AI experience +
      • +
    +
    +
    +

    Get Involved:

    +

    Interested in contributing to Heidi's development? Let us know your expertise.

    + + Contact our team + + +
    +
    +
    + +
    +

    Roadmap

    +

    + Here's what we're planning to build in the coming months. +

    + +
    +
    +
    1
    +
    +

    Personalized Learning Paths

    +

    + Customized learning experiences that adapt to your goals, whether you're preparing for a job interview, planning to relocate, or simply interested in the culture. +

    +
    +

    + Coming Q2 2025: Initial assessment and personalized vocabulary modules based on your specific needs and Swiss region of interest. +

    +
    +
    +
    +
    + +
    +
    +
    2
    +
    +

    Cultural Insights Platform

    +

    + Comprehensive guides to Swiss customs, traditions, social norms, history, and governance to help you navigate daily life and understand the culture. +

    +
    +

    + Coming Q3 2025: Interactive cultural guides covering social etiquette, local traditions, history, and the Swiss political system. +

    +
    +
    +
    +
    + +
    +
    +
    3
    +
    +

    Swiss Content Library

    +

    + Authentic Swiss German content curated to match your proficiency level, including videos with subtitles, podcasts, and articles. +

    +
    +

    + Coming Q4 2025: Launch of the content library with subtitled videos and transcripts from Zürich, Bern, and Basel regions. +

    +
    +
    +
    +
    + +
    +
    +
    4
    +
    +

    Audio Recognition & Feedback

    +

    + Practice your pronunciation with our advanced speech recognition technology that provides instant feedback specific to Swiss German dialects. +

    +
    +

    + Coming Q1 2026: Record yourself and receive detailed feedback on your accent and pronunciation. +

    +
    +
    +
    +
    +
    +
    +
    + ); +}; + +export default FutureVisionSection; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/hero/HeroSection.tsx b/app/bots/swiss-german-teacher/components/hero/HeroSection.tsx new file mode 100644 index 000000000..767384f2c --- /dev/null +++ b/app/bots/swiss-german-teacher/components/hero/HeroSection.tsx @@ -0,0 +1,164 @@ +import React from 'react'; +import { btnPrimary, btnSecondary } from '../../utils/constants'; +import { openHeidiBot } from '../../utils/navigation'; + +interface HeroSectionProps { + getTryLink: () => string; +} + +const HeroSection = ({ getTryLink }: HeroSectionProps) => { + return ( +
    + {/* Hero Background Pattern */} +
    + + + + + + + + +
    + + {/* Content Container */} +
    +
    + {/* Left Column - Text Content */} +
    +
    + + + + + Made in Zürich, Switzerland + +
    + +

    + Meet Heidi, Your Swiss German Teacher +

    +

    + A personalized AI language tutor that helps you learn Swiss German naturally and authentically. +

    + +
    +
    + + + +

    Learn real Swiss German as it's actually spoken

    +
    +
    + + + +

    Focus on practical vocabulary and expressions

    +
    +
    + + + +

    Cultural context to understand the Swiss way of life

    +
    +
    + +
    + + +
    +
    + + {/* Right Column - Demo Images */} +
    +
    +
    +
    +
    +
    +
    +
    +
    + Chat with Heidi - Your Swiss German Teacher +
    +
    +
    +
    +
    + H +
    +
    +

    + Grüezi! I'm Heidi, your Swiss German teacher. How can I help you today? +

    +
    +
    +
    +
    +

    + I'm planning a trip to Zürich and want to learn some basic Swiss German phrases. +

    +
    +
    + U +
    +
    +
    +
    + H +
    +
    +

    + That's exciting! Here are some useful everyday phrases in Swiss German (Zürich dialect): +

    +
      +
    • Grüezi - Hello (formal)
      • +
    • Hoi - Hi (informal)
      • +
    • Merci vilmal - Thank you very much
      • +
    • Uf Widerluege - Goodbye
      • +
    • Wie gaht's? - How are you?
      • +
    +
    +
    +
    +
    + + {/* Testimonial Bubble */} +
    +
    +
    + {[1, 2, 3, 4, 5].map((star) => ( + + + + ))} +
    + 5.0 +
    +

    + "Heidi helped me learn Swiss German when standard German courses weren't working for me. So practical!" +

    +

    + – Michael T., Expat in Zürich +

    +
    +
    +
    +
    +
    + ); +}; + +export default HeroSection; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/language-learning/ConversationPractice.tsx b/app/bots/swiss-german-teacher/components/language-learning/ConversationPractice.tsx new file mode 100644 index 000000000..a936ac8db --- /dev/null +++ b/app/bots/swiss-german-teacher/components/language-learning/ConversationPractice.tsx @@ -0,0 +1,68 @@ +import React from 'react'; +import { btnPrimary } from '../../utils/constants'; + +interface ConversationPracticeProps { + getTryLink: () => string; +} + +const ConversationPractice = ({ getTryLink }: ConversationPracticeProps) => { + const conversations = [ + { + situation: "Ordering coffee", + standard: "Ich hätte gerne einen Kaffee, bitte.", + swiss: "Ich hett gern en Kafi, bitte.", + translation: "I would like a coffee, please." + }, + { + situation: "Asking for the bill", + standard: "Die Rechnung, bitte.", + swiss: "D'Rächnig, bitte.", + translation: "The bill, please." + } + ]; + + return ( +
    + {conversations.map((convo, index) => ( +
    +
    +

    {convo.situation}

    +
    +
    +
    +

    Standard German:

    +

    {convo.standard}

    +
    +
    +

    Swiss German:

    +

    {convo.swiss}

    +
    +
    +

    English:

    +

    {convo.translation}

    +
    +
    +
    + ))} + +
    +

    Practice conversations

    +

    + Simulate real-life conversations in Swiss German. Heidi will play different roles and help you practice. +

    + +
    +
    + ); +}; + +export default ConversationPractice; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/language-learning/GrammarPractice.tsx b/app/bots/swiss-german-teacher/components/language-learning/GrammarPractice.tsx new file mode 100644 index 000000000..9cc8cf3ae --- /dev/null +++ b/app/bots/swiss-german-teacher/components/language-learning/GrammarPractice.tsx @@ -0,0 +1,89 @@ +import React from 'react'; +import { btnPrimary } from '../../utils/constants'; + +interface GrammarPracticeProps { + getTryLink: () => string; +} + +const GrammarPractice = ({ getTryLink }: GrammarPracticeProps) => { + return ( +
    +
    +
    +

    Pronunciation Differences

    +
    +
    +
      +
    • + K → Ch +
      +

      + Standard: Kind (child) +

      +

      + Swiss: Chind +

      +
      +
      • +
    • + -en → -e +
      +

      + Standard: machen (to do/make) +

      +

      + Swiss: mache +

      +
      +
      • +
    +
    +
    + +
    +
    +

    Grammar Simplifications

    +
    +
    +
    +
    No Simple Past Tense
    +

    + Swiss German uses perfect tense (have/has + past participle) instead of simple past. +

    +
    +
    +

    Standard (simple past):

    +

    Ich ging nach Hause.

    +

    I went home.

    +
    +
    +

    Swiss (perfect tense):

    +

    Ich bi hei gange.

    +

    I have gone home.

    +
    +
    +
    +
    +
    + +
    +

    Understand Swiss German grammar

    +

    + Get personalized grammar explanations that focus on the differences between Standard German and Swiss German. +

    + +
    +
    + ); +}; + +export default GrammarPractice; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/language-learning/LanguageLearningSection.tsx b/app/bots/swiss-german-teacher/components/language-learning/LanguageLearningSection.tsx new file mode 100644 index 000000000..79398e3f9 --- /dev/null +++ b/app/bots/swiss-german-teacher/components/language-learning/LanguageLearningSection.tsx @@ -0,0 +1,98 @@ +import React, { useState } from 'react'; +import VocabularyBuilder from './VocabularyBuilder'; +import ConversationPractice from './ConversationPractice'; +import GrammarPractice from './GrammarPractice'; +import { cardStyle } from '../../utils/constants'; + +interface LanguageLearningSectionProps { + getTryLink: () => string; +} + +const LanguageLearningSection = ({ getTryLink }: LanguageLearningSectionProps) => { + const [activeTab, setActiveTab] = useState('vocabulary'); + + return ( +
    +
    +
    + + + +
    +

    Language Learning

    +
    +

    + Learn to speak like a local with personalized Swiss German lessons focused on real-world communication. +

    + + {/* Tabs */} +
    + + + +
    + + {/* Tab Content */} +
    + {activeTab === 'vocabulary' && ( +
    +

    Vocabulary Builder

    +

    + Learn practical Swiss German words and phrases focusing on Zürich dialect with pronunciation guides. +

    + +
    + )} + + {activeTab === 'conversation' && ( +
    +

    Conversation Practice

    +

    + Practice everyday conversations with examples showing both Standard and Swiss German versions. +

    + +
    + )} + + {activeTab === 'grammar' && ( +
    +

    Grammar Explanations

    +

    + Understand Swiss German grammar through simple explanations focusing on the differences from Standard German. +

    + +
    + )} +
    +
    + ); +}; + +export default LanguageLearningSection; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/language-learning/VocabularyBuilder.tsx b/app/bots/swiss-german-teacher/components/language-learning/VocabularyBuilder.tsx new file mode 100644 index 000000000..46a4c484b --- /dev/null +++ b/app/bots/swiss-german-teacher/components/language-learning/VocabularyBuilder.tsx @@ -0,0 +1,124 @@ +import React, { useState } from 'react'; +import { btnPrimary } from '../../utils/constants'; + +interface VocabularyBuilderProps { + getTryLink: () => string; +} + +const VocabularyBuilder = ({ getTryLink }: VocabularyBuilderProps) => { + const [activeExample, setActiveExample] = useState(0); + + // Example vocabulary words to showcase + const examples = [ + { + standard: "guten Tag", + swiss: "grüezi", + pronunciation: "GROO-eh-tsee", + notes: "Formal greeting, singular form. Use 'grüezi mitenand' for greeting multiple people." + }, + { + standard: "auf Wiedersehen", + swiss: "uf widerluege", + pronunciation: "oof VEE-der-loo-eh-geh", + notes: "More formal goodbye. For casual situations use 'tschüss' or 'tschau'." + }, + { + standard: "danke", + swiss: "merci", + pronunciation: "MER-see", + notes: "Swiss German often uses French-derived words for common expressions." + } + ]; + + return ( +
    +
    + {examples.map((example, index) => ( + + ))} +
    + +
    +
    +
    +
    +

    {examples[activeExample].swiss}

    + ({examples[activeExample].standard}) +
    +

    Pronunciation: {examples[activeExample].pronunciation}

    +
    +
    + + Common + +
    +
    + +
    +

    + Context: {examples[activeExample].notes} +

    +
    + +
    + + + + + + + See more vocabulary + +
    +
    + +
    +

    Build your vocabulary

    +

    + Enter any English or German word to get the Swiss German equivalent with context and examples. +

    + +
    +
    + ); +}; + +export default VocabularyBuilder; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/navigation/Navigation.tsx b/app/bots/swiss-german-teacher/components/navigation/Navigation.tsx new file mode 100644 index 000000000..f0b74f054 --- /dev/null +++ b/app/bots/swiss-german-teacher/components/navigation/Navigation.tsx @@ -0,0 +1,111 @@ +import React, { useState, useEffect } from 'react'; +import Link from 'next/link'; + +/** + * Navigation component for Heidi with section tracking and consistent appearance behavior + */ +const Navigation: React.FC<{ className?: string }> = ({ className = '' }) => { + const [activeSection, setActiveSection] = useState(''); + const [isVisible, setIsVisible] = useState(false); + const [lastScrollY, setLastScrollY] = useState(0); + + // Menu items for Heidi navigation + const menuItems = [ + { id: 'language-learning', label: 'Language Learning' }, + { id: 'communication', label: 'Communication' }, + { id: 'social', label: 'Social Integration' }, + { id: 'content', label: 'Content Library' }, + { id: 'future-vision', label: 'Roadmap' } + ]; + + // Handle scroll events to show/hide navigation and highlight active section + useEffect(() => { + const handleScroll = () => { + const currentScrollY = window.scrollY; + + // Show navigation after scrolling down 200px (reduced from 300px) + if (currentScrollY > 200) { + setIsVisible(true); + } else { + setIsVisible(false); + } + + // Determine active section + if (currentScrollY > 100) { + // Find which section is currently in view + const menuItemsCopy = [...menuItems]; + for (const item of menuItemsCopy.reverse()) { + const element = document.getElementById(item.id); + if (element && element.offsetTop <= currentScrollY + 300) { + setActiveSection(item.id); + break; + } + } + } + + setLastScrollY(currentScrollY); + }; + + window.addEventListener('scroll', handleScroll, { passive: true }); + handleScroll(); // Initial check + + return () => window.removeEventListener('scroll', handleScroll); + }, [lastScrollY]); + + // Handle smooth scrolling when clicking a menu item + const scrollToSection = (id: string) => { + const element = document.getElementById(id); + if (element) { + window.scrollTo({ + top: element.offsetTop - 100, + behavior: 'smooth', + }); + setActiveSection(id); + } + }; + + return ( + + ); +}; + +export default Navigation; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/shared/DemoModeOverlay.tsx b/app/bots/swiss-german-teacher/components/shared/DemoModeOverlay.tsx new file mode 100644 index 000000000..11cf9ebba --- /dev/null +++ b/app/bots/swiss-german-teacher/components/shared/DemoModeOverlay.tsx @@ -0,0 +1,85 @@ +import React from 'react'; +import { DemoState } from '../../types'; +import DemoPopup from './DemoPopup'; +import { btnPrimary } from '../../utils/constants'; + +interface DemoModeOverlayProps { + demoState: DemoState; + onInputChange: (value: string) => void; + onSubmit: () => void; + onContinue: () => void; + onClose: () => void; +} + +const DemoModeOverlay = ({ + demoState, + onInputChange, + onSubmit, + onContinue, + onClose +}: DemoModeOverlayProps) => { + const { step, prompt, response } = demoState; + + if (step === 1) { + return ( +
    +
    +
    +

    Vocabulary Builder Demo

    + +
    + +

    + Try entering a word or phrase you'd like to learn in Swiss German: +

    + +
    { + e.preventDefault(); + onSubmit(); + }}> +
    + onInputChange(e.target.value)} + aria-label="Enter word or phrase" + /> +

    + Try "hello", "thank you", or any common greeting +

    +
    + +
    + +
    +
    +
    +
    + ); + } + + if (step === 2 && response) { + return ; + } + + return null; +}; + +export default DemoModeOverlay; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/shared/DemoPopup.tsx b/app/bots/swiss-german-teacher/components/shared/DemoPopup.tsx new file mode 100644 index 000000000..2196f4d0e --- /dev/null +++ b/app/bots/swiss-german-teacher/components/shared/DemoPopup.tsx @@ -0,0 +1,79 @@ +import React from 'react'; +import { DemoResponse } from '../../types'; +import { btnPrimary } from '../../utils/constants'; + +interface DemoPopupProps { + response: DemoResponse; + onContinue: () => void; + onClose: () => void; +} + +const DemoPopup = ({ response, onContinue, onClose }: DemoPopupProps) => { + return ( +
    +
    +
    +

    Vocabulary Result

    + +
    + +
    +
    +
    +
    +

    {response.word}

    +

    {response.translation}

    +
    + + {response.difficulty} + +
    +
    + + + + + + + + + + + + + + + + +
    Example{response.example}
    Pronunciation{response.pronunciation}
    Notes{response.notes}
    + +
    +

    + Heidi says: Swiss German often replaces High German words with French-derived terms like "merci" instead of "danke." +

    +
    +
    + +
    + +
    +
    +
    + ); +}; + +export default DemoPopup; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/shared/Navigation.tsx b/app/bots/swiss-german-teacher/components/shared/Navigation.tsx new file mode 100644 index 000000000..87e69be09 --- /dev/null +++ b/app/bots/swiss-german-teacher/components/shared/Navigation.tsx @@ -0,0 +1,131 @@ +import React, { useState, useEffect } from 'react'; +import { btnPrimary } from '../../utils/constants'; + +interface NavigationProps { + getTryLink: () => string; + className?: string; +} + +const Navigation = ({ getTryLink, className = '' }: NavigationProps) => { + const [isScrolled, setIsScrolled] = useState(false); + const [isMenuOpen, setIsMenuOpen] = useState(false); + + useEffect(() => { + const handleScroll = () => { + if (window.scrollY > 10) { + setIsScrolled(true); + } else { + setIsScrolled(false); + } + }; + + window.addEventListener('scroll', handleScroll); + return () => window.removeEventListener('scroll', handleScroll); + }, []); + + const navLinks = [ + { name: 'Language Learning', href: '#language-learning' }, + { name: 'Communication', href: '#communication' }, + { name: 'Social', href: '#integration' }, + { name: 'Swiss Content', href: '#swiss-content' } + ]; + + return ( + + ); +}; + +export default Navigation; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/shared/WaitlistForm.tsx b/app/bots/swiss-german-teacher/components/shared/WaitlistForm.tsx new file mode 100644 index 000000000..309562a3b --- /dev/null +++ b/app/bots/swiss-german-teacher/components/shared/WaitlistForm.tsx @@ -0,0 +1,94 @@ +import React from 'react'; +import { useWaitlistForm } from '../../hooks/useWaitlistForm'; +import { btnPrimary } from '../../utils/constants'; +import { WaitlistPreferences } from '../../types'; + +const WaitlistForm = () => { + const { formState, updateEmail, togglePreference, handleSubmit } = useWaitlistForm(); + const { email, preferences, isSubmitting, isSubmitted, error } = formState; + + // Map of preference keys to display text + const preferenceLabels: Record = { + learningTools: "Advanced learning tools and pronunciation features", + communityFeatures: "Community features and language exchange", + authenticContent: "Authentic Swiss German content and media", + culturalInsights: "Cultural insights and local events", + earlyAccess: "Early access to new features", + emailUpdates: "Email updates about product development" + }; + + if (isSubmitted) { + return ( +
    + + + +

    Thank You!

    +

    + You've been added to our waitlist. We'll notify you when we have updates about the features you're interested in. +

    +
    + ); + } + + return ( +
    +

    Join the Waitlist

    +
    + + updateEmail(e.target.value)} + className="w-full p-3 border rounded-md focus:outline-none focus:ring-2 focus:ring-green-500" + placeholder="your@email.com" + required + aria-describedby={error ? "email-error" : undefined} + /> + {error &&

    {error}

    } +
    + +
    +

    + I'm interested in: (select all that apply) +

    +
    + {Object.entries(preferenceLabels).map(([key, label]) => ( +
    +
    + togglePreference(key as keyof WaitlistPreferences)} + className="focus:ring-green-500 h-4 w-4 text-green-600 border-gray-300 rounded" + /> +
    +
    + +
    +
    + ))} +
    +
    + +
    + +
    +
    + ); +}; + +export default WaitlistForm; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/components/social/SocialSection.tsx b/app/bots/swiss-german-teacher/components/social/SocialSection.tsx new file mode 100644 index 000000000..4d0c64bc5 --- /dev/null +++ b/app/bots/swiss-german-teacher/components/social/SocialSection.tsx @@ -0,0 +1,172 @@ +import React from 'react'; +import { cardStyle, comingSoonBadge, btnPrimary, btnSecondary } from '../../utils/constants'; + +interface SocialSectionProps { + getTryLink: () => string; +} + +const SocialSection = ({ getTryLink }: SocialSectionProps) => { + // Example events + const events = [ + { + title: "Swiss Language Exchange Meetup", + time: "Tonight, 7pm at Café Sphères", + description: "Practice Swiss German with locals in a relaxed setting with guided conversation topics.", + infoLink: "https://www.meetup.com/zurich-german-language-exchange/" + }, + { + title: "Zurich Film Festival", + time: "This weekend at various locations", + description: "Great opportunity to hear Swiss German in context and meet locals who share your interests.", + infoLink: "https://zff.com/en/home/", + ticketLink: "https://zff.com/en/tickets/" + } + ]; + + // Cultural topics + const culturalTopics = [ + { + title: "Social Etiquette", + items: [ + "• Greetings and introductions", + "• Punctuality and time management", + "• Dining customs and tipping" + ] + }, + { + title: "Local Traditions", + items: [ + "• Seasonal festivals and celebrations", + "• Regional customs and foods", + "• Holidays and observances" + ] + }, + { + title: "History", + items: [ + "• Formation of the Swiss Confederation", + "• Historical neutrality and humanitarian effort", + "• Evolution of Swiss identity and culture" + ] + }, + { + title: "Civics & Governance", + items: [ + "• Direct democracy and separation of powers", + "• Federalism and cantonal structure", + "• Armed neutrality and militia system" + ] + } + ]; + + return ( +
    +
    +
    + + + +
    +

    Social

    +
    +

    + Connect with the local community by discovering cultural events and understanding local customs. +

    + + {/* Events */} +
    +

    Zürich Events

    +
    +

    + Find events in Zürich that reinforce your language learning and help you connect with locals. +

    + + Beta Feature + +
    + +
    + {events.map((event, index) => ( +
    +
    +
    +

    {event.title}

    +

    {event.time}

    +

    {event.description}

    +
    +
    + + Event Info + + {event.ticketLink && ( + + Buy Ticket + + )} +
    +
    +
    + ))} + + +
    +
    + + {/* Cultural Insights */} +
    +
    Coming Soon
    +

    Cultural Insights

    +

    + Understand Swiss customs, traditions, and social norms to navigate daily life with confidence. +

    + +
    + {culturalTopics.map((topic, index) => ( +
    +

    {topic.title}

    +
      + {topic.items.map((item, itemIndex) => ( +
    • {item}
      • + ))} +
    +
    + ))} + +
    + +
    +
    +
    +
    + ); +}; + +export default SocialSection; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/data/conversation.ts b/app/bots/swiss-german-teacher/data/conversation.ts new file mode 100644 index 000000000..042e29a63 --- /dev/null +++ b/app/bots/swiss-german-teacher/data/conversation.ts @@ -0,0 +1,28 @@ +import { ConversationExample } from '../types'; + +export const conversationExamples: ConversationExample[] = [ + { + situation: "Greeting a friend", + standard: "Hallo, wie geht es dir?", + swiss: "Hoi, wie gaht's?", + translation: "Hi, how are you?" + }, + { + situation: "Ordering coffee", + standard: "Ich hätte gerne einen Kaffee, bitte.", + swiss: "Ich hätt gern en Kafi, bitte.", + translation: "I would like a coffee, please." + }, + { + situation: "Asking for directions", + standard: "Entschuldigung, wo ist der Bahnhof?", + swiss: "Tschuldigung, wo isch de Bahnhof?", + translation: "Excuse me, where is the train station?" + }, + { + situation: "Making plans", + standard: "Wollen wir morgen ins Kino gehen?", + swiss: "Wemmer morn is Kino gah?", + translation: "Do you want to go to the cinema tomorrow?" + } +]; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/data/events.ts b/app/bots/swiss-german-teacher/data/events.ts new file mode 100644 index 000000000..0519ecba6 --- /dev/null +++ b/app/bots/swiss-german-teacher/data/events.ts @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/hooks/useDemoMode.ts b/app/bots/swiss-german-teacher/hooks/useDemoMode.ts new file mode 100644 index 000000000..53a91d3b1 --- /dev/null +++ b/app/bots/swiss-german-teacher/hooks/useDemoMode.ts @@ -0,0 +1,99 @@ +import { useState, useCallback } from 'react'; +import { DemoState, DemoResponse } from '../types'; + +export const useDemoMode = () => { + const [demoState, setDemoState] = useState({ + isActive: false, + step: 0, + prompt: '', + response: null + }); + + const startDemo = useCallback(() => { + setDemoState(prev => ({ + ...prev, + isActive: true, + step: 1, + prompt: '', + response: null + })); + }, []); + + const stopDemo = useCallback(() => { + setDemoState(prev => ({ + ...prev, + isActive: false, + step: 0 + })); + }, []); + + const setPrompt = useCallback((prompt: string) => { + setDemoState(prev => ({ + ...prev, + prompt + })); + }, []); + + const submitPrompt = useCallback(() => { + // Simulate API response with demo data + const demoResponses: Record = { + default: { + word: "hoi", + translation: "hi/hello", + example: "Hoi, wie gaht's?", + pronunciation: "hoy", + notes: "Very common casual greeting in Zürich", + difficulty: "easy" + }, + grüezi: { + word: "grüezi", + translation: "hello (formal)", + example: "Grüezi, wie gaht's Ihne?", + pronunciation: "GROO-eh-tsee", + notes: "Formal greeting used with strangers or in business settings", + difficulty: "medium" + }, + merci: { + word: "merci vielmal", + translation: "thank you very much", + example: "Merci vielmal für d'Hilf!", + pronunciation: "MER-see feel-mahl", + notes: "Notice the French influence - 'merci' is used instead of 'danke'", + difficulty: "easy" + } + }; + + // Check if we have a specific response for this prompt + const prompt = demoState.prompt.toLowerCase().trim(); + const response = + (prompt.includes("grüezi") || prompt.includes("gruezi")) ? demoResponses.grüezi : + (prompt.includes("merci") || prompt.includes("thank")) ? demoResponses.merci : + demoResponses.default; + + setDemoState(prev => ({ + ...prev, + step: 2, + response + })); + }, [demoState.prompt]); + + const continueDemo = useCallback(() => { + setDemoState(prev => ({ + ...prev, + step: 1, + prompt: '', + response: null + })); + }, []); + + return { + demoState, + startDemo, + stopDemo, + setPrompt, + submitPrompt, + continueDemo + }; +}; + +export default useDemoMode; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/hooks/useWaitlistForm.ts b/app/bots/swiss-german-teacher/hooks/useWaitlistForm.ts new file mode 100644 index 000000000..db5c41245 --- /dev/null +++ b/app/bots/swiss-german-teacher/hooks/useWaitlistForm.ts @@ -0,0 +1,92 @@ +import { useState, useCallback } from 'react'; +import { WaitlistFormState, WaitlistPreferences } from '../types'; +import { isValidEmail } from '../utils/validation'; + +const initialPreferences: WaitlistPreferences = { + learningTools: true, + communityFeatures: false, + authenticContent: true, + culturalInsights: false, + earlyAccess: true, + emailUpdates: true +}; + +/** + * Hook to manage waitlist form state and submission + */ +export const useWaitlistForm = () => { + const [formState, setFormState] = useState({ + email: '', + preferences: initialPreferences, + isSubmitting: false, + isSubmitted: false, + error: null + }); + + const updateEmail = useCallback((email: string) => { + setFormState(prev => ({ + ...prev, + email, + error: null + })); + }, []); + + const togglePreference = useCallback((key: keyof WaitlistPreferences) => { + setFormState(prev => ({ + ...prev, + preferences: { + ...prev.preferences, + [key]: !prev.preferences[key] + } + })); + }, []); + + const handleSubmit = useCallback(async (e: React.FormEvent) => { + e.preventDefault(); + + // Validate email + if (!isValidEmail(formState.email)) { + setFormState(prev => ({ + ...prev, + error: 'Please enter a valid email address' + })); + return; + } + + // Start submission + setFormState(prev => ({ + ...prev, + isSubmitting: true, + error: null + })); + + try { + // Simulate API call with a timeout + await new Promise(resolve => setTimeout(resolve, 1500)); + + // Success state + setFormState(prev => ({ + ...prev, + isSubmitting: false, + isSubmitted: true + })); + + } catch (error) { + // Error handling + setFormState(prev => ({ + ...prev, + isSubmitting: false, + error: error instanceof Error ? error.message : 'Failed to submit' + })); + } + }, [formState.email]); + + return { + formState, + updateEmail, + togglePreference, + handleSubmit + }; +}; + +export default useWaitlistForm; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/page.tsx b/app/bots/swiss-german-teacher/page.tsx index d527fca7a..9d9b62265 100644 --- a/app/bots/swiss-german-teacher/page.tsx +++ b/app/bots/swiss-german-teacher/page.tsx @@ -1,77 +1,147 @@ -'use client'; +"use client"; -import React from 'react'; +import React, { useEffect, useRef } from 'react'; import Link from 'next/link'; import bots from '../../../data/bots'; +import dynamic from 'next/dynamic'; -export default function SwissGermanTeacher() { +// Components +import BotNavigation from '../BotNavigation'; +import HeroSection from './components/hero/HeroSection'; +import LanguageLearningSection from './components/language-learning/LanguageLearningSection'; +import CommunicationSection from './components/communication/CommunicationSection'; +import SocialSection from './components/social/SocialSection'; +import SwissContentSection from './components/content/SwissContentSection'; +import FutureVisionSection from './components/future/FutureVisionSection'; +import WaitlistForm from './components/shared/WaitlistForm'; + +const SwissGermanTeacher = () => { const bot = bots.find(b => b.slug === 'swiss-german-teacher'); + // Use ref to prevent double scrolling in React Strict Mode + const hasScrolledToTop = useRef(false); + + // Function to generate a link to try the bot + const getTryLink = () => { + return bot?.tryLink || 'https://chat.openai.com/'; + }; + + // Navigation menu items + const menuItems = [ + { id: 'language-learning', label: 'Language Learning', icon: '📝', section: 'language-learning' }, + { id: 'communication', label: 'Communication', icon: '💬', section: 'communication' }, + { id: 'integration', label: 'Social', icon: '👥', section: 'integration' }, + { id: 'swiss-content', label: 'Swiss Content', icon: '🇨🇭', section: 'swiss-content' }, + { id: 'future', label: 'Future', icon: '🔮', section: 'future' }, + { id: 'waitlist', label: 'Join Beta', icon: '✨', section: 'waitlist' } + ]; + + // Handle scroll to section if hash is present in URL + useEffect(() => { + const handleHashChange = () => { + const hash = window.location.hash; + if (hash) { + const element = document.querySelector(hash); + if (element) { + setTimeout(() => { + element.scrollIntoView({ behavior: 'smooth' }); + }, 100); + } + } else if (!hasScrolledToTop.current) { + window.scrollTo(0, 0); + hasScrolledToTop.current = true; + } + }; - if (!bot) { - return
    Bot not found
    ; - } + // Initial check on mount + handleHashChange(); + + // Listen for hash changes + window.addEventListener('hashchange', handleHashChange); + + return () => { + window.removeEventListener('hashchange', handleHashChange); + }; + }, []); return (
    -
    -
    -

    {bot.title}

    -

    {bot.overview}

    -
    - -
    -
    -

    Features

    -
      - {bot.features.map((feature, index) => ( -
    • - - - - {feature} -
      • - ))} -
    + {/* Bot-specific Navigation */} + + +
    + + +
    + +
    + +
    + +
    + +
    + +
    + +
    + +
    + +
    + +
    + +
    +
    +
    +

    + Join Our Beta Program +

    +

    + Be one of the first to experience our upcoming features and help shape the future of Swiss German learning. +

    + + +
    +
    +
    + +
    +
    +
    +
    + + + + Heidi +
    -
    -

    How It Works

    -

    {bot.details}

    - - Start Learning - +
    -
    -
    -
    -

    Ready to Master Swiss German?

    -

    - Start your journey to fluency with our AI-powered Swiss German teacher. Get personalized - lessons, instant feedback, and cultural insights. +

    +

    © 2023 Botsmann. All rights reserved.

    +

    + "Heidi" is an AI GPT powered by OpenAI's technology. + Not affiliated with the Swiss government or any official language institution.

    - - Contact Us -
    -
    +
    ); -} +}; + +export default SwissGermanTeacher; diff --git a/app/bots/swiss-german-teacher/styles/global.css b/app/bots/swiss-german-teacher/styles/global.css new file mode 100644 index 000000000..8d604dcb2 --- /dev/null +++ b/app/bots/swiss-german-teacher/styles/global.css @@ -0,0 +1,66 @@ +/* Custom scrollbar for demo section */ +.demo-scroll::-webkit-scrollbar { + width: 8px; +} + +.demo-scroll::-webkit-scrollbar-track { + background: #f1f1f1; + border-radius: 10px; +} + +.demo-scroll::-webkit-scrollbar-thumb { + background: #c5c5c5; + border-radius: 10px; +} + +.demo-scroll::-webkit-scrollbar-thumb:hover { + background: #a1a1a1; +} + +/* Custom animations */ +@keyframes fadeIn { + from { opacity: 0; } + to { opacity: 1; } +} + +.fade-in { + animation: fadeIn 0.4s ease-in-out; +} + +@keyframes slideUp { + from { + opacity: 0; + transform: translateY(20px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +.slide-up { + animation: slideUp 0.5s ease-out; +} + +/* Text highlight for vocabulary */ +.vocab-highlight { + background: linear-gradient(120deg, rgba(56, 178, 172, 0.2) 0%, rgba(56, 178, 172, 0) 100%); + padding: 0.25rem 0.5rem; + margin: 0 -0.5rem; + border-radius: 4px; +} + +/* Custom gradient text */ +.gradient-text { + background: linear-gradient(90deg, #10b981 0%, #0ea5e9 100%); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +/* Focus outlines with custom color for better accessibility */ +.custom-focus:focus { + outline: none; + box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.3); + border-color: #10b981; +} \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/types/index.ts b/app/bots/swiss-german-teacher/types/index.ts new file mode 100644 index 000000000..5e6565c34 --- /dev/null +++ b/app/bots/swiss-german-teacher/types/index.ts @@ -0,0 +1,62 @@ +/** + * Core type definitions + */ + +// Vocabulary section types +export interface VocabularyWord { + word: string; + translation: string; + example: string; + notes?: string; +} + +// Grammar section types +export interface GrammarConcept { + concept: string; + explanation: string; + example: string; + notes?: string; +} + +// Conversation section types +export interface ConversationExample { + situation: string; + standard: string; + swiss: string; + translation: string; +} + +// Waitlist form types +export interface WaitlistPreferences { + learningTools: boolean; + communityFeatures: boolean; + authenticContent: boolean; + culturalInsights: boolean; + earlyAccess: boolean; + emailUpdates: boolean; +} + +export interface WaitlistFormState { + email: string; + preferences: WaitlistPreferences; + isSubmitting: boolean; + isSubmitted: boolean; + error: string | null; +} + +// Demo mode types +export interface DemoState { + isActive: boolean; + step: number; + prompt: string; + response: DemoResponse | null; +} + +export interface DemoResponse { + word: string; + translation: string; + example: string; + pronunciation: string; + notes: string; + difficulty: string; +} \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/utils/constants.ts b/app/bots/swiss-german-teacher/utils/constants.ts new file mode 100644 index 000000000..ff8992491 --- /dev/null +++ b/app/bots/swiss-german-teacher/utils/constants.ts @@ -0,0 +1,30 @@ +/** + * Shared UI constants + * + * This file centralizes UI string constants to: + * - Maintain visual consistency across components + * - Simplify future UI updates (change in one place) + * - Reduce duplication of lengthy Tailwind class strings + */ + +// Button styles +export const btnPrimary = "px-6 py-3 bg-green-500 text-white font-medium rounded-md hover:bg-green-600 transition-colors focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-offset-2"; +export const btnSecondary = "px-6 py-3 bg-white text-gray-700 font-medium rounded-md border border-gray-300 hover:bg-gray-50 transition-colors focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2"; + +// Card styles +export const cardStyle = "p-6 bg-white rounded-xl shadow-sm border border-gray-200 relative"; + +// Badge styles +export const comingSoonBadge = "absolute top-4 right-4 bg-amber-100 text-amber-800 text-xs font-semibold px-2.5 py-0.5 rounded-full border border-amber-200"; + +// Feature number styles +export const featureNumberBadge = "flex-shrink-0 w-10 h-10 rounded-full bg-blue-100 flex items-center justify-center text-blue-600 font-semibold"; +export const featureNumberText = "text-lg font-medium text-gray-900 mb-2"; + +// Section styles +export const sectionHeading = "text-3xl font-semibold text-gray-900 mb-4"; +export const sectionSubheading = "text-lg text-gray-600 mb-8"; + +// Common CSS classes +export const cardHeading = "text-xl font-semibold mb-2"; +export const cardText = "text-gray-600 mb-4"; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/utils/navigation.ts b/app/bots/swiss-german-teacher/utils/navigation.ts new file mode 100644 index 000000000..53ec3310e --- /dev/null +++ b/app/bots/swiss-german-teacher/utils/navigation.ts @@ -0,0 +1,20 @@ +/** + * Opens the Heidi bot in a new tab with an optional query + * @param query Optional query to append to the URL + */ +export const openHeidiBot = (query?: string) => { + const baseUrl = 'https://chatgpt.com/g/g-rni41WTSh-heidi-tell'; + const url = query ? `${baseUrl}?q=${encodeURIComponent(query)}` : baseUrl; + + // Ensure the window opens properly + const newWindow = window.open(url, '_blank'); + + // Fallback if window.open is blocked + if (!newWindow || newWindow.closed || typeof newWindow.closed === 'undefined') { + // Show a message to the user + alert('Please allow pop-ups to open Heidi in a new tab, or click this link: ' + url); + + // Copy the URL to clipboard as another fallback + navigator.clipboard.writeText(url).catch(err => console.error('Could not copy URL: ', err)); + } +}; \ No newline at end of file diff --git a/app/bots/swiss-german-teacher/utils/validation.ts b/app/bots/swiss-german-teacher/utils/validation.ts new file mode 100644 index 000000000..4c1e9659e --- /dev/null +++ b/app/bots/swiss-german-teacher/utils/validation.ts @@ -0,0 +1,37 @@ +/** + * Validation utilities + */ + +/** + * Validates an email address format + * @param email The email address to validate + * @returns Boolean indicating if the email is valid + */ +export const isValidEmail = (email: string): boolean => { + const pattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; + return pattern.test(email); +}; + +/** + * Validates a text input is not empty + * @param text The text to validate + * @returns Boolean indicating if the text is not empty + */ +export const isNotEmpty = (text: string): boolean => { + return text.trim().length > 0; +}; + +/** + * Format error message for display + * @param error Error message or object + * @returns Formatted error message string + */ +export const formatErrorMessage = (error: any): string => { + if (typeof error === 'string') { + return error; + } + if (error instanceof Error) { + return error.message; + } + return 'An unknown error occurred'; +}; \ No newline at end of file diff --git a/app/components/NavigationWrapper.tsx b/app/components/NavigationWrapper.tsx new file mode 100644 index 000000000..156bfeae6 --- /dev/null +++ b/app/components/NavigationWrapper.tsx @@ -0,0 +1,17 @@ +'use client'; + +import React from 'react'; +import { usePathname } from 'next/navigation'; +import Header from '@/components/Header'; +import SolonNavigation from '@/app/projects/governance/components/Navigation'; + +export default function NavigationWrapper() { + const pathname = usePathname(); + const isSolonPage = pathname?.startsWith('/projects/governance'); + + if (isSolonPage) { + return ; + } + + return
    ; +} \ No newline at end of file diff --git a/app/components/shared/Navigation.tsx b/app/components/shared/Navigation.tsx new file mode 100644 index 000000000..55babf28a --- /dev/null +++ b/app/components/shared/Navigation.tsx @@ -0,0 +1,149 @@ +'use client'; + +import React, { useState, useEffect } from 'react'; +import Link from 'next/link'; +import type { Route } from 'next'; +import { Logo } from './navigation/Logo'; +import { ProductDropdown } from './navigation/ProductDropdown'; +import { ProfileDropdown } from './navigation/ProfileDropdown'; +import { MobileMenu } from './navigation/MobileMenu'; +import type { MenuItem } from './navigation/types'; + +export default function Navigation() { + const [isScrolled, setIsScrolled] = useState(false); + const [activeSection, setActiveSection] = useState(null); + const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); + const [activeDropdown, setActiveDropdown] = useState(null); + + useEffect(() => { + const handleScroll = () => { + setIsScrolled(window.scrollY > 0); + }; + + window.addEventListener('scroll', handleScroll); + return () => window.removeEventListener('scroll', handleScroll); + }, []); + + useEffect(() => { + const handleHashChange = () => { + const hash = window.location.hash.slice(1); + setActiveSection(hash || null); + }; + + window.addEventListener('hashchange', handleHashChange); + handleHashChange(); // Initial check + + return () => window.removeEventListener('hashchange', handleHashChange); + }, []); + + const menuItems: MenuItem[] = [ + { + id: 'portal', + label: 'Portal', + path: '/projects/governance/portal' as Route, + section: 'portal' + }, + { + id: 'products', + label: 'Products', + path: '/projects/governance/products' as Route, + section: 'products', + dropdown: { + items: [ + { + id: 'voting', + label: 'Open Vote', + path: '/projects/governance/products/voting' as Route, + section: 'voting' + }, + { + id: 'proposals', + label: 'Open Law', + path: '/projects/governance/products/proposals' as Route, + section: 'proposals' + }, + { + id: 'analytics', + label: 'Open Analytics', + path: '/projects/governance/products/analytics' as Route, + section: 'analytics' + } + ] + } + }, + { + id: 'build', + label: 'Build', + path: '/projects/governance/build' as Route, + section: 'build' + }, + { + id: 'whitepaper', + label: 'Whitepaper', + path: '/projects/governance/whitepaper' as Route, + section: 'whitepaper' + } + ]; + + return ( +
    +
    +
    + {/* Logo */} + + + {/* Desktop Navigation */} + + + {/* Mobile menu button */} + +
    +
    + + {/* Mobile menu */} + setIsMobileMenuOpen(false)} + menuItems={menuItems} + activeSection={activeSection} + /> +
    + ); +} \ No newline at end of file diff --git a/app/components/shared/navigation/Logo.tsx b/app/components/shared/navigation/Logo.tsx new file mode 100644 index 000000000..3c7a2da09 --- /dev/null +++ b/app/components/shared/navigation/Logo.tsx @@ -0,0 +1,39 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import type { LogoProps } from './types'; + +export function Logo({ className = '' }: LogoProps) { + return ( +
    + + + + + + +
    + + +
    + 🏛️ +
    +
    +

    Solon

    +

    Decentralized Governance

    +
    + +
    + ); +} \ No newline at end of file diff --git a/app/components/shared/navigation/MobileMenu.tsx b/app/components/shared/navigation/MobileMenu.tsx new file mode 100644 index 000000000..2a09ac18e --- /dev/null +++ b/app/components/shared/navigation/MobileMenu.tsx @@ -0,0 +1,92 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import type { MobileMenuProps } from './types'; + +export function MobileMenu({ isOpen, onClose, menuItems, activeSection }: MobileMenuProps) { + return ( +
    + {/* Backdrop */} +
    + + {/* Menu panel */} +
    +
    + {/* Header */} +
    +

    Menu

    + +
    + + {/* Navigation */} + + + {/* Footer */} +
    + +
    + 👤 +
    + Profile + +
    +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/components/shared/navigation/ProductDropdown.tsx b/app/components/shared/navigation/ProductDropdown.tsx new file mode 100644 index 000000000..2bf9ccbf5 --- /dev/null +++ b/app/components/shared/navigation/ProductDropdown.tsx @@ -0,0 +1,93 @@ +'use client'; + +import React, { useEffect, useRef } from 'react'; +import Link from 'next/link'; +import type { Route } from 'next'; +import type { ProductDropdownProps } from './types'; + +export function ProductDropdown({ isOpen, onToggle, item }: ProductDropdownProps) { + const dropdownRef = useRef(null); + + useEffect(() => { + function handleClickOutside(event: MouseEvent) { + if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node)) { + onToggle(); + } + } + + if (isOpen) { + document.addEventListener('mousedown', handleClickOutside); + } + + return () => { + document.removeEventListener('mousedown', handleClickOutside); + }; + }, [isOpen, onToggle]); + + const productLinks = [ + { + id: 'voting', + label: 'Open Vote', + description: 'Participate in decentralized decision-making', + path: '/projects/governance/open-vote', + icon: '🗳️' + }, + { + id: 'proposals', + label: 'Open Law', + description: 'Create and manage governance proposals', + path: '/projects/governance/open-law', + icon: '📜' + }, + { + id: 'analytics', + label: 'Open Analytics', + description: 'Track governance metrics and insights', + path: '/projects/governance/open-pay', + icon: '📊' + } + ]; + + return ( +
    + + + {isOpen && ( +
    +
    +

    Products

    +
    +
    + {productLinks.map((product) => ( + + {product.icon} +
    +
    {product.label}
    +
    {product.description}
    +
    + + ))} +
    +
    + )} +
    + ); +} \ No newline at end of file diff --git a/app/components/shared/navigation/ProfileDropdown.tsx b/app/components/shared/navigation/ProfileDropdown.tsx new file mode 100644 index 000000000..9481a69ab --- /dev/null +++ b/app/components/shared/navigation/ProfileDropdown.tsx @@ -0,0 +1,73 @@ +'use client'; + +import React, { useEffect, useRef } from 'react'; +import Link from 'next/link'; +import type { Route } from 'next'; +import type { ProfileDropdownProps } from './types'; + +export function ProfileDropdown({ isOpen, onToggle }: ProfileDropdownProps) { + const dropdownRef = useRef(null); + + useEffect(() => { + function handleClickOutside(event: MouseEvent) { + if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node)) { + onToggle(); + } + } + + if (isOpen) { + document.addEventListener('mousedown', handleClickOutside); + } + + return () => { + document.removeEventListener('mousedown', handleClickOutside); + }; + }, [isOpen, onToggle]); + + const profileLinks = [ + { + id: 'portal', + label: 'Portal', + path: '/projects/governance/portal' + } + ]; + + return ( +
    + + + {isOpen && ( +
    +
    +

    Account

    +
    +
    + {profileLinks.map((link) => ( + + {link.label} + + ))} +
    +
    + )} +
    + ); +} \ No newline at end of file diff --git a/app/components/shared/navigation/hooks/useActiveSection.ts b/app/components/shared/navigation/hooks/useActiveSection.ts new file mode 100644 index 000000000..61e8a679e --- /dev/null +++ b/app/components/shared/navigation/hooks/useActiveSection.ts @@ -0,0 +1,24 @@ +'use client'; + +import { useEffect, useState } from 'react'; +import { MenuItem } from '../types'; + +export function useActiveSection(pathname: string, menuItems: MenuItem[]) { + const [activeSection, setActiveSection] = useState(''); + + useEffect(() => { + const currentPath = pathname.split('/').pop() || ''; + + // Find the menu item that matches the current path + const activeItem = menuItems.find((item) => { + if (typeof item.path !== 'string' && item.path?.pathname) { + return item.path.pathname.split('/').pop() === currentPath; + } + return false; + }); + + setActiveSection(activeItem?.section || ''); + }, [pathname, menuItems]); + + return { activeSection }; +} \ No newline at end of file diff --git a/app/components/shared/navigation/hooks/useScrollDirection.ts b/app/components/shared/navigation/hooks/useScrollDirection.ts new file mode 100644 index 000000000..54619a96a --- /dev/null +++ b/app/components/shared/navigation/hooks/useScrollDirection.ts @@ -0,0 +1,27 @@ +'use client'; + +import { useState, useEffect } from 'react'; + +export function useScrollDirection() { + const [scrollDirection, setScrollDirection] = useState<'up' | 'down'>('up'); + const [scrollY, setScrollY] = useState(0); + + useEffect(() => { + let lastScrollY = window.scrollY; + + const updateScrollDirection = () => { + const scrollY = window.scrollY; + const direction = scrollY > lastScrollY ? 'down' : 'up'; + setScrollDirection(direction); + setScrollY(scrollY); + lastScrollY = scrollY > 0 ? scrollY : 0; + }; + + window.addEventListener('scroll', updateScrollDirection); + return () => { + window.removeEventListener('scroll', updateScrollDirection); + }; + }, []); + + return { scrollDirection, scrollY }; +} \ No newline at end of file diff --git a/app/components/shared/navigation/types.ts b/app/components/shared/navigation/types.ts new file mode 100644 index 000000000..12b38ea34 --- /dev/null +++ b/app/components/shared/navigation/types.ts @@ -0,0 +1,53 @@ +import type { Route } from 'next'; + +export type PathWithHash = Route | { + pathname: Route; + hash?: string; +}; + +export type MenuItem = { + id: string; + label: string; + icon?: React.ReactNode; + path: PathWithHash; + section?: string; + dropdown?: { + items: MenuItem[]; + }; +}; + +export type ProductLink = { + id: string; + label: string; + description: string; + path: PathWithHash; + icon: React.ReactNode; +}; + +export type ProfileLink = { + id: string; + label: string; + path: PathWithHash; +}; + +export type LogoProps = { + className?: string; +}; + +export type ProductDropdownProps = { + isOpen: boolean; + onToggle: () => void; + item: MenuItem; +}; + +export type ProfileDropdownProps = { + isOpen: boolean; + onToggle: () => void; +}; + +export type MobileMenuProps = { + isOpen: boolean; + onClose: () => void; + menuItems: MenuItem[]; + activeSection: string | null; +}; \ No newline at end of file diff --git a/app/contact/page.tsx b/app/contact/page.tsx new file mode 100644 index 000000000..5d9c58e65 --- /dev/null +++ b/app/contact/page.tsx @@ -0,0 +1,206 @@ +'use client'; + +import React, { useState } from 'react'; + +export default function ContactPage() { + const [formState, setFormState] = useState({ + name: '', + email: '', + company: '', + message: '', + }); + + const [isSubmitting, setIsSubmitting] = useState(false); + const [isSubmitted, setIsSubmitted] = useState(false); + const [error, setError] = useState(''); + + const handleChange = (e: React.ChangeEvent) => { + setFormState({ + ...formState, + [e.target.name]: e.target.value, + }); + }; + + const handleSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + setIsSubmitting(true); + setError(''); + + try { + // Simulate API call + await new Promise(resolve => setTimeout(resolve, 1000)); + + // Reset form and show success message + setFormState({ + name: '', + email: '', + company: '', + message: '', + }); + setIsSubmitted(true); + } catch (err) { + setError('There was an error submitting your request. Please try again.'); + } finally { + setIsSubmitting(false); + } + }; + + return ( +
    +
    +

    Contact Us

    +

    + Have questions about our AI solutions? We're here to help. Reach out to our team using the form below. +

    +
    + +
    +
    +

    Get in Touch

    + +
    +
    +

    Email

    +

    + + info@botsmann.com + +

    +
    + +
    +

    Office Hours

    +

    Monday – Friday: 9am – 5pm CET

    +
    + +
    +

    Location

    +

    Zurich, Switzerland

    +
    +
    + +
    +

    Looking for a demo?

    +

    + Schedule a personalized demo with one of our product specialists to see our AI solutions in action. +

    + +
    +
    + +
    +

    Request a Consultation

    +
    + {isSubmitted ? ( +
    + + + +

    Thank you!

    +

    + We've received your message and will get back to you soon. +

    + +
    + ) : ( +
    + {error && ( +
    + {error} +
    + )} + +
    + + +
    + +
    + + +
    + +
    + + +
    + +
    + + +
    +
    + +
    +
    +
    +
    +
    + )} + + {/* Enabling Laws Tab */} + {activeTab === 'laws' && ( +
    +

    Enabling Legislation

    +

    + These laws authorized and governed the execution of this transaction. +

    + +
      + {transaction.enablingLaws.map((law) => ( +
    • +
      +
      +

      + + {law.name} + +

      +

      ID: {law.id}

      +
      +
      + + View Law Details + +
      +
      +
      • + ))} +
    +
    + )} + + {/* Documents Tab */} + {activeTab === 'documents' && ( +
    +

    Supporting Documentation

    +

    + Complete documentation for transparency and compliance verification. +

    + +
      + {transaction.documents.map((doc) => ( +
    • +
      +
      + + + + {doc.name} +
      + + View Document + +
      +
      • + ))} +
    +
    + )} + + {/* Timeline Tab */} + {activeTab === 'timeline' && ( +
    +

    Transaction Timeline

    +

    + Complete history of this transaction from approval to completion. +

    + +
    +
      + {transaction.timeline.map((item, index) => ( +
    • +
      + {index !== transaction.timeline.length - 1 ? ( + + ) : null} +
      +
      + + + +
      +
      +
      +

      {item.event}

      +

      {item.description}

      +
      +
      + +
      +
      +
      +
      +
      • + ))} +
    +
    +
    + )} +
    + + {/* Transaction Footer */} +
    +
    +
    + + +
    + +
    +
    +
    + ); +}; + +export default TransactionWithTraceability; \ No newline at end of file diff --git a/app/projects/governance/components/VisionSection.tsx b/app/projects/governance/components/VisionSection.tsx new file mode 100644 index 000000000..ff6b5de4f --- /dev/null +++ b/app/projects/governance/components/VisionSection.tsx @@ -0,0 +1,85 @@ +'use client'; + +import React from 'react'; + +/** + * Vision section component for Solon Governance platform + * Showcasing the three core principles of the platform + */ +const VisionSection: React.FC = () => { + return ( +
    +
    +
    +

    Our Vision

    +

    + Solon is built on three core principles that transform how citizens interact with governance systems. +

    +
    + +
    + {/* Vision Card 1 */} +
    +
    + + + + +
    +

    Maximum Transparency

    +

    + A governance system where every transaction, vote, and decision is publicly visible and traceable, making corruption virtually impossible. +

    +
    + + {/* Vision Card 2 */} +
    +
    + + + +
    +

    Direct Democracy

    +

    + Citizens directly participate in decision-making, from budgeting to lawmaking, with verified voting systems and clear accountability mechanisms. +

    +
    + + {/* Vision Card 3 */} +
    +
    + + + +
    +

    Market-Based Governance

    +

    + Government functions operate in a competitive marketplace, with clear KPIs, data-driven evaluations, and continuous improvement mechanisms. +

    +
    +
    + +
    +
    +
    +

    Philosophy: Solon's Approach

    +

    + Named after the ancient Athenian lawmaker and reformer, Solon represents a return to the core principles of democracy—rule by the people—enhanced with modern technology and data-driven systems. +

    +

    + Our approach combines the best of direct democracy, market efficiency, and technological transparency to create governance systems that are more responsive, accountable, and effective than traditional models. +

    +
    +
    +
    + 🏛️ +
    +
    +
    +
    +
    +
    + ); +}; + +export default VisionSection; \ No newline at end of file diff --git a/app/projects/governance/components/WhitepaperSection.tsx b/app/projects/governance/components/WhitepaperSection.tsx new file mode 100644 index 000000000..235673f09 --- /dev/null +++ b/app/projects/governance/components/WhitepaperSection.tsx @@ -0,0 +1,166 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; + +const WhitepaperSection: React.FC = () => { + return ( +
    +
    +
    + + Documentation + +

    + Solon Governance Whitepaper +

    +

    + Detailed technical documentation and theoretical foundations of our revolutionary governance platform. +

    +
    + +
    + {/* Left Column: Whitepaper Cover */} +
    +
    + {/* Document Cover */} +
    +
    +

    WHITEPAPER

    +

    Solon Platform

    +

    A New Vision for Transparent Governance

    +
    +
    +

    Version 1.2 - 2024

    +
    +
    +
    + + {/* Corner fold effect */} +
    +
    +
    +
    + + {/* Right Column: Content */} +
    +
    +
    +

    + Comprehensive Documentation +

    +
    + +
    +
    +
    +

    + + + + Sections Included +

    +
      +
    • Executive Summary
      • +
    • Theoretical Foundation
      • +
    • Technical Architecture
      • +
    • Implementation Strategy
      • +
    • Security & Governance
      • +
    • Economic Model
      • +
    • Use Cases & Case Studies
      • +
    +
    + +
    +

    + + + + Key Highlights +

    +
      +
    • Detailed explanation of the four core components
      • +
    • Security and privacy considerations
      • +
    • Implementation roadmap and timeline
      • +
    • Governance token economics and incentives
      • +
    • Case studies and success metrics
      • +
    +
    + +
    +
    +
    + Last updated: May 15, 2024 +
    + Format: + PDF + EPUB +
    +
    + +
    + + Download + + + + + + View Online + +
    +
    +
    +
    +
    +
    + + {/* Additional resources */} +
    +
    +
    +
    + + + +
    +
    +

    Video Explanations

    +

    Watch our detailed explainer videos about the platform.

    + + View Videos → + +
    +
    +
    +
    +
    +
    + + + +
    +
    +

    Research Papers

    +

    Access academic research supporting our governance model.

    + + Read Research → + +
    +
    +
    +
    +
    +
    +
    +
    + ); +}; + +export default WhitepaperSection; \ No newline at end of file diff --git a/app/projects/governance/data/sampleData.ts b/app/projects/governance/data/sampleData.ts new file mode 100644 index 000000000..52723eb39 --- /dev/null +++ b/app/projects/governance/data/sampleData.ts @@ -0,0 +1,944 @@ +'use client'; + +import { AgencyData, AgencyTeamMember, AgencyRegulation } from '../components/AgencyProfile'; +import { EnhancedTransaction } from '../components/TransactionWithTraceability'; +import { CitizenData, TaxPayment, CitizenContribution, CitizenBenefit } from '../components/CitizenProfile'; + +// Sample Team Members +export const sampleTeamMembers: AgencyTeamMember[] = [ + { + id: 'tm1', + name: 'Eleanor Rodriguez', + position: 'Director', + department: 'Executive Office', + imageUrl: '/images/avatars/eleanor.jpg', + bio: 'Public servant with 15 years of experience in government administration and policy implementation.', + yearsOfService: 15, + salary: 175000, + transparency: 92, + responsibilities: [ + 'Agency oversight', + 'Strategic planning', + 'Interdepartmental coordination', + 'Budget approval' + ], + contact: { + email: 'eleanor.rodriguez@gov.example', + phone: '(555) 123-4567', + office: 'HQ - Suite 400' + } + }, + { + id: 'tm2', + name: 'Marcus Johnson', + position: 'Deputy Director', + department: 'Operations', + imageUrl: '/images/avatars/marcus.jpg', + bio: 'Former private sector executive with expertise in organizational efficiency and process improvement.', + yearsOfService: 7, + salary: 155000, + transparency: 88, + responsibilities: [ + 'Daily operations management', + 'Staff supervision', + 'Process improvement', + 'Performance metrics' + ], + contact: { + email: 'marcus.johnson@gov.example', + phone: '(555) 123-4568', + office: 'HQ - Suite 320' + } + }, + { + id: 'tm3', + name: 'Sarah Chen', + position: 'Chief Financial Officer', + department: 'Finance', + imageUrl: '/images/avatars/sarah.jpg', + bio: 'CPA with background in public finance and government accounting standards.', + yearsOfService: 9, + salary: 160000, + transparency: 95, + responsibilities: [ + 'Budget management', + 'Financial reporting', + 'Audit coordination', + 'Financial compliance' + ], + contact: { + email: 'sarah.chen@gov.example', + phone: '(555) 123-4569', + office: 'HQ - Suite 280' + } + }, + { + id: 'tm4', + name: 'James Wilson', + position: 'Chief Technology Officer', + department: 'IT Services', + imageUrl: '/images/avatars/james.jpg', + bio: 'Technology leader with experience in government systems modernization and cybersecurity.', + yearsOfService: 5, + salary: 165000, + transparency: 91, + responsibilities: [ + 'Technology infrastructure', + 'Digital services', + 'Cybersecurity', + 'Data management' + ], + contact: { + email: 'james.wilson@gov.example', + phone: '(555) 123-4570', + office: 'Tech Center - Floor 3' + } + }, + { + id: 'tm5', + name: 'Maria Gonzalez', + position: 'Community Relations Manager', + department: 'Public Affairs', + imageUrl: '/images/avatars/maria.jpg', + bio: 'Community organizer with strong connections to local neighborhoods and advocacy groups.', + yearsOfService: 11, + salary: 125000, + transparency: 93, + responsibilities: [ + 'Community outreach', + 'Public meetings', + 'Citizen feedback', + 'Partnership development' + ], + contact: { + email: 'maria.gonzalez@gov.example', + phone: '(555) 123-4571', + office: 'Community Center - Room 104' + } + } +]; + +// Sample Enhanced Transactions +export const sampleTransactions: EnhancedTransaction[] = [ + { + id: 'tx1', + date: '2023-06-15', + department: 'Transportation', + departmentId: 'dept2', + recipient: 'Metro Construction Co.', + description: 'Road Repair Project - Downtown District', + amount: 450000, + status: 'Completed', + metrics: { + costPerUnit: '$150/sq meter', + timeline: 'On schedule', + qualityScore: 95, + contractCompliance: 100 + }, + transparencyScore: 92, + socialData: { + publicComments: 18, + likes: 35, + concerns: 3, + shares: 12 + }, + enablingLaws: [ + { id: 'law3', name: 'Infrastructure Maintenance Act' }, + { id: 'law7', name: 'Public Works Contracting Standards' } + ], + documents: [ + { id: 'doc1', name: 'Contract Agreement', url: '/documents/tx1/contract.pdf' }, + { id: 'doc2', name: 'Environmental Impact', url: '/documents/tx1/impact.pdf' }, + { id: 'doc3', name: 'Completion Certificate', url: '/documents/tx1/completion.pdf' } + ], + timeline: [ + { date: '2023-01-10', event: 'Project Approved', description: 'Budget allocation confirmed' }, + { date: '2023-02-05', event: 'Bidding Process', description: '5 contractors submitted bids' }, + { date: '2023-03-20', event: 'Contract Awarded', description: 'Metro Construction selected' }, + { date: '2023-04-15', event: 'Work Commenced', description: 'Initial road closures and setup' }, + { date: '2023-06-12', event: 'Final Inspection', description: 'Project passed all quality checks' }, + { date: '2023-06-15', event: 'Payment Issued', description: 'Final payment for completed work' } + ] + }, + { + id: 'tx2', + date: '2023-07-02', + department: 'Education', + departmentId: 'dept3', + recipient: 'Scholastic Tech Solutions', + description: 'Classroom Technology Upgrade - District Schools', + amount: 325000, + status: 'Completed', + metrics: { + costPerUnit: '$1300/classroom', + timeline: '2 weeks ahead of schedule', + qualityScore: 98, + contractCompliance: 100 + }, + transparencyScore: 96, + socialData: { + publicComments: 42, + likes: 156, + concerns: 5, + shares: 37 + }, + enablingLaws: [ + { id: 'law5', name: 'Education Technology Advancement Act' }, + { id: 'law12', name: 'Digital Literacy Initiative' } + ], + documents: [ + { id: 'doc4', name: 'Equipment Specifications', url: '/documents/tx2/specs.pdf' }, + { id: 'doc5', name: 'School Distribution Plan', url: '/documents/tx2/distribution.pdf' }, + { id: 'doc6', name: 'Training Schedule', url: '/documents/tx2/training.pdf' } + ], + timeline: [ + { date: '2023-03-05', event: 'Needs Assessment', description: 'Evaluation of classroom requirements' }, + { date: '2023-04-12', event: 'Procurement Approval', description: 'School board approved technology plan' }, + { date: '2023-05-20', event: 'Vendor Selection', description: 'Scholastic Tech chosen as provider' }, + { date: '2023-06-15', event: 'Installation Begins', description: 'First phase of schools upgraded' }, + { date: '2023-06-30', event: 'Teacher Training', description: 'Professional development sessions held' }, + { date: '2023-07-02', event: 'Project Completion', description: 'All classrooms upgraded and verified' } + ] + }, + { + id: 'tx3', + date: '2023-05-18', + department: 'Parks & Recreation', + departmentId: 'dept4', + recipient: 'Green Spaces Landscaping', + description: 'Community Park Renovation - Westside', + amount: 275000, + status: 'Completed', + metrics: { + costPerUnit: '$55/sq meter', + timeline: '1 week delayed (weather)', + qualityScore: 93, + contractCompliance: 98 + }, + transparencyScore: 90, + socialData: { + publicComments: 87, + likes: 215, + concerns: 12, + shares: 45 + }, + enablingLaws: [ + { id: 'law8', name: 'Public Spaces Enhancement Act' }, + { id: 'law15', name: 'Community Recreation Standards' } + ], + documents: [ + { id: 'doc7', name: 'Design Plans', url: '/documents/tx3/design.pdf' }, + { id: 'doc8', name: 'Community Feedback', url: '/documents/tx3/feedback.pdf' }, + { id: 'doc9', name: 'Sustainability Report', url: '/documents/tx3/sustainability.pdf' } + ], + timeline: [ + { date: '2023-02-10', event: 'Community Input', description: 'Public meetings to gather design ideas' }, + { date: '2023-03-15', event: 'Design Approval', description: 'Final plans approved by Parks Board' }, + { date: '2023-04-01', event: 'Construction Begins', description: 'Site preparation and old equipment removal' }, + { date: '2023-05-10', event: 'Weather Delay', description: 'Heavy rain caused one week delay' }, + { date: '2023-05-17', event: 'Final Inspection', description: 'Safety certification completed' }, + { date: '2023-05-18', event: 'Park Reopening', description: 'Ribbon cutting ceremony with residents' } + ] + }, + { + id: 'tx4', + date: '2023-07-20', + department: 'Public Health', + departmentId: 'dept5', + recipient: 'Medical Supplies Direct', + description: 'Vaccine Distribution Program', + amount: 520000, + status: 'In Progress', + metrics: { + costPerUnit: '$26/resident served', + timeline: 'On schedule', + qualityScore: 99, + contractCompliance: 100 + }, + transparencyScore: 98, + socialData: { + publicComments: 132, + likes: 267, + concerns: 45, + shares: 89 + }, + enablingLaws: [ + { id: 'law2', name: 'Public Health Emergency Response Act' }, + { id: 'law9', name: 'Vaccine Access Initiative' } + ], + documents: [ + { id: 'doc10', name: 'Distribution Strategy', url: '/documents/tx4/strategy.pdf' }, + { id: 'doc11', name: 'Cold Chain Verification', url: '/documents/tx4/coldchain.pdf' }, + { id: 'doc12', name: 'Community Access Points', url: '/documents/tx4/access.pdf' } + ], + timeline: [ + { date: '2023-05-01', event: 'Emergency Declaration', description: 'Health emergency triggered response' }, + { date: '2023-05-15', event: 'Supplier Contract', description: 'Expedited procurement process completed' }, + { date: '2023-06-10', event: 'First Delivery', description: 'Initial vaccine supply received' }, + { date: '2023-06-15', event: 'Distribution Begins', description: 'Priority populations served first' }, + { date: '2023-07-01', event: 'Phase 2 Rollout', description: 'General population access points opened' }, + { date: '2023-07-20', event: 'Interim Payment', description: '60% of program completed, interim payment made' } + ] + }, + { + id: 'tx5', + date: '2023-04-05', + department: 'Public Safety', + departmentId: 'dept1', + recipient: 'First Responder Equipment Co.', + description: 'Emergency Services Equipment Upgrade', + amount: 380000, + status: 'Completed', + metrics: { + costPerUnit: '$12,500/unit', + timeline: 'On schedule', + qualityScore: 97, + contractCompliance: 100 + }, + transparencyScore: 94, + socialData: { + publicComments: 56, + likes: 189, + concerns: 7, + shares: 42 + }, + enablingLaws: [ + { id: 'law1', name: 'Emergency Services Modernization Act' }, + { id: 'law11', name: 'First Responder Safety Standards' } + ], + documents: [ + { id: 'doc13', name: 'Equipment Specifications', url: '/documents/tx5/specs.pdf' }, + { id: 'doc14', name: 'Training Certification', url: '/documents/tx5/training.pdf' }, + { id: 'doc15', name: 'Deployment Plan', url: '/documents/tx5/deployment.pdf' } + ], + timeline: [ + { date: '2023-01-20', event: 'Needs Assessment', description: 'Evaluation of current equipment status' }, + { date: '2023-02-10', event: 'Budget Approval', description: 'City council approved emergency funding' }, + { date: '2023-02-28', event: 'Vendor Selection', description: 'Competitive bid process completed' }, + { date: '2023-03-15', event: 'Equipment Delivery', description: 'All ordered items received and inventoried' }, + { date: '2023-03-20', event: 'Staff Training', description: 'All shifts completed equipment training' }, + { date: '2023-04-05', event: 'Full Deployment', description: 'New equipment in service across all stations' } + ] + } +]; + +// Sample Agency Regulations +export const sampleRegulations: AgencyRegulation[] = [ + { + id: 'reg1', + title: 'Public Safety Response Time Standards', + description: 'Establishes maximum response times for emergency services based on incident type and location.', + dateEnacted: '2022-09-15', + lastUpdated: '2023-01-20', + status: 'active', + purpose: 'To ensure timely emergency service response to all areas of the jurisdiction.', + kpis: [ + { + metric: 'Urban Response Time', + target: '< 4 minutes', + current: '3.8 minutes', + status: 'achieved' + }, + { + metric: 'Suburban Response Time', + target: '< 6 minutes', + current: '5.5 minutes', + status: 'achieved' + }, + { + metric: 'Rural Response Time', + target: '< 12 minutes', + current: '13.2 minutes', + status: 'at-risk' + } + ], + enablingLawId: 'law1', + enablingLawName: 'Emergency Services Modernization Act' + }, + { + id: 'reg2', + title: 'Road Maintenance Quality Standards', + description: 'Defines requirements for road repairs, including materials, durability, and environmental considerations.', + dateEnacted: '2021-11-30', + lastUpdated: '2023-02-10', + status: 'active', + purpose: 'To ensure consistent quality in road construction and maintenance projects.', + kpis: [ + { + metric: 'Materials Compliance', + target: '100%', + current: '98%', + status: 'on-track' + }, + { + metric: 'Repair Durability', + target: '5+ years', + current: '4.7 years avg.', + status: 'on-track' + }, + { + metric: 'Project Documentation', + target: '100%', + current: '100%', + status: 'achieved' + } + ], + enablingLawId: 'law3', + enablingLawName: 'Infrastructure Maintenance Act' + }, + { + id: 'reg3', + title: 'Educational Technology Implementation', + description: 'Guidelines for technology deployment in educational settings, including accessibility requirements.', + dateEnacted: '2022-07-15', + lastUpdated: '2023-03-05', + status: 'active', + purpose: 'To standardize technology implementation and ensure equal access across all schools.', + kpis: [ + { + metric: 'Student Device Ratio', + target: '1:1', + current: '1:1.2', + status: 'on-track' + }, + { + metric: 'Teacher Training', + target: '100%', + current: '87%', + status: 'at-risk' + }, + { + metric: 'Accessibility Compliance', + target: '100%', + current: '100%', + status: 'achieved' + } + ], + enablingLawId: 'law5', + enablingLawName: 'Education Technology Advancement Act' + }, + { + id: 'reg4', + title: 'Park Sustainability Standards', + description: 'Requirements for water conservation, native plants, and sustainable maintenance in public parks.', + dateEnacted: '2022-02-28', + lastUpdated: '2022-10-15', + status: 'active', + purpose: 'To ensure environmental sustainability in public park spaces.', + kpis: [ + { + metric: 'Water Usage Reduction', + target: '30%', + current: '25%', + status: 'on-track' + }, + { + metric: 'Native Plant Coverage', + target: '75%', + current: '68%', + status: 'on-track' + }, + { + metric: 'Chemical-Free Maintenance', + target: '90%', + current: '85%', + status: 'on-track' + } + ], + enablingLawId: 'law8', + enablingLawName: 'Public Spaces Enhancement Act' + }, + { + id: 'reg5', + title: 'Health Emergency Response Protocol', + description: 'Procedures for coordinating public health responses to emergencies, including resource allocation.', + dateEnacted: '2022-05-10', + lastUpdated: '2023-04-20', + status: 'active', + purpose: 'To establish clear protocols for responding to public health emergencies.', + kpis: [ + { + metric: 'Response Activation Time', + target: '< 24 hours', + current: '18 hours', + status: 'achieved' + }, + { + metric: 'Resource Distribution Equity', + target: '100%', + current: '94%', + status: 'on-track' + }, + { + metric: 'Public Communication', + target: '12 hour updates', + current: '24 hour updates', + status: 'failed' + } + ], + enablingLawId: 'law2', + enablingLawName: 'Public Health Emergency Response Act' + } +]; + +// Sample Agencies +export const sampleAgencies: AgencyData[] = [ + { + id: 'dept1', + name: 'Department of Public Safety', + description: 'Responsible for emergency services, law enforcement, and disaster response coordination throughout the jurisdiction.', + transparencyScore: 87, + establishment: 'January 15, 1965', + budget: { + total: 38500000, + allocated: 36750000, + spent: 28125000, + fiscalYear: '2023-2024' + }, + metrics: [ + { + name: 'Emergency Response Time', + value: '4.2 min', + change: '-0.3 min from last year', + trend: 'up' + }, + { + name: 'Public Safety Index', + value: '86/100', + change: '+4 points from last year', + trend: 'up' + }, + { + name: 'Staff Training Hours', + value: '12,450', + change: '+15% from last year', + trend: 'up' + }, + { + name: 'Incident Resolution Rate', + value: '94%', + change: '+2% from last year', + trend: 'up' + } + ], + transactions: sampleTransactions.filter(t => t.department === 'Public Safety'), + regulations: sampleRegulations.filter(r => r.enablingLawName.includes('Emergency') || r.enablingLawName.includes('First Responder')), + team: sampleTeamMembers.filter((_, index) => [0, 3].includes(index)), + citizenImpact: { + servicesProvided: 15680, + citizensServed: 180450, + satisfactionScore: 89, + avgResponseTime: '4.2 minutes' + } + }, + { + id: 'dept2', + name: 'Department of Transportation', + description: 'Oversees public transportation systems, road maintenance, traffic management, and infrastructure development.', + transparencyScore: 92, + establishment: 'March 28, 1972', + budget: { + total: 42750000, + allocated: 41500000, + spent: 32450000, + fiscalYear: '2023-2024' + }, + metrics: [ + { + name: 'Road Condition Index', + value: '78/100', + change: '+6 points from last year', + trend: 'up' + }, + { + name: 'Public Transit Ridership', + value: '9.2M', + change: '+8% from last year', + trend: 'up' + }, + { + name: 'Traffic Congestion', + value: '32%', + change: '-5% from last year', + trend: 'up' + }, + { + name: 'Infrastructure Projects', + value: '24', + change: '+3 from last year', + trend: 'up' + } + ], + transactions: sampleTransactions.filter(t => t.department === 'Transportation'), + regulations: sampleRegulations.filter(r => r.enablingLawName.includes('Infrastructure')), + team: sampleTeamMembers.filter((_, index) => [1, 4].includes(index)), + citizenImpact: { + servicesProvided: 8760, + citizensServed: 230000, + satisfactionScore: 82, + avgResponseTime: '3.5 days' + } + }, + { + id: 'dept3', + name: 'Department of Education', + description: 'Manages public education, school programs, teacher professional development, and educational policy implementation.', + transparencyScore: 94, + establishment: 'September 5, 1968', + budget: { + total: 65250000, + allocated: 64100000, + spent: 48750000, + fiscalYear: '2023-2024' + }, + metrics: [ + { + name: 'Graduation Rate', + value: '89%', + change: '+3% from last year', + trend: 'up' + }, + { + name: 'Student-Teacher Ratio', + value: '18:1', + change: '-1 from last year', + trend: 'up' + }, + { + name: 'Digital Access', + value: '96%', + change: '+5% from last year', + trend: 'up' + }, + { + name: 'Test Score Average', + value: '78/100', + change: '+2 points from last year', + trend: 'up' + } + ], + transactions: sampleTransactions.filter(t => t.department === 'Education'), + regulations: sampleRegulations.filter(r => r.enablingLawName.includes('Education')), + team: sampleTeamMembers.filter((_, index) => [2, 4].includes(index)), + citizenImpact: { + servicesProvided: 350, + citizensServed: 42500, + satisfactionScore: 87, + avgResponseTime: '5.2 days' + } + }, + { + id: 'dept4', + name: 'Department of Parks & Recreation', + description: 'Responsible for maintaining public parks, recreational facilities, and community programs for citizens of all ages.', + transparencyScore: 90, + establishment: 'June 12, 1975', + budget: { + total: 28500000, + allocated: 27900000, + spent: 21350000, + fiscalYear: '2023-2024' + }, + metrics: [ + { + name: 'Park Access', + value: '92%', + change: '+4% from last year', + trend: 'up' + }, + { + name: 'Program Participation', + value: '38,450', + change: '+12% from last year', + trend: 'up' + }, + { + name: 'Green Space', + value: '1,245 acres', + change: '+35 acres from last year', + trend: 'up' + }, + { + name: 'Facility Condition', + value: '84/100', + change: '+5 points from last year', + trend: 'up' + } + ], + transactions: sampleTransactions.filter(t => t.department === 'Parks & Recreation'), + regulations: sampleRegulations.filter(r => r.enablingLawName.includes('Public Spaces')), + team: sampleTeamMembers.filter((_, index) => [0, 4].includes(index)), + citizenImpact: { + servicesProvided: 1250, + citizensServed: 156000, + satisfactionScore: 91, + avgResponseTime: '2.8 days' + } + }, + { + id: 'dept5', + name: 'Department of Public Health', + description: 'Manages public health initiatives, disease prevention programs, health education, and emergency health responses.', + transparencyScore: 96, + establishment: 'November 3, 1970', + budget: { + total: 56750000, + allocated: 55900000, + spent: 42650000, + fiscalYear: '2023-2024' + }, + metrics: [ + { + name: 'Vaccination Rate', + value: '87%', + change: '+6% from last year', + trend: 'up' + }, + { + name: 'Health Screenings', + value: '45,320', + change: '+18% from last year', + trend: 'up' + }, + { + name: 'Community Health Score', + value: '82/100', + change: '+3 points from last year', + trend: 'up' + }, + { + name: 'Response Time', + value: '1.8 hours', + change: '-0.5 hours from last year', + trend: 'up' + } + ], + transactions: sampleTransactions.filter(t => t.department === 'Public Health'), + regulations: sampleRegulations.filter(r => r.enablingLawName.includes('Health')), + team: sampleTeamMembers.filter((_, index) => [2, 3].includes(index)), + citizenImpact: { + servicesProvided: 32450, + citizensServed: 210000, + satisfactionScore: 88, + avgResponseTime: '2.2 hours' + } + } +]; + +// Sample Tax Payments +export const sampleTaxPayments: TaxPayment[] = [ + { + id: 'tax1', + year: '2023', + amount: 5250, + date: '2023-04-15', + status: 'Paid', + type: 'Income', + reference: 'TX-2023-04152' + }, + { + id: 'tax2', + year: '2023', + amount: 3200, + date: '2023-03-15', + status: 'Paid', + type: 'Property', + reference: 'TX-2023-03122' + }, + { + id: 'tax3', + year: '2022', + amount: 4950, + date: '2022-04-10', + status: 'Paid', + type: 'Income', + reference: 'TX-2022-04105' + }, + { + id: 'tax4', + year: '2022', + amount: 3050, + date: '2022-03-12', + status: 'Paid', + type: 'Property', + reference: 'TX-2022-03118' + }, + { + id: 'tax5', + year: '2021', + amount: 4600, + date: '2021-04-12', + status: 'Paid', + type: 'Income', + reference: 'TX-2021-04120' + }, + { + id: 'tax6', + year: '2021', + amount: 2900, + date: '2021-03-10', + status: 'Paid', + type: 'Property', + reference: 'TX-2021-03101' + }, + { + id: 'tax7', + year: '2023', + amount: 1200, + date: '2023-06-15', + status: 'Pending', + type: 'Other', + reference: 'TX-2023-06158' + } +]; + +// Sample Contributions +export const sampleContributions: CitizenContribution[] = [ + { + agencyId: 'dept1', + agencyName: 'Department of Public Safety', + amount: 2040, + percentage: 22, + transparencyScore: 87, + contributionHistory: [ + { year: '2021', amount: 1770 }, + { year: '2022', amount: 1890 }, + { year: '2023', amount: 2040 } + ] + }, + { + agencyId: 'dept2', + agencyName: 'Department of Transportation', + amount: 1670, + percentage: 18, + transparencyScore: 92, + contributionHistory: [ + { year: '2021', amount: 1480 }, + { year: '2022', amount: 1550 }, + { year: '2023', amount: 1670 } + ] + }, + { + agencyId: 'dept3', + agencyName: 'Department of Education', + amount: 2780, + percentage: 30, + transparencyScore: 94, + contributionHistory: [ + { year: '2021', amount: 2430 }, + { year: '2022', amount: 2580 }, + { year: '2023', amount: 2780 } + ] + }, + { + agencyId: 'dept4', + agencyName: 'Department of Parks & Recreation', + amount: 740, + percentage: 8, + transparencyScore: 90, + contributionHistory: [ + { year: '2021', amount: 650 }, + { year: '2022', amount: 690 }, + { year: '2023', amount: 740 } + ] + }, + { + agencyId: 'dept5', + agencyName: 'Department of Public Health', + amount: 2040, + percentage: 22, + transparencyScore: 96, + contributionHistory: [ + { year: '2021', amount: 1770 }, + { year: '2022', amount: 1890 }, + { year: '2023', amount: 2040 } + ] + } +]; + +// Sample Benefits +export const sampleBenefits: CitizenBenefit[] = [ + { + id: 'ben1', + name: 'Healthcare Subsidy', + description: 'Partial coverage for essential healthcare services', + amount: 1200, + frequency: 'Annual', + provider: 'Department of Public Health', + providerId: 'dept5', + dateReceived: '2023-01-15', + status: 'Active' + }, + { + id: 'ben2', + name: 'Education Grant - Children', + description: 'Support for educational materials and activities', + amount: 500, + frequency: 'Annual', + provider: 'Department of Education', + providerId: 'dept3', + dateReceived: '2023-02-20', + status: 'Active' + }, + { + id: 'ben3', + name: 'Public Transit Pass', + description: 'Reduced fare transit card for public transportation', + amount: 75, + frequency: 'Monthly', + provider: 'Department of Transportation', + providerId: 'dept2', + dateReceived: '2023-07-01', + status: 'Active' + }, + { + id: 'ben4', + name: 'Recreation Program Discount', + description: '50% discount on community center programs', + amount: 120, + frequency: 'Quarterly', + provider: 'Department of Parks & Recreation', + providerId: 'dept4', + dateReceived: '2023-04-10', + status: 'Active' + }, + { + id: 'ben5', + name: 'Senior Wellness Program', + description: 'Preventative health services for senior household members', + amount: 350, + frequency: 'Annual', + provider: 'Department of Public Health', + providerId: 'dept5', + dateReceived: '2023-05-15', + status: 'Pending' + } +]; + +// Sample Citizen +export const sampleCitizen: CitizenData = { + id: 'cit1', + name: 'Jordan Smith', + address: '123 Main Street, Cityville', + district: 'North Central', + registeredSince: '2015-06-10', + avatarUrl: '/images/avatars/jordan.jpg', + taxHistory: sampleTaxPayments, + contributions: sampleContributions, + benefits: sampleBenefits, + representativeId: 'tm5', + representativeName: 'Maria Gonzalez', + totalTaxContribution: 9270, + votingDistricts: { + local: 'District 3', + state: 'State District 8', + federal: 'Federal District 2' + }, + participationScore: 78 +}; + +export default { + agencies: sampleAgencies, + transactions: sampleTransactions, + citizen: sampleCitizen +}; \ No newline at end of file diff --git a/app/projects/governance/employees/[id]/page.tsx b/app/projects/governance/employees/[id]/page.tsx new file mode 100644 index 000000000..9dcf07e68 --- /dev/null +++ b/app/projects/governance/employees/[id]/page.tsx @@ -0,0 +1,340 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import { useRouter } from 'next/navigation'; +import { sampleTeamMembers } from '../../data/sampleData'; + +export default function EmployeeDetailPage({ params }: { params: { id: string } }) { + const router = useRouter(); + const employeeId = params.id; + + // Find the employee with the matching ID + const employee = sampleTeamMembers.find(emp => emp.id === employeeId); + + // Helper function to format currency + const formatCurrency = (amount: number) => { + return new Intl.NumberFormat('en-US', { + style: 'currency', + currency: 'USD', + maximumFractionDigits: 0, + }).format(amount); + }; + + // If employee not found, show error and link back to all employees + if (!employee) { + return ( +
    +
    + + +
    +

    Employee Not Found

    +

    + The employee profile you are looking for could not be found. +

    + + View All Employees + +
    +
    +
    + ); + } + + return ( +
    +
    + + +
    + {/* Employee Header */} +
    +
    +
    + {employee.imageUrl ? ( + {employee.name} + ) : ( +
    + {employee.name.charAt(0)} +
    + )} +
    +

    {employee.name}

    +

    {employee.position}

    +

    {employee.department}

    +
    +
    +
    + + Transparency Score: {employee.transparency}/100 + +
    +
    +
    + + {/* Employee Bio */} +
    +

    Professional Biography

    +

    {employee.bio}

    +
    + + {/* Employment Details */} +
    +

    Employment Details

    +
    +
    +
    Department
    +
    {employee.department}
    +
    +
    +
    Years of Service
    +
    {employee.yearsOfService} years
    +
    +
    +
    Annual Salary
    +
    {formatCurrency(employee.salary)}
    +
    +
    +
    Office Location
    +
    {employee.contact.office}
    +
    + +
    +
    Phone
    +
    {employee.contact.phone}
    +
    +
    +
    + + {/* Responsibilities */} +
    +

    Responsibilities & Authority

    +
    +

    Key Responsibilities

    +
      + {employee.responsibilities.map((resp, index) => ( +
    • + + + + {resp} +
      • + ))} +
    +
    + + {/* Placeholder for decision authority - would be populated from real data */} +
    +

    Decision-Making Authority

    +
      +
    • + + + + Can approve expenditures up to {formatCurrency(employee.position.includes('Director') ? 50000 : 10000)} +
      • +
    • + + + + {employee.position.includes('Director') ? 'Final approval' : 'Recommends'} for departmental policies +
      • +
    • + + + + {employee.position.includes('Director') || employee.position.includes('Chief') ? 'Participates in' : 'Provides input for'} strategic planning +
      • +
    +
    +
    +
    + + {/* Performance & Transparency */} +
    +
    +

    Performance & Transparency

    +

    + Performance metrics and transparency indicators for this public servant. +

    +
    +
    +
    +

    Transparency Score Components

    +
    +
    +
    +

    Disclosure Compliance

    + + {Math.round(employee.transparency * 0.95)}% + +
    +
    +
    +
    +

    + Measures completeness of required public disclosures +

    +
    +
    +
    +

    Decision Documentation

    + + {Math.round(employee.transparency * 0.9)}% + +
    +
    +
    +
    +

    + Evaluates documentation of decisions and rationales +

    +
    +
    +
    +

    Public Responsiveness

    + + {Math.round(employee.transparency * 1.05)}% + +
    +
    +
    +
    +

    + Measures responsiveness to public inquiries and feedback +

    +
    +
    +
    + +
    +

    Performance Highlights

    +
    +
    +
    +

    Projects Managed

    +

    {employee.yearsOfService * 2 + 4}

    +

    +{employee.yearsOfService < 5 ? 2 : 1} from previous year

    +
    +
    +

    Budget Responsibility

    +

    {formatCurrency(employee.salary * 8)}

    +

    For current fiscal year

    +
    +
    +

    Team Size

    +

    {employee.position.includes('Director') ? 12 : employee.position.includes('Manager') ? 6 : 2}

    +

    Direct reports

    +
    +
    +

    Public Engagement

    +

    {employee.position.includes('Relations') ? 95 : 78}%

    +

    Response rate to inquiries

    +
    +
    +
    +
    +
    +
    + + {/* Contact and Feedback */} +
    +
    +

    Contact & Feedback

    +

    + Ways to contact this employee or provide feedback on their performance. +

    +
    +
    +
    +
    +

    Contact Information

    +
    + +
    +
    Phone
    +
    {employee.contact.phone}
    +
    +
    +
    Office
    +
    {employee.contact.office}
    +
    +
    +
    +
    +

    Provide Feedback

    +

    + Your feedback helps improve public service and ensures accountability. +

    + +
    +
    +
    +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/projects/governance/employees/page.tsx b/app/projects/governance/employees/page.tsx new file mode 100644 index 000000000..2fe0353de --- /dev/null +++ b/app/projects/governance/employees/page.tsx @@ -0,0 +1,141 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import { sampleTeamMembers } from '../data/sampleData'; + +export default function EmployeesPage() { + // Helper function to get transparency score color + const getTransparencyColor = (score: number) => { + if (score >= 90) return 'text-green-600'; + if (score >= 80) return 'text-blue-600'; + if (score >= 70) return 'text-yellow-600'; + return 'text-red-600'; + }; + + // Helper function to format currency + const formatCurrency = (amount: number) => { + return new Intl.NumberFormat('en-US', { + style: 'currency', + currency: 'USD', + maximumFractionDigits: 0, + }).format(amount); + }; + + return ( +
    +
    + + +
    +

    Government Employees

    +

    + Explore the public servants working to deliver government services +

    +
    + +
    +

    Employee Transparency Index

    +

    + Our employee transparency system promotes accountability by making key information about public servants + available to citizens. Review roles, responsibilities, and performance metrics for the individuals + responsible for managing public resources. +

    + +
    + {sampleTeamMembers.map((employee) => ( + +
    +
    +
    +

    {employee.name}

    +

    {employee.position}

    +
    + + T-Score: {employee.transparency} + +
    +
    +
    +

    {employee.department}

    +

    {employee.bio}

    + +
    +
    Key Details
    +
    +
    Years of Service:
    +
    {employee.yearsOfService}
    +
    Salary:
    +
    {formatCurrency(employee.salary)}
    +
    +
    +
    +
    + + View Profile + + + + +
    + + ))} +
    +
    + +
    +

    Transparency Standards

    +

    + Our employee profiles adhere to strict standards of transparency while respecting privacy. Here's what's included: +

    + +
    +
    +

    Basic Information

    +
      +
    • • Name and position
      • +
    • • Department affiliation
      • +
    • • Years of public service
      • +
    • • Professional biography
      • +
    +
    +
    +

    Accountability

    +
      +
    • • Public roles and responsibilities
      • +
    • • Decision-making authority
      • +
    • • Contact information for inquiries
      • +
    • • Salary information (as permitted by law)
      • +
    +
    +
    +

    Privacy Protection

    +
      +
    • • No personal contact information
      • +
    • • No family details
      • +
    • • No detailed employment history
      • +
    • • No personally identifiable information
      • +
    +
    +
    +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/projects/governance/layout.tsx b/app/projects/governance/layout.tsx new file mode 100644 index 000000000..959e5171b --- /dev/null +++ b/app/projects/governance/layout.tsx @@ -0,0 +1,18 @@ +'use client'; + +import React from 'react'; +import Navigation from './components/Navigation'; +import './styles.css'; + +export default function GovernanceLayout({ + children, +}: { + children: React.ReactNode; +}) { + return ( +
    + + {children} +
    + ); +} \ No newline at end of file diff --git a/app/projects/governance/metadata.ts b/app/projects/governance/metadata.ts new file mode 100644 index 000000000..2d21e5edd --- /dev/null +++ b/app/projects/governance/metadata.ts @@ -0,0 +1,6 @@ +import { Metadata } from 'next'; + +export const metadata: Metadata = { + title: 'Solon | Decentralized Direct Democracy', + description: 'Solutions for decentralized direct democracy. Maximum transparency, citizen empowerment, and efficient governance.', +}; \ No newline at end of file diff --git a/app/projects/governance/open-law/page.tsx b/app/projects/governance/open-law/page.tsx new file mode 100644 index 000000000..a77742c0b --- /dev/null +++ b/app/projects/governance/open-law/page.tsx @@ -0,0 +1,442 @@ +'use client'; + +import React, { useState } from 'react'; +import Link from 'next/link'; +import DetailedComponentsNav from '../components/DetailedComponentsNav'; + +/** + * Law Transparency Framework Detailed Page + * + * This page provides in-depth information about Solon's Law Transparency Framework, + * including how it works, why it's important, use cases, and examples. + */ + +// Define types for law data structures +type LawGoal = { + goal: string; + metric: string; + target: string; + current: string; + status: 'achieved' | 'near-target' | 'in-progress' | 'needs-attention'; +}; + +type LawAmendment = { + id: string; + title: string; + date: string; + sponsor: string; + status: 'approved' | 'pending'; +}; + +type LawCostBenefit = { + implementation: string; + maintenanceAnnual: string; + economicBenefit: string; + returnOnInvestment: string; +}; + +type LawPublicFeedback = { + sentiment: string; + supportPercentage: number; + commentVolume: number; + keyThemes: string[]; +}; + +type LawData = { + title: string; + status: string; + enactedDate: string; + goals: LawGoal[]; + amendments: LawAmendment[]; + costBenefit: LawCostBenefit; + publicFeedback: LawPublicFeedback; +}; + +type Laws = { + [key: string]: LawData; +}; + +export default function LawFrameworkPage() { + // State for the interactive law effectiveness tracker demo + const [selectedLaw, setSelectedLaw] = useState('env-protection-act'); + + // Mock data for laws + const laws: Laws = { + 'env-protection-act': { + title: 'Environmental Protection Act 2023', + status: 'active', + enactedDate: '2023-03-15', + goals: [ + { goal: 'Reduce carbon emissions by 30%', metric: 'CO2 emissions', target: '30% reduction', current: '12% reduction', status: 'in-progress' }, + { goal: 'Increase renewable energy usage', metric: 'Renewable energy %', target: '40% of grid', current: '28% of grid', status: 'in-progress' }, + { goal: 'Protect 5000 acres of forest', metric: 'Protected land', target: '5000 acres', current: '4200 acres', status: 'near-target' } + ], + amendments: [ + { id: 'EPA-A1', title: 'Solar Incentives Amendment', date: '2023-06-10', sponsor: 'Rep. Johnson', status: 'approved' }, + { id: 'EPA-A2', title: 'Corporate Emissions Reporting', date: '2023-07-22', sponsor: 'Rep. Garcia', status: 'pending' } + ], + costBenefit: { + implementation: '$3.2M', + maintenanceAnnual: '$1.1M', + economicBenefit: '$12.4M', + returnOnInvestment: '387%' + }, + publicFeedback: { + sentiment: 'positive', + supportPercentage: 72, + commentVolume: 1542, + keyThemes: ['Economic impact', 'Implementation speed', 'Enforcement concerns'] + } + }, + 'digital-privacy-act': { + title: 'Digital Privacy Act 2022', + status: 'active', + enactedDate: '2022-11-05', + goals: [ + { goal: 'Secure personal data protection', metric: 'Data breach incidents', target: '50% reduction', current: '32% reduction', status: 'in-progress' }, + { goal: 'Increase transparency in data collection', metric: 'Compliance rate', target: '95% of companies', current: '78% of companies', status: 'in-progress' }, + { goal: 'Enforce right to be forgotten', metric: 'Request fulfillment rate', target: '99% fulfilled', current: '94% fulfilled', status: 'near-target' } + ], + amendments: [ + { id: 'DPA-A1', title: "Minor's Data Protection", date: '2023-02-18', sponsor: 'Rep. Williams', status: 'approved' }, + { id: 'DPA-A2', title: 'Breach Notification Requirements', date: '2023-05-03', sponsor: 'Rep. Chen', status: 'approved' } + ], + costBenefit: { + implementation: '$4.5M', + maintenanceAnnual: '$2.3M', + economicBenefit: '$18.7M', + returnOnInvestment: '415%' + }, + publicFeedback: { + sentiment: 'very positive', + supportPercentage: 84, + commentVolume: 2371, + keyThemes: ['Corporate compliance', 'Penalties adequacy', 'Consumer education'] + } + }, + 'small-business-act': { + title: 'Small Business Support Act 2023', + status: 'active', + enactedDate: '2023-01-20', + goals: [ + { goal: 'Increase small business formation', metric: 'New business registrations', target: '25% increase', current: '13% increase', status: 'in-progress' }, + { goal: 'Improve access to capital', metric: 'Loan approval rate', target: '40% increase', current: '22% increase', status: 'in-progress' }, + { goal: 'Reduce regulatory burden', metric: 'Compliance time', target: '50% reduction', current: '15% reduction', status: 'needs-attention' } + ], + amendments: [ + { id: 'SBA-A1', title: 'Minority Business Focus', date: '2023-04-12', sponsor: 'Rep. Washington', status: 'approved' }, + { id: 'SBA-A2', title: 'Rural Enterprise Incentives', date: '2023-08-05', sponsor: 'Rep. Miller', status: 'pending' } + ], + costBenefit: { + implementation: '$5.8M', + maintenanceAnnual: '$2.7M', + economicBenefit: '$47.3M', + returnOnInvestment: '815%' + }, + publicFeedback: { + sentiment: 'positive', + supportPercentage: 68, + commentVolume: 1837, + keyThemes: ['Application process', 'Distribution equity', 'Administrative overhead'] + } + } + }; + + const selectedLawData = laws[selectedLaw]; + + // Function to determine goal status color + const getStatusColor = (status: string): string => { + switch (status) { + case 'achieved': + return 'bg-green-50 text-green-800'; + case 'near-target': + return 'bg-blue-50 text-blue-800'; + case 'in-progress': + return 'bg-yellow-50 text-yellow-800'; + case 'needs-attention': + return 'bg-red-50 text-red-800'; + default: + return 'bg-gray-100 text-gray-800'; + } + }; + + return ( +
    + {/* Hero Section */} +
    +
    +
    +
    +

    Open Law

    +

    End the era of unaccountable legislation. Every law now has clear problem statements, measurable KPIs, and defined accountability timelines.

    +
    + + Explore Active Laws + + + See the Impact + +
    +
    +
    +
    +
    ACTIVE
    +
    +

    Street Safety Enhancement Act

    +

    Enacted: March 12, 2023 • Status: In Progress

    +
    +
    +
    +

    PROBLEM STATEMENT

    +

    Pedestrian injuries at intersections have increased 14% in the last two years.

    +
    +
    +

    KEY METRICS

    +
    +
    +
    +
    + Target: 50% reduction in accidents + Current: 42% +
    +
    +
    +

    ACCOUNTABILITY

    +

    Lead: Transportation Safety Board

    +

    Timeline: Complete by Dec 2023

    +
    +
    +
    +
    +
    +
    +
    + + {/* Benefits Section */} +
    +
    +

    Why Open Law Transforms Governance

    + +
    +
    +
    📊
    +

    Measure Real Results

    +

    Studies show that laws with clearly defined metrics are 3.7x more likely to achieve their intended outcomes. Open Law ensures every piece of legislation has measurable targets and accountability.

    +
    + +
    +
    🛡️
    +

    True Political Accountability

    +

    When politicians sponsor laws, they become directly accountable for results. Open Law creates a permanent record of promises made versus results delivered.

    +
    + +
    +
    📝
    +

    Citizen Participation

    +

    Open Law transforms citizens from passive subjects into active participants. Comment directly on laws, suggest improvements, and help measure outcomes in your community.

    +
    +
    +
    +
    + + {/* How It Works Section */} +
    +
    +
    +

    How Open Law Works

    +

    + A revolutionary framework for legislation that brings clarity, measurability, and accountability to every law. +

    +
    + +
    +
    +
    1
    +

    Problem Definition

    +

    Every law starts with a clearly articulated problem statement backed by data. No more vague objectives or hidden agendas.

    +
    + +
    +
    2
    +

    KPI Definition

    +

    Each law includes specific, measurable Key Performance Indicators that define success. You'll know exactly if a law is working.

    +
    + +
    +
    3
    +

    Timeline Setting

    +

    Clear timeframes for implementation and evaluation prevent laws from lingering in limbo. Automatic evaluation at predetermined milestones.

    +
    + +
    +
    4
    +

    Accountability Assignment

    +

    Specific individuals and departments are assigned responsibility. If a law fails, citizens know exactly who to hold accountable.

    +
    +
    +
    +
    + + {/* Demo Section */} +
    +
    +
    +

    Explore Active Legislation

    +

    + In a full implementation, this section would contain real-time data on all active laws, their KPIs, and current progress. +

    +
    + +
    +
    +
    +

    Community Health Initiative

    +
    + Enacted: January 2023 + On Track +
    +
    +
    +
    +

    PROBLEM

    +

    Rising obesity rates across all demographics and limited access to preventative care.

    +
    +
    +

    METRICS

    +
    +
    +

    Obesity Rate Reduction

    +
    +
    +
    +
    + Target: 15% + Current: 5.2% +
    +
    +
    +

    Preventative Care Access

    +
    +
    +
    +
    + Target: 95% + Current: 57% +
    +
    +
    +
    +
    +
    +

    Lead: Health Department

    +

    Timeline: 2023-2025

    +
    + + View Details → + +
    +
    +
    + +
    +
    +

    Clean Energy Transition Act

    +
    + Enacted: October 2022 + At Risk +
    +
    +
    +
    +

    PROBLEM

    +

    High carbon emissions from municipal operations and aging energy infrastructure.

    +
    +
    +

    METRICS

    +
    +
    +

    Carbon Reduction

    +
    +
    +
    +
    + Target: 40% + Current: 8.8% +
    +
    +
    +

    Renewable Usage

    +
    +
    +
    +
    + Target: 50% + Current: 22.5% +
    +
    +
    +
    +
    +
    +

    Lead: Energy Commission

    +

    Timeline: 2022-2024

    +
    + + View Details → + +
    +
    +
    +
    + +
    + + View All Active Laws + + + + +
    +
    +
    + + {/* Testimonial Section */} +
    +
    +
    +

    The Results Speak for Themselves

    + +
    +
    +
    + + + +
    +
    +
    + "Cities that have implemented the Open Law framework have seen a 43% increase in successful policy outcomes. Laws that don't work get fixed or removed. Accountability is no longer optional." +
    +

    Independent Policy Research Institute

    +
    +
    +
    +
    + + {/* CTA Section */} +
    +
    +

    Transform Your Legislative Process

    +

    + Join the growing movement of accountable, measurable, and transparent legislation. The future of law-making is here. +

    +
    + + Request Implementation Details + +
    +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/projects/governance/open-pay/page.tsx b/app/projects/governance/open-pay/page.tsx new file mode 100644 index 000000000..dda52a070 --- /dev/null +++ b/app/projects/governance/open-pay/page.tsx @@ -0,0 +1,215 @@ +'use client'; + +import React, { useState } from 'react'; +import Link from 'next/link'; +import DetailedComponentsNav from '../components/DetailedComponentsNav'; +import TransactionDemo from '../components/TransactionDemo'; + +/** + * Open Pay - Transparent government transactions with instant verification + * Highlights the value of complete financial transparency in governance + */ + +// Enhanced transaction type with social components and law traceability +type Transaction = { + id: string; + date: string; + department: string; + recipient: string; + description: string; + amount: number; + status: string; + documents: string[]; + approvals: string[]; + metrics: { + timeToCompletion: string; + costVsBudget: string; + qualityScore: string; + }; + // Social components + socialInteraction?: { + likes: number; + dislikes: number; + comments: number; + shares: number; + donations: number; + }; + // Law traceability + enablingLaw?: { + id: string; + name: string; + date: string; + sponsors: string[]; + link: string; + }; + timeline?: {date: string, event: string}[]; +}; + +export default function OpenPay() { + return ( +
    + {/* Hero Section */} +
    +
    +
    +
    +

    Open Pay

    +

    End financial opacity in government forever. A revolutionary transaction system that gives every taxpayer direct visibility into how their money is spent.

    +
    + + See Live Transactions + + + Explore Benefits + +
    +
    +
    +
    +
    LIVE
    +
    +
    +

    Department of Transportation

    +

    Transaction #TX-2023-06-15-001

    +
    +
    +

    $249,800

    +

    June 15, 2023

    +
    +
    +

    Highway Repair - Section 14A

    +
    +
    + + +
    + + 💬 18 comments + +
    +
    +
    +
    +
    +
    + + {/* Benefits Section */} +
    +
    +

    Why Open Pay is Indispensable

    + +
    +
    +
    ⚡
    +

    Eliminate Wasteful Spending

    +

    Research shows public scrutiny reduces unnecessary government spending by up to 18% while improving service quality. Open Pay provides the transparency needed to identify and eliminate waste.

    +
    + +
    +
    🛡️
    +

    Prevent Corruption Automatically

    +

    When every dollar is tracked publicly, corruption becomes nearly impossible. Open Pay's transaction verification system creates an environment where financial misconduct is immediately visible.

    +
    + +
    +
    📈
    +

    Restore Public Trust

    +

    In regions using similar systems, public trust in government increased by 41%. Open Pay bridges the gap between taxpayers and their government, creating unprecedented accountability.

    +
    +
    +
    +
    + + {/* Demo Section */} +
    +
    +
    +

    See It In Action

    +

    + Explore, comment on, and verify real government transactions in real-time. This is what true financial transparency looks like. +

    +
    + + +
    +
    + + {/* Implementation Section */} +
    +
    +
    +

    Implementation Without Disruption

    +

    + Open Pay can be implemented alongside existing financial systems with minimal operational changes, making the transition to transparency smooth and cost-effective. +

    +
    + +
    +
    +

    For Government Leaders

    +
      +
    • + ✓ + Showcase your commitment to transparency +
      • +
    • + ✓ + Reduce audit costs by up to 35% +
      • +
    • + ✓ + Improve public approval ratings +
      • +
    • + ✓ + Reduce administrative overhead +
      • +
    +
    + +
    +

    For Citizens

    +
      +
    • + ✓ + See exactly how your tax dollars are spent +
      • +
    • + ✓ + Provide direct feedback on government spending +
      • +
    • + ✓ + Hold elected officials accountable +
      • +
    • + ✓ + Participate in spending prioritization +
      • +
    +
    +
    +
    +
    + + {/* CTA Section */} +
    +
    +

    Ready for True Financial Transparency?

    +

    + Join the growing movement of governments and citizens embracing complete financial transparency. The future of public finance is open. +

    +
    + + Request Implementation Details + +
    +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/projects/governance/open-service/page.tsx b/app/projects/governance/open-service/page.tsx new file mode 100644 index 000000000..0f586fcb7 --- /dev/null +++ b/app/projects/governance/open-service/page.tsx @@ -0,0 +1,414 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; + +/** + * Open Service - Competitive government service marketplace + * Transforms public service delivery through competition and transparency + */ +export default function OpenService() { + return ( +
    + {/* Hero Section */} +
    +
    +
    +
    +

    Open Service

    +

    Revolutionize government services through competition and real-time feedback. Better services, lower costs, and total transparency.

    +
    + + Explore Marketplace + + + View Economic Impact + +
    +
    +
    +
    +
    +
    +
    +

    Waste Management Services

    +

    Contract Term: 2023-2026

    +
    + + Active + +
    +
    +
    +
    +
    + Provider Performance + 92% +
    +
    +
    +
    +
    +
    +
    + Citizen Satisfaction + 88% +
    +
    +
    +
    +
    +
    +
    + Cost Efficiency + 94% +
    +
    +
    +
    +
    +
    +
    + $2.3M annual cost +
    +
    + $420K savings vs. previous +
    +
    +
    +
    +
    +
    +
    +
    + + {/* Benefits Section */} +
    +
    +

    The Undeniable Power of Open Service

    + +
    +
    +
    💰
    +

    Save 15-32% on Government Services

    +

    Independent studies confirm that competitive bidding for government services reduces costs by 15-32% while maintaining or improving quality standards.

    +
    + +
    +
    ⚡
    +

    Accelerate Service Improvement

    +

    When providers compete and citizens rate services, quality improves 4x faster than traditional monopolistic government service delivery models.

    +
    + +
    +
    🔍
    +

    Full Contract Transparency

    +

    Every service contract, performance metric, and citizen feedback rating is publicly visible. No more backroom deals or unaccountable service providers.

    +
    +
    +
    +
    + + {/* How It Works Section */} +
    +
    +
    +

    How Open Service Works

    +

    + A revolutionary marketplace that transforms how government services are delivered to citizens. +

    +
    + +
    +
    +
    1
    +

    Service Definition

    +

    Government defines exact service requirements, quality standards, and budgets. Citizens can comment on and help refine these specifications.

    +
    + +
    +
    2
    +

    Competitive Bidding

    +

    Service providers—both private companies and public agencies—submit competitive bids to deliver services at the best possible value.

    +
    + +
    +
    3
    +

    Performance Tracking

    +

    All providers are measured against clear performance metrics in real-time. Citizens can view exactly how services are performing against targets.

    +
    + +
    +
    4
    +

    Citizen Feedback

    +

    Citizens rate and review services directly. Poor performers face contract termination, while high performers receive bonuses and contract extensions.

    +
    +
    +
    +
    + + {/* Marketplace Demo Section */} +
    +
    +
    +

    Service Marketplace

    +

    + In a full implementation, citizens would see all active service contracts with real-time performance data. +

    +
    + +
    +
    +
    +
    +

    Park Maintenance

    + + Excellent + +
    +

    Provider: GreenScape Solutions

    +
    +
    +
    +
    + Service Quality + 96% +
    +
    +
    +
    +
    +
    +
    + Response Time + 92% +
    +
    +
    +
    +
    +
    + Annual Contract: $875K + Savings: $130K +
    +
    + + View Contract Details → + +
    +
    +
    + +
    +
    +
    +

    Street Cleaning

    + + Good + +
    +

    Provider: CleanStreets Inc.

    +
    +
    +
    +
    + Service Quality + 84% +
    +
    +
    +
    +
    +
    +
    + Response Time + 79% +
    +
    +
    +
    +
    +
    + Annual Contract: $1.2M + Savings: $220K +
    +
    + + View Contract Details → + +
    +
    +
    + +
    +
    +
    +

    Public Transit

    + + Warning + +
    +

    Provider: Metro Systems LLC

    +
    +
    +
    +
    + Service Quality + 68% +
    +
    +
    +
    +
    +
    +
    + On-Time Performance + 72% +
    +
    +
    +
    +
    +
    + Annual Contract: $4.8M + Rebid Scheduled +
    +
    + + View Contract Details → + +
    +
    +
    +
    + +
    + + View All Service Contracts + + + + +
    +
    +
    + + {/* Case Studies Section */} +
    +
    +
    +

    Real-World Success Stories

    +

    + Communities that have implemented Open Service are seeing remarkable improvements in service quality and cost-effectiveness. +

    +
    + +
    +
    +

    Fairview County, USA

    +

    + After implementing Open Service for 12 municipal services, Fairview County reduced annual costs by $4.2 million (22%) while improving citizen satisfaction scores from 64% to 87%. Their most dramatic improvements came in waste management and road maintenance services. +

    +
    +
    + Cost Reduction + 22% +
    +
    +
    +
    +
    + Satisfaction Increase + +23% +
    +
    +
    +
    +
    +
    + +
    +

    East Harbor City

    +

    + Facing a budget crisis, East Harbor implemented Open Service across all public works functions. Within 18 months, they achieved $12.8 million in savings (31%), eliminated their budget deficit, and saw dramatic improvements in service quality as measured by independent auditors. +

    +
    +
    + Cost Reduction + 31% +
    +
    +
    +
    +
    + Service Quality Improvement + +47% +
    +
    +
    +
    +
    +
    +
    +
    +
    + + {/* FAQ Section */} +
    +
    +
    +

    Common Questions

    +

    + Answers to frequently asked questions about implementing Open Service +

    +
    + +
    +
    +

    What happens to government employees?

    +

    + Government employees are given the opportunity to form their own service entities and compete for contracts. Many cities find that employee-run organizations win a significant portion of contracts due to their institutional knowledge and dedication to their communities. +

    +
    + +
    +

    How is service quality maintained?

    +

    + Service quality typically improves under Open Service due to clear performance metrics, real-time citizen feedback, and competition between providers. Contracts include specific quality requirements with penalties for poor performance and bonuses for excellence. +

    +
    + +
    +

    What services can be included?

    +

    + Most government services can be delivered through Open Service, including waste management, park maintenance, road repair, IT services, facility management, fleet maintenance, customer service, and many others. Core policy functions generally remain with government officials. +

    +
    + +
    +

    How long does implementation take?

    +

    + Most communities implement Open Service in phases, typically starting with 3-5 services and expanding over time. Initial implementation takes 3-6 months, with full implementation across all eligible services usually completed within 18-24 months. +

    +
    +
    +
    +
    + + {/* CTA Section */} +
    +
    +

    Transform Your Community's Services

    +

    + Join the growing movement of cities and counties achieving better services at lower costs through Open Service. Your citizens deserve nothing less. +

    +
    + + Request Implementation Details + +
    +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/projects/governance/open-vote/page.tsx b/app/projects/governance/open-vote/page.tsx new file mode 100644 index 000000000..3aea5499d --- /dev/null +++ b/app/projects/governance/open-vote/page.tsx @@ -0,0 +1,419 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; + +/** + * Open Vote - Direct citizen participation in democracy + * Transparent and secure voting for modern digital governance + */ +export default function OpenVote() { + return ( +
    + {/* Hero Section */} +
    +
    +
    +
    +

    Open Vote

    +

    Democracy reimagined. Secure, transparent, and auditable voting for the digital age. Every voice heard, every vote counted.

    +
    + + View Active Votes + + + Explore Benefits + +
    +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +

    Community Budget Allocation

    +

    Active until: June 15, 2023

    +
    +
    + + Active + +
    +
    +
    +

    How should we allocate the $2.5M community improvement budget?

    +
    +
    +
    + Park Renovations + 42% +
    +
    +
    +
    +
    +
    +
    + Road Improvements + 28% +
    +
    +
    +
    +
    +
    +
    + Community Center + 18% +
    +
    +
    +
    +
    +
    +
    + Public Safety + 12% +
    +
    +
    +
    +
    +
    +
    +
    + 4,218 votes cast +
    + + Cast Your Vote → + +
    +
    +
    +
    +
    +
    +
    + + {/* Benefits Section */} +
    +
    +

    Why Open Vote Transforms Democracy

    + +
    +
    +
    🔐
    +

    Uncompromising Security

    +

    Military-grade encryption, blockchain verification, and decentralized storage ensure every vote is secure, tamper-proof, and auditable by independent validators.

    +
    + +
    +
    👥
    +

    Universal Accessibility

    +

    Multiple voting options (mobile, web, kiosk, paper) ensure every citizen can participate, regardless of technical ability, physical limitations, or location.

    +
    + +
    +
    ⚡
    +

    Unprecedented Participation

    +

    Communities using Open Vote experience 3-5x higher participation rates in local decision-making, creating more representative outcomes and stronger community buy-in.

    +
    +
    +
    +
    + + {/* How It Works Section */} +
    +
    +
    +

    How Open Vote Works

    +

    + A secure, transparent voting platform for anything from community budgets to major policy decisions. +

    +
    + +
    +
    +
    1
    +

    Issue Submission

    +

    Officials or citizens (through petition) can create proposals for community vote, complete with clear options and supporting documentation.

    +
    + +
    +
    2
    +

    Secure Authentication

    +

    Voters verify their identity through secure multi-factor authentication, with privacy-preserving protocols that separate identity from votes.

    +
    + +
    +
    3
    +

    Vote Casting

    +

    Citizens vote through their preferred method (app, web, kiosk), receiving a unique receipt code to verify their vote was properly recorded.

    +
    + +
    +
    4
    +

    Transparent Results

    +

    Results are tallied in real-time and cryptographically verified, with full audit trails available to independent validators and the public.

    +
    +
    +
    +
    + + {/* Active Votes Section */} +
    +
    +
    +

    Active Votes

    +

    + In a full implementation, citizens would see all current voting opportunities, with real-time results. +

    +
    + +
    +
    +
    +
    +

    Community Budget Allocation

    + + Active + +
    +

    Ends in: 3 days, 8 hours

    +
    +
    +

    How should we allocate the $2.5M community improvement budget?

    +
    +
    +
    + Park Renovations + 42% +
    +
    +
    +
    +
    +
    +
    + Road Improvements + 28% +
    +
    +
    +
    +
    +
    +
    + 4,218 votes cast + 7,500 eligible voters +
    +
    + + Cast Your Vote → + +
    +
    +
    + +
    +
    +
    +

    Downtown Development Plan

    + + Active + +
    +

    Ends in: 5 days, 12 hours

    +
    +
    +

    Which development option should be pursued for the vacant downtown lot?

    +
    +
    +
    + Mixed-use with affordable housing + 57% +
    +
    +
    +
    +
    +
    +
    + Commercial development + 26% +
    +
    +
    +
    +
    +
    +
    + Public plaza and park + 17% +
    +
    +
    +
    +
    +
    +
    + 3,542 votes cast + 12,000 eligible voters +
    +
    + + Cast Your Vote → + +
    +
    +
    +
    + +
    + + View All Active Votes + + + + +
    +
    +
    + + {/* Case Studies Section */} +
    +
    +
    +

    Success Stories

    +

    + Communities that have implemented Open Vote are experiencing unprecedented levels of civic engagement. +

    +
    + +
    +
    +

    Westlake City

    +

    + After implementing Open Vote for local decisions, Westlake City saw citizen participation increase from 8% to 42% within six months. The city successfully resolved long-standing disputes about infrastructure priorities and passed their first balanced budget in a decade with 78% approval. +

    +
    +
    + Participation Increase + +425% +
    +
    +
    +
    +
    + Policy Implementation Speed + 3.2× faster +
    +
    +
    +
    +
    +
    + +
    +

    Riverside County

    +

    + Riverside County implemented Open Vote for their participatory budgeting process, allowing citizens to directly allocate 15% of discretionary spending. The result was a 62% reduction in spending disputes, unprecedented unity across political parties, and measurably higher satisfaction with county services. +

    +
    +
    + Budget Dispute Reduction + -62% +
    +
    +
    +
    +
    + Citizen Satisfaction + +47% +
    +
    +
    +
    +
    +
    +
    +
    +
    + + {/* Security Section */} +
    +
    +
    +

    Uncompromising Security

    +

    + Open Vote meets the highest security standards, exceeding requirements for national elections. +

    +
    + +
    +
    +
    🔒
    +
    +

    End-to-End Encryption

    +

    + Military-grade encryption protects every vote from casting through counting. Even system administrators cannot view individual votes or manipulate results. +

    +
    +
    + +
    +
    🔗
    +
    +

    Blockchain Verification

    +

    + Every vote is recorded on an immutable blockchain, creating a permanent, tamper-proof record that can be independently verified without compromising voter privacy. +

    +
    +
    + +
    +
    👁️
    +
    +

    Independent Auditing

    +

    + Multiple independent auditors have access to monitor the voting system in real-time, ensuring compliance with security protocols and verifying accurate vote tallying. +

    +
    +
    + +
    +
    🔄
    +
    +

    Voter Verification

    +

    + Each voter can verify their vote was correctly recorded and counted using a unique receipt code, without revealing their voting choices to others. +

    +
    +
    +
    +
    +
    + + {/* CTA Section */} +
    +
    +

    Transform Your Community's Decision-Making

    +

    + Join the growing movement of communities embracing direct democracy through secure digital voting. When citizens participate, everyone wins. +

    +
    + + Request Implementation Details + +
    +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/projects/governance/page.tsx b/app/projects/governance/page.tsx new file mode 100644 index 000000000..6fc4a5f89 --- /dev/null +++ b/app/projects/governance/page.tsx @@ -0,0 +1,46 @@ +'use client'; + +import React from 'react'; +import './styles.css'; + +// Import all components +import HeroSection from './components/HeroSection'; +import CoreComponentsSection from './components/CoreComponentsSection'; +import ApplicationsSection from './components/ApplicationsSection'; +import WhitepaperSection from './components/WhitepaperSection'; +import FAQSection from './components/FAQSection'; +import CTASection from './components/CTASection'; + +/** + * Solon - Decentralized Direct Democracy Governance Platform Page + * + * This is the main page component for the Solon governance platform. + * It follows the bot page structure for consistency with other Botsmann offerings. + * + * @module SolonGovernancePage + */ +export default function GovernancePage() { + return ( +
    +
    + {/* Hero Section */} + + + {/* Core Components Section */} + + + {/* Application Areas Section */} + + + {/* Whitepaper Section */} + + + {/* FAQ Section */} + + + {/* Call-to-Action Section */} + +
    +
    + ); +} diff --git a/app/projects/governance/portal/components/ActionCenter.tsx b/app/projects/governance/portal/components/ActionCenter.tsx new file mode 100644 index 000000000..1133bd434 --- /dev/null +++ b/app/projects/governance/portal/components/ActionCenter.tsx @@ -0,0 +1,94 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; + +interface PendingAction { + id: string; + type: 'vote' | 'review' | 'delegate'; + title: string; + description: string; + deadline: string; + taxImpact: string; + path: string; +} + +interface ActionCenterProps { + pendingActions: PendingAction[]; +} + +/** + * Displays pending actions requiring user attention + */ +const ActionCenter: React.FC = ({ pendingActions }) => { + return ( +
    +

    Action Center

    +

    + Review and act on pending votes, proposals, and delegations that impact your tax dollars. +

    + +
    + {pendingActions.map((action) => ( +
    +
    +
    +
    + + {action.type === 'vote' ? '🗳️' : + action.type === 'review' ? '⚖️' : + '👥'} + +
    +
    +

    {action.title}

    +

    {action.description}

    +
    + + + + + Deadline: {action.deadline} + + + {action.taxImpact} + +
    +
    +
    + + Take Action + +
    +
    + ))} +
    + +
    +

    Suggestion Box

    +

    + Have an idea for how taxes should be spent in your community? Submit a suggestion for consideration. +

    +
    + + +
    +
    +
    + ); +}; + +export default ActionCenter; \ No newline at end of file diff --git a/app/projects/governance/portal/components/ActivityFeed.tsx b/app/projects/governance/portal/components/ActivityFeed.tsx new file mode 100644 index 000000000..8580958e4 --- /dev/null +++ b/app/projects/governance/portal/components/ActivityFeed.tsx @@ -0,0 +1,90 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; + +interface Activity { + id: string; + type: 'transaction' | 'law' | 'service' | 'vote'; + action: string; + item: string; + time: string; + path: string; + taxImpact: string; +} + +interface ActivityFeedProps { + activities: Activity[]; +} + +/** + * Displays a feed of recent user activities across Solon components + */ +const ActivityFeed: React.FC = ({ activities }) => { + return ( +
    +

    Recent Activity

    +
    +
      + {activities.map((activity, activityIdx) => ( +
    • +
      + {activityIdx !== activities.length - 1 ? ( +
      +
      • + ))} +
    +
    +
    + + View all activity + + + + +
    +
    + ); +}; + +export default ActivityFeed; \ No newline at end of file diff --git a/app/projects/governance/portal/components/ComponentCards.tsx b/app/projects/governance/portal/components/ComponentCards.tsx new file mode 100644 index 000000000..22044ad9f --- /dev/null +++ b/app/projects/governance/portal/components/ComponentCards.tsx @@ -0,0 +1,72 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; + +interface ComponentCard { + id: string; + title: string; + description: string; + icon: string; + color: string; + path: string; +} + +interface ComponentCardsProps { + cards: ComponentCard[]; +} + +/** + * Displays a grid of cards for navigating to different Solon components + */ +const ComponentCards: React.FC = ({ cards }) => { + // Helper for dynamic color classes + const getColorClasses = (color: string) => { + switch (color) { + case 'blue': + return 'bg-blue-50 text-blue-700 border-blue-200'; + case 'amber': + return 'bg-amber-50 text-amber-700 border-amber-200'; + case 'green': + return 'bg-green-50 text-green-700 border-green-200'; + case 'purple': + return 'bg-purple-50 text-purple-700 border-purple-200'; + default: + return 'bg-gray-50 text-gray-700 border-gray-200'; + } + }; + + return ( +
    + {cards.map((card) => ( + +
    +
    +

    {card.title}

    + {card.icon} +
    +
    +
    +

    {card.description}

    +
    + + Explore + + + + +
    +
    + + ))} +
    + ); +}; + +export default ComponentCards; \ No newline at end of file diff --git a/app/projects/governance/portal/components/ComponentPreview.tsx b/app/projects/governance/portal/components/ComponentPreview.tsx new file mode 100644 index 000000000..e4e27e32f --- /dev/null +++ b/app/projects/governance/portal/components/ComponentPreview.tsx @@ -0,0 +1,80 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; + +interface ComponentPreviewProps { + icon: string; + title: string; + description: string; + ctaText: string; + path: string; + color: string; +} + +/** + * Preview component for Solon modules with a CTA button + */ +const ComponentPreview: React.FC = ({ + icon, + title, + description, + ctaText, + path, + color, +}) => { + // Get color classes based on component + const getColorClasses = () => { + switch (color) { + case 'amber': + return { + bg: 'bg-amber-100', + text: 'text-amber-600', + button: 'bg-amber-600 hover:bg-amber-700', + }; + case 'green': + return { + bg: 'bg-green-100', + text: 'text-green-600', + button: 'bg-green-600 hover:bg-green-700', + }; + case 'purple': + return { + bg: 'bg-purple-100', + text: 'text-purple-600', + button: 'bg-purple-600 hover:bg-purple-700', + }; + default: + return { + bg: 'bg-blue-100', + text: 'text-blue-600', + button: 'bg-blue-600 hover:bg-blue-700', + }; + } + }; + + const colorClasses = getColorClasses(); + + return ( +
    +
    + {icon} +
    +

    {title}

    +

    + {description} +

    + + {ctaText} + + + + +
    + ); +}; + +export default ComponentPreview; \ No newline at end of file diff --git a/app/projects/governance/portal/components/MetricsGrid.tsx b/app/projects/governance/portal/components/MetricsGrid.tsx new file mode 100644 index 000000000..eb0db1253 --- /dev/null +++ b/app/projects/governance/portal/components/MetricsGrid.tsx @@ -0,0 +1,57 @@ +'use client'; + +import React from 'react'; + +interface Metric { + label: string; + value: string; + change: string; + trend: 'up' | 'down' | 'neutral'; + tooltip: string; +} + +interface MetricsGridProps { + metrics: Metric[]; +} + +/** + * Displays a grid of metrics with values, trends, and tooltips + */ +const MetricsGrid: React.FC = ({ metrics }) => { + return ( +
    + {metrics.map((metric) => ( +
    +

    {metric.label}

    +
    +

    {metric.value}

    +

    + {metric.change} + {metric.trend === 'up' && ( + + + + )} + {metric.trend === 'down' && ( + + + + )} +

    +
    + {/* Tooltip */} + {metric.tooltip && ( +
    + {metric.tooltip} +
    + )} +
    + ))} +
    + ); +}; + +export default MetricsGrid; \ No newline at end of file diff --git a/app/projects/governance/portal/components/TabsContainer.tsx b/app/projects/governance/portal/components/TabsContainer.tsx new file mode 100644 index 000000000..046bab047 --- /dev/null +++ b/app/projects/governance/portal/components/TabsContainer.tsx @@ -0,0 +1,80 @@ +'use client'; + +import React, { ReactNode } from 'react'; + +interface Tab { + id: string; + label: string; +} + +interface TabsContainerProps { + tabs: Tab[]; + activeTab: string; + onTabChange: (tabId: string) => void; + showFilter: boolean; + filter?: string; + onFilterChange?: (filter: string) => void; + children: ReactNode; +} + +/** + * Container component for tabs with optional filter dropdown + */ +const TabsContainer: React.FC = ({ + tabs, + activeTab, + onTabChange, + showFilter, + filter = 'all', + onFilterChange, + children, +}) => { + return ( +
    +
    +
    +
    + {tabs.map((tab) => ( + + ))} +
    + + {showFilter && onFilterChange && ( +
    + +
    + )} +
    +
    + + {/* Tab Content */} +
    + {children} +
    +
    + ); +}; + +export default TabsContainer; \ No newline at end of file diff --git a/app/projects/governance/portal/components/TaxFlow.tsx b/app/projects/governance/portal/components/TaxFlow.tsx new file mode 100644 index 000000000..3608e382c --- /dev/null +++ b/app/projects/governance/portal/components/TaxFlow.tsx @@ -0,0 +1,131 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; + +interface TaxCategory { + category: string; + percentage: number; + amount: string; +} + +interface TaxFundedProject { + category: string; + title: string; + impact: string; + contribution: string; + total: string; + link: string; +} + +interface TaxFlowProps { + taxAllocation: TaxCategory[]; + taxFundedProjects: TaxFundedProject[]; + filter: string; + onFilterChange: (filter: string) => void; +} + +/** + * Displays tax allocation breakdown and tax-funded projects + */ +const TaxFlow: React.FC = ({ + taxAllocation, + taxFundedProjects, + filter, + onFilterChange +}) => { + return ( +
    +
    +
    +

    Your Tax Flow

    +

    See how your $3,200 in annual taxes is allocated across government services

    +
    +
    +

    Community Impact: 15,000+ citizens served

    +
    +
    + + {/* Tax allocation breakdown */} +
    +

    Tax Allocation Breakdown

    +
    + {taxAllocation.map((category) => ( +
    +
    +
    + {category.category} + ({category.percentage}%) +
    + {category.amount} +
    +
    +
    +
    +
    + ))} +
    +
    +

    Note: Visualization represents FY 2023-2024 tax allocations. Future visualizations will include interactive Sankey diagrams.

    +
    +
    + + {/* Recent tax-funded projects */} +
    +
    +

    Recent Tax-Funded Projects

    + +
    +
    +
    + {taxFundedProjects.map((project, index) => ( +
    +
    + + {project.category} + + Your contribution: {project.contribution} +
    +
    {project.title}
    +

    {project.impact}

    +
    + Total: {project.total} + + View Details + +
    +
    + ))} +
    +
    +
    +
    + ); +}; + +export default TaxFlow; \ No newline at end of file diff --git a/app/projects/governance/portal/page.tsx b/app/projects/governance/portal/page.tsx new file mode 100644 index 000000000..0d2392e9c --- /dev/null +++ b/app/projects/governance/portal/page.tsx @@ -0,0 +1,450 @@ +'use client'; + +import React, { useState } from 'react'; +import DashboardTransactionDemo from '../components/DashboardTransactionDemo'; +import MetricsGrid from './components/MetricsGrid'; +import ComponentCards from './components/ComponentCards'; +import ActivityFeed from './components/ActivityFeed'; +import TaxFlow from './components/TaxFlow'; +import ActionCenter from './components/ActionCenter'; +import TabsContainer from './components/TabsContainer'; +import ComponentPreview from './components/ComponentPreview'; +import Link from 'next/link'; + +/** + * Portal - Central hub for citizen interaction with Solon + * Provides access to all four key components with interactive features + * and tax-related transparency + */ +export default function Portal() { + const [activeTab, setActiveTab] = useState('overview'); + const [filter, setFilter] = useState('all'); + + // Enhanced metrics with tax-focused data + const metrics = [ + { + label: 'Annual Tax Contribution', + value: '$8,942.58', + change: '+$412.12', + trend: 'up' as const, + tooltip: 'Total tax payments for the current fiscal year' + }, + { + label: 'Tax Allocation Efficiency', + value: '94.3%', + change: '+2.1%', + trend: 'up' as const, + tooltip: 'Percentage of your tax dollars allocated to public goods' + }, + { + label: 'Community Rank', + value: '241', + change: 'of 5280', + trend: 'neutral' as const, + tooltip: 'Your ranking in the Solon community based on contribution and participation' + }, + { + label: 'Participation Score', + value: '78.2', + change: '+12.4', + trend: 'up' as const, + tooltip: 'Score based on voting participation and community engagement' + }, + { + label: 'Tax Return Rate', + value: '4.1%', + change: '-0.3%', + trend: 'down' as const, + tooltip: 'Percentage of taxes returned through efficiency gains' + }, + { + label: 'Budget Influence', + value: 'Medium', + change: '+1 tier', + trend: 'up' as const, + tooltip: 'Your level of influence on budget allocation based on participation' + } + ]; + + // Tax allocation breakdown for visualization + const taxAllocation = [ + { category: 'Infrastructure', percentage: 32, amount: '$1,024' }, + { category: 'Education', percentage: 28, amount: '$896' }, + { category: 'Healthcare', percentage: 18, amount: '$576' }, + { category: 'Public Safety', percentage: 12, amount: '$384' }, + { category: 'Recreation', percentage: 5, amount: '$160' }, + { category: 'Administration', percentage: 5, amount: '$160' }, + ]; + + // Recent activity for the activity feed - using the interface defined in ActivityFeed.tsx + const recentActivity = [ + { + id: '1', + type: 'transaction' as 'transaction' | 'law' | 'service' | 'vote', + action: 'commented on', + item: 'Highway Repair - Section 14A', + time: '2 hours ago', + path: '/projects/governance/open-pay', + taxImpact: 'Your contribution: $4.12' + }, + { + id: '2', + type: 'law' as 'transaction' | 'law' | 'service' | 'vote', + action: 'reviewed', + item: 'Public Parks Expansion Act', + time: '1 day ago', + path: '/projects/governance/open-law', + taxImpact: 'Affects $160 of your taxes annually' + }, + { + id: '3', + type: 'service' as 'transaction' | 'law' | 'service' | 'vote', + action: 'rated', + item: 'Waste Management Services', + time: '3 days ago', + path: '/projects/governance/open-service', + taxImpact: 'Your contribution: $86.40 annually' + }, + { + id: '4', + type: 'vote' as 'transaction' | 'law' | 'service' | 'vote', + action: 'voted on', + item: 'City Budget Allocation 2023', + time: '1 week ago', + path: '/projects/governance/open-vote', + taxImpact: 'Controls 100% of your tax allocation' + } + ]; + + // Pending actions for the action center - using the interface defined in ActionCenter.tsx + const pendingActions = [ + { + id: 'pa1', + type: 'vote' as 'vote' | 'review' | 'delegate', + title: 'Transportation Infrastructure Bond', + description: 'Vote on $12M bond for road improvements', + deadline: '3 days', + taxImpact: 'Est. impact: +$28/year for 5 years', + path: '/projects/governance/open-vote' + }, + { + id: 'pa2', + type: 'review' as 'vote' | 'review' | 'delegate', + title: 'School Budget Increase Proposal', + description: 'Review and comment on 8% budget increase', + deadline: '5 days', + taxImpact: 'Est. impact: +$45/year ongoing', + path: '/projects/governance/open-law' + }, + { + id: 'pa3', + type: 'delegate' as 'vote' | 'review' | 'delegate', + title: 'Public Safety Fund Allocation', + description: 'Delegate your vote or vote directly', + deadline: '1 week', + taxImpact: 'Affects $384 of your annual taxes', + path: '/projects/governance/open-vote' + } + ]; + + // Tax-funded projects for tax flow tab + const taxFundedProjects = [ + { + category: 'Infrastructure', + title: 'Highway Repair - Section 14A', + impact: 'Reduced travel time by 12 minutes for 15,000 daily commuters', + contribution: '$4.12', + total: '$249,800', + link: '/projects/governance/open-pay' + }, + { + category: 'Recreation', + title: 'Community Park Maintenance', + impact: 'Benefits 1,200+ weekly park visitors and ensures safe equipment', + contribution: '$0.94', + total: '$56,750', + link: '/projects/governance/open-pay' + }, + { + category: 'Education', + title: 'School District Technology Upgrade', + impact: 'Upgraded technology for 3,500 students across 8 schools', + contribution: '$20.63', + total: '$1,250,000', + link: '/projects/governance/open-pay' + }, + { + category: 'Public Safety', + title: 'Emergency Response Equipment', + impact: 'Reduced response times by 1.8 minutes in emergency situations', + contribution: '$8.22', + total: '$498,600', + link: '/projects/governance/open-pay' + } + ]; + + // Component cards for navigation + const componentCards = [ + { + id: 'payments', + title: 'Open Pay', + description: 'Track, verify, and engage with government spending in real-time.', + icon: '💸', + color: 'blue', + path: '/projects/governance/open-pay' + }, + { + id: 'laws', + title: 'Open Law', + description: 'Review, comment on, and track the progress of legislation.', + icon: '⚖️', + color: 'amber', + path: '/projects/governance/open-law' + }, + { + id: 'services', + title: 'Open Service', + description: 'Rate service providers, suggest improvements, and monitor contracts.', + icon: '🛠️', + color: 'green', + path: '/projects/governance/open-service' + }, + { + id: 'voting', + title: 'Open Vote', + description: 'Vote directly on issues that matter and see results in real-time.', + icon: '🗳️', + color: 'purple', + path: '/projects/governance/open-vote' + }, + { + id: 'citizen', + title: 'My Citizen Profile', + description: 'View and manage your citizen profile, tax contributions, and government benefits.', + icon: '👤', + color: 'blue', + path: '/projects/governance/citizen' + }, + { + id: 'employees', + title: 'Employee Profiles', + description: 'Explore government employees, their roles, and transparency scores.', + icon: '👥', + color: 'green', + path: '/projects/governance/employees' + }, + { + id: 'agencies', + title: 'Agency Directory', + description: 'View government agencies, their budgets, and transparency metrics.', + icon: '🏛️', + color: 'amber', + path: '/projects/governance/agencies' + } + ]; + + // Tab definitions + const tabs = [ + { id: 'overview', label: 'Recent Activity' }, + { id: 'transactions', label: 'Open Pay' }, + { id: 'tax-flow', label: 'Tax Flow' }, + { id: 'action-center', label: 'Action Center' }, + { id: 'laws', label: 'Open Law' }, + { id: 'services', label: 'Open Service' }, + { id: 'voting', label: 'Open Vote' }, + ]; + + // Component previews + const openLawPreview = { + icon: '⚖️', + title: 'Open Law Platform', + description: 'Track legislation, comment on proposals, and see the impact of laws in your community and on your taxes.', + ctaText: 'Go to Open Law', + path: '/projects/governance/open-law', + color: 'amber' + }; + + const openServePreview = { + icon: '🛠️', + title: 'Public Service Marketplace', + description: 'Rate service providers, suggest improvements, and ensure your tax dollars fund quality public services.', + ctaText: 'Explore Services', + path: '/projects/governance/open-service', + color: 'green' + }; + + const demosPreview = { + icon: '🗳️', + title: 'Open Vote Platform', + description: 'Vote directly on issues that matter in your community and see the results and implementation in real-time.', + ctaText: 'Participate Now', + path: '/projects/governance/open-vote', + color: 'purple' + }; + + // High-value citizen information + const citizenData = { + name: "Alex Morgan", + id: "CIT-10045876", + district: "North Central", + taxContribution: "$15,500", + lastActivity: "Voted on School Budget Proposal (3 days ago)" + }; + + return ( +
    + {/* Portal Header */} +
    +
    +
    +
    +

    Citizen Portal

    +

    + Your personal hub for transparent governance and civic participation +

    +
    +
    + + +
    +
    +
    +
    + + {/* Main Portal Content */} +
    + {/* Citizen Welcome Banner */} +
    +
    +
    +
    +
    +
    + AM +
    +
    +

    + Welcome, {citizenData.name} +

    +
    +
    + Citizen ID: {citizenData.id} + • + District: {citizenData.district} +
    +
    +
    +
    +
    +
    + + View My Profile + +
    +
    +
    +
    +
    +
    +
    Tax Contribution
    +
    {citizenData.taxContribution}
    +
    + + View Tax History + +
    +
    +
    +
    Agency Distribution
    +
    5 Agencies
    +
    + + Set Advisory Preferences + +
    +
    +
    +
    Active Benefits
    +
    3 Benefits
    +
    + + View All Benefits + +
    +
    +
    +
    Last Activity
    +
    {citizenData.lastActivity}
    +
    + + View Activity + +
    +
    +
    +
    +
    + + {/* Portal Metrics */} + + + {/* Component Navigation Cards */} + + + {/* Portal Tabs with Filter */} + + {/* Overview Tab - Activity Feed */} + {activeTab === 'overview' && } + + {/* Transactions Tab */} + {activeTab === 'transactions' && } + + {/* Tax Flow Tab */} + {activeTab === 'tax-flow' && ( + + )} + + {/* Action Center Tab */} + {activeTab === 'action-center' && } + + {/* Open Laws Tab */} + {activeTab === 'laws' && } + + {/* Open Serve Tab */} + {activeTab === 'services' && } + + {/* Demos Tab */} + {activeTab === 'voting' && } + +
    + + {/* Portal Footer */} +
    +
    +

    + Solon Governance Platform - Empowering citizens through tax transparency and participation +

    +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/projects/governance/styles.css b/app/projects/governance/styles.css new file mode 100644 index 000000000..e62fbe786 --- /dev/null +++ b/app/projects/governance/styles.css @@ -0,0 +1,105 @@ +/* Solon Governance Project Custom Styles */ + +/* General styles */ +.governance-navigation { + background-color: #ffffff; + border-bottom: 1px solid #e5e7eb; +} + +/* Button styles */ +.btn-primary { + @apply inline-block px-6 py-3 bg-green-600 text-white font-medium rounded-lg hover:bg-green-700 transition-colors; +} + +.btn-secondary { + @apply inline-block px-6 py-3 bg-white text-green-600 font-medium rounded-lg border border-green-600 hover:bg-green-50 transition-colors; +} + +.btn-tertiary { + @apply inline-block px-4 py-2 bg-gray-50 text-gray-700 font-medium rounded-lg hover:bg-gray-100 transition-colors; +} + +/* Feature card styles */ +.feature-card { + @apply bg-white p-6 rounded-lg border border-gray-200 shadow-sm transition-all duration-300; +} + +.feature-card:hover { + @apply shadow-md border-green-200; +} + +/* Gradient backgrounds */ +.bg-governance-gradient { + background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%); +} + +/* Logo text */ +.logo-text { + @apply font-bold text-green-800; +} + +/* Remove scrollbar for navigation overflow */ +.no-scrollbar::-webkit-scrollbar { + display: none; +} + +.no-scrollbar { + -ms-overflow-style: none; + scrollbar-width: none; +} + +/* Fade-in animation */ +@keyframes fadeIn { + from { opacity: 0; transform: translateY(10px); } + to { opacity: 1; transform: translateY(0); } +} + +.animate-fadeIn { + animation: fadeIn 0.5s ease-out forwards; +} + +/* Solon Governance - Global Styles */ + +/* General styles */ +.governance-container { + max-width: 1200px; + margin: 0 auto; + padding: 0 1.5rem; +} + +/* Timeline specific styles */ +.roadmap-milestone { + transition: transform 0.3s ease, box-shadow 0.3s ease; +} + +.roadmap-milestone:hover { + transform: translateY(-4px); + box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); +} + +.timeline-icon { + display: flex; + align-items: center; + justify-content: center; + width: 3rem; + height: 3rem; + background-color: #dcfce7; + border-radius: 50%; + font-size: 1.25rem; +} + +/* Vision cards interaction */ +.vision-card { + transition: transform 0.3s ease, box-shadow 0.3s ease; +} + +.vision-card:hover { + transform: translateY(-5px); + box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); +} + +/* Ensure focus states are visible for accessibility */ +:focus { + outline: 2px solid #16a34a; + outline-offset: 2px; +} \ No newline at end of file diff --git a/app/projects/governance/transparency/page.tsx b/app/projects/governance/transparency/page.tsx new file mode 100644 index 000000000..0766b8224 --- /dev/null +++ b/app/projects/governance/transparency/page.tsx @@ -0,0 +1,128 @@ +'use client'; + +import React, { useState } from 'react'; +import { TransactionWithTraceability } from '../components/TransactionWithTraceability'; +import AgencyProfile from '../components/AgencyProfile'; +import CitizenProfile from '../components/CitizenProfile'; +import sampleData from '../data/sampleData'; + +const TransparencyDemoPage = () => { + const [activeDemo, setActiveDemo] = useState<'transaction' | 'agency' | 'citizen'>('transaction'); + + return ( +
    + {/* Hero Section */} +
    +
    +

    + Government Transparency Suite +

    +

    + Explore the tools making government more transparent, accountable, and citizen-centric. + See how citizens can track their contributions, how agencies report their operations, + and how transactions are linked to enabling legislation. +

    +
    +
    +
    + + + +
    +
    +
    +
    +
    + + {/* Content */} +
    + {/* Feature Description */} +
    +
    + {activeDemo === 'transaction' && ( +
    +

    Enhanced Transaction Traceability

    +

    + See how every government expenditure is linked to the laws that enabled it, + key performance indicators (KPIs), complete documentation, and a timeline showing + the entire process from approval to completion. Citizens can comment, like, or + raise concerns about any transaction. +

    +
    + )} + + {activeDemo === 'agency' && ( +
    +

    Agency Transparency Profile

    +

    + Comprehensive view of a government agency's operations, including budget allocation, + spending, key metrics, regulations, team members with transparency scores, and direct + citizen impact. This complete picture helps citizens understand what agencies do and + how effectively they serve the public. +

    +
    + )} + + {activeDemo === 'citizen' && ( +
    +

    Citizen Contribution Tracking

    +

    + Citizens can see exactly how their tax contributions are distributed across different + government agencies, set advisory preferences for future distributions, track benefits + they receive, and view their participation in governance. This creates a personalized + view of each citizen's relationship with their government. +

    +
    + )} +
    +
    + + {/* Component Demo */} + {activeDemo === 'transaction' && ( +
    +
    + +
    +
    + )} + + {activeDemo === 'agency' && ( + + )} + + {activeDemo === 'citizen' && ( + + )} +
    +
    + ); +}; + +export default TransparencyDemoPage; \ No newline at end of file diff --git a/app/projects/governance/whitepaper/page.tsx b/app/projects/governance/whitepaper/page.tsx new file mode 100644 index 000000000..1790453a8 --- /dev/null +++ b/app/projects/governance/whitepaper/page.tsx @@ -0,0 +1,179 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import DetailedComponentsNav from '../components/DetailedComponentsNav'; + +/** + * Solon Whitepaper Page + * + * This page presents the full whitepaper for the Solon governance platform, + * including all details about its theoretical foundations, technical implementation, + * and potential impact. + */ +export default function WhitepaperPage() { + return ( +
    + {/* Navigation Component */} + + +
    +
    +

    Solon Whitepaper

    +

    + A Comprehensive Framework for Transparent, Decentralized Governance +

    +
    + + +
    +
    + + {/* Table of Contents */} + + + {/* Executive Summary */} +
    +

    Executive Summary

    +

    + Solon is a comprehensive governance platform designed to transform how citizens interact with governments + and public institutions. Building on principles of radical transparency, direct citizen participation, + and market-based efficiency, Solon offers a practical framework for implementing next-generation governance + systems that address the fundamental challenges facing democracies today. +

    +

    + This whitepaper presents the technical architecture, theoretical foundations, and practical implementation + strategy for Solon. Unlike theoretical governance models, Solon is designed for real-world adoption with + clear migration paths from existing systems, pragmatic compromise mechanisms, and scalable components that + can be implemented individually or as a complete solution. +

    +

    + The platform is built around four core components that work together to create a cohesive governance ecosystem: +

    +
      +
    • Transparent Transaction System - A blockchain-based platform that makes all government financial transactions visible, immutable, and traceable.
      • +
    • Law Transparency Framework - A system that ensures all laws and regulations have clear purposes, measurable outcomes, and automatic review triggers.
      • +
    • Government Function Marketplace - A competitive marketplace for government services that prioritizes efficiency and innovation.
      • +
    • Direct Democracy Voting System - A secure digital platform enabling citizens to directly participate in decision-making at all levels of government.
      • +
    +

    + Through case studies and real-world examples, this whitepaper demonstrates how Solon can reduce corruption, increase government efficiency, rebuild citizen trust, and create more responsive public institutions. +

    +
    + + {/* Introduction */} +
    +

    Introduction

    +

    + Democracies worldwide face declining citizen trust, increasing corruption, and governance systems that have + failed to leverage modern technology to improve transparency and participation. While technological + advancements have transformed virtually every aspect of human society, governance structures remain largely + unchanged from those developed centuries ago. +

    +

    + Solon addresses these challenges by reimagining governance for the digital age. Named after the ancient + Athenian lawgiver and reformer who laid the foundations for Athenian democracy, our platform combines + cutting-edge technology with time-tested democratic principles to create a governance framework that is + more transparent, efficient, and responsive to citizen needs. +

    +
    +

    Core Problems Addressed

    +
      +
    • Opacity in Government Operations - Citizens cannot easily access information about how their tax money is spent or how decisions are made.
      • +
    • Limited Accountability - Laws and regulations lack clear success metrics or review mechanisms.
      • +
    • Inefficient Service Delivery - Government monopolies on services lead to high costs and low innovation.
      • +
    • Minimal Citizen Participation - Citizens have few opportunities for meaningful input beyond occasional elections.
      • +
    +
    +

    + This whitepaper presents not just a theoretical framework, but a practical roadmap for implementation, + with clear examples of how each component can be adapted to different contexts and governance levels from + local to national. It draws on real-world examples, case studies, and evidence-based research to demonstrate + the feasibility and impact of the Solon approach. +

    +
    + + {/* More sections would continue here */} + {/* Theoretical Foundation */} +
    +

    Theoretical Foundation

    +

    + Solon's design is grounded in several theoretical frameworks and principles that inform its architecture and functionality. +

    + +

    Principles of Radical Transparency

    +

    + At its core, Solon embraces the principle that in a democracy, citizens have a fundamental right to know how their government operates, how decisions are made, and how public resources are allocated. This transparency is not just about passive access to information, but active and accessible presentation of data that enables meaningful citizen oversight. +

    +

    + Research has consistently shown that transparency reduces corruption and increases government efficiency. For example, studies in municipalities that implemented open budget initiatives saw corruption decrease by up to 30% and citizen satisfaction with government services increase significantly. +

    + +

    Direct Democracy and Delegative Systems

    +

    + Solon incorporates elements of both direct democracy and delegative (or liquid) democracy. While pure direct democracy can be impractical at scale, and representative democracy often disconnects citizens from decision-making, Solon provides a flexible middle ground where citizens can directly participate in decisions they care about while delegating their authority on other matters. +

    +

    + This approach is supported by research showing that when citizens have meaningful opportunities to participate in governance, they develop greater political efficacy, knowledge, and commitment to democratic processes. +

    + +

    Market-Based Efficiency

    +

    + Solon incorporates market principles to drive efficiency in public service delivery, drawing on extensive research showing that competitive provision of government services can reduce costs while maintaining or improving quality. +

    +

    + Unlike pure privatization, Solon's marketplace model maintains public oversight and accountability while introducing competition, transparency, and performance-based contracting to eliminate the inefficiencies of government monopolies. +

    + +
    +

    Theoretical Influences

    +
      +
    • Deliberative Democracy - Emphasis on informed citizen discussion and decision-making
      • +
    • Public Choice Theory - Understanding incentive structures in public institutions
      • +
    • Open Government Data Movement - Principles of accessibility and usability of public data
      • +
    • Blockchain Governance - Distributed consensus mechanisms and immutable record-keeping
      • +
    • Competitive Government - Market-based approaches to public service delivery
      • +
    +
    +
    + + {/* Limited preview of other sections */} +
    +

    Continue Reading the Full Whitepaper

    +

    + The full whitepaper contains detailed explanations of all components, implementation strategies, case studies, and the complete development roadmap. +

    + +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/projects/libertech/page.tsx b/app/projects/libertech/page.tsx deleted file mode 100644 index b34152725..000000000 --- a/app/projects/libertech/page.tsx +++ /dev/null @@ -1,94 +0,0 @@ -'use client'; - -import React from 'react'; -import Link from 'next/link'; - -export default function LiberTech() { - return ( -
    -
    -
    -

    LiberTech

    -

    - Technologies dedicated to maximizing human liberty and minimizing government power. -

    -
    - -
    -
    -

    Government Spending Tracker

    -

    - A Venmo-like timeline for all government spending. Every payment includes: -

    -
      -
    • • Unique transaction ID
      • -
    • • Date and time
      • -
    • • Sender (government agency)
      • -
    • • Receiver (individual/organization)
      • -
    • • Amount and currency
      • -
    • • Legal basis for payment
      • -
    • • Purpose and description
      • -
    -

    - Users can view, like, comment, and share transactions. They can also donate to either - the sender or receiver, promoting transparency and engagement in government spending. -

    - - Learn more about Government Spending Tracker - - - - -
    - -
    -

    Future Initiatives

    -

    - We're constantly developing new technologies to enhance transparency and reduce - government overreach. Our upcoming projects include: -

    -
      -
    • • Blockchain-based voting systems
      • -
    • • Decentralized identity verification
      • -
    • • Smart contract government services
      • -
    • • Public fund allocation transparency tools
      • -
    -

    - Join us in building a future where technology empowers individuals and ensures - government accountability. -

    -
    -
    - -
    -

    Get Involved

    -
    -

    - We're looking for developers, designers, and advocates who share our vision of - using technology to promote liberty and transparency. -

    - - Contact Us - -
    -
    -
    -
    - ); -} diff --git a/app/projects/page.tsx b/app/projects/page.tsx index 88be5b14a..336a019c4 100644 --- a/app/projects/page.tsx +++ b/app/projects/page.tsx @@ -6,16 +6,34 @@ import Image from 'next/image'; const projects = [ { - title: 'LiberTech', - description: 'Technologies dedicated to maximizing human liberty and minimizing government power. Featuring innovative solutions like the Venmo-style government spending tracker.', - href: '/projects/libertech', - image: '/libertech.png' + title: 'Techno-Capital', + description: 'Investing in technology to drive humanity toward technological singularity through commodities, public companies, startups, research, and SubSpace Capital.', + href: '/projects/techno-capital', + image: '/images/techno-capital.jpg' }, { - title: 'Roboshop', - description: 'AI-powered shopping assistant that finds exactly what you need with just one word. Integrating with multiple e-commerce platforms for the best results.', - href: '/projects/roboshop', - image: '/roboshop.png' + title: 'Governance', + description: 'Technologies dedicated to maximizing transparency and accountability in government spending, featuring innovative solutions like the Venmo-style spending tracker.', + href: '/projects/governance', + image: '/governance.png' + }, + { + title: 'Credit', + description: 'Enterprise-grade automation for venture credit operations. Automatically ingest and analyze portfolio company reports, monitor debt metrics, and make data-driven decisions.', + href: '/projects/credit', + image: '/credit.png' + }, + { + title: 'Recurring Fulfillment', + description: 'AI-powered platform for managing recurring purchases, subscriptions, and services. Automate your replenishment process and inventory management with predictive analytics.', + href: '/projects/shopping', + image: '/shopping.png' + }, + { + title: 'Project Finance', + description: 'Full transparency project finance and management tool. Start projects, manage funding through donations/credit/investments, track tasks and costs, with complete public visibility.', + href: '/projects/finance', + image: '/finance.png' } ]; @@ -26,7 +44,8 @@ export default function Projects() {

    Projects

    - Explore our ambitious projects aimed at transforming society through technology. + Explore our transformative projects focused on governance, finance, and automation. + Each project represents our commitment to transparency, efficiency, and technological innovation.

    @@ -34,7 +53,7 @@ export default function Projects() { {projects.map((project) => (
    diff --git a/app/projects/roboshop/page.tsx b/app/projects/roboshop/page.tsx deleted file mode 100644 index 86e9e8578..000000000 --- a/app/projects/roboshop/page.tsx +++ /dev/null @@ -1,95 +0,0 @@ -'use client'; - -import React from 'react'; -import Link from 'next/link'; - -export default function Roboshop() { - return ( -
    -
    -
    -

    Roboshop

    -

    - AI-powered shopping assistant that finds exactly what you need with just one word. -

    -
    - -
    -
    -

    One-Word Query System

    -

    - Simply input a single word and let our advanced AI understand and fulfill your shopping needs: -

    -
      -
    • • Natural Language Processing for accurate interpretation
      • -
    • • Context-aware product matching
      • -
    • • Multi-platform product search
      • -
    • • Price comparison and optimization
      • -
    • • Personalized recommendations
      • -
    -

    - Our system leverages cutting-edge AI to understand your needs and find the perfect products - across multiple e-commerce platforms. -

    -
    - -
    -

    Platform Integration

    -

    - We search across multiple e-commerce platforms to find the best options: -

    -
      -
    • • Amazon marketplace integration
      • -
    • • Ricardo platform connectivity
      • -
    • • Real-time price tracking
      • -
    • • Automated price comparison
      • -
    • • Secure transaction processing
      • -
    -

    - Get the best deals from multiple sources with our comprehensive platform integration. -

    -
    -
    - -
    -

    Try It Now

    -
    -
    - - -
    - -
    -
    - -
    -

    Get Started

    -
    -

    - Ready to revolutionize your shopping experience? Contact us to learn more about - implementing Roboshop in your business. -

    - - Contact Us - -
    -
    -
    -
    - ); -} diff --git a/app/projects/shopping/page.tsx b/app/projects/shopping/page.tsx new file mode 100644 index 000000000..7846c61c5 --- /dev/null +++ b/app/projects/shopping/page.tsx @@ -0,0 +1,269 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; + +export default function RecurringFulfillment() { + return ( +
    +
    + {/* Header */} +
    +

    + Recurring Purchases Automation +

    +

    + Effortlessly manage all your recurring commitments—whether it's physical supplies, recurring services, or digital subscriptions—in one centralized dashboard. +

    +
    + + {/* Categories Overview */} +
    +
    +

    Replenishable Goods

    +

    + Manage supplies, industrial inputs, raw materials, and more. Our predictive analytics and dynamic scheduling ensure you never run out of essentials. +

    +
    +
    +

    Recurring Services

    +

    + Stay on top of cleaning, safety audits, maintenance, and other services with automated scheduling and real-time alerts. +

    +
    +
    +

    Subscriptions

    +

    + Track and manage your software subscriptions—from cloud services to SaaS tools like Calendly—with consolidated billing and automated renewal notifications. +

    +
    +
    + + {/* Dashboard Features */} +
    +

    Dashboard Features

    +
    +

    + Get a comprehensive view of all your recurring commitments in one place. Customize thresholds, set reminders, and gain data-driven insights to optimize spending. +

    +
      +
    • • Unified overview of goods, services, and subscriptions
      • +
    • • Customizable reorder and renewal thresholds
      • +
    • • Automated alerts and renewal notifications
      • +
    • • Detailed analytics for cost and usage optimization
      • +
    • • Upcoming replenishments dashboard with timeline visualization
      • +
    • • Usage history tracking to identify consumption patterns
      • +
    • • Smart home/IoT device integration for real-time tracking
      • +
    • • Budget management with spending forecasts and alerts
      • +
    +

    + Whether you're managing a household or a business, our dashboard simplifies recurring management. +

    +
    +
    + + {/* Interactive Demo */} +
    +

    See It In Action

    +
    +
    +

    Interactive Dashboard Demo

    + {/* Replace with actual demo or screenshot */} +
    +

    + Our intuitive dashboard gives you a bird's-eye view of all your recurring commitments, with detailed insights just a click away. +

    +
    +
    + + {/* Set Up Your Dashboard */} +
    +

    Set Up Your Dashboard

    +
    +
    + + +
    + +
    +
    + + {/* Integration Partners */} +
    +

    Integration Partners

    +
    +

    + Seamlessly connect with the platforms and services you already use: +

    +
    +
    + ERP System +
    +
    + CRM Platform +
    +
    + Accounting Software +
    +
    + IoT Devices +
    +
    +

    + Our open API architecture enables integration with virtually any enterprise system. +

    +
    +
    + + {/* Case Studies */} +
    +

    Case Study: Acme Corporation

    +
    +

    + Acme Corporation, a mid-sized manufacturing firm, streamlined its inventory and service management using our automated replenishment system. +

    +
      +
    • • Challenge: Inefficient manual reordering and service scheduling led to downtime.
      • +
    • • Solution: Integration with their ERP and service management systems enabled real-time tracking and dynamic scheduling.
      • +
    • • Results: 30% reduction in downtime and 25% decrease in inventory holding costs within 6 months.
      • +
    +

    + Acme Corporation now enjoys a seamless supply chain and service management experience. +

    +
    +
    + +
    +

    Case Study: SoftCo Enterprise

    +
    +

    + SoftCo Enterprise revolutionized its digital subscription management by consolidating all its recurring software services on our dashboard. +

    +
      +
    • • Challenge: Disorganized subscription renewals and escalating costs.
      • +
    • • Solution: A unified dashboard with automated alerts and consolidated billing improved their management process.
      • +
    • • Results: 40% improvement in renewal compliance and 20% reduction in subscription overhead in the first quarter.
      • +
    +

    + With our system, SoftCo Enterprise now manages all its digital subscriptions effortlessly. +

    +
    +
    + + {/* Pricing Plans */} +
    +

    Pricing Plans

    +
    +
    +

    Personal

    +

    $29/month

    +

    Perfect for individuals and home management

    +
      +
    • • Up to 50 recurring items
      • +
    • • Basic analytics
      • +
    • • Email notifications
      • +
    • • 30-day history
      • +
    + +
    + +
    +
    + POPULAR +
    +

    Business

    +

    $99/month

    +

    Ideal for small to medium businesses

    +
      +
    • • Up to 500 recurring items
      • +
    • • Advanced analytics
      • +
    • • SMS & email notifications
      • +
    • • 1-year history
      • +
    • • Basic API access
      • +
    + +
    + +
    +

    Enterprise

    +

    Custom

    +

    For large organizations with complex needs

    +
      +
    • • Unlimited recurring items
      • +
    • • Custom analytics
      • +
    • • Custom notifications
      • +
    • • Unlimited history
      • +
    • • Full API access
      • +
    • • Dedicated support
      • +
    + +
    +
    +
    + + {/* Data Security */} +
    +

    Enterprise-Grade Security

    +
    +

    + Your data security is our top priority. Our platform is built with industry-leading security measures: +

    +
      +
    • • SOC 2 Type II certified
      • +
    • • End-to-end encryption
      • +
    • • Role-based access controls
      • +
    • • Regular security audits
      • +
    • • GDPR and CCPA compliant
      • +
    +

    + We treat your data with the utmost care, applying enterprise-grade security at every level. +

    +
    +
    + + {/* Get Started / Contact */} +
    +

    Get Started

    +
    +

    + Ready to transform the way you manage recurring commitments? Whether it's physical goods, services, or digital subscriptions, our unified dashboard has you covered. +

    + + Contact Us + +
    +
    +
    +
    + ); +} \ No newline at end of file diff --git a/app/projects/techno-capital/README.md b/app/projects/techno-capital/README.md new file mode 100644 index 000000000..80c547777 --- /dev/null +++ b/app/projects/techno-capital/README.md @@ -0,0 +1,38 @@ +# Botsmann Techno-Capital Assets + +This document outlines the image assets needed for the Techno-Capital project section. + +## Required Images + +1. **techno-capital-hero.jpg** + - Location: `/public/images/techno-capital-hero.jpg` + - Description: A hero image showing a futuristic tunnel or underground structure with technological elements, representing the visionary aspect of the Techno-Capital initiative + - Suggested dimensions: 1920x1080px (16:9 aspect ratio) + - Style: Dark theme with OpenAI green accents + +2. **techno-capital.jpg** + - Location: `/public/images/techno-capital.jpg` + - Description: A smaller thumbnail version for the projects listing page + - Suggested dimensions: 800x450px (16:9 aspect ratio) + - Style: Should match the hero image style but optimized for thumbnail display + +## Image Guidelines + +- Images should follow the Botsmann design aesthetic with dark backgrounds and OpenAI green (#10A37F) accents +- Images should convey the technological singularity and underground/subterranean themes +- For placeholder purposes, solid color blocks with text can be used until final images are created +- Consider using AI image generation tools (like DALL-E or Midjourney) with prompts like: + - "Futuristic underground tunnel with green technological lighting, digital interfaces, dark aesthetic" + - "Technological singularity concept visualization with dark background and emerald green accents" + +## Image Directory Setup + +The directory structure should be: +``` +/public + /images + techno-capital-hero.jpg + techno-capital.jpg +``` + +You can create placeholder images using online tools or basic graphic design software until final assets are ready. \ No newline at end of file diff --git a/app/projects/techno-capital/page.tsx b/app/projects/techno-capital/page.tsx new file mode 100644 index 000000000..eb52c5f96 --- /dev/null +++ b/app/projects/techno-capital/page.tsx @@ -0,0 +1,345 @@ +'use client'; + +import React, { useState } from 'react'; +import Link from 'next/link'; +import { NextSection } from '../../../src/components/navigation/NextSection'; + +export default function TechnoCapital() { + const [formSubmitted, setFormSubmitted] = useState(false); + const [submitting, setSubmitting] = useState(false); + const [formError, setFormError] = useState(''); + + const handleSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + setSubmitting(true); + setFormError(''); + + // Simulating form submission + try { + await new Promise(resolve => setTimeout(resolve, 1500)); + setFormSubmitted(true); + } catch (error) { + setFormError('There was an error submitting the form. Please try again.'); + } finally { + setSubmitting(false); + } + }; + + return ( +
    +
    + {/* Title and Overview */} +
    +
    + + Coming Soon + + Investment fund launching 2025 +
    +

    + Botsmann Techno-Capital (BTC) +

    +

    + Accelerating humanity toward technological singularity through strategic investments in commodities, research, and subterranean development. +

    +
    + + {/* Features Section */} +
    +
    +

    Investment Focus

    +
      +
    • + + + + Strategic commodities: uranium, rare earths, copper, and other critical resources +
      • +
    • + + + + Advanced research funding for AI, fusion energy, and longevity science +
      • +
    • + + + + Subterranean and space-based real estate development via SubSpace Capital +
      • +
    • + + + + Long-term investment horizon (20+ years) focused on singularity acceleration +
      • +
    +
    + +
    +

    Our Vision

    +

    + Botsmann Techno-Capital is dedicated to accelerating humanity's progress toward technological singularity—when artificial intelligence surpasses human capabilities and leads to unprecedented growth and advancement. +

    +

    + Unlike traditional investment funds that focus on quarterly returns or existing companies, BTC strategically invests in the foundational resources, physical infrastructure, and breakthrough research needed to support this technological transformation. +

    +

    + By focusing on commodities and physical infrastructure rather than companies, we ensure direct control of the critical resources required for technological advancement. +

    +
    +
    + + {/* SubSpace Capital Section */} +
    +

    SubSpace Capital

    +
    +
    +
    + + + +
    +

    Our Real Estate Division

    +
    +

    + SubSpace Capital is our specialized real estate division that invests in the most undervalued property class: subterranean real estate and extraterrestrial development. We focus on: +

    + +
    +
    +

    Earth-Based Underground Properties

    +
      +
    • + + + + Climate-resilient bunkers and habitation facilities +
      • +
    • + + + + Subterranean data centers with natural cooling +
      • +
    • + + + + Underground transportation and logistics networks +
      • +
    +
    + +
    +

    Space-Based Development

    +
      +
    • + + + + Lunar and Martian subsurface habitat technologies +
      • +
    • + + + + Asteroid mining rights and extraction infrastructure +
      • +
    • + + + + Early claims on extraterrestrial real estate resources +
      • +
    +
    +
    + +
    +

    + "The future of humanity may lie beneath the surface—of Earth and beyond. By developing subterranean and space-based habitats, we're creating the resilient infrastructure needed for the coming technological singularity." +

    +
    +
    +
    + + {/* Investment Approach */} +
    +

    Investment Approach

    +
    +
      +
    1. +
      + 1 +
      +
      +

      Strategic Resource Acquisition

      +

      We identify and acquire commodities and physical assets that will become increasingly critical for technological advancement.

      +
      +
      2. +
    2. +
      + 2 +
      +
      +

      Research Integration

      +

      We fund breakthrough research that enhances the value of our physical assets and accelerates singularity development.

      +
      +
      3. +
    3. +
      + 3 +
      +
      +

      Infrastructure Creation

      +

      We develop the physical and digital infrastructure needed to support exponential technological growth.

      +
      +
      4. +
    + +
    +

    Trading Strategy

    +

    For commodity investments, we maintain a balanced portfolio approach:

    +
      +
    • + + + + Long positions (20–40%) for building strategic reserves +
      • +
    • + + + + Short positions (5–50%) to capitalize on market inefficiencies +
      • +
    +
    +
    +
    + + {/* Waitlist Section */} +
    +
    +

    Join Our Investor Waitlist

    +

    + Botsmann Techno-Capital is preparing to launch. Join our waitlist to be among the first to invest in humanity's technological future. +

    + + {formSubmitted ? ( +
    + + + +

    Thank You!

    +

    + You've been added to our waitlist. We'll notify you when Botsmann Techno-Capital launches. +

    +
    + ) : ( + +
    + + +
    +
    + + +
    +
    + + +
    +
    + + +
    + + {formError &&

    {formError}

    } + + )} +
    +
    + + +
    +
    + ); +} \ No newline at end of file diff --git a/app/roboshop/page.tsx b/app/roboshop/page.tsx deleted file mode 100644 index 27121251d..000000000 --- a/app/roboshop/page.tsx +++ /dev/null @@ -1,121 +0,0 @@ -'use client'; - -import React, { useState } from 'react'; - -interface ProductResult { - id: string; - title: string; - description: string; - price: number; - image: string; - url: string; - platform: 'Amazon' | 'Ricardo'; -} - -export default function Roboshop() { - const [query, setQuery] = useState(''); - const [results, setResults] = useState([]); - const [isSearching, setIsSearching] = useState(false); - - const handleSearch = async (e: React.FormEvent) => { - e.preventDefault(); - if (!query.trim()) return; - - setIsSearching(true); - try { - const response = await fetch('/api/products/search', { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify({ query: query.trim() }) - }); - - if (!response.ok) { - throw new Error('Search failed'); - } - - const data = await response.json(); - setResults(data.results); - } catch (error) { - console.error('Search error:', error); - } finally { - setIsSearching(false); - } - }; - - return ( -
    -
    -
    -

    Roboshop

    -

    - Enter a single word and let our AI find exactly what you need across multiple platforms. -

    -
    - -
    -
    - setQuery(e.target.value)} - className="w-full rounded-xl border-2 border-gray-200 bg-transparent px-4 py-3 text-lg text-gray-900 outline-none transition-colors focus:border-green-600" - placeholder="Enter one word..." - maxLength={50} - /> - -
    -
    - -
    - {results.map((product) => ( -
    -
    - {product.title} -
    -
    -

    {product.title}

    -

    {product.description}

    -
    - - ${product.price.toFixed(2)} - - {product.platform} -
    -
    - - View on {product.platform} → - - -
    -
    -
    - ))} -
    -
    -
    - ); -} diff --git a/app/solutions/businesses/[slug]/page.tsx b/app/solutions/businesses/[slug]/page.tsx new file mode 100644 index 000000000..bb73128a5 --- /dev/null +++ b/app/solutions/businesses/[slug]/page.tsx @@ -0,0 +1,21 @@ +'use client'; + +import React from 'react'; +import { useParams } from 'next/navigation'; +import solutionsData from '@/data/solutions.json'; +import SolutionLayout, { SolutionData } from '@/components/SolutionLayout'; + +export default function SolutionPage() { + const { slug } = useParams(); + const category = "businesses"; // Hard-coded since this file is under businesses + + const solutionData: SolutionData | undefined = solutionsData[category]?.find( + (s: any) => s.slug === slug + ); + + if (!solutionData) { + return
    Solution not found
    ; + } + + return ; +} diff --git a/app/solutions/businesses/page.tsx b/app/solutions/businesses/page.tsx new file mode 100644 index 000000000..0b4239966 --- /dev/null +++ b/app/solutions/businesses/page.tsx @@ -0,0 +1,31 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import solutionsData from '@/data/solutions.json'; + +export default function BusinessesSolutions() { + const genericInfo = "Our AI solutions for businesses help optimize operations, enhance decision-making, and streamline processes for enterprise needs."; + const businesses = solutionsData.businesses; + + return ( +
    +
    +

    Solutions for Businesses

    +

    {genericInfo}

    +
    +
    + {businesses.map((solution: any) => ( + +

    {solution.title}

    +

    {solution.overview}

    + + ))} +
    +
    + ); +} diff --git a/app/solutions/governments/[slug]/page.tsx b/app/solutions/governments/[slug]/page.tsx new file mode 100644 index 000000000..148a104f0 --- /dev/null +++ b/app/solutions/governments/[slug]/page.tsx @@ -0,0 +1,21 @@ +'use client'; + +import React from 'react'; +import { useParams } from 'next/navigation'; +import solutionsData from '@/data/solutions.json'; +import SolutionLayout, { SolutionData } from '@/components/SolutionLayout'; + +export default function SolutionPage() { + const { slug } = useParams(); + const category = "governments"; // Hard-coded since this file is under governments + + const solutionData: SolutionData | undefined = solutionsData[category]?.find( + (s: any) => s.slug === slug + ); + + if (!solutionData) { + return
    Solution not found
    ; + } + + return ; +} diff --git a/app/solutions/governments/page.tsx b/app/solutions/governments/page.tsx new file mode 100644 index 000000000..80f670d9a --- /dev/null +++ b/app/solutions/governments/page.tsx @@ -0,0 +1,31 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import solutionsData from '@/data/solutions.json'; + +export default function GovernmentsSolutions() { + const genericInfo = "Our solutions for governments focus on transparency, efficiency, and public accountability through advanced AI tools."; + const governments = solutionsData.governments; + + return ( +
    +
    +

    Solutions for Governments

    +

    {genericInfo}

    +
    +
    + {governments.map((solution: any) => ( + +

    {solution.title}

    +

    {solution.overview}

    + + ))} +
    +
    + ); +} diff --git a/app/solutions/individuals/[slug]/page.tsx b/app/solutions/individuals/[slug]/page.tsx new file mode 100644 index 000000000..5b11290b1 --- /dev/null +++ b/app/solutions/individuals/[slug]/page.tsx @@ -0,0 +1,21 @@ +'use client'; + +import React from 'react'; +import { useParams } from 'next/navigation'; +import solutionsData from '@/data/solutions.json'; +import SolutionLayout, { SolutionData } from '@/components/SolutionLayout'; + +export default function SolutionPage() { + const { slug } = useParams(); + const category = "individuals"; // Hard-coded since this file is under individuals + + const solutionData: SolutionData | undefined = solutionsData[category]?.find( + (s: any) => s.slug === slug + ); + + if (!solutionData) { + return
    Solution not found
    ; + } + + return ; +} diff --git a/app/solutions/individuals/page.tsx b/app/solutions/individuals/page.tsx new file mode 100644 index 000000000..6f356e699 --- /dev/null +++ b/app/solutions/individuals/page.tsx @@ -0,0 +1,31 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import solutionsData from '@/data/solutions.json'; + +export default function IndividualsSolutions() { + const genericInfo = "We provide personalized AI solutions for individuals to manage daily life, learn new skills, and get tailored insights."; + const individuals = solutionsData.individuals; + + return ( +
    +
    +

    Solutions for Individuals

    +

    {genericInfo}

    +
    +
    + {individuals.map((solution: any) => ( + +

    {solution.title}

    +

    {solution.overview}

    + + ))} +
    +
    + ); +} diff --git a/app/solutions/page.tsx b/app/solutions/page.tsx new file mode 100644 index 000000000..70c008997 --- /dev/null +++ b/app/solutions/page.tsx @@ -0,0 +1,151 @@ +import React from 'react'; +import Link from 'next/link'; +import Image from 'next/image'; +import type { Route } from 'next'; +import solutions from '@/data/solutions.json'; + +export default function SolutionsPage() { + const allSolutions = [ + ...solutions.individuals.map(s => ({ ...s, category: 'individuals' })), + ...solutions.businesses.map(s => ({ ...s, category: 'businesses' })), + ...solutions.governments.map(s => ({ ...s, category: 'governments' })) + ]; + + return ( +
    +
    +

    AI Solutions for Everyone

    +

    + At Botsmann, we develop cutting-edge AI solutions tailored to the unique needs of individuals, + businesses, and governments. Our innovative technologies help automate tasks, enhance + productivity, and unlock new possibilities. +

    +
    + + {/* Customer Categories */} +
    + {/* Individuals */} +
    +
    +
    + Individuals +
    +
    +
    +

    For Individuals

    +

    + Enhance your personal life with AI assistants that help you shop smarter, + learn languages faster, and get expert advice on legal, medical, and creative matters. +

    + + Learn more + + + + +
    +
    + + {/* Businesses */} +
    + + Coming Soon + +
    +
    + Businesses +
    +
    +
    +

    For Businesses

    +

    + Streamline operations, increase efficiency, and gain valuable insights with + our AI solutions designed specifically for businesses of all sizes. +

    + + Learn more + + + + +
    +
    + + {/* Governments */} +
    + + Coming Soon + +
    +
    + Governments +
    +
    +
    +

    For Governments

    +

    + Enhance transparency, improve public services, and optimize resource allocation with our + specialized AI tools designed for government agencies and public institutions. +

    + + Learn more + + + + +
    +
    +
    + + {/* All Solutions Section */} +
    +

    All Solutions

    +
    + {allSolutions.map((solution) => ( + + {solution.slug !== 'swiss-german-teacher' && ( + + Coming Soon + + )} +
    +

    {solution.title}

    +

    {solution.overview}

    +
    + + Learn more → + + + ))} +
    +
    + + {/* Call to action */} +
    +

    Ready to Transform Your Experience?

    +

    + Contact us today to discuss how our AI solutions can be tailored to your specific needs and challenges. +

    + + Get in Touch + +
    +
    + ); +} \ No newline at end of file diff --git a/app/types/next.d.ts b/app/types/next.d.ts new file mode 100644 index 000000000..42601ec22 --- /dev/null +++ b/app/types/next.d.ts @@ -0,0 +1,7 @@ +import { LinkProps } from 'next/link'; + +declare module 'next/link' { + interface LinkProps { + href: string | { pathname: string; query?: Record }; + } +} diff --git a/app/types/route.d.ts b/app/types/route.d.ts new file mode 100644 index 000000000..8b1378917 --- /dev/null +++ b/app/types/route.d.ts @@ -0,0 +1 @@ + diff --git a/app/utils/navigationFixes.js b/app/utils/navigationFixes.js new file mode 100644 index 000000000..ccc8f84f2 --- /dev/null +++ b/app/utils/navigationFixes.js @@ -0,0 +1,95 @@ +/** + * Navigation fixes to prevent dropdown menu interference between + * Botsmann header and bot-specific navigation bars. + */ + +// Function to initialize dropdown behavior fixes +export const initializeNavigationFixes = () => { + // This function should be called in the useEffect of bot pages + + const addNavigationFixes = () => { + // Find all dropdown containers in the Botsmann header + const dropdownContainers = document.querySelectorAll('.dropdown-container'); + const botNavigation = document.querySelector('.bot-navigation'); + + if (!dropdownContainers.length || !botNavigation) { + // If elements don't exist yet, try again in 100ms + setTimeout(addNavigationFixes, 100); + return; + } + + // Function to handle dropdown visibility + const handleDropdownToggle = (container, isVisible) => { + // Get the dropdown menu within this container + const dropdown = container.querySelector('.dropdown-menu'); + if (!dropdown) return; + + if (isVisible) { + // When dropdown is shown + dropdown.classList.remove('hidden'); + document.body.classList.add('dropdown-open'); + + // Ensure dropdown has highest z-index + dropdown.style.zIndex = '1000'; + + // Make bot navigation ignore pointer events temporarily + if (botNavigation) { + botNavigation.style.pointerEvents = 'none'; + } + } else { + // When dropdown is hidden + dropdown.classList.add('hidden'); + document.body.classList.remove('dropdown-open'); + + // Reset bot navigation + if (botNavigation) { + botNavigation.style.pointerEvents = ''; + } + } + }; + + // Add event listeners to dropdown containers + dropdownContainers.forEach(container => { + // For mouse interaction + container.addEventListener('mouseenter', () => { + handleDropdownToggle(container, true); + }); + + container.addEventListener('mouseleave', () => { + handleDropdownToggle(container, false); + }); + + // For touch/click interaction + container.addEventListener('click', (e) => { + const dropdown = container.querySelector('.dropdown-menu'); + const isHidden = dropdown?.classList.contains('hidden'); + + // Hide all other dropdowns first + dropdownContainers.forEach(otherContainer => { + if (otherContainer !== container) { + handleDropdownToggle(otherContainer, false); + } + }); + + // Toggle this dropdown + handleDropdownToggle(container, isHidden); + e.stopPropagation(); + }); + }); + + // Click outside to close all dropdowns + document.addEventListener('click', () => { + dropdownContainers.forEach(container => { + handleDropdownToggle(container, false); + }); + }); + }; + + // Execute when window loads + if (document.readyState === 'complete') { + addNavigationFixes(); + } else { + window.addEventListener('load', addNavigationFixes); + return () => window.removeEventListener('load', addNavigationFixes); + } +}; \ No newline at end of file diff --git a/backup/bots_backup/[slug]/route.ts b/backup/bots_backup/[slug]/route.ts new file mode 100644 index 000000000..33ba74774 --- /dev/null +++ b/backup/bots_backup/[slug]/route.ts @@ -0,0 +1,10 @@ +import { type NextRequest } from 'next/server'; +import bots from '@/data/bots'; + +export async function generateStaticParams() { + return bots.map((bot) => ({ + slug: bot.slug, + })); +} + +export const dynamic = 'force-static'; diff --git a/backup/bots_backup/artistic-advisor/page.tsx b/backup/bots_backup/artistic-advisor/page.tsx new file mode 100644 index 000000000..cf7a8687b --- /dev/null +++ b/backup/bots_backup/artistic-advisor/page.tsx @@ -0,0 +1,77 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import bots from '../../../data/bots'; + +export default function ArtisticAdvisor() { + const bot = bots.find(b => b.slug === 'artistic-advisor'); + + if (!bot) { + return
    Bot not found
    ; + } + + return ( +
    +
    +
    +

    {bot.title}

    +

    {bot.overview}

    +
    + +
    +
    +

    Features

    +
      + {bot.features.map((feature, index) => ( +
    • + + + + {feature} +
      • + ))} +
    +
    + +
    +

    How It Works

    +

    {bot.details}

    + + Get Started + +
    +
    + +
    +
    +

    Ready to Enhance Your Artistic Journey?

    +

    + Let our AI-powered artistic advisor help you explore new techniques, refine your style, + and gain valuable insights from art history while maintaining your unique creative vision. +

    + + Contact Us + +
    +
    +
    +
    + ); +} diff --git a/backup/bots_backup/auto-shopper/page.tsx b/backup/bots_backup/auto-shopper/page.tsx new file mode 100644 index 000000000..3736ab016 --- /dev/null +++ b/backup/bots_backup/auto-shopper/page.tsx @@ -0,0 +1,100 @@ +'use client'; + +import React, { useState } from 'react'; + +interface ProductResult { + id: string; + title: string; + description: string; + price: number; + image: string; + url: string; + platform: 'Amazon' | 'Ricardo'; +} + +export default function AutoShopper() { + const [query, setQuery] = useState(''); + const [results, setResults] = useState([]); + const [isSearching, setIsSearching] = useState(false); + + const handleSearch = async (e: React.FormEvent) => { + e.preventDefault(); + if (!query.trim()) return; + + setIsSearching(true); + try { + const response = await fetch('/api/products/search', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ query: query.trim() }) + }); + + if (!response.ok) { + throw new Error('Search failed'); + } + + const data = await response.json(); + setResults(data.results); + } catch (error) { + console.error('Search error:', error); + // TODO: Add error handling UI + } finally { + setIsSearching(false); + } + }; + + return ( +
    +

    Professional Auto-Shopper

    + + {/* One-word query input */} +
    +
    + setQuery(e.target.value)} + className="w-full rounded-xl border-gray-200 bg-white px-4 py-3 pr-12 text-lg shadow-sm focus:border-openai-green focus:ring-openai-green" + placeholder="Enter one word..." + maxLength={50} + /> + +
    +
    + + {/* Results grid */} +
    + {results.map((product) => ( +
    + {product.title} +

    {product.title}

    +

    {product.description}

    +
    + ${product.price} + {product.platform} +
    +
    + + View on {product.platform} → + + +
    +
    + ))} +
    +
    + ); +} diff --git a/app/bots/gov-spending-tracker/page.tsx b/backup/bots_backup/gov-spending-tracker/page.tsx similarity index 100% rename from app/bots/gov-spending-tracker/page.tsx rename to backup/bots_backup/gov-spending-tracker/page.tsx diff --git a/backup/bots_backup/legal-expert/page.tsx b/backup/bots_backup/legal-expert/page.tsx new file mode 100644 index 000000000..48118c61b --- /dev/null +++ b/backup/bots_backup/legal-expert/page.tsx @@ -0,0 +1,77 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import bots from '../../../data/bots'; + +export default function LegalExpert() { + const bot = bots.find(b => b.slug === 'legal-expert'); + + if (!bot) { + return
    Bot not found
    ; + } + + return ( +
    +
    +
    +

    {bot.title}

    +

    {bot.overview}

    +
    + +
    +
    +

    Features

    +
      + {bot.features.map((feature, index) => ( +
    • + + + + {feature} +
      • + ))} +
    +
    + +
    +

    How It Works

    +

    {bot.details}

    + + Get Started + +
    +
    + +
    +
    +

    Ready to Transform Your Legal Practice?

    +

    + Leverage our AI-powered legal expert assistant to streamline research, + analyze documents, and stay current with legal developments. +

    + + Contact Us + +
    +
    +
    +
    + ); +} diff --git a/backup/bots_backup/medical-expert/page.tsx b/backup/bots_backup/medical-expert/page.tsx new file mode 100644 index 000000000..4a894d2ad --- /dev/null +++ b/backup/bots_backup/medical-expert/page.tsx @@ -0,0 +1,77 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import bots from '../../../data/bots'; + +export default function MedicalExpert() { + const bot = bots.find(b => b.slug === 'medical-expert'); + + if (!bot) { + return
    Bot not found
    ; + } + + return ( +
    +
    +
    +

    {bot.title}

    +

    {bot.overview}

    +
    + +
    +
    +

    Features

    +
      + {bot.features.map((feature, index) => ( +
    • + + + + {feature} +
      • + ))} +
    +
    + +
    +

    How It Works

    +

    {bot.details}

    + + Get Started + +
    +
    + +
    +
    +

    Ready to Enhance Your Medical Practice?

    +

    + Leverage our AI-powered medical expert assistant to stay current with research, + analyze cases, and make informed decisions based on the latest medical evidence. +

    + + Contact Us + +
    +
    +
    +
    + ); +} diff --git a/backup/bots_backup/page.tsx b/backup/bots_backup/page.tsx new file mode 100644 index 000000000..277241403 --- /dev/null +++ b/backup/bots_backup/page.tsx @@ -0,0 +1,30 @@ +import React from 'react'; +import Link from 'next/link'; +import type { Route } from 'next'; +import { Bot } from '@/data/bots'; +import bots from '@/data/bots'; + +export default function BotsList() { + return ( +
    +

    Our AI Bots

    +
    + {bots.map((bot) => ( + +
    +

    {bot.title}

    +

    {bot.description}

    +
    + + Learn more → + + + ))} +
    +
    + ); +} diff --git a/backup/bots_backup/swiss-german-teacher/page.tsx b/backup/bots_backup/swiss-german-teacher/page.tsx new file mode 100644 index 000000000..d527fca7a --- /dev/null +++ b/backup/bots_backup/swiss-german-teacher/page.tsx @@ -0,0 +1,77 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import bots from '../../../data/bots'; + +export default function SwissGermanTeacher() { + const bot = bots.find(b => b.slug === 'swiss-german-teacher'); + + if (!bot) { + return
    Bot not found
    ; + } + + return ( +
    +
    +
    +

    {bot.title}

    +

    {bot.overview}

    +
    + +
    +
    +

    Features

    +
      + {bot.features.map((feature, index) => ( +
    • + + + + {feature} +
      • + ))} +
    +
    + +
    +

    How It Works

    +

    {bot.details}

    + + Start Learning + +
    +
    + +
    +
    +

    Ready to Master Swiss German?

    +

    + Start your journey to fluency with our AI-powered Swiss German teacher. Get personalized + lessons, instant feedback, and cultural insights. +

    + + Contact Us + +
    +
    +
    +
    + ); +} diff --git a/backup/projects_backup/credit/page.tsx b/backup/projects_backup/credit/page.tsx new file mode 100644 index 000000000..baedfba2f --- /dev/null +++ b/backup/projects_backup/credit/page.tsx @@ -0,0 +1,107 @@ +'use client'; + +import React from 'react'; +import { NextSection } from '../../../src/components/navigation/NextSection'; + +export default function Credit() { + return ( +
    +

    Credit Workflow Automation

    + +
    +

    + Streamline your credit operations with our AI-powered workflow automation solution. + Monitor portfolio companies, analyze financial data, and make informed decisions faster. +

    +
    + +
    +

    Key Features

    +
    +
    +

    Automated Reporting

    +

    + Automatically ingest and process regular reports from portfolio companies, saving time and reducing errors. +

    +
    +
    +

    Debt Monitoring

    +

    + Track and analyze debt metrics in real-time with automated alerts for key thresholds. +

    +
    +
    +

    Financial Analysis

    +

    + Comprehensive analysis of financials, KPIs, and qualitative factors including investor information. +

    +
    +
    +
    + +
    +

    How It Works

    +
    +
    +
    +
    + 1 +
    +
    +
    +

    Data Integration

    +

    + Connect your portfolio companies' reporting systems for automated data ingestion. +

    +
    +
    +
    +
    +
    + 2 +
    +
    +
    +

    AI Analysis

    +

    + Our AI processes financial data, identifies trends, and generates insights automatically. +

    +
    +
    +
    +
    +
    + 3 +
    +
    +
    +

    Monitoring Dashboard

    +

    + Access real-time insights and alerts through an intuitive dashboard interface. +

    +
    +
    +
    +
    + +
    +

    Ready to Transform Your Workflow?

    +

    + Let us help you automate your credit operations and make better decisions faster. +

    + + Contact Us + +
    + + +
    + ); +} diff --git a/backup/projects_backup/finance/page.tsx b/backup/projects_backup/finance/page.tsx new file mode 100644 index 000000000..cc2a85949 --- /dev/null +++ b/backup/projects_backup/finance/page.tsx @@ -0,0 +1,91 @@ +'use client'; + +import React from 'react'; +import { NextSection } from '@/src/components/navigation/NextSection'; + +export default function ProjectFinance() { + return ( +
    +
    +
    +

    Project Finance

    +

    + A revolutionary platform for transparent project finance and management. Start projects, + manage funding, and track progress with complete public visibility. Every transaction, + decision, and milestone is open to the public, fostering trust and accountability. +

    +
    + +
    +
    +

    Easy Project Creation

    +

    Start any project with a few clicks. Define goals, milestones, and funding needs with our intuitive interface.

    +
    + +
    +

    Multiple Funding Sources

    +

    Accept donations, credit, or investments. Track all contributions transparently and provide real-time updates to stakeholders.

    +
    + +
    +

    Public Financial Dashboard

    +

    Real-time visibility into project finances, tasks, and progress. Monitor every transaction and milestone in real-time.

    +
    + +
    +

    Task Management

    +

    Break down projects into tasks, assign costs, and track completion. Every task's budget and progress is visible to all stakeholders.

    +
    + +
    +

    Public Audit Trail

    +

    Complete transparency with every transaction logged and visible. Built-in tools for financial stewardship and accountability.

    +
    + +
    +

    Insights and Analytics

    +

    Data-driven insights into project performance, spending patterns, and milestone achievement rates.

    +
    +
    + +
    +

    How It Works

    +
    +
    +

    1. Project Setup

    +

    + Create your project with a clear description, goals, and funding requirements. + Break down the project into tasks, each with its own budget and timeline. + All this information is immediately public and searchable. +

    +
    + +
    +

    2. Funding Collection

    +

    + Accept multiple types of funding: donations, investments, or credit. Each contribution + is tracked and displayed in real-time. Donors and investors can see exactly how their + money is being used. +

    +
    + +
    +

    3. Transparent Execution

    +

    + As the project progresses, every transaction and task update is automatically recorded + and displayed. Stakeholders can track progress, view financial statements, and monitor + milestone completion in real-time. +

    +
    +
    +
    + + +
    +
    + ); +} diff --git a/app/projects/libertech/gov-spending/page.tsx b/backup/projects_backup/governance/page.tsx similarity index 100% rename from app/projects/libertech/gov-spending/page.tsx rename to backup/projects_backup/governance/page.tsx diff --git a/backup/projects_backup/page.tsx b/backup/projects_backup/page.tsx new file mode 100644 index 000000000..ab14e3556 --- /dev/null +++ b/backup/projects_backup/page.tsx @@ -0,0 +1,86 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; +import Image from 'next/image'; + +const projects = [ + { + title: 'Governance', + description: 'Technologies dedicated to maximizing transparency and accountability in government spending, featuring innovative solutions like the Venmo-style spending tracker.', + href: '/projects/governance', + image: '/governance.png' + }, + { + title: 'Credit', + description: 'Enterprise-grade automation for venture credit operations. Automatically ingest and analyze portfolio company reports, monitor debt metrics, and make data-driven decisions.', + href: '/projects/credit', + image: '/credit.png' + }, + { + title: 'Shopping', + description: 'AI-powered shopping assistant that finds exactly what you need with just one word. Integrating with multiple e-commerce platforms for the best results.', + href: '/projects/shopping', + image: '/shopping.png' + }, + { + title: 'Project Finance', + description: 'Full transparency project finance and management tool. Start projects, manage funding through donations/credit/investments, track tasks and costs, with complete public visibility.', + href: '/projects/finance', + image: '/finance.png' + } +]; + +export default function Projects() { + return ( +
    +
    +
    +

    Projects

    +

    + Explore our transformative projects focused on governance, finance, and automation. + Each project represents our commitment to transparency, efficiency, and technological innovation. +

    +
    + +
    + {projects.map((project) => ( + +
    +
    +
    +

    {project.title}

    +
    +
    +
    +
    +

    {project.title}

    +

    {project.description}

    +
    + Learn more + + + +
    +
    + + ))} +
    +
    +
    + ); +} diff --git a/backup/projects_backup/shopping/page.tsx b/backup/projects_backup/shopping/page.tsx new file mode 100644 index 000000000..8d62f4367 --- /dev/null +++ b/backup/projects_backup/shopping/page.tsx @@ -0,0 +1,269 @@ +'use client'; + +import React from 'react'; +import Link from 'next/link'; + +export default function Shopping() { + return ( +
    +
    + {/* Header */} +
    +

    + Recurring Purchases Automation +

    +

    + Effortlessly manage all your recurring commitments—whether it's physical supplies, recurring services, or digital subscriptions—in one centralized dashboard. +

    +
    + + {/* Categories Overview */} +
    +
    +

    Replenishable Goods

    +

    + Manage supplies, industrial inputs, raw materials, and more. Our predictive analytics and dynamic scheduling ensure you never run out of essentials. +

    +
    +
    +

    Recurring Services

    +

    + Stay on top of cleaning, safety audits, maintenance, and other services with automated scheduling and real-time alerts. +

    +
    +
    +

    Subscriptions

    +

    + Track and manage your software subscriptions—from cloud services to SaaS tools like Calendly—with consolidated billing and automated renewal notifications. +

    +
    +
    + + {/* Dashboard Features */} +
    +

    Dashboard Features

    +
    +

    + Get a comprehensive view of all your recurring commitments in one place. Customize thresholds, set reminders, and gain data-driven insights to optimize spending. +

    +
      +
    • • Unified overview of goods, services, and subscriptions
      • +
    • • Customizable reorder and renewal thresholds
      • +
    • • Automated alerts and renewal notifications
      • +
    • • Detailed analytics for cost and usage optimization
      • +
    • • Upcoming replenishments dashboard with timeline visualization
      • +
    • • Usage history tracking to identify consumption patterns
      • +
    • • Smart home/IoT device integration for real-time tracking
      • +
    • • Budget management with spending forecasts and alerts
      • +
    +

    + Whether you're managing a household or a business, our dashboard simplifies recurring management. +

    +
    +
    + + {/* Interactive Demo */} +
    +

    See It In Action

    +
    +
    +

    Interactive Dashboard Demo

    + {/* Replace with actual demo or screenshot */} +
    +

    + Our intuitive dashboard gives you a bird's-eye view of all your recurring commitments, with detailed insights just a click away. +

    +
    +
    + + {/* Set Up Your Dashboard */} +
    +

    Set Up Your Dashboard

    +
    +
    + + +
    + +
    +
    + + {/* Integration Partners */} +
    +

    Integration Partners

    +
    +

    + Seamlessly connect with the platforms and services you already use: +

    +
    +
    + ERP System +
    +
    + CRM Platform +
    +
    + Accounting Software +
    +
    + IoT Devices +
    +
    +

    + Our open API architecture enables integration with virtually any enterprise system. +

    +
    +
    + + {/* Case Studies */} +
    +

    Case Study: Acme Corporation

    +
    +

    + Acme Corporation, a mid-sized manufacturing firm, streamlined its inventory and service management using our automated replenishment system. +

    +
      +
    • • Challenge: Inefficient manual reordering and service scheduling led to downtime.
      • +
    • • Solution: Integration with their ERP and service management systems enabled real-time tracking and dynamic scheduling.
      • +
    • • Results: 30% reduction in downtime and 25% decrease in inventory holding costs within 6 months.
      • +
    +

    + Acme Corporation now enjoys a seamless supply chain and service management experience. +

    +
    +
    + +
    +

    Case Study: SoftCo Enterprise

    +
    +

    + SoftCo Enterprise revolutionized its digital subscription management by consolidating all its recurring software services on our dashboard. +

    +
      +
    • • Challenge: Disorganized subscription renewals and escalating costs.
      • +
    • • Solution: A unified dashboard with automated alerts and consolidated billing improved their management process.
      • +
    • • Results: 40% improvement in renewal compliance and 20% reduction in subscription overhead in the first quarter.
      • +
    +

    + With our system, SoftCo Enterprise now manages all its digital subscriptions effortlessly. +

    +
    +
    + + {/* Pricing Plans */} +
    +

    Pricing Plans

    +
    +
    +

    Personal

    +

    $29/month

    +

    Perfect for individuals and home management

    +
      +
    • • Up to 50 recurring items
      • +
    • • Basic analytics
      • +
    • • Email notifications
      • +
    • • 30-day history
      • +
    + +
    + +
    +
    + POPULAR +
    +

    Business

    +

    $99/month

    +

    Ideal for small to medium businesses

    +
      +
    • • Up to 500 recurring items
      • +
    • • Advanced analytics
      • +
    • • SMS & email notifications
      • +
    • • 1-year history
      • +
    • • Basic API access
      • +
    + +
    + +
    +

    Enterprise

    +

    Custom

    +

    For large organizations with complex needs

    +
      +
    • • Unlimited recurring items
      • +
    • • Custom analytics
      • +
    • • Custom notifications
      • +
    • • Unlimited history
      • +
    • • Full API access
      • +
    • • Dedicated support
      • +
    + +
    +
    +
    + + {/* Data Security */} +
    +

    Enterprise-Grade Security

    +
    +

    + Your data security is our top priority. Our platform is built with industry-leading security measures: +

    +
      +
    • • SOC 2 Type II certified
      • +
    • • End-to-end encryption
      • +
    • • Role-based access controls
      • +
    • • Regular security audits
      • +
    • • GDPR and CCPA compliant
      • +
    +

    + We treat your data with the utmost care, applying enterprise-grade security at every level. +

    +
    +
    + + {/* Get Started / Contact */} +
    +

    Get Started

    +
    +

    + Ready to transform the way you manage recurring commitments? Whether it's physical goods, services, or digital subscriptions, our unified dashboard has you covered. +

    + + Contact Us + +
    +
    +
    +
    + ); +} \ No newline at end of file diff --git a/commitlint.config.cjs b/commitlint.config.cjs new file mode 100644 index 000000000..3347cb961 --- /dev/null +++ b/commitlint.config.cjs @@ -0,0 +1 @@ +module.exports = {extends: ['@commitlint/config-conventional']}; diff --git a/components/CollaborationForm.tsx b/components/CollaborationForm.tsx new file mode 100644 index 000000000..e90f06efd --- /dev/null +++ b/components/CollaborationForm.tsx @@ -0,0 +1,182 @@ +/** + * Collaboration Form Component + * + * Form for people interested in collaborating on AI research and development + */ + +import { useState } from 'react'; +import { useForm } from 'react-hook-form'; + +type FormData = { + name: string; + email: string; + expertise: string; + interests: string; +}; + +export default function CollaborationForm() { + const [isSubmitting, setIsSubmitting] = useState(false); + const [submitSuccess, setSubmitSuccess] = useState(false); + const [submitError, setSubmitError] = useState(null); + + const { + register, + handleSubmit, + reset, + formState: { errors }, + } = useForm(); + + const onSubmit = async (data: FormData) => { + setIsSubmitting(true); + setSubmitError(null); + + try { + // Simulate API call + await new Promise(resolve => setTimeout(resolve, 1500)); + console.log('Collaboration form submitted:', data); + + // In production, we would send this data to an API endpoint + // await fetch('/api/collaboration', { + // method: 'POST', + // headers: { 'Content-Type': 'application/json' }, + // body: JSON.stringify(data), + // }); + + setSubmitSuccess(true); + reset(); + } catch (error) { + console.error('Error submitting form:', error); + setSubmitError('Something went wrong. Please try again later.'); + } finally { + setIsSubmitting(false); + } + }; + + if (submitSuccess) { + return ( +
    +

    Thanks for joining our community!

    +

    + We're excited to collaborate with you on building the future of AI. + We'll be in touch soon to discuss how we can work together. +

    + +
    + ); + } + + return ( +
    +
    +
    +
    + + + {errors.name && ( +

    {errors.name.message}

    + )} +
    + +
    + + + {errors.email && ( +

    {errors.email.message}

    + )} +
    +
    + +
    + + + {errors.expertise && ( +

    {errors.expertise.message}

    + )} +
    + +
    + +