import { Component } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';

export interface PeriodicElement {
  order: number;
  date: string;
  status: string;
}

const ELEMENT_DATA: PeriodicElement[] = [
  { order: 1, date: 'Hydrogen', status: 'Aproved' },
  { order: 2, date: 'Helium', status: 'Aproved' },
  { order: 3, date: 'Lithium', status: 'Aproved' },
  { order: 4, date: 'Beryllium', status: 'Rjected' },
  { order: 5, date: 'Boron', status: 'Rjected' },
  { order: 6, date: 'Carbon', status: 'Rjected' },
  { order: 7, date: 'Nitrogen', status: 'Rjected' },
  { order: 8, date: 'Oxygen', status: 'Pending' },
  { order: 9, date: 'Fluorine', status: 'Pending' },
  { order: 10, date: 'Neon', status: 'Pending' },
];
@Component({
  selector: 'app-order-list',
  templateUrl: './order-list.component.html',
  styleUrls: ['./order-list.component.scss'],
})
export class OrderListComponent {
  displayedColumns: string[] = ['order', 'date', 'status', 'actions'];
  dataSource = ELEMENT_DATA;

  constructor(
    private readonly router: Router,
    private readonly route: ActivatedRoute
  ) {}

  onOpenDetail(): void {
    this.router.navigate(['./details'], { relativeTo: this.route });
  }
}
