import { Component, Event, h, Listen, Prop, State, } from "@stencil/core";
import renderHandlebars from "../../../helpers/renderHandlebars";
export class TotallerCardList {
  constructor() {
    this.groupBy = "month";
    this.timeframe = new Date();
    this.options = [];
    this.paths = {};
    this.totals = {};
  }
  async onSuccess(event) {
    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
    if (((_a = event === null || event === void 0 ? void 0 : event.detail) === null || _a === void 0 ? void 0 : _a.endpoint) === "findTotaller") {
      const totallerId = (_d = (_c = (_b = event === null || event === void 0 ? void 0 : event.detail) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.totaller) === null || _d === void 0 ? void 0 : _d.id;
      for (const [key, path] of Object.entries(((_g = (_f = (_e = event === null || event === void 0 ? void 0 : event.detail) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.totaller) === null || _g === void 0 ? void 0 : _g.paths) || {})) {
        if (!this.paths[totallerId])
          this.paths[totallerId] = {};
        this.paths[totallerId][key] = path;
        if (this.groupBy === key)
          this.fetchTotals(totallerId, path);
        if (!this.options.includes(key))
          this.options.push(key);
      }
      this.options = [...this.options];
      this.paths = { ...this.paths };
      if (!this.label)
        this.label = ((_k = (_j = (_h = event === null || event === void 0 ? void 0 : event.detail) === null || _h === void 0 ? void 0 : _h.data) === null || _j === void 0 ? void 0 : _j.totaller) === null || _k === void 0 ? void 0 : _k.name) || null;
    }
    else if (((_l = event === null || event === void 0 ? void 0 : event.detail) === null || _l === void 0 ? void 0 : _l.endpoint) === "findTotals") {
      const totallerId = (_q = (_p = (_o = (_m = event === null || event === void 0 ? void 0 : event.detail) === null || _m === void 0 ? void 0 : _m.event) === null || _o === void 0 ? void 0 : _o.detail) === null || _p === void 0 ? void 0 : _p.params) === null || _q === void 0 ? void 0 : _q.totallerId;
      this.totals = {
        ...this.totals,
        [totallerId]: (_s = (_r = event === null || event === void 0 ? void 0 : event.detail) === null || _r === void 0 ? void 0 : _r.data) === null || _s === void 0 ? void 0 : _s.totals,
      };
    }
  }
  async fetchTotals(totallerId, path, timestamp) {
    this.fireenjinFetch.emit({
      endpoint: "findTotals",
      params: {
        totallerId,
        path: this.renderPathTemplate(totallerId, path, timestamp),
      },
    });
  }
  async onChange(event) {
    var _a, _b, _c, _d;
    if (((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.name) === "groupBy") {
      this.groupBy = (_b = event === null || event === void 0 ? void 0 : event.target) === null || _b === void 0 ? void 0 : _b.value;
    }
    else if (((_c = event === null || event === void 0 ? void 0 : event.target) === null || _c === void 0 ? void 0 : _c.name) === "timeframe") {
      this.timeframe;
    }
    for (const totallerId of this.totallerIds) {
      const noonTimestamp = new Date(Date.parse(event.target.value));
      noonTimestamp.setHours(24);
      this.fetchTotals(totallerId, this.paths[totallerId][this.groupBy], ((_d = event === null || event === void 0 ? void 0 : event.target) === null || _d === void 0 ? void 0 : _d.name) === "timeframe" ? noonTimestamp : this.timeframe);
    }
  }
  renderPathTemplate(totallerId, pathStr, timestamp) {
    return renderHandlebars(pathStr, {
      totaller: {
        id: totallerId,
      },
      data: {
        // THIS NEEDS TO BE CHANGED
        createdAt: timestamp || new Date(),
      },
    });
  }
  render() {
    return [
      h("floodteam-title-bar", null,
        this.label || "",
        h("div", { slot: "end" },
          h("fireenjin-select", { style: { display: "none" }, ref: (el) => (this.selectEl = el), label: "View By", labelPosition: "stacked", name: "groupBy", value: this.groupBy, options: (this.options || []).map((option) => ({
              label: option,
              value: option,
            })) }),
          h("fireenjin-chip-bar", null,
            h("ion-chip", { onClick: () => this.selectEl.querySelector("ion-select").click() },
              this.groupBy,
              h("ion-icon", { name: "chevron-down-circle" })),
            h("ion-chip", null,
              h("fireenjin-input", { "clear-on-edit": true, name: "timeframe", type: "date", value: this.timeframe }))))),
      (this.totallerIds || []).map((totallerId) => {
        var _a;
        return (h("floodteam-totaller-cards", { totals: (_a = this.totals) === null || _a === void 0 ? void 0 : _a[totallerId], totallerId: totallerId }));
      }),
    ];
  }
  static get is() { return "floodteam-totaller-card-list"; }
  static get properties() { return {
    "totallerIds": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "any[]",
        "resolved": "any[]",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      }
    },
    "label": {
      "type": "string",
      "mutable": true,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "label",
      "reflect": false
    },
    "groupBy": {
      "type": "string",
      "mutable": true,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "group-by",
      "reflect": false,
      "defaultValue": "\"month\""
    },
    "timeframe": {
      "type": "unknown",
      "mutable": true,
      "complexType": {
        "original": "Date",
        "resolved": "Date",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "defaultValue": "new Date()"
    }
  }; }
  static get states() { return {
    "options": {},
    "paths": {},
    "totals": {}
  }; }
  static get events() { return [{
      "method": "fireenjinFetch",
      "name": "fireenjinFetch",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [],
        "text": ""
      },
      "complexType": {
        "original": "FireEnjinFetchEvent",
        "resolved": "FireEnjinFetchEvent",
        "references": {
          "FireEnjinFetchEvent": {
            "location": "import",
            "path": "@fireenjin/sdk"
          }
        }
      }
    }]; }
  static get listeners() { return [{
      "name": "fireenjinSuccess",
      "method": "onSuccess",
      "target": undefined,
      "capture": false,
      "passive": false
    }, {
      "name": "ionChange",
      "method": "onChange",
      "target": undefined,
      "capture": false,
      "passive": false
    }]; }
}
