MyUnion Pro — AI-Powered Trade Union Management Platform
MyUnion Pro is a full-stack web application for trade union management with AI-powered chatbots, automated document generation, appeal tracking, and member engagement features. Built with Next.js 16, TypeScript, and PostgreSQL, it streamlines union operations, member onboarding, and document processing.
Project Overview
MyUnion Pro is a full-stack web application for trade union management with AI-powered chatbots, automated document generation, appeal tracking, and member engagement features. Built with Next.js 16, TypeScript, and PostgreSQL, it streamlines union operations, member onboarding, and document processing.
Live Application: myunion.pro
Version: 1.6.1
Status: Production-ready with ongoing enhancements
Core Technologies & Stack
Frontend:
Next.js 16.0.7 (App Router, Turbopack)
React 19.2.0 with Server/Client Components
TypeScript 5
Tailwind CSS 4 with dark mode
React Hook Form + Zod validation
TinyMCE rich text editor
Backend:
Next.js API Routes (RESTful)
Prisma ORM 6.19.0
PostgreSQL database
NextAuth.js 4.24.13 (multiple auth providers)
BullMQ (job queue)
Puppeteer (PDF generation)
AI & Integrations:
OpenRouter AI API (LLM)
Vector embeddings (knowledge base RAG)
DaData API (organization validation)
Best Benefits API (partner discounts)
Firebase Cloud Messaging (push notifications)
Telegram Bot API
Yandex OAuth
Infrastructure:
PM2 process manager
Nginx reverse proxy
SSH tunneling for secure DB access
VDS file storage
Key Features & Modules
1. AI-Powered Chat System
Dual-mode chatbots: Statement Bot and Appeal Bot
RAG: documents are chunked, embedded, and retrieved
Knowledge base: support for PDF, DOCX, XLSX, CSV, TXT
Auto-processing pipeline: extraction → chunking → embedding → storage
Chat history, renaming, export
Quick question tags for common appeals
Default chat creation on user registration
Technical Implementation:
Vector similarity search
Async document processing (BullMQ)
Streaming responses
Message reactions and attachments
2. Document Generation System
Template-based generation with WYSIWYG editor
Automated PDF creation via Puppeteer
Multiple document types: membership applications, contribution forms, etc.
Dynamic variable substitution from user profiles
Signed document upload
Google Drive integration
Batch regeneration
Document Flow:
Profile data collection via AI chat
Validation of required fields
Template selection and rendering
PDF generation with Puppeteer
Storage and download
3. User Profile Management
Profile with 50+ fields
DaData integration for organization validation (ЕГРЮЛ/Минюст РФ)
Address autocomplete
Avatar upload with cropping
Awards, education, professions management (JSON-based)
Profile completion tracking with progress indicators
Profile restoration from knowledge base
UX Enhancements:
Hidden forms (collapsible)
Editable/deletable cards
Mobile-responsive design
Real-time validation
4. Appeals Management System
8-digit public ID generation with collision detection
Appeal types: Legal, Accounting, Technical, Other
Sidebar integration with quick access
Status tracking: Draft, Submitted, In Progress, Resolved
Analytics with keyword extraction
Quick action tags
Appeal chat mode with context
5. Social Features
Posts feed: creation, likes, comments, views
News: articles with polls and comments
User profiles: public pages with posts
Subscriptions: follow users
Compact mini-cards for dashboard feeds
Image uploads with optimization
Link previews
Video embeds (YouTube)
6. Discounts & Benefits Integration
Best Benefits API integration
City-based filtering with auto-detection
User preferences: push notifications, filters
Geolocation support
Discount activation tracking
Sync with partner system
7. Authentication & Security
Multiple auth methods:
Email/password
SMS OTP (2FA)
Telegram OAuth
Yandex OAuth
Magic link
Role-based access control (6 roles)
Session management
Account merging
Phone number history tracking
Email verification
8. Admin Panel
User management with impersonation
AI bot configuration
Knowledge base management
Document template editor (WYSIWYG)
News management
Organization hierarchy management
System logs and analytics
Environment variable management
Queue status monitoring
9. Push Notifications
Firebase Cloud Messaging integration
OneSignal support (legacy)
Action buttons in notifications
Smart subscription management
Non-blocking implementation
10. Mobile Optimization
Responsive design (mobile-first)
Mobile header with navigation
Touch-friendly interactions
Optimized image loading
Mobile menu system
Adaptive layouts
Database Architecture
20+ Prisma Models:
User (with roles, membership status)
Organization (hierarchical structure)
ChatSession, ChatMessage
Document, DocumentTemplate
UserAppeal, AppealAnalytics
KnowledgeBase, KnowledgeDocument, KnowledgeChunk
UserPost, News, Comment
Discount, DiscountPreference
PushSubscription
And more
Features:
Hierarchical organizations (PПО → Regional → Federal)
JSON fields for flexible data (awards, education, etc.)
Soft deletes
Comprehensive indexing
Cascade deletes where appropriate
Performance Optimizations
Server Components for initial load
Image optimization with Sharp
Lazy loading and code splitting
Redis caching (BullMQ)
Async document processing
Efficient database queries with Prisma
Static page generation (126 routes)
Chunk optimization for production builds
Production Deployment
Infrastructure:
Ubuntu VDS (194.87.49.210)
PM2 process manager
Nginx reverse proxy
SSH tunnel for secure DB access
Automated deployment scripts
Error monitoring and logging
Deployment Process:
Git-based deployment
Clean build process
Prisma migrations
Health checks
Zero-downtime restarts
Recent Improvements (Today's Session)
Production Bug Fixes:
Fixed missing JavaScript chunks (500 errors)
Implemented clean rebuild process
Resolved MODULE_NOT_FOUND errors
Verified all 68 chunk files generated correctly
UI/UX Enhancements:
Compact post/news cards for dashboard
Improved mobile responsiveness
Hidden form patterns for awards/education/professions
Fixed hydration errors and FOUC issues
Chat Improvements:
Fixed message sorting (oldest to newest)
Resolved duplicate key warnings
Improved message reaction display
Enhanced attachment handling
Development Workflow
TypeScript for type safety
Prisma for database management
Environment-based configuration
Comprehensive documentation (40+ MD files)
Testing guides and procedures
Migration scripts
Local dev setup with SSH tunneling
Key Metrics
Total Routes: 126+ (dynamic + static)
API Endpoints: 100+
Components: 50+
Database Models: 20+
Lines of Code: 15,000+
Documentation Files: 40+
Skills Demonstrated
Frontend Development:
React 19 with Server Components
Next.js App Router architecture
Responsive UI/UX design
State management
Form handling and validation
Real-time features
Backend Development:
RESTful API design
Database schema design
Authentication/authorization
File processing and storage
Job queues and async processing
Third-party API integrations
AI & Machine Learning:
RAG implementation
Vector embeddings
LLM integration (OpenRouter)
Context management
Knowledge base systems
DevOps & Infrastructure:
Production deployment
Process management (PM2)
Reverse proxy configuration
SSH tunneling
Database administration
Error monitoring
Problem Solving:
Production debugging
Performance optimization
Hydration error fixes
Build process optimization
Cross-browser compatibility
Project Highlights
End-to-end development from concept to production
Complex feature set covering multiple domains
Production-ready with real users
Scalable architecture for future growth
Comprehensive documentation
Modern tech stack with best practices
Mobile-first responsive design
AI integration with RAG
This project demonstrates ability to build and deploy a production-ready SaaS platform with modern web technologies, AI integration, and complex business logic.
Skills
AI Design
UI Design
Cursor AI
Graphic Design
Design Systems
Front-End Development
DevOps
Design Sprint
Interaction Design
User Testing
Usability Testing
UX Research
Leadership
Canvas
No-Code
+ More