​

MNKY VERSE

​

Overview

​

Key Features

• Multi-Agent Interaction: Engage with three specialized agents (MOOD, CODE, SAGE)
• Unified Dashboard: Centralized view of your journey with easy access to all agents
• Enhanced Navigation: Context-aware sidebar with breadcrumbs and keyboard shortcuts
• Personalized Experience: Custom recommendations and content based on user preferences
• Secure Authentication: Robust user management with Supabase Auth
• Cross-Agent Collaboration: Seamless handoffs between agents for comprehensive support

​

Architecture

​

Technology Stack

• Frontend: Next.js 14+ (App Router), TypeScript, React
• Styling: Tailwind CSS, ShadCN UI components
• State Management: React Context API, Server Components
• Backend: Supabase, Edge Functions
• Database: PostgreSQL (via Supabase)
• Authentication: Supabase Auth
• AI Integration: Vector search, LLM integrations
• Deployment: Vercel

​

Application Structure

apps/mnky-verse/
├── app/                      # Next.js App Router routes
│   ├── api/                  # API routes for data access
│   ├── auth/                 # Authentication flows
│   ├── dashboard/            # User dashboard experience
│   ├── profile/              # User profile management
│   ├── chat/                 # Universal chat interface
│   ├── agents/               # Agent-specific pages
│   └── protected/            # Protected route components
├── components/               # Reusable React components
│   ├── ui/                   # ShadCN UI components
│   ├── agents/               # Agent-specific components
│   └── typography/           # Text styling components
├── lib/                      # Shared libraries and utilities
├── utils/                    # Utility functions
├── hooks/                    # Custom React hooks
├── supabase/                 # Supabase configuration
└── public/                    # Static assets

​

Getting Started

​

Prerequisites

• Node.js 18+ and pnpm installed
• Supabase account and project
• Environment variables configured

​

Setup

1. Clone the repository:
   Copy

   git clone https://github.com/mood-mnky/MNKY-REPO.git
   cd MNKY-REPO
   
2. Install dependencies:
   Copy

   pnpm install
   
3. Configure environment variables: Create .env.local in apps/mnky-verse/:
   Copy

   NEXT_PUBLIC_SUPABASE_URL=your-supabase-url
   NEXT_PUBLIC_SUPABASE_ANON_KEY=your-supabase-anon-key
   NEXT_PUBLIC_SITE_URL=http://localhost:3000
   OPENAI_API_KEY=your-openai-key  # Optional
   
4. Start development server:
   Copy

   pnpm --filter mnky-verse dev
   
5. Visit http://localhost:3000

​

Local Supabase Setup

# Install Supabase CLI
npm install -g supabase

# Navigate to Supabase directory
cd apps/mnky-verse/supabase

# Start Supabase locally
supabase start

# Apply migrations
supabase db reset

​

Agent Integration

​

MOOD MNKY Agent

• Purpose: Experience and personalization specialist
• Capabilities: Custom fragrance recommendations, self-care journey guidance
• Integration: Chat interface, product recommendations, mood tracking

​

CODE MNKY Agent

• Purpose: Technical expert and development support
• Capabilities: Code analysis, infrastructure management, documentation
• Integration: Developer tools, technical support, system diagnostics

​

SAGE MNKY Agent

• Purpose: Knowledge and learning guide
• Capabilities: Educational content, community facilitation, learning paths
• Integration: Learning environments, content delivery, community features

​

API Integration

• Supabase API: Authentication, database, storage, real-time subscriptions
• OpenAI API: AI capabilities and agent interactions
• Shopify API: Product data and e-commerce functionality
• Notion API: Content management and knowledge base
• Custom APIs: Flowise, Ollama, Langchain, n8n integrations

​

Deployment

​

Vercel Deployment

1. Connect GitHub repository to Vercel
2. Set environment variables in Vercel dashboard
3. Configure build settings:
   • Build Command: cd ../.. && pnpm deploy:mnky-verse
   • Output Directory: .next
   • Install Command: pnpm install

​

Environment Variables

​

Development Workflow

​

Running Tests

# Run all tests
pnpm --filter mnky-verse test

# Run tests in watch mode
pnpm --filter mnky-verse test:watch

​

Type Checking

pnpm --filter mnky-verse check-types

​

Linting

pnpm --filter mnky-verse lint

​

Troubleshooting

​

Common Issues

​

Authentication Errors

• Issue: “Invalid credentials” or “Session expired”
• Solution: Clear browser cookies and re-authenticate. Verify NEXT_PUBLIC_SUPABASE_URL and NEXT_PUBLIC_SUPABASE_ANON_KEY are correct.

​

Sidebar Not Appearing

• Issue: Sidebar navigation not visible
• Solution: Press ⌘+B (Mac) or Ctrl+B (Windows) to toggle sidebar. Check browser console for errors.

​

Agent Not Responding

• Issue: Agent chat interface not loading or timing out
• Solution: Verify OpenAI API key is set (if using OpenAI features). Check network connectivity and API endpoint status.

​

Performance Optimization

• Enable Edge Caching: Configure Vercel edge caching for static assets
• Optimize Images: Use Next.js Image component for automatic optimization
• Code Splitting: Leverage Next.js automatic code splitting
• Database Queries: Use Supabase query optimization and indexing

​

Related Resources

• Agent Ecosystem - Learn about MOOD, CODE, and SAGE agents
• API Documentation - Comprehensive API reference
• Supabase Integration - Database and auth setup
• UI Components Package - Shared UI component library
• Supabase Client Package - Database client utilities
• Contribution Guidelines - How to contribute