import { Disposable, ICommandService, Inject } from '@univerjs/core';
import { ChartSingle, LineChartSingle, PieChartSingle, RadarChartSingle, SystemSingle } from '@univerjs/icons';
import { ComponentManager, IMenuManagerService, RibbonInsertGroup } from '@univerjs/ui';

import {
  JnpfSheetsFocusEchartOperation,
  JnpfSheetsInsertedFloatEchartOperation,
  JnpfSheetsInsertFloatBarEchartOperation,
  JnpfSheetsInsertFloatLineEchartOperation,
  JnpfSheetsInsertFloatPieEchartOperation,
  JnpfSheetsInsertFloatRadarEchartOperation,
} from '../commands/operations/sheet-float-echart.operation';
import univerFloatEchartComponent from '../components/Echart/float.vue';
import { JnpfCommandIds, JnpfUniverFloatEchartKey } from '../utils/define';
import {
  JnpfSheetsFloatEchartMenuFactory,
  JnpfSheetsInsertFloatBarEchartMenuFactory,
  JnpfSheetsInsertFloatLineEchartMenuFactory,
  JnpfSheetsInsertFloatPieEchartMenuFactory,
  JnpfSheetsInsertFloatRadarEchartMenuFactory,
} from './menus/sheet-float-echart.menu';

export class JnpfSheetsFloatEchartController extends Disposable {
  constructor(
    @ICommandService private readonly _commandService: ICommandService,
    @IMenuManagerService private readonly _menuManagerService: IMenuManagerService,
    @Inject(ComponentManager) private readonly _componentManager: ComponentManager,
  ) {
    super();

    this._initCommands();
    this._registerComponents();
    this._initMenus();
  }

  private _initCommands(): void {
    [
      JnpfSheetsInsertFloatBarEchartOperation,
      JnpfSheetsInsertFloatLineEchartOperation,
      JnpfSheetsInsertFloatPieEchartOperation,
      JnpfSheetsInsertFloatRadarEchartOperation,
      JnpfSheetsInsertedFloatEchartOperation,
      JnpfSheetsFocusEchartOperation,
    ].forEach(command => {
      this.disposeWithMe(this._commandService.registerCommand(command));
    });
  }

  private _initMenus(): void {
    this._menuManagerService.mergeMenu({
      // 主菜单
      [RibbonInsertGroup.MEDIA]: {
        [JnpfCommandIds.floatEchartOperations]: {
          [JnpfSheetsInsertFloatBarEchartOperation.id]: {
            menuItemFactory: JnpfSheetsInsertFloatBarEchartMenuFactory,
            order: 0,
          },
          [JnpfSheetsInsertFloatLineEchartOperation.id]: {
            menuItemFactory: JnpfSheetsInsertFloatLineEchartMenuFactory,
            order: 1,
          },
          [JnpfSheetsInsertFloatPieEchartOperation.id]: {
            menuItemFactory: JnpfSheetsInsertFloatPieEchartMenuFactory,
            order: 2,
          },
          [JnpfSheetsInsertFloatRadarEchartOperation.id]: {
            menuItemFactory: JnpfSheetsInsertFloatRadarEchartMenuFactory,
            order: 3,
          },
          menuItemFactory: JnpfSheetsFloatEchartMenuFactory,
          order: 1,
        },
      },
    });
  }

  private _registerComponents(): void {
    // 注册图表组件进来
    this.disposeWithMe(this._componentManager.register(JnpfUniverFloatEchartKey, univerFloatEchartComponent, { framework: 'vue3' }));

    // 注册按钮图标
    this.disposeWithMe(this._componentManager.register('SystemSingle', SystemSingle));
    this.disposeWithMe(this._componentManager.register('ChartSingle', ChartSingle));
    this.disposeWithMe(this._componentManager.register('LineChartSingle', LineChartSingle));
    this.disposeWithMe(this._componentManager.register('PieChartSingle', PieChartSingle));
    this.disposeWithMe(this._componentManager.register('RadarChartSingle', RadarChartSingle));
  }
}