import { Component, inject, input } from '@angular/core';
import { MatListModule } from '@angular/material/list';
import RedeemableAction from '../../shared/models/redeemable-action';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatDialog } from '@angular/material/dialog';
import { ActionItemEditComponent } from '../action-item-edit/action-item-edit.component';
import { HermesClientService } from '../../hermes-client.service';
import { MatSelectModule } from '@angular/material/select';

@Component({
  selector: 'action-list',
  standalone: true,
  imports: [
    MatButtonModule,
    MatFormFieldModule,
    MatIconModule,
    MatListModule,
    MatSelectModule,
  ],
  templateUrl: './action-list.component.html',
  styleUrl: './action-list.component.scss'
})
export class ActionListComponent {
  actions = input.required<RedeemableAction[]>({ alias: 'actions' });

  readonly dialog = inject(MatDialog);
  readonly client = inject(HermesClientService);


  create(): void {
    this.openDialog({ user_id: '', name: '', type: '', has_message: false, data: {} });
  }

  modify(action: RedeemableAction): void {
    this.openDialog(action);
  }

  private openDialog(action: RedeemableAction): void {
    this.dialog.open(ActionItemEditComponent, {
      data: { action: { user_id: action.user_id, name: action.name, type: action.type, data: action.data }, actions: this.actions() },
    });
  }
}