import { injectable, inject } from 'inversify';
import { set } from 'lodash';
import EventEmitter from '@antv/event-emitter';
import { MODEL, FACTORY } from '../../constants';
import { DatasetConfig, DatasetManager } from '../dataset-manager';
import { COMPONENT_EVENT, COMPONENT_MODE, GET_DATASET_STATUS } from './constants';
import type { ComponentConfig, ComponentMode, ComponentPlugin, ConfigPanelPlugin } from './types';

@injectable()
export class Component extends EventEmitter {
  config: ComponentConfig;

  dataset: JSON;

  mode: ComponentMode;

  @inject(MODEL.DatasetManager)
  private _datasetManager: DatasetManager;

  @inject(FACTORY.ComponentPlugin)
  private _getComponentPlugin: (type: string) => ComponentPlugin | null;

  @inject(FACTORY.ConfigPanelPlugin)
  private _getConfigPanelPlugin: (type: string) => ConfigPanelPlugin | null;

  init(config: ComponentConfig) {
    this.config = config;
  }

  get componentPlugin(): ComponentPlugin | null {
    const { type } = this.config;
    return type ? this._getComponentPlugin(type) : null;
  }

  getConfigPanelPlugin(type: string): ConfigPanelPlugin | null {
    return type ? this._getConfigPanelPlugin(type) : null;
  }

  updateConfigPanelProperty(path: string, value: any) {
    set(this.config.config, path, value);
    this.emit(COMPONENT_EVENT.UpdateConfigPanel);
  }

  async getDataset() {
    this.emit(COMPONENT_EVENT.GetDataset, GET_DATASET_STATUS.loading);
    const { datasetId } = this.config;
    this.dataset = await this._datasetManager.getDatasetById(datasetId);
    this.emit(COMPONENT_EVENT.GetDataset, GET_DATASET_STATUS.success);
  }

  async updateDataset(id: DatasetConfig['id']) {
    this.config.datasetId = id;
    await this.getDataset();
    this.emit(COMPONENT_EVENT.UpdateDataset);
  }

  focus() {
    this.mode = COMPONENT_MODE.focus;
    this.emit(COMPONENT_EVENT.Focus, this.config.id);
  }

  blur() {
    this.mode = COMPONENT_MODE.blur;
    this.emit(COMPONENT_EVENT.Blur);
  }
}