From 0e05769581ce3c00ab7a1a8133db72225e018a6d Mon Sep 17 00:00:00 2001 From: Paul Bailey Date: Tue, 18 Nov 2025 00:31:44 +0000 Subject: [PATCH] Rebrand application from 'Beach Litter Mapping Platform' to 'Litter Scouts' - Updated app name in all source files, documentation, and configuration - Changed package names in package.json files - Updated header, titles, and user-facing text - Modified email templates and notification text - Updated steering rules and spec documents --- .dockerignore | 25 ++++++++ .env.docker | 24 +++++++ .env.docker.example | 0 .kiro/specs/beach-litter-mapping/design.md | 4 +- .../beach-litter-mapping/requirements.md | 4 +- .kiro/steering/product.md | 2 +- DOCKER_SETUP.md | 0 Dockerfile | 62 +++++++++++++++++++ Dockerfile.backend | 28 +++++++++ Dockerfile.frontend | 29 +++++++++ README.md | 4 +- docker-compose.yml | 54 ++++++++++++++++ index.html | 2 +- nginx.conf | 33 ++++++++++ package.json | 2 +- server/Dockerfile | 49 +++++++++++++++ server/README.md | 4 +- server/package.json | 4 +- server/src/scripts/testEmail.ts | 4 +- server/src/services/emailService.ts | 8 +-- src/README.md | 4 +- src/components/README.md | 2 +- src/components/auth/SignInPage.tsx | 2 +- src/components/layout/Header.tsx | 2 +- src/hooks/index.ts | 2 +- src/types/index.ts | 2 +- src/utils/index.ts | 2 +- vite.config.js | 6 +- 28 files changed, 334 insertions(+), 30 deletions(-) create mode 100644 .dockerignore create mode 100644 .env.docker create mode 100644 .env.docker.example create mode 100644 DOCKER_SETUP.md create mode 100644 Dockerfile create mode 100644 Dockerfile.backend create mode 100644 Dockerfile.frontend create mode 100644 docker-compose.yml create mode 100644 nginx.conf create mode 100644 server/Dockerfile diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..8b4732f --- /dev/null +++ b/.dockerignore @@ -0,0 +1,25 @@ +node_modules +dist +.git +.gitignore +*.md +.env +.env.local +.env.*.local +npm-debug.log* +yarn-debug.log* +yarn-error.log* +.DS_Store +coverage +.vscode +.idea +*.swp +*.swo +*~ +.kiro +uploads/* +!uploads/.gitkeep +server/node_modules +server/dist +server/uploads/* +!server/uploads/.gitkeep diff --git a/.env.docker b/.env.docker new file mode 100644 index 0000000..414967d --- /dev/null +++ b/.env.docker @@ -0,0 +1,24 @@ +# Docker Environment Configuration +# Copy this to .env and fill in your actual values + +# Database (your existing MySQL server) +DATABASE_URL=mysql://beach_litter_user:BeachClean2024!@192.168.4.20:3306/beach_litter_mapping + +# Clerk Authentication +CLERK_SECRET_KEY=sk_test_your_secret_key_here +CLERK_WEBHOOK_SECRET=whsec_your_webhook_secret_here +VITE_CLERK_PUBLISHABLE_KEY=pk_test_your_publishable_key_here + +# Server Configuration +MAX_FILE_SIZE=5242880 + +# External APIs +OPENWEATHER_API_KEY=your_openweather_api_key_here + +# Email Notifications (AhaSend) +AHASEND_API_KEY=your_ahasend_api_key_here +FROM_EMAIL=Beach Litter Platform + +# Frontend URL (adjust for production) +FRONTEND_URL=http://localhost +VITE_API_BASE_URL=http://localhost:3000 diff --git a/.env.docker.example b/.env.docker.example new file mode 100644 index 0000000..e69de29 diff --git a/.kiro/specs/beach-litter-mapping/design.md b/.kiro/specs/beach-litter-mapping/design.md index 28b68b5..a373045 100644 --- a/.kiro/specs/beach-litter-mapping/design.md +++ b/.kiro/specs/beach-litter-mapping/design.md @@ -1,8 +1,8 @@ -# Beach Litter Mapping Platform - Design Document +# Litter Scouts - Design Document ## Overview -The Beach Litter Mapping Platform is a full-stack web application that enables crowdsourced environmental monitoring of Irish coastal areas. The system combines modern web technologies with geospatial data processing to create an interactive platform for reporting, visualizing, and addressing beach litter and environmental concerns. +Litter Scouts is a full-stack web application that enables crowdsourced environmental monitoring of Irish coastal areas. The system combines modern web technologies with geospatial data processing to create an interactive platform for reporting, visualizing, and addressing beach litter and environmental concerns. ### Technology Stack diff --git a/.kiro/specs/beach-litter-mapping/requirements.md b/.kiro/specs/beach-litter-mapping/requirements.md index 0e0fa1d..b9a5d1d 100644 --- a/.kiro/specs/beach-litter-mapping/requirements.md +++ b/.kiro/specs/beach-litter-mapping/requirements.md @@ -2,11 +2,11 @@ ## Introduction -The Beach Litter Mapping Platform is a web-based application designed to crowdsource environmental data about beach litter and other coastal concerns across Ireland. The system empowers communities to report, visualize, and address environmental issues through interactive mapping, data analytics, and coordinated clean-up events. By providing real-time visibility into coastal pollution patterns, the platform aims to raise awareness, drive community engagement, and support evidence-based environmental action. +Litter Scouts is a web-based application designed to crowdsource environmental data about beach litter and other coastal concerns across Ireland. The system empowers communities to report, visualize, and address environmental issues through interactive mapping, data analytics, and coordinated clean-up events. By providing real-time visibility into coastal pollution patterns, the platform aims to raise awareness, drive community engagement, and support evidence-based environmental action. ## Glossary -- **Platform**: The Beach Litter Mapping web application system +- **Platform**: The Litter Scouts web application system - **User**: Any person accessing the Platform, including reporters, volunteers, and viewers - **Litter Report**: A user-submitted record documenting observed beach litter or environmental concerns - **Map Interface**: The interactive map component displaying geographical data and litter overlays diff --git a/.kiro/steering/product.md b/.kiro/steering/product.md index 0f4034f..c9e90a9 100644 --- a/.kiro/steering/product.md +++ b/.kiro/steering/product.md @@ -1,6 +1,6 @@ # Product Overview -The Beach Litter Mapping Platform is a crowdsourced environmental monitoring web application for Irish coastal areas. It enables users to report beach litter with photos and GPS coordinates, visualize pollution patterns on interactive maps, organize cleanup events, and analyze environmental data. +Litter Scouts is a crowdsourced environmental monitoring web application for Irish coastal areas. It enables users to report beach litter with photos and GPS coordinates, visualize pollution patterns on interactive maps, organize cleanup events, and analyze environmental data. ## Core Features diff --git a/DOCKER_SETUP.md b/DOCKER_SETUP.md new file mode 100644 index 0000000..e69de29 diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..e878dbc --- /dev/null +++ b/Dockerfile @@ -0,0 +1,62 @@ +# Multi-stage build for Litter Scouts frontend +FROM node:20-alpine AS frontend-builder + +WORKDIR /app + +# Copy frontend package files +COPY package*.json ./ +RUN npm ci + +# Copy frontend source +COPY . . + +# Build frontend +RUN npm run build + +# Backend builder stage +FROM node:20-alpine AS backend-builder + +WORKDIR /app + +# Copy backend package files +COPY server/package*.json ./ +RUN npm ci + +# Copy backend source and prisma +COPY server/ ./ + +# Generate Prisma client +RUN npx prisma generate + +# Build backend +RUN npm run build + +# Production stage +FROM node:20-alpine + +WORKDIR /app + +# Install production dependencies for backend +COPY server/package*.json ./ +RUN npm ci --only=production + +# Copy built backend +COPY --from=backend-builder /app/dist ./dist +COPY --from=backend-builder /app/node_modules/.prisma ./node_modules/.prisma +COPY --from=backend-builder /app/prisma ./prisma + +# Copy built frontend to serve statically +COPY --from=frontend-builder /app/dist ./public + +# Create uploads directory +RUN mkdir -p ./uploads + +# Expose port +EXPOSE 3000 + +# Health check +HEALTHCHECK --interval=30s --timeout=3s --start-period=40s \ + CMD node -e "require('http').get('http://localhost:3000/health', (r) => {process.exit(r.statusCode === 200 ? 0 : 1)})" + +# Start the application +CMD ["node", "dist/index.js"] diff --git a/Dockerfile.backend b/Dockerfile.backend new file mode 100644 index 0000000..d93632f --- /dev/null +++ b/Dockerfile.backend @@ -0,0 +1,28 @@ +# Backend Dockerfile +FROM node:20-alpine + +WORKDIR /app + +# Copy package files +COPY server/package*.json ./ + +# Install dependencies +RUN npm ci + +# Copy prisma schema first for generation +COPY server/prisma ./prisma + +# Generate Prisma client +RUN npx prisma generate + +# Copy source code +COPY server/ . + +# Build TypeScript +RUN npm run build + +# Expose port +EXPOSE 3000 + +# Start the application +CMD ["npm", "start"] diff --git a/Dockerfile.frontend b/Dockerfile.frontend new file mode 100644 index 0000000..8466bb8 --- /dev/null +++ b/Dockerfile.frontend @@ -0,0 +1,29 @@ +# Frontend Dockerfile +FROM node:20-alpine AS builder + +WORKDIR /app + +# Copy package files +COPY package*.json ./ + +# Install dependencies +RUN npm ci + +# Copy source code +COPY . . + +# Build the application +RUN npm run build + +# Production stage with nginx +FROM nginx:alpine + +# Copy built assets from builder +COPY --from=builder /app/dist /usr/share/nginx/html + +# Copy nginx configuration +COPY nginx.conf /etc/nginx/conf.d/default.conf + +EXPOSE 80 + +CMD ["nginx", "-g", "daemon off;"] diff --git a/README.md b/README.md index 18bc70e..1cbee82 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ -# React + Vite +# Litter Scouts -This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. +Crowdsourced environmental monitoring web application for Irish coastal areas. Currently, two official plugins are available: diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..59c84fe --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,54 @@ +version: '3.8' + +services: + app: + build: + context: . + dockerfile: Dockerfile + container_name: litter-scouts + ports: + - "3000:3000" + environment: + - NODE_ENV=production + - PORT=3000 + - DATABASE_URL=${DATABASE_URL} + - CLERK_SECRET_KEY=${CLERK_SECRET_KEY} + - CLERK_WEBHOOK_SECRET=${CLERK_WEBHOOK_SECRET} + - UPLOAD_DIR=/app/uploads + - MAX_FILE_SIZE=${MAX_FILE_SIZE:-5242880} + - OPENWEATHER_API_KEY=${OPENWEATHER_API_KEY} + - AHASEND_API_KEY=${AHASEND_API_KEY} + - FROM_EMAIL=${FROM_EMAIL} + - FRONTEND_URL=${FRONTEND_URL:-http://localhost:3000} + volumes: + - ./uploads:/app/uploads + - ./server/prisma:/app/prisma + restart: unless-stopped + depends_on: + - db-check + networks: + - litter-scouts-network + + # Database connectivity check service + db-check: + image: mysql:8.0 + container_name: litter-scouts-db-check + command: > + sh -c " + until mysql -h ${DB_HOST} -P ${DB_PORT} -u ${DB_USER} -p${DB_PASSWORD} -e 'SELECT 1'; do + echo 'Waiting for database...'; + sleep 2; + done; + echo 'Database is ready!'; + " + environment: + - DB_HOST=${DB_HOST} + - DB_PORT=${DB_PORT} + - DB_USER=${DB_USER} + - DB_PASSWORD=${DB_PASSWORD} + networks: + - litter-scouts-network + +networks: + litter-scouts-network: + driver: bridge diff --git a/index.html b/index.html index 6ac2528..444cd05 100644 --- a/index.html +++ b/index.html @@ -4,7 +4,7 @@ - Beach Litter Mapping Platform + Litter Scouts
diff --git a/nginx.conf b/nginx.conf new file mode 100644 index 0000000..4eae2a3 --- /dev/null +++ b/nginx.conf @@ -0,0 +1,33 @@ +server { + listen 80; + server_name localhost; + root /usr/share/nginx/html; + index index.html; + + # Gzip compression + gzip on; + gzip_vary on; + gzip_min_length 1024; + gzip_types text/plain text/css text/xml text/javascript application/x-javascript application/xml+rss application/json application/javascript; + + # Security headers + add_header X-Frame-Options "SAMEORIGIN" always; + add_header X-Content-Type-Options "nosniff" always; + add_header X-XSS-Protection "1; mode=block" always; + + # Handle React Router + location / { + try_files $uri $uri/ /index.html; + } + + # Cache static assets + location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ { + expires 1y; + add_header Cache-Control "public, immutable"; + } + + # Don't cache index.html + location = /index.html { + add_header Cache-Control "no-cache, no-store, must-revalidate"; + } +} diff --git a/package.json b/package.json index b362021..6af1a6e 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "ocean-cleanup", + "name": "litter-scouts", "private": true, "version": "0.0.0", "type": "module", diff --git a/server/Dockerfile b/server/Dockerfile new file mode 100644 index 0000000..e5b2090 --- /dev/null +++ b/server/Dockerfile @@ -0,0 +1,49 @@ +# Backend Dockerfile +FROM node:20-alpine AS builder + +WORKDIR /app + +# Copy package files +COPY package*.json ./ + +# Install dependencies +RUN npm ci + +# Copy prisma schema +COPY prisma ./prisma + +# Generate Prisma client +RUN npx prisma generate + +# Copy source code +COPY . . + +# Build TypeScript +RUN npm run build + +# Production stage +FROM node:20-alpine + +WORKDIR /app + +# Copy package files +COPY package*.json ./ + +# Install production dependencies only +RUN npm ci --only=production + +# Copy prisma schema and generated client +COPY --from=builder /app/prisma ./prisma +COPY --from=builder /app/node_modules/.prisma ./node_modules/.prisma + +# Copy built application +COPY --from=builder /app/dist ./dist + +# Create uploads directory +RUN mkdir -p uploads + +# Expose port +EXPOSE 3000 + +# Start the application +CMD ["node", "dist/index.js"] diff --git a/server/README.md b/server/README.md index fdc2ea9..18d8635 100644 --- a/server/README.md +++ b/server/README.md @@ -1,6 +1,6 @@ -# Beach Litter Mapping API +# Litter Scouts API -Backend API server for the Beach Litter Mapping Platform. +Backend API server for Litter Scouts. ## Setup diff --git a/server/package.json b/server/package.json index 5df47e9..3e0b9c5 100644 --- a/server/package.json +++ b/server/package.json @@ -1,7 +1,7 @@ { - "name": "beach-litter-api", + "name": "litter-scouts-api", "version": "1.0.0", - "description": "Backend API for Beach Litter Mapping Platform", + "description": "Backend API for Litter Scouts", "main": "dist/index.js", "scripts": { "dev": "tsx watch src/index.ts", diff --git a/server/src/scripts/testEmail.ts b/server/src/scripts/testEmail.ts index bdbff56..a45fb64 100644 --- a/server/src/scripts/testEmail.ts +++ b/server/src/scripts/testEmail.ts @@ -22,8 +22,8 @@ async function testEmail() { const success = await emailService.sendEmail({ to: testEmail, - subject: 'Beach Litter Platform - Test Email', - text: 'This is a test email from the Beach Litter Mapping Platform. If you received this, email notifications are working correctly!', + subject: 'Litter Scouts - Test Email', + text: 'This is a test email from Litter Scouts. If you received this, email notifications are working correctly!', }); if (success) { diff --git a/server/src/services/emailService.ts b/server/src/services/emailService.ts index d2bb501..66475e7 100644 --- a/server/src/services/emailService.ts +++ b/server/src/services/emailService.ts @@ -88,7 +88,7 @@ ${message} ${relatedType && relatedId ? `View details: ${this.getDetailsUrl(relatedType, relatedId)}` : ''} --- -Beach Litter Mapping Platform +Litter Scouts To manage your notification preferences, visit your profile settings. `.trim(); @@ -122,7 +122,7 @@ To manage your notification preferences, visit your profile settings. ` : ''} @@ -177,8 +177,8 @@ To manage your notification preferences, visit your profile settings. const success = await this.sendEmail({ to: testEmail, - subject: 'Beach Litter Platform - Email Test', - text: 'This is a test email from the Beach Litter Mapping Platform. If you received this, email notifications are working correctly!', + subject: 'Litter Scouts - Email Test', + text: 'This is a test email from Litter Scouts. If you received this, email notifications are working correctly!', }); return success; diff --git a/src/README.md b/src/README.md index aaff9c5..9e226b8 100644 --- a/src/README.md +++ b/src/README.md @@ -1,6 +1,6 @@ -# Beach Litter Mapping Platform - Source Code +# Litter Scouts - Source Code -This directory contains the frontend source code for the Beach Litter Mapping Platform. +This directory contains the frontend source code for Litter Scouts. ## Project Structure diff --git a/src/components/README.md b/src/components/README.md index 74a7dd3..78e24ec 100644 --- a/src/components/README.md +++ b/src/components/README.md @@ -1,6 +1,6 @@ # Components Directory -This directory contains all React components for the Beach Litter Mapping Platform. +This directory contains all React components for Litter Scouts. ## Structure diff --git a/src/components/auth/SignInPage.tsx b/src/components/auth/SignInPage.tsx index 7d340ab..7994dce 100644 --- a/src/components/auth/SignInPage.tsx +++ b/src/components/auth/SignInPage.tsx @@ -15,7 +15,7 @@ export function SignInPage() {

- Sign in to Beach Litter Mapping + Sign in to Litter Scouts

Join the community in tracking and cleaning coastal pollution diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx index f1738ef..f7f2537 100644 --- a/src/components/layout/Header.tsx +++ b/src/components/layout/Header.tsx @@ -27,7 +27,7 @@ export function Header() {

- Beach Litter Mapping + Litter Scouts

diff --git a/src/hooks/index.ts b/src/hooks/index.ts index d4097de..929babb 100644 --- a/src/hooks/index.ts +++ b/src/hooks/index.ts @@ -1,4 +1,4 @@ -// Custom React hooks for the Beach Litter Mapping Platform +// Custom React hooks for Litter Scouts export { default as useGeolocation } from './useGeolocation'; export { useAuth } from './useAuth'; diff --git a/src/types/index.ts b/src/types/index.ts index 770017b..76593ba 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -1,4 +1,4 @@ -// Core type definitions for the Beach Litter Mapping Platform +// Core type definitions for Litter Scouts export type LitterType = 'plastic' | 'metal' | 'glass' | 'organic' | 'hazardous' | 'other'; diff --git a/src/utils/index.ts b/src/utils/index.ts index 6d7ee57..4a0ed32 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,4 +1,4 @@ -// Utility functions for the Beach Litter Mapping Platform +// Utility functions for Litter Scouts // Re-export coordinate utilities export * from './coordinates'; diff --git a/vite.config.js b/vite.config.js index ff1ca01..c35ce8e 100644 --- a/vite.config.js +++ b/vite.config.js @@ -9,7 +9,7 @@ export default defineConfig({ host: true, // Allow external access allowedHosts: [ 'localhost', - 'litter.psbailey.uk', + 'litterscouts.psbailey.uk', '.psbailey.uk', // Allow all subdomains ], }, @@ -19,8 +19,8 @@ export default defineConfig({ registerType: 'autoUpdate', includeAssets: ['vite.svg'], manifest: { - name: 'Beach Litter Mapping Platform', - short_name: 'Beach Cleanup', + name: 'Litter Scouts', + short_name: 'Litter Scouts', description: 'Crowdsourced environmental monitoring of Irish coastal areas', theme_color: '#0ea5e9', background_color: '#ffffff',