import { Component, OnInit } from '@angular/core';
import { Project, ProjectService } from '../../../services/project.service';
import { MatIcon } from '@angular/material/icon';
import { MatProgressBar } from '@angular/material/progress-bar';
import { DatePipe } from '@angular/common';
import { MatButton } from '@angular/material/button';
import { Router } from '@angular/router';
import { MatCard, MatCardContent, MatCardHeader, MatCardTitle } from '@angular/material/card';

@Component({
  selector: 'app-projects',
  standalone: true,
  imports: [
    MatIcon,
    MatProgressBar,
    MatButton,
    MatCard,
    MatCardHeader,
    MatCardTitle,
    MatCardContent,
    DatePipe
  ],
  templateUrl: './projects.component.html',
  styleUrl: './projects.component.scss',
})
export class ProjectsComponent implements OnInit {
  projects: Project[] = [];
  isLoading = true;

  constructor(
    private projectService: ProjectService,
    private router: Router
  ) {}

  ngOnInit(): void {
    this.loadProjects();
  }

  loadProjects(): void {
    this.projectService.getUserProjects().subscribe({
      next: (data) => {
        // Фикс бага с JSON в имени
        this.projects = data.map(p => {
          if (p.name && p.name.startsWith('{')) {
            try {
              const parsed = JSON.parse(p.name);
              p.name = parsed.name || 'Untitled Project';
            } catch (e) {
              p.name = 'Invalid Data';
            }
          }
          return p;
        });
        this.isLoading = false;
      },
      error: () => this.isLoading = false
    });
  }

  openProjectDetails(projectId: string): void {
    this.router.navigate(['/main/user/projects', projectId, 'details']);
  }

  createNewProject(): void {
    this.router.navigate(['/main/user/projects/add']);
  }

  getStatusColor(status: string): string {
    switch (status) {
      case 'RUNNING': return '#4caf50';
      case 'STARTING': return '#ffc107';
      case 'STOPPED': return '#9e9e9e';
      case 'ERROR': return '#f44336';
      default: return '#bdbdbd';
    }
  }
}