import { Build, h, } from "@stencil/core";
import { toastController } from "@ionic/core";
import state from "../../../store";
export class ModalSendEmail {
  constructor() {
    this.toOptions = [];
    this.ccOptions = [];
    this.bccOptions = [];
    this.formData = {};
    this.to = [];
    this.bccs = [];
    this.ccs = [];
    this.subject = undefined;
    this.replyTo = undefined;
    this.from = "info@thefloodteam.com";
    this.attachments = [];
    this.templateId = undefined;
    this.users = [];
    this.templateFilter = undefined;
    this.hideTemplateSelect = false;
    this.filters = undefined;
    this.payload = undefined;
    this.job = undefined;
    this.templateData = {};
    this.notes = undefined;
  }
  onChange(event) {
    var _a;
    if (((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.name) === "templateId") {
      this.templateId = event.target.value;
    }
  }
  async onSuccess(event) {
    var _a;
    if (((_a = event.detail) === null || _a === void 0 ? void 0 : _a.endpoint) === "sendTemplateEmail") {
      const sendEmailModalEl = document.querySelector("ion-modal.modal-send-email-wrapper");
      if (sendEmailModalEl === null || sendEmailModalEl === void 0 ? void 0 : sendEmailModalEl.dismiss) {
        await sendEmailModalEl.dismiss();
        this.presentToast();
      }
    }
  }
  async presentToast() {
    const toast = await toastController.create({
      message: "Your emails are on their way.",
      duration: 2000,
    });
    toast.present();
  }
  componentWillLoad() {
    var _a;
    if (!(Build === null || Build === void 0 ? void 0 : Build.isBrowser))
      return;
    this.toOptions = (this.users || []).map((user) => ({
      label: (user === null || user === void 0 ? void 0 : user.email) ||
        `${user === null || user === void 0 ? void 0 : user.firstName} ${user === null || user === void 0 ? void 0 : user.lastName} has no Email on File.`,
      value: user === null || user === void 0 ? void 0 : user.email,
      disabled: !(user === null || user === void 0 ? void 0 : user.email),
    }));
    if (this.to)
      this.toOptions = [
        ...this.toOptions,
        ...this.to.map((to) => ({
          label: to,
          value: to,
          disabed: false,
        })),
      ];
    this.bccOptions = (this.users || []).map((user) => ({
      label: (user === null || user === void 0 ? void 0 : user.email) ||
        `${user === null || user === void 0 ? void 0 : user.firstName} ${user === null || user === void 0 ? void 0 : user.lastName} has no Email on File.`,
      value: user === null || user === void 0 ? void 0 : user.email,
      disabled: !(user === null || user === void 0 ? void 0 : user.email),
    }));
    if (this.bccs)
      this.bccOptions = [
        ...this.bccOptions,
        ...this.bccs.map((bcc) => ({
          label: bcc,
          value: bcc,
          disabed: false,
        })),
      ];
    this.ccOptions = (this.users || []).map((user) => ({
      label: (user === null || user === void 0 ? void 0 : user.email) ||
        `${user === null || user === void 0 ? void 0 : user.firstName} ${user === null || user === void 0 ? void 0 : user.lastName} has no Email on File.`,
      value: user === null || user === void 0 ? void 0 : user.email,
      disabled: !(user === null || user === void 0 ? void 0 : user.email),
    }));
    if (this.ccs)
      this.ccOptions = [
        ...this.ccOptions,
        ...this.ccs.map((cc) => ({
          label: cc,
          value: cc,
          disabed: false,
        })),
      ];
    this.formData = {
      data: { ...(this.templateData || {}), notes: this.notes },
      filters: this.filters,
      payload: this.payload,
      attachments: this.attachments,
      jobId: (_a = this.job) === null || _a === void 0 ? void 0 : _a.id,
      ccs: this.ccs,
      bccs: this.bccs,
      from: this.from,
      emails: this.to,
      templateId: this.templateId,
    };
  }
  render() {
    return [
      h("ion-header", null, h("ion-toolbar", null, h("ion-title", null, "Send Email"), h("ion-buttons", { slot: "end" }, h("ion-button", { onClick: () => this.formEl.submit(), color: "primary", fill: "solid" }, "Send"), h("ion-button", { onClick: () => this.floodteamCloseModal.emit(), style: {
          "--color": "var(--ion-text-color)",
          "--color-hover": "var(--ion-color-danger",
        } }, h("ion-icon", { slot: "icon-only", name: "close-circle-outline" }))))),
      h("ion-content", { style: {
          "--background": "var(--ion-color-base)",
        } }, h("fireenjin-form", { ref: (el) => (this.formEl = el), endpoint: "sendTemplateEmail", formData: this.formData, disableEnterButton: true, hideControls: true }, h("ion-grid", null, h("ion-row", null, h("ion-col", { size: "12", sizeMd: "7" }, !this.hideTemplateSelect && (h("fireenjin-select", { ref: (el) => (this.templateSelectEl = el), name: "templateId", label: "Template", labelPosition: "stacked", placeholder: "Select Message Template", value: this.templateId, options: (state.templates || [])
          .filter((template) => !(template === null || template === void 0 ? void 0 : template.partial) &&
          (template === null || template === void 0 ? void 0 : template.type) === "email" &&
          (!this.templateFilter ||
            this.templateFilter(template)))
          .map((template) => ({
          label: template === null || template === void 0 ? void 0 : template.subject,
          value: template === null || template === void 0 ? void 0 : template.id,
        })) })), h("fireenjin-select-tags", { name: "emails", label: "Send To", labelPosition: "stacked", placeholder: "Add Emails", allowAdding: true, value: this.to, options: this.toOptions }), h("fireenjin-select-tags", { name: "ccs", label: "CCs", labelPosition: "stacked", placeholder: "Add CCs", allowAdding: true, value: this.ccs, options: this.ccOptions })), h("ion-col", { size: "12", sizeMd: "5" }, this.templateId && (h("floodteam-template", { id: "email-preview", zoom: 0.3, templateId: this.templateId, data: this.payload || {
          job: this.job || null,
        } })))), h("ion-row", null, h("ion-col", null, h("fireenjin-chip-bar", null, (this.attachments || []).map((url) => {
        var _a, _b, _c, _d, _e, _f;
        return (h("ion-chip", null, h("ion-icon", { name: "document", class: "ft-icon-style" }), h("ion-label", null, Build.isBrowser &&
          decodeURI(((_f = (_e = (_d = (_c = (_b = (_a = url === null || url === void 0 ? void 0 : url.split) === null || _a === void 0 ? void 0 : _a.call(url, "/")) === null || _b === void 0 ? void 0 : _b.pop) === null || _c === void 0 ? void 0 : _c.call(_b)) === null || _d === void 0 ? void 0 : _d.split) === null || _e === void 0 ? void 0 : _e.call(_d, "?")) === null || _f === void 0 ? void 0 : _f[0]) ||
            "No File Name"))));
      }))))), h("ion-accordion-group", null, h("ion-accordion", null, h("ion-item", { slot: "header" }, h("ion-label", null, "Advanced")), h("ion-grid", { slot: "content" }, h("ion-row", null, h("ion-col", null, h("fireenjin-input", { name: "subject", label: "Subject", labelPosition: "stacked", placeholder: "Email Subject", value: this.subject }))), h("ion-row", null, h("ion-col", null, h("ion-item", { class: "ion-padding-bottom" }, h("ion-label", { position: "stacked" }, "Additional Notes"), h("ion-textarea", { style: {
          border: "2px solid #bebebe",
          "--padding-start": "15px",
          "--padding-end": "15px",
        }, name: "data.notes", placeholder: "Enter notes here", inputmode: "text", spellcheck: true, rows: 4, autocapitalize: "sentences", maxlength: 400 })))), h("ion-row", null, h("ion-col", null, h("fireenjin-select-tags", { name: "bccs", label: "BCCs", labelPosition: "stacked", placeholder: "Add BCCs", allowAdding: true, value: this.bccs, options: this.bccOptions }))), h("ion-row", null, h("ion-col", null, h("fireenjin-input", { name: "from", label: "Email From", labelPosition: "stacked", placeholder: "Email Address to Send From", value: this.from })), h("ion-col", null, h("fireenjin-input", { name: "replyTo", label: "Reply To", labelPosition: "stacked", placeholder: "Email Address to Reply", value: this.replyTo })))))))),
    ];
  }
  static get is() { return "modal-send-email"; }
  static get originalStyleUrls() {
    return {
      "$": ["modal-send-email.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["modal-send-email.css"]
    };
  }
  static get properties() {
    return {
      "to": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "string[]",
          "resolved": "string[]",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "defaultValue": "[]"
      },
      "bccs": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "string[]",
          "resolved": "string[]",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "defaultValue": "[]"
      },
      "ccs": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "string[]",
          "resolved": "string[]",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "defaultValue": "[]"
      },
      "subject": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "subject",
        "reflect": false
      },
      "replyTo": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "reply-to",
        "reflect": false
      },
      "from": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "from",
        "reflect": false,
        "defaultValue": "\"info@thefloodteam.com\""
      },
      "attachments": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "string[]",
          "resolved": "string[]",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "defaultValue": "[]"
      },
      "templateId": {
        "type": "string",
        "mutable": true,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "template-id",
        "reflect": false
      },
      "users": {
        "type": "unknown",
        "mutable": true,
        "complexType": {
          "original": "User[]",
          "resolved": "User[]",
          "references": {
            "User": {
              "location": "import",
              "path": "../../../sdk"
            }
          }
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "defaultValue": "[]"
      },
      "templateFilter": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "(template: Template) => boolean",
          "resolved": "(template: Template) => boolean",
          "references": {
            "Template": {
              "location": "import",
              "path": "../../../sdk"
            }
          }
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": ""
        }
      },
      "hideTemplateSelect": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "hide-template-select",
        "reflect": false,
        "defaultValue": "false"
      },
      "filters": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "{ [name: string]: any }",
          "resolved": "{ [name: string]: any; }",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        }
      },
      "payload": {
        "type": "any",
        "mutable": false,
        "complexType": {
          "original": "any",
          "resolved": "any",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "payload",
        "reflect": false
      },
      "job": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "Job",
          "resolved": "{ __typename?: \"Job\"; address?: Address; afterhours?: boolean; agent?: User; amountBilled?: number; amountDeducted?: number; amountOwed?: number; amountPaid?: number; appointment?: Appointment; appointments?: Appointment[]; attributionToken?: Token; category?: number; cause?: string; claimNumber?: string; createdAt?: string; createdBy?: User; customer?: User; dateOfLoss?: string; efileCount?: number; efiles?: Efile[]; feed?: Feed[]; id?: string; invoices?: Invoice[]; isFranchise?: boolean; isInsured?: boolean; isSearchable?: boolean; lastNotifiedAt?: string; location?: Location; lostReason?: string; manager?: User; matterportModelId?: string; notionId?: string; payModel?: PayModel; payables?: Payable[]; payments?: Payment[]; phone?: string; photos?: Photo[]; picture?: string; propertyAge?: number; ratings?: Rating[]; readings?: Reading[]; referral?: User; serviceStillNeeded?: string; serviceTypes?: string[]; services?: ScopeService[]; sites?: Site[]; status?: string; success?: User; tags?: string[]; title?: string; updatedAt?: string; updatedBy?: User; userIds?: string[]; users?: User[]; weather?: Weather[]; weatherIds?: string[]; }",
          "references": {
            "Job": {
              "location": "import",
              "path": "../../../sdk"
            }
          }
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": ""
        }
      },
      "templateData": {
        "type": "any",
        "mutable": false,
        "complexType": {
          "original": "any",
          "resolved": "any",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "template-data",
        "reflect": false,
        "defaultValue": "{}"
      },
      "notes": {
        "type": "string",
        "mutable": true,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "notes",
        "reflect": false
      }
    };
  }
  static get events() {
    return [{
        "method": "floodteamCloseModal",
        "name": "floodteamCloseModal",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": ""
        },
        "complexType": {
          "original": "any",
          "resolved": "any",
          "references": {}
        }
      }];
  }
  static get listeners() {
    return [{
        "name": "ionChange",
        "method": "onChange",
        "target": undefined,
        "capture": false,
        "passive": false
      }, {
        "name": "fireenjinSuccess",
        "method": "onSuccess",
        "target": "body",
        "capture": false,
        "passive": false
      }];
  }
}
