import { generateActionComponent } from '@dvn/core/components/views/dvn-card-view/action-util';
import { getDataModelFieldDisplayValue } from '@dvn/core/models/data-model';
import { findField } from '@dvn/core/util/field';
import { Component, Event, h, Prop } from '@stencil/core';
function getFieldFromData(fields, fieldData) {
  return fieldData.fieldDisplay || findField(fields, fieldData.fieldId);
}
function getColumnData(config, field) {
  if (!config.columns || !config.columns[field.id]) {
    return {
      weight: 1,
    };
  }
  return config.columns[field.id];
}
function calculateActionsWidth(actions = []) {
  return actions.length * 40;
}
const renderRow = (config, fields, tableColumnConfig, actionEvent, modifyItemEvent, item, params, index) => (h("dvn-table-row", { elevation: config.elevation, separation: config.separation, removeSpacing: true },
  tableColumnConfig.map(columnConfig => {
    const field = getFieldFromData(fields, columnConfig);
    const columnData = getColumnData(config, field);
    if (columnConfig.componentTag) {
      const Tag = columnConfig.componentTag;
      return (h("dvn-table-cell", { weight: columnData.weight, width: columnData.width },
        h(Tag, { field: field, item: item })));
    }
    return (h("dvn-table-cell", { editable: columnConfig.isEditable, weight: columnData.weight, width: columnData.width, onCellValueChange: (event) => {
        event.stopPropagation();
        modifyItemEvent.emit({
          field,
          item,
          value: event.detail,
        });
      }, renderDisplay: () => (h("dvn-field-display-cell", { showTitle: false, field: field, value: getDataModelFieldDisplayValue(item, field, columnConfig.fieldId) })), renderEdit: () => (h("dvn-field-input-cell", { field: field, value: getDataModelFieldDisplayValue(item, field, columnConfig.fieldId) })) }));
  }),
  (config.actions && config.actions.length > 0) &&
    h("dvn-table-cell", { width: calculateActionsWidth(config.actions) }, config.actions.map(action => generateActionComponent(index, params, item, actionEvent, action, { leaned: true })))));
const renderHeader = (config, fields, tableColumnConfig) => {
  let totalWidth = 0;
  tableColumnConfig.forEach(columnConfig => {
    const field = getFieldFromData(fields, columnConfig);
    totalWidth += getColumnData(config, field).width;
  });
  return (h("dvn-table-header", { elevation: config.elevation, separation: config.separation, width: `${totalWidth}px` },
    tableColumnConfig.map(columnConfig => {
      const field = getFieldFromData(fields, columnConfig);
      return (h("dvn-table-header-cell", { weight: getColumnData(config, field).weight, width: getColumnData(config, field).width }, field.title));
    }),
    config.actions &&
      h("dvn-table-header-cell", { width: calculateActionsWidth(config.actions) })));
};
export class DvnListViewTable {
  constructor() {
    this.items = [];
    this.isEndReached = false;
    this.isProgressing = false;
    this.fields = [];
    this.params = {};
  }
  render() {
    const { items, config, params } = this;
    const { elevation, fields: tableColumnConfigs, hideHeader = false, separation = 0 } = config;
    return (h("dvn-table", { leaned: true },
      !hideHeader && renderHeader(config, this.fields, tableColumnConfigs),
      h("dvn-table-body", { elevation: elevation, separation: separation },
        items.map((item, index) => renderRow(config, this.fields, tableColumnConfigs, this.action, this.modifyItem, item, params, index)),
        !this.isProgressing && !this.isEndReached && !this.error && items.length === 0 &&
          h("p", { class: "text-centered" }, "No data found."),
        !this.isEndReached &&
          h("div", { class: "table-progress-container" },
            this.isProgressing &&
              h("dvn-progress", { indefinite: true, tint: "primary" }),
            this.error &&
              h("div", { class: "error-container d-flex align-items-center justify-content-center flex-column" },
                this.error,
                h("dvn-button", { onClick: () => this.retry.emit() }, "Retry"))))));
  }
  static get is() { return "dvn-list-view-table"; }
  static get encapsulation() { return "scoped"; }
  static get originalStyleUrls() { return {
    "$": ["dvn-list-view-table.css"]
  }; }
  static get styleUrls() { return {
    "$": ["dvn-list-view-table.css"]
  }; }
  static get properties() { return {
    "config": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "ListViewTableConfig",
        "resolved": "ListViewTableConfig",
        "references": {
          "ListViewTableConfig": {
            "location": "import",
            "path": "@dvn/core/components/views/dvn-list-view-table/config"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      }
    },
    "items": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "DataModel[]",
        "resolved": "DataModel[]",
        "references": {
          "DataModel": {
            "location": "import",
            "path": "@dvn/core/models/data-model"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "defaultValue": "[]"
    },
    "isEndReached": {
      "type": "boolean",
      "mutable": false,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "is-end-reached",
      "reflect": false,
      "defaultValue": "false"
    },
    "isProgressing": {
      "type": "boolean",
      "mutable": false,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "is-progressing",
      "reflect": false,
      "defaultValue": "false"
    },
    "error": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": true,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "error",
      "reflect": false
    },
    "fields": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "BaseField[]",
        "resolved": "BaseField[]",
        "references": {
          "BaseField": {
            "location": "import",
            "path": "@dvn/core/doldurma/src/BaseField"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "defaultValue": "[]"
    },
    "params": {
      "type": "any",
      "mutable": false,
      "complexType": {
        "original": "any",
        "resolved": "any",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "params",
      "reflect": false,
      "defaultValue": "{}"
    }
  }; }
  static get events() { return [{
      "method": "action",
      "name": "action",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [],
        "text": ""
      },
      "complexType": {
        "original": "any",
        "resolved": "any",
        "references": {}
      }
    }, {
      "method": "retry",
      "name": "retry",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [],
        "text": ""
      },
      "complexType": {
        "original": "any",
        "resolved": "any",
        "references": {}
      }
    }, {
      "method": "modifyItem",
      "name": "modifyItem",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [],
        "text": ""
      },
      "complexType": {
        "original": "any",
        "resolved": "any",
        "references": {}
      }
    }]; }
}
