cultureat-bak/.claude/TASKS.md

TASKS.md - CCAT Project Task Management

Task Status Instructions

Use GitHub-style checkboxes to mark task completion:

• - [ ] for uncompleted tasks
• - [x] for completed tasks
• Add notes or comments after tasks using <!-- Notes: ... -->

---

Milestone 1: Foundation & Setup

WordPress Theme Structure

• Create basic WordPress theme structure with functions.php and style.css
• Set up composer.json with WPackagist dependencies
• Create directory structure (acf-json/, includes/, app/, server/, shared/)
• Configure Nuxt 4 within WordPress theme context
• Set up basic theme activation and WordPress integration

Development Environment

• Configure Gitea Actions for CI/CD pipeline
• Set up local development environment
• Configure environment variables for development/production
• Set up hot reloading for Nuxt within WordPress theme
• Create basic build scripts and deployment configuration

Core Plugins & Dependencies

• Install and configure WPGraphQL plugin
• Install and configure WPGraphQL JWT Authentication
• Install and configure Advanced Custom Fields (ACF) Pro
• Install and configure ACF Extended Pro
• Configure GraphQL schema and test basic queries

---

Milestone 2: Content Structure & Data Models

Custom Post Types (CPT)

• Create Contributor CPT (artist/organization profiles)
• Create Event CPT (base event descriptions)
• Create Listing CPT (job offers/proposals with deadlines)
• Create Location CPT (venue information, hierarchical)
• Create Profile CPT (user cultural profiles)
• Create Project CPT (CCAT projects)
• Create Representation CPT (event instances)
• Create Resource CPT (document/link repository)
• Create Template CPT (reusable content blocks)

Custom Taxonomies

• Create Discipline taxonomy (artistic/cultural categories)
• Create Listing Category taxonomy
• Create Project Category taxonomy
• Create Resource Category taxonomy
• Configure taxonomy relationships with CPTs

ACF Field Groups

• Design and create ACF fields for Contributor CPT
• Design and create ACF fields for Event CPT
• Design and create ACF fields for Listing CPT
• Design and create ACF fields for Location CPT (venue/room hierarchy)
• Design and create ACF fields for Profile CPT
• Design and create ACF fields for Project CPT
• Design and create ACF fields for Representation CPT
• Design and create ACF fields for Resource CPT
• Create flexible content field groups for dynamic layouts
• Set up ACF options page for site-wide settings

WPGraphQL Integration

• Configure GraphQL schema for all CPTs
• Configure GraphQL schema for all taxonomies
• Configure GraphQL schema for ACF fields
• Test GraphQL queries for all content types
• Set up GraphQL authentication and permissions
• Customize MediaItem GraphQL type to include center (x/y) fields

---

Milestone 3: Authentication & User Management

JWT Authentication System

• Configure JWT authentication for WPGraphQL
• Create useAuth composable for token management
• Implement user registration flow
• Implement user login flow
• Implement JWT token refresh mechanism
• Handle authentication errors and edge cases

User Roles & Permissions

• Define custom user roles (member, premium, admin)
• Configure user capabilities and permissions
• Implement user registration with email verification
• Create user profile management system
• Link user accounts to Profile CPT

Member Signup & Management

• Create useMemberSignup composable
• Create useMemberArea composable
• Build member registration forms
• Build member profile editing interface
• Implement membership tier upgrades
• Create admin user impersonation functionality

---

Milestone 4: Core Nuxt Components

Base Component Architecture

• Set up Nuxt UI integration
• Create base layout structure
• Design component organization system

Node Components (Main Page Components)

• Create node component for Event pages
• Create node component for Listing pages
• Create node component for Location pages
• Create node component for Profile pages
• Create node component for Project pages
• Create node component for Resource pages
• Create useNodeByUri composable for content fetching

Site Components (Global)

• Create header component with navigation
• Create footer component
• Create main navigation system
• Create breadcrumb navigation (excluding virtual pages)
• Create search functionality
• Implement responsive navigation for mobile

Authentication Components

• Create login form component
• Create registration form component
• Create password reset component
• Create protected route middleware
• Create user profile components
• Create member zone dashboard

---

Milestone 5: Content Management & Flexible Layouts

Flexible Content Sections

• Create section components for ACF flexible fields
• Design reusable content block system
• Implement Template CPT integration
• Create dynamic section rendering system
• Build content editor interface
• Create additional section components (Hero, Gallery, CTA, etc.)
• Implement section preview in admin
• Add section styling and layout options

ACF Extended Pro Preview System

• Configure ACF Extended Pro preview templates
• Set up iframe preview system
• Implement SSR rendering for preview content
• Create preview layouts in /layouts directory
• Implement reusable template replacement logic
• Test real-time preview functionality

Content Features

• Implement image uploads with point-of-interest cropping
• Create automated URL redirect system
• Implement virtual pages (redirect to first child)
• Build content search and filtering
• Create content categorization system
• Handle richtext content display on frontend

Missing Core Components

• Create TheContributor node component
• Create TheRepresentation node component
• Implement menu system integration
• Create user management components for profiles
• Build admin dashboard components
• Complete footer top section implementation

---

Milestone 6: Event System & Calendar

Event Management

• Design event-representation relationship system
• Create event creation and editing interface
• Build event listing and detail pages
• Implement event approval workflow for admins
• Create event search and filtering system

Interactive Calendar

• Integrate Leaflet maps for location display
• Build calendar component with multiple views (month/week/day/list)
• Implement event filtering and search
• Create event detail modal/popup
• Add calendar navigation and date selection
• Connect events to representations for calendar display
• Add location markers on map integration

Event Subscriptions

• Design event subscription system
• Create subscription forms (free events)
• Implement waitlist management
• Build bulk attendee registration for admins
• Create subscription confirmation system
• Add subscription cancellation functionality

---

Milestone 7: Utilities & Composables

Core Composables

• Create useResponsive composable for responsive utilities
• Create useSiteOptions composable for ACF options page
• Build error handling utilities
• Create loading state management
• Implement cache management utilities

GraphQL Operations

• Create GraphQL operation files (.gql) in /app/graphql/
• Set up GraphQL codegen for TypeScript types
• Create reusable GraphQL fragments
• Implement GraphQL error handling
• Add GraphQL query optimization
• Create GraphQL operations for all CPTs
• Implement pagination for large datasets
• Add GraphQL subscriptions for real-time updates

---

Milestone 8: Third-Party Integrations (PHP)

Mailchimp Integration

• Set up Mailchimp PHP SDK
• Create user synchronization system
• Implement newsletter subscription management
• Build transactional email system
• Create email template system
• Add merge field synchronization

Stripe Integration

• Set up Stripe PHP SDK
• Implement payment processing for premium memberships
• Create subscription billing system
• Build payment webhook handling
• Implement refund processing
• Add payment analytics and reporting

AirTable Import System

• Design non-destructive import system
• Create AirTable API integration
• Build field mapping interface
• Implement incremental updates
• Add import validation and error handling
• Create import history and rollback functionality

---

Milestone 9: Advanced Features

Admin Tools

• Create admin dashboard
• Build user management interface
• Implement content moderation tools
• Create event subscription management
• Add analytics and reporting features
• Build system configuration interface

Event Webscraping Tool

• Design webscraping architecture
• Create external event source configuration
• Build automated event discovery system
• Implement data validation and normalization
• Add duplicate detection and management
• Create admin review and approval workflow

Premium Membership Features

• Design premium feature system
• Enhanced profile visibility
• Priority event listings
• Advanced analytics for members
• Additional content creation tools
• Premium support features

---

Milestone 10: Additional Implementations

Missing UI Components

• Create custom form components for user-generated content
• Build notification/toast system
• Create loading states and skeleton screens
• Implement modal/dialog system
• Build file upload components with progress
• Create responsive tables for admin data

Enhanced Features

• Add real-time validation for forms
• Implement advanced search with filters
• Create bookmark/favorite system for events
• Add social sharing components
• Implement print-friendly views

---

Milestone 11: UI/UX & Polish

Custom UI Components

• Design and build custom UI component library
• Create consistent styling system
• Implement responsive design patterns
• Add animations and transitions
• Build accessibility features
• Create component documentation

Mobile Optimization

• Optimize all components for mobile
• Implement touch-friendly interactions
• Create mobile-specific navigation
• Optimize performance for mobile devices
• Test across different screen sizes

---

Milestone 11: Testing & Quality Assurance

Unit Testing

• Set up testing framework
• Write tests for composables
• Test utility functions
• Create mock data for testing
• Add continuous integration testing

Integration Testing

• Test GraphQL operations
• Test WordPress/PHP integration
• Validate third-party integrations
• Test user authentication flows
• Verify payment processing

End-to-End Testing

• Test complete user registration flow
• Test event creation and subscription
• Test member area functionality
• Test admin workflows
• Test content preview system

---

Milestone 12: Performance & Optimization

Performance Optimization

• Optimize GraphQL queries (prevent N+1)
• Implement caching strategies
• Optimize images with @nuxt/image
• Minimize bundle sizes
• Implement lazy loading
• Monitor Core Web Vitals

Security Audit

• Review authentication security
• Validate input sanitization
• Test API security
• Review payment security
• Implement security headers
• Run security vulnerability scans

---

Milestone 13: Launch Preparation

Content Migration

• Migrate existing content from current systems
• Set up initial user accounts
• Import event data
• Configure site-wide settings
• Test content import process

Documentation & Training

• Create user documentation
• Write admin training materials
• Document API endpoints
• Create troubleshooting guides
• Record training videos

Final Testing & Deployment

• Complete end-to-end testing
• Performance testing under load
• Cross-browser compatibility testing
• Mobile device testing
• Production deployment
• Post-launch monitoring setup

---

Current Technical Debt

• Implement complete member signup flow
• Complete member area functionality
• Add comprehensive error boundaries
• Implement proper loading states across app
• Add input validation and sanitization
• Create comprehensive TypeScript types

---

Post-Launch Tasks

Ongoing Maintenance

• Set up monitoring and alerting
• Create backup procedures
• Plan regular security updates
• Monitor performance metrics
• Gather user feedback
• Plan feature iterations

---

---

Current Status Summary (Updated)

✅ Completed Phases:

• Foundation & Setup: ~95% complete (Milestone 1)
• Content Structure: ~90% complete (Milestone 2)
• Authentication Core: ~80% complete (Milestone 3)
• Basic Components: ~70% complete (Milestone 4)

🚧 In Progress:

• Content Management: ~60% complete (Milestone 5)
• Core Composables: ~70% complete (Milestone 7)

⏳ Next Priority Areas:

1. Member Area Completion - Critical (useMemberSignup & useMemberArea composables)
2. Event System Implementation - High Priority (including backend Representation data)
3. Event Calendar Integration - High Priority (Leaflet maps)
4. Footer Completion - Medium Priority (TheSiteFooter top section)
5. Third-party Integrations - Medium Priority

📊 Overall Project Status: ~65% Complete

Notes:

• Mark completed tasks with [x]
• Add comments or blockers using <!-- Notes: ... --> after tasks
• Update this file regularly during development
• Use this file to track progress and plan work sessions
• Priority levels: Critical > High > Medium > Low