import { CdkScrollableModule } from '@angular/cdk/scrolling';
import { CurrencyPipe } from '@angular/common';
import { Component, inject } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
import { MatRippleModule } from '@angular/material/core';
import { MAT_DIALOG_DATA, MatDialogRef, MatDialogModule } from '@angular/material/dialog';
import { Observable } from 'rxjs';

import { Table } from '../../core/table';

@Component({
  selector: 'app-tables-dialog',
  templateUrl: './tables-dialog.component.html',
  styleUrls: ['./tables-dialog.component.sass'],
  imports: [CdkScrollableModule, CurrencyPipe, MatButtonModule, MatDialogModule, MatRippleModule, MatCardModule],
})
export class TablesDialogComponent {
  dialogRef = inject<MatDialogRef<TablesDialogComponent>>(MatDialogRef);
  data = inject<{
    list: Observable<Table[]>;
    canChooseRunning: boolean;
  }>(MAT_DIALOG_DATA);

  list: Table[] = [];
  canChooseRunning: boolean;
  selected: Table | null;

  constructor() {
    const data = this.data;

    this.data.list.subscribe((list: Table[]) => {
      this.list = list;
    });
    this.canChooseRunning = data.canChooseRunning;
    this.selected = null;
  }

  select(t: Table) {
    if (!this.canChooseRunning && t.status) {
      return;
    }
    if (this.selected === t) {
      this.selected = null;
    } else {
      this.selected = t;
    }
  }

  accept(): void {
    if (this.selected !== null) {
      this.dialogRef.close(this.selected);
    }
  }
}