Cloud-CV/EvalAI

View on GitHub
frontend_v2/src/app/components/template-challenge-create/template-challenge-create.component.ts

Summary

Maintainability
A
3 hrs
Test Coverage
import { Component, OnInit, OnDestroy } from '@angular/core';

import { AuthService } from '../../services/auth.service';
import { GlobalService } from '../../services/global.service';
import { ChallengeService } from '../../services/challenge.service';
import { Router, ActivatedRoute } from '@angular/router';

/**
 * Component Class
 */
@Component({
  selector: 'app-template-challenge-create',
  templateUrl: './template-challenge-create.component.html',
  styleUrls: ['./template-challenge-create.component.scss'],
})
export class TemplateChallengeCreateComponent implements OnInit, OnDestroy {
  /**
   * Is the user logged in?
   */
  isLoggedIn = false;

  /**
   * Selected Host team object
   */
  hostTeam = null;

  /**
   * Challenge template id
   */
  id = null;

  /**
   * Number of phases
   */
  phases = null;

  /**
   * Challenge values loaded by host
   */
  challengeData = {
    title: null,
    start_date: null,
    end_date: null,
    description: null,
    evaluation_script: null,
    challenge_phases: null,
  };

  /**
   * Challenge phase data loaded by hosts
   */
  challenge_phases = [];

  /**
   * Challenge phase data model used to fill challenge_phases above
   */
  challengePhaseData = {
    name: null,
    start_date: null,
    end_date: null,
  };

  /**
   * Route for hosted challenges
   */
  hostedChallengesRoute = '/challenges/me';

  /**
   * Route path for host teams
   */
  hostTeamsRoute = '/teams/hosts';

  constructor(
    public authService: AuthService,
    private router: Router,
    private route: ActivatedRoute,
    private challengeService: ChallengeService,
    private globalService: GlobalService
  ) {}

  ngOnInit() {
    if (this.authService.isLoggedIn()) {
      this.isLoggedIn = true;
    }

    this.route.params.subscribe((params) => {
      if (params['id']) {
        this.id = params['id'];
      }

      if (params['phases']) {
        this.phases = params['phases'];
      }

      this.challengeService.currentHostTeam.subscribe((hostTeam) => {
        this.hostTeam = hostTeam;
        if (!this.hostTeam) {
          this.router.navigate([this.hostTeamsRoute], {
            queryParams: { template: true, templateId: this.id, templatePhases: this.phases },
          });
        }
      });
    });

    for (let i = 0; i < this.phases; i++) {
      this.challengePhaseData['id'] = i + 1;
      this.challenge_phases.push(Object.assign({}, this.challengePhaseData));
    }
  }

  ngOnDestroy() {
    this.hostTeam = null;
  }

  createTemplateChallenge() {
    if (this.challengeData != null) {
      const FORM_DATA: FormData = new FormData();
      this.challengeData['is_challenge_template'] = true;
      this.challengeData['template_id'] = this.id;
      this.challengeData.challenge_phases = JSON.stringify(this.challenge_phases);
      for (const key of Object.keys(this.challengeData)) {
        FORM_DATA.append(key, this.challengeData[key]);
      }
      this.globalService.startLoader('Creating Challenge');
      this.challengeService.challengeCreate(this.hostTeam['id'], FORM_DATA).subscribe(
        (data) => {
          this.globalService.stopLoader();
          this.globalService.showToast(
            'success',
            'Challenge created and successfuly sent to EvalAI admin for approval.'
          );
          this.router.navigate([this.hostedChallengesRoute]);
        },
        (err) => {
          console.log(err.error);
          this.globalService.stopLoader();
          this.globalService.showToast(
            'error',
            'Sorry, something went wrong when creating the challenge. Please try again later: ' +
              JSON.stringify(err.error)
          );
        },
        () => {}
      );
    } else {
      this.globalService.showToast('error', 'Please fill all the given challenge details');
    }
  }
}