import { Component, OnInit } from '@angular/core';
import {GoogleSignInSuccess} from 'angular-google-signin';
import { Router, ActivatedRoute } from '@angular/router';
import { ServerService } from '../../app/services/server.service';
import { Project } from '../entities/model/project';

@Component({
  selector: 'projects',
  template: `
  <h1 class="title">Projects</h1>
  
    <ul class="list-group col-md-4">
      <li *ngFor="let project of projects"
        class="list-group-item">
        <a [routerLink]="['/dynamic-form', project.id]" >
          {{ project.name }}
        </a>
      </li>
    </ul>

  <router-outlet></router-outlet>
`,
  providers:  [ServerService]
})

export class ProjectsComponent implements OnInit{
  returnUrl: string;
  projects: Project[];

  constructor( 
    private serverService: ServerService,
    private route: ActivatedRoute,
    private router: Router){

  }

  ngOnInit() {
    //this.projects = this.serverService.getDummyProjects();
    this.projects = [];
    this.serverService.getProjects().subscribe( 
      response => {

        console.log("response");
        console.log(response);
        response.forEach(resp => {
          let pr = new Project();
          pr.id = resp.id;
          pr.name = resp.label;
          this.projects.push(pr);
        });
      }
    );
  }



}