## 🎨 UI/UX Fixes ### Fixed React Hydration Errors - ActivityFeed: Standardized button styling (gradient → solid) - ActivityFeed: Unified icon sizes and spacing for SSR/CSR consistency - ActivityFeed: Added timestamps to chat messages for stable React keys - About: Fixed duplicate keys in tech stack items (added unique key combinations) - Projects: Fixed duplicate keys in project tags (combined projectId + tag + index) ### Fixed Layout Issues - Added spacer after Header component (h-24 md:h-32) to prevent navbar overlap - Hero section now properly visible below fixed navbar ## 🔧 Backend Improvements ### Database Schema - Added ActivityStatus model for real-time activity tracking - Supports: coding activity, music playing, watching, gaming, status/mood - Single-row design (id=1) with auto-updating timestamps ### API Enhancements - Fixed n8n status endpoint to handle missing table gracefully - Added TypeScript interfaces (removed ESLint `any` warnings) - New API: POST /api/n8n/generate-image for AI image generation - New API: GET /api/n8n/generate-image?projectId=X for status check ## 🔐 Security & Auth ### Middleware Updates - Removed premature auth redirect for /manage and /editor routes - Pages now handle their own authentication (show login forms) - Security headers still applied to all routes ## 🤖 New Feature: AI Image Generation System ### Complete automated project cover image generation using local Stable Diffusion **Core Components:** - Admin UI component (AIImageGenerator.tsx) with preview, generate, and regenerate - n8n workflow integration for automation - Context-aware prompt generation based on project metadata - Support for 10+ project categories with optimized prompts **Documentation (6 new files):** - README.md - System overview and features - SETUP.md - Detailed installation guide (486 lines) - QUICKSTART.md - 15-minute quick start - PROMPT_TEMPLATES.md - Category-specific templates (612 lines) - ENVIRONMENT.md - Environment variables reference - n8n-workflow-ai-image-generator.json - Ready-to-import workflow **Database Migration:** - SQL script: create_activity_status.sql - Auto-setup script: quick-fix.sh - Migration guide: prisma/migrations/README.md **Key Features:** ✅ Automatic generation on project creation ✅ Manual regeneration via admin UI ✅ Category-specific prompts (web, mobile, devops, ai, game, etc.) ✅ Local Stable Diffusion (no API costs, privacy-first) ✅ n8n workflow orchestration ✅ Optimized for web (1024x768) ## 📝 Documentation - CHANGELOG_DEV.md - Complete changelog with migration guide - PRE_PUSH_CHECKLIST.md - Pre-push verification checklist - Comprehensive AI image generation docs ## 🐛 Bug Fixes 1. Fixed "Hydration failed" errors in ActivityFeed 2. Fixed "two children with same key" warnings 3. Fixed navbar overlapping hero section 4. Fixed "relation activity_status does not exist" errors 5. Fixed /manage redirect loop (was going to home page) 6. Fixed TypeScript ESLint errors and warnings 7. Fixed duplicate transition prop in Hero component ## ⚠️ Breaking Changes None - All changes are backward compatible ## 🔄 Migration Required Database migration needed for new ActivityStatus table: ```bash ./prisma/migrations/quick-fix.sh # OR psql -d portfolio -f prisma/migrations/create_activity_status.sql ``` ## 📦 Files Changed **Modified (7):** - app/page.tsx - app/components/About.tsx - app/components/Projects.tsx - app/components/ActivityFeed.tsx - app/components/Hero.tsx - app/api/n8n/status/route.ts - middleware.ts - prisma/schema.prisma **Created (14):** - app/api/n8n/generate-image/route.ts - app/components/admin/AIImageGenerator.tsx - docs/ai-image-generation/* (6 files) - prisma/migrations/* (3 files) - CHANGELOG_DEV.md - PRE_PUSH_CHECKLIST.md - COMMIT_MESSAGE.txt ## ✅ Testing - [x] Build successful: npm run build - [x] Linting passed: npm run lint (0 errors, 8 warnings) - [x] No hydration errors in console - [x] No duplicate key warnings - [x] /manage accessible (shows login form) - [x] API endpoints responding correctly - [x] Navbar no longer overlaps content ## 🚀 Next Steps 1. Test AI image generation with Stable Diffusion setup 2. Test n8n workflow integration 3. Create demo screenshots for new features 4. Update main README.md after merge --- Co-authored-by: AI Assistant (Claude Sonnet 4.5)
186 lines
6.3 KiB
Bash
Executable File
186 lines
6.3 KiB
Bash
Executable File
#!/bin/bash
|
|
|
|
# Push to Dev Branch - Automated Script
|
|
# This script performs final checks and pushes changes to the dev branch
|
|
|
|
set -e
|
|
|
|
# Colors for output
|
|
RED='\033[0;31m'
|
|
GREEN='\033[0;32m'
|
|
YELLOW='\033[1;33m'
|
|
BLUE='\033[0;34m'
|
|
NC='\033[0m' # No Color
|
|
|
|
echo -e "${BLUE}╔════════════════════════════════════════════════════════════╗${NC}"
|
|
echo -e "${BLUE}║ Portfolio - Push to Dev Branch ║${NC}"
|
|
echo -e "${BLUE}╚════════════════════════════════════════════════════════════╝${NC}"
|
|
echo ""
|
|
|
|
# Check if we're on dev branch
|
|
CURRENT_BRANCH=$(git branch --show-current)
|
|
if [ "$CURRENT_BRANCH" != "dev" ]; then
|
|
echo -e "${YELLOW}⚠️ Warning: You're on branch '${CURRENT_BRANCH}', not 'dev'${NC}"
|
|
read -p "Do you want to switch to dev branch? (y/n) " -n 1 -r
|
|
echo
|
|
if [[ $REPLY =~ ^[Yy]$ ]]; then
|
|
git checkout dev
|
|
echo -e "${GREEN}✓ Switched to dev branch${NC}"
|
|
else
|
|
echo -e "${RED}✗ Aborted${NC}"
|
|
exit 1
|
|
fi
|
|
fi
|
|
|
|
echo -e "${BLUE}📋 Running Pre-Push Checks...${NC}"
|
|
echo ""
|
|
|
|
# Check 1: Build Test
|
|
echo -e "${YELLOW}[1/5] Building project...${NC}"
|
|
if npm run build > /dev/null 2>&1; then
|
|
echo -e "${GREEN}✓ Build successful${NC}"
|
|
else
|
|
echo -e "${RED}✗ Build failed${NC}"
|
|
echo "Run 'npm run build' to see errors"
|
|
exit 1
|
|
fi
|
|
|
|
# Check 2: Lint Test
|
|
echo -e "${YELLOW}[2/5] Running linter...${NC}"
|
|
LINT_OUTPUT=$(npm run lint 2>&1)
|
|
ERROR_COUNT=$(echo "$LINT_OUTPUT" | grep -oP '\d+(?= error)' || echo "0")
|
|
if [ "$ERROR_COUNT" -eq 0 ]; then
|
|
echo -e "${GREEN}✓ Lint passed (0 errors)${NC}"
|
|
else
|
|
echo -e "${RED}✗ Lint failed ($ERROR_COUNT errors)${NC}"
|
|
echo "Run 'npm run lint' to see errors"
|
|
exit 1
|
|
fi
|
|
|
|
# Check 3: Check for uncommitted changes
|
|
echo -e "${YELLOW}[3/5] Checking git status...${NC}"
|
|
if [ -n "$(git status --porcelain)" ]; then
|
|
echo -e "${GREEN}✓ Found uncommitted changes${NC}"
|
|
echo ""
|
|
echo "Modified files:"
|
|
git status --short
|
|
echo ""
|
|
else
|
|
echo -e "${YELLOW}⚠️ No uncommitted changes found${NC}"
|
|
read -p "Push anyway? (y/n) " -n 1 -r
|
|
echo
|
|
if [[ ! $REPLY =~ ^[Yy]$ ]]; then
|
|
echo -e "${RED}✗ Aborted${NC}"
|
|
exit 1
|
|
fi
|
|
fi
|
|
|
|
# Check 4: Verify critical files exist
|
|
echo -e "${YELLOW}[4/5] Verifying critical files...${NC}"
|
|
REQUIRED_FILES=(
|
|
"CHANGELOG_DEV.md"
|
|
"AFTER_PUSH_SETUP.md"
|
|
"prisma/migrations/create_activity_status.sql"
|
|
"docs/ai-image-generation/README.md"
|
|
)
|
|
MISSING=0
|
|
for file in "${REQUIRED_FILES[@]}"; do
|
|
if [ ! -f "$file" ]; then
|
|
echo -e "${RED}✗ Missing: $file${NC}"
|
|
MISSING=$((MISSING + 1))
|
|
fi
|
|
done
|
|
if [ $MISSING -eq 0 ]; then
|
|
echo -e "${GREEN}✓ All critical files present${NC}"
|
|
else
|
|
echo -e "${RED}✗ Missing $MISSING critical file(s)${NC}"
|
|
exit 1
|
|
fi
|
|
|
|
# Check 5: Check for .env.local in staging
|
|
echo -e "${YELLOW}[5/5] Checking for sensitive files...${NC}"
|
|
if git ls-files --error-unmatch .env.local > /dev/null 2>&1; then
|
|
echo -e "${RED}✗ DANGER: .env.local is staged for commit!${NC}"
|
|
echo "Run: git reset HEAD .env.local"
|
|
exit 1
|
|
else
|
|
echo -e "${GREEN}✓ No sensitive files staged${NC}"
|
|
fi
|
|
|
|
echo ""
|
|
echo -e "${GREEN}╔════════════════════════════════════════════════════════════╗${NC}"
|
|
echo -e "${GREEN}║ All Pre-Push Checks Passed! ✓ ║${NC}"
|
|
echo -e "${GREEN}╚════════════════════════════════════════════════════════════╝${NC}"
|
|
echo ""
|
|
|
|
# Show what will be committed
|
|
echo -e "${BLUE}📦 Changes to be committed:${NC}"
|
|
echo ""
|
|
git status --short
|
|
echo ""
|
|
|
|
# Ask for confirmation
|
|
echo -e "${YELLOW}Ready to commit and push to dev branch?${NC}"
|
|
read -p "Continue? (y/n) " -n 1 -r
|
|
echo
|
|
if [[ ! $REPLY =~ ^[Yy]$ ]]; then
|
|
echo -e "${RED}✗ Aborted by user${NC}"
|
|
exit 1
|
|
fi
|
|
|
|
# Stage all changes
|
|
echo -e "${BLUE}📝 Staging changes...${NC}"
|
|
git add .
|
|
|
|
# Commit with prepared message
|
|
echo -e "${BLUE}💾 Committing...${NC}"
|
|
if [ -f "COMMIT_MESSAGE.txt" ]; then
|
|
git commit -F COMMIT_MESSAGE.txt
|
|
echo -e "${GREEN}✓ Committed with prepared message${NC}"
|
|
else
|
|
echo -e "${YELLOW}⚠️ COMMIT_MESSAGE.txt not found, using default message${NC}"
|
|
git commit -m "feat: Fix hydration errors, navbar overlap, and add AI image generation system
|
|
|
|
- Fixed React hydration errors in ActivityFeed
|
|
- Fixed duplicate keys in About and Projects
|
|
- Fixed navbar overlapping hero section
|
|
- Fixed /manage redirect loop
|
|
- Added complete AI image generation system
|
|
- Added ActivityStatus database model
|
|
- Comprehensive documentation included
|
|
|
|
See CHANGELOG_DEV.md for details."
|
|
echo -e "${GREEN}✓ Committed with default message${NC}"
|
|
fi
|
|
|
|
# Push to remote
|
|
echo -e "${BLUE}🚀 Pushing to origin/dev...${NC}"
|
|
if git push origin dev; then
|
|
echo ""
|
|
echo -e "${GREEN}╔════════════════════════════════════════════════════════════╗${NC}"
|
|
echo -e "${GREEN}║ Successfully Pushed to Dev Branch! 🎉 ║${NC}"
|
|
echo -e "${GREEN}╚════════════════════════════════════════════════════════════╝${NC}"
|
|
echo ""
|
|
echo -e "${BLUE}Next Steps:${NC}"
|
|
echo " 1. Verify changes on remote: git log origin/dev --oneline -3"
|
|
echo " 2. Share AFTER_PUSH_SETUP.md with team members"
|
|
echo " 3. Test in staging environment"
|
|
echo " 4. Create PR to main when ready"
|
|
echo ""
|
|
echo -e "${YELLOW}⚠️ Remember: Team members must run database migration!${NC}"
|
|
echo " ./prisma/migrations/quick-fix.sh"
|
|
echo ""
|
|
else
|
|
echo ""
|
|
echo -e "${RED}✗ Push failed${NC}"
|
|
echo "Check your network connection and remote permissions"
|
|
exit 1
|
|
fi
|
|
|
|
# Show final commit
|
|
echo -e "${BLUE}📊 Latest commits:${NC}"
|
|
git log --oneline -3
|
|
echo ""
|
|
|
|
echo -e "${GREEN}✅ All done!${NC}"
|