import Component from '../component/index';
import TableComponent from '../table-component';
import storageApi from '../../api/StorageServiceAPI';
import FilterApiComponent from '../search-component/index';
import ApiInfoComponent from '../api-info-component/index';
import CreateApiComponent from '../create-api-component/index';
import ButtonComponent from '../button-component/ButtonComponent';

class ApiPage extends Component {
    constructor (mainNodeSelector, parentNode) {
        super(mainNodeSelector, parentNode);

        this.filterBox = new FilterApiComponent(this.mainNode);
        this.storageListTable = new TableComponent(this.mainNode);
        this.infoBox = new ApiInfoComponent();
        this.createWindow = new CreateApiComponent();
        this.addSubscribe(this.storageListTable, 'showInfo', (obj) => {
            this.infoBox.render(obj);
        });

        this.createBtn = new ButtonComponent(this.filterBox.filterButtonBox, '✚', 'btn btn-primary mb-3 Create__btn');
        this.addSubscribe(this.createBtn, 'click', () => {
            this.createWindow.show();
        });
        this.addSubscribe(this.createWindow, 'renderTable', () => {
            this.initStorageListTable();
        });

        this.initStorageListTable();

        this.addSubscribe(this.infoBox, 'deleteApi', () => {
            this.initStorageListTable();
        });
    }

    initStorageListTable = async () => {
        const list = await storageApi.request();
        return this.storageListTable.render(list);
    };
}

export default ApiPage;