Files
thrillwiki_django_no_react/shared/docs/memory-bank/decisions/reactivated-implementation-2025-01-19.md

5.6 KiB

Reactivated Implementation Analysis & Plan - January 19, 2025

Current Project Analysis Completed

Project Structure Overview

  • Framework: Django 5.0+ with comprehensive theme park management system
  • Package Management: UV (confirmed in .clinerules)
  • Frontend Stack: HTMX + AlpineJS + Tailwind CSS (to be replaced)
  • Database: PostGIS (GeoDjango enabled)
  • Authentication: Django Allauth with Google/Discord OAuth

Django Apps Identified

Core Apps:
- accounts (custom user model)
- parks (main entity)
- rides (park rides)
- operators (park operators) 
- property_owners (park ownership)
- manufacturers (ride manufacturers)
- designers (ride designers)
- reviews (user reviews)
- media (photo management)
- moderation (content moderation)
- search (search functionality)
- analytics (page view tracking)
- location (geographic data)
- history_tracking (audit trails)

Key Dependencies Analysis

# Current Dependencies (UV-managed)
Django = "^5.0"
django-htmx = "^1.17.2"          # TO BE REPLACED
django-tailwind-cli = "^2.21.1"  # COMPATIBLE
django-allauth = "^0.60.1"       # COMPATIBLE
django-pghistory = "^3.5.2"      # COMPATIBLE
psycopg2-binary = "^2.9.9"       # COMPATIBLE
django-cleanup = "^8.0.0"        # COMPATIBLE
whitenoise = "^6.6.0"            # COMPATIBLE

Template Structure Assessment

Current Templates (~100+ files):
- templates/base/base.html (main layout)
- templates/parks/*.html (park views)
- templates/rides/*.html (ride views) 
- templates/accounts/*.html (auth views)
- templates/moderation/*.html (admin views)
- templates/*/partials/*.html (HTMX partials)

Implementation Strategy Decision

Phase 1: Foundation Setup (Week 1)

  1. Install reactivated package via UV
  2. Configure Django settings for dual template backends
  3. Create client/ directory structure
  4. Setup TypeScript configuration
  5. Create base React components

Phase 2: Core Entity Templates (Weeks 2-4)

  1. Convert home.html to React
  2. Convert park list/detail templates
  3. Convert ride list/detail templates
  4. Create type-safe Django model interfaces

Phase 3: Authentication & Advanced Features (Weeks 5-6)

  1. Convert authentication templates
  2. Convert search functionality
  3. Convert moderation interface
  4. Implement AJAX endpoints with @interface decorator

Phase 4: Testing & Optimization (Week 7)

  1. Update test suite for React components
  2. Performance optimization
  3. Bundle size optimization
  4. Production deployment validation

Technical Decisions

1. Dual Template Backend Strategy

Decision: Keep both Django and JSX template backends during transition Rationale: Allows gradual migration without breaking existing functionality

TEMPLATES = [
    {
        "BACKEND": "django.template.backends.django.DjangoTemplates",
        # ... existing config
    },
    {
        "BACKEND": "reactivated.backend.JSX",
        "DIRS": [],
        "APP_DIRS": True,
        "OPTIONS": {
            "context_processors": [
                "django.contrib.messages.context_processors.messages",
                "django.template.context_processors.csrf",
                "django.template.context_processors.request",
                "django.template.context_processors.static",
            ]
        },
    },
]

2. Project Structure

Decision: Create client/ directory at project root Rationale: Follows reactivated best practices

thrillwiki_django_no_react/
├── client/                    # NEW: React components
│   ├── index.tsx             # Client entry point  
│   ├── components/           # Reusable components
│   │   ├── Layout.tsx
│   │   ├── forms/
│   │   └── ui/
│   ├── templates/            # Page templates
│   │   ├── HomePage.tsx
│   │   ├── parks/
│   │   ├── rides/
│   │   └── accounts/
│   └── types/                # TypeScript definitions
├── package.json              # NEW: Node.js dependencies
├── tsconfig.json            # NEW: TypeScript config
└── ... existing Django structure

3. Type Safety Strategy

Decision: Use reactivated's Pick utility for selective model serialization Rationale: Provides type safety while controlling data transfer

from reactivated import Pick, template
from typing import Literal

# Example: Park detail template
ParkPick = Pick[Park, Literal[
    "id", "name", "slug", "description", "status",
    "opening_date", "website", "operator.name", 
    "location.latitude", "location.longitude"
]]

@template
class ParkDetail(NamedTuple):
    park: ParkPick
    rides_count: int
    photos: List[Photo]

4. CSS/Styling Strategy

Decision: Maintain Tailwind CSS within React components Rationale: Existing Tailwind setup is working well, no need to change

5. HTMX Migration Strategy

Decision: Replace HTMX partial updates with React state management Rationale: React provides better state management and component reusability

Entity Relationship Compliance

All implementations will follow the established .clinerules entity relationships:

  • Parks → Operators (required)
  • Parks → PropertyOwners (optional)
  • Rides → Parks (required)
  • Rides → Manufacturers/Designers (optional)

Next Steps

  1. Begin Phase 1 implementation
  2. Install reactivated package using UV
  3. Configure Django settings
  4. Create basic React infrastructure

Decision Date: 2025-01-19 Status: Implementation Plan Approved Estimated Timeline: 7 weeks total