import { Component } from '@angular/core';
import { TreeComponent } from '../tree/tree.component';
import { TreeNode } from '../../models/tree-node';
import { QueryService } from '../../services/query.service';
import { Query } from '../../models/query';
import { Action } from '../../models/action';
import {
  faArrowDown,
  faArrowUp,
  faRemove,
} from '@fortawesome/free-solid-svg-icons';
import { ExecuteService } from '../../services/execute.service';
import { Header } from '../../models/header';

@Component({
  selector: 'fbi-query',
  standalone: true,
  imports: [TreeComponent],
  templateUrl: './query.component.html',
  styleUrl: './query.component.scss',
})
export class QueryComponent {
  node: TreeNode = new TreeNode({});

  constructor(
    private queryService: QueryService,
    executeService: ExecuteService
  ) {
    queryService.Query.subscribe((query: Query) => {
      executeService.headers(query).subscribe((headers: Header[]) => {
        this.node = new TreeNode({
          hidden: true,
          expanded: true,
          children: [
            {
              label: 'Fields',
              leaf: false,
              expanded: true,
              children: (query?.fields ?? []).map(
                (field: string, index: number, array: string[]) => {
                  const actions = [];
                  if (index !== 0) {
                    actions.push({
                      label: 'Move Up',
                      icon: faArrowUp,
                      data: { cmd: ACTIONS.UP, data: index - 1 },
                    });
                  }
                  if (index !== array.length - 1) {
                    actions.push({
                      label: 'Move Down',
                      icon: faArrowDown,
                      data: { cmd: ACTIONS.DOWN, data: index + 1 },
                    });
                  }
                  actions.push({
                    label: 'Remove',
                    icon: faRemove,
                    data: { cmd: ACTIONS.REMOVE },
                  });

                  const label =
                    headers.find((header: Header) => header.source === field)
                      ?.label ?? 'unknown';

                  return {
                    label: label,
                    data: field,
                    actions: actions,
                  };
                }
              ),
            },
            { label: 'Filters', expanded: true, leaf: false },
          ] as TreeNode[],
        });
      });
    });
  }

  onActionClick(event: { action: Action; node: TreeNode }): void {
    const data = event.action.data as ActionData;
    switch (data.cmd) {
      case ACTIONS.REMOVE:
        this.queryService.remove(event.node.data);
        break;
      case ACTIONS.UP:
        this.queryService.add(event.node.data, data.data);
        break;
      case ACTIONS.DOWN:
        this.queryService.add(event.node.data, data.data);
        break;
    }
  }
}

enum ACTIONS {
  REMOVE = 'del',
  UP = 'up',
  DOWN = 'down',
}

type ActionData = {
  cmd: ACTIONS;
  data: any;
};
