Fix new Frontend 1

scripts/fix-frontend.sh

@@ -0,0 +1,201 @@
+#!/bin/bash
+# scripts/fix-frontend.sh - Frontend troubleshooting script
+
+set -e
+
+GREEN='\033[0;32m'
+BLUE='\033[0;34m'
+RED='\033[0;31m'
+YELLOW='\033[0;33m'
+NC='\033[0m'
+
+print_step() {
+    echo -e "${BLUE}[FRONTEND-FIX]${NC} $1"
+}
+
+print_success() {
+    echo -e "${GREEN}[SUCCESS]${NC} $1"
+}
+
+print_error() {
+    echo -e "${RED}[ERROR]${NC} $1"
+}
+
+print_warning() {
+    echo -e "${YELLOW}[WARNING]${NC} $1"
+}
+
+# Check if we're in the right directory
+if [ ! -f "docker-compose.yml" ]; then
+    print_error "docker-compose.yml not found. Please run this script from the project root."
+    exit 1
+fi
+
+print_step "Starting frontend troubleshooting..."
+
+# Step 1: Check frontend directory structure
+print_step "Checking frontend directory structure..."
+if [ ! -d "frontend" ]; then
+    print_error "Frontend directory not found!"
+    exit 1
+fi
+
+cd frontend
+
+# Step 2: Check package.json exists
+if [ ! -f "package.json" ]; then
+    print_error "package.json not found in frontend directory!"
+    exit 1
+fi
+print_success "package.json found"
+
+# Step 3: Generate package-lock.json if missing
+if [ ! -f "package-lock.json" ]; then
+    print_warning "package-lock.json not found. Generating..."
+    npm install
+    print_success "package-lock.json generated"
+else
+    print_success "package-lock.json found"
+fi
+
+# Step 4: Check for missing directories
+print_step "Creating missing directories..."
+mkdir -p src/pages
+mkdir -p src/components
+mkdir -p src/hooks
+mkdir -p src/services
+mkdir -p src/utils
+mkdir -p public
+print_success "Directory structure verified"
+
+# Step 5: Check for App.tsx
+if [ ! -f "src/App.tsx" ]; then
+    print_warning "src/App.tsx not found. Creating basic App.tsx..."
+    
+    cat > src/App.tsx << 'EOF'
+import React from 'react'
+import { BrowserRouter as Router, Routes, Route } from 'react-router-dom'
+
+function App() {
+  return (
+    <Router>
+      <div className="App min-h-screen bg-gray-50">
+        <div className="container mx-auto px-4 py-8">
+          <h1 className="text-3xl font-bold text-gray-900 mb-6">
+            🥖 PanIA Dashboard
+          </h1>
+          <div className="bg-white rounded-lg shadow p-6">
+            <h2 className="text-xl font-semibold mb-4">
+              Bienvenido a PanIA
+            </h2>
+            <p className="text-gray-600">
+              Sistema de predicción de demanda para panaderías en Madrid
+            </p>
+          </div>
+        </div>
+      </div>
+    </Router>
+  )
+}
+
+export default App
+EOF
+    print_success "Basic App.tsx created"
+else
+    print_success "App.tsx found"
+fi
+
+# Step 6: Check for index.css
+if [ ! -f "src/index.css" ]; then
+    print_warning "src/index.css not found. Creating basic CSS..."
+    
+    cat > src/index.css << 'EOF'
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}
+EOF
+    print_success "Basic index.css created"
+else
+    print_success "index.css found"
+fi
+
+# Step 7: Go back to project root
+cd ..
+
+# Step 8: Stop and remove the frontend container
+print_step "Stopping and removing existing frontend container..."
+docker-compose stop dashboard 2>/dev/null || true
+docker-compose rm -f dashboard 2>/dev/null || true
+
+# Step 9: Remove the image to force rebuild
+print_step "Removing frontend image to force rebuild..."
+docker rmi bakery/dashboard:latest 2>/dev/null || true
+
+# Step 10: Check .env file
+if [ ! -f ".env" ]; then
+    print_warning ".env file not found. Creating from example..."
+    if [ -f ".env.example" ]; then
+        cp .env.example .env
+        print_success ".env created from .env.example"
+    else
+        # Create minimal .env
+        cat > .env << 'EOF'
+ENVIRONMENT=development
+DASHBOARD_PORT=3000
+GATEWAY_PORT=8000
+IMAGE_TAG=latest
+EOF
+        print_success "Minimal .env created"
+    fi
+fi
+
+# Step 11: Rebuild the frontend service
+print_step "Rebuilding frontend service..."
+docker-compose build --no-cache dashboard
+
+# Step 12: Start the frontend service
+print_step "Starting frontend service..."
+docker-compose up -d dashboard
+
+# Step 13: Wait and check status
+print_step "Waiting for frontend to start..."
+sleep 10
+
+# Check if container is running
+if docker-compose ps dashboard | grep -q "Up"; then
+    print_success "Frontend container is running!"
+    print_step "Checking logs..."
+    docker-compose logs --tail=20 dashboard
+    
+    print_step "Testing frontend health..."
+    sleep 5
+    if curl -f http://localhost:3000 >/dev/null 2>&1; then
+        print_success "Frontend is accessible at http://localhost:3000"
+    else
+        print_warning "Frontend is running but not yet accessible. Check logs above."
+    fi
+else
+    print_error "Frontend container failed to start. Check logs:"
+    docker-compose logs dashboard
+fi
+
+print_step "Frontend troubleshooting completed!"
+echo ""
+echo "Next steps:"
+echo "1. Check the frontend at: http://localhost:3000"
+echo "2. View logs with: docker-compose logs dashboard"
+echo "3. Restart if needed: docker-compose restart dashboard"