import React from 'react';
import { ReactWidget } from '@jupyterlab/apputils';
import { ISignal, Signal } from '@lumino/signaling';
import DatasourceView from './DatasourceView';
import DatasyncView from './DatasyncView';
import DatalogView from './DatalogView';
import DataView from './DataView';
import { IDatasourceItem } from './api/datasource';
import { Widget } from '@lumino/widgets';

interface ITableOpenSignalData {
  datasource: IDatasourceItem;
  tableName: string;
  action: 'schema' | 'content';
}

class DataViewWidget extends ReactWidget {
  constructor(manager: string, options?: Widget.IOptions) {
    super(options);
    this._manager = manager;
  }

  public get tableOpened(): ISignal<DataViewWidget, ITableOpenSignalData> {
    return this._tableOpened;
  }

  public get wizardOpened(): ISignal<DataViewWidget, void> {
    return this._wizardOpened;
  }

  render(): JSX.Element {
    const datasourceView = (
      <DatasourceView
        manager={this._manager}
        onOpenTable={(datasource, tableName, action) =>
          this._tableOpened.emit({ datasource, tableName, action })
        }
      />
    );

    const datasyncView = (
      <DatasyncView
        onOpenWizard={() => {
          this._wizardOpened.emit();
        }}
      />
    );

    const datalogView = <DatalogView />;

    return (
      <div
        style={{
          height: '100%',
          display: 'flex'
          // flexDirection: 'column'
        }}
      >
        <DataView
          dataSourceElement={datasourceView}
          dataSyncElement={datasyncView}
          dataLogElement={datalogView}
        />
      </div>
    );
  }

  private _manager: string;
  private _tableOpened = new Signal<DataViewWidget, ITableOpenSignalData>(this);
  private _wizardOpened = new Signal<DataViewWidget, void>(this);
}

export default DataViewWidget;
