import { Component, Listen, Prop, h, State, Build, } from "@stencil/core";
import { toastController } from "@ionic/core";
import getCache from "../../../helpers/getCache";
import clearCache from "../../../helpers/clearCache";
export class ModalOnboarding {
  constructor() {
    this.user = {};
  }
  async onReset(event) {
    if (event.detail.endpoint === "editUser") {
      await clearCache("referredBy");
      const onboardingModalEl = document.querySelector("ion-modal.modal-onboarding");
      if (onboardingModalEl === null || onboardingModalEl === void 0 ? void 0 : onboardingModalEl.dismiss) {
        await onboardingModalEl.dismiss();
      }
    }
  }
  async onSuccess(event) {
    var _a;
    if (((_a = event.detail) === null || _a === void 0 ? void 0 : _a.endpoint) === "editUser") {
      await clearCache("referredBy");
      const onboardingModalEl = document.querySelector("ion-modal.modal-onboarding");
      if (onboardingModalEl === null || onboardingModalEl === void 0 ? void 0 : onboardingModalEl.dismiss) {
        await onboardingModalEl.dismiss();
        this.presentToast();
      }
    }
  }
  async presentToast() {
    const toast = await toastController.create({
      message: `Your profile has been setup successfully!`,
      duration: 3000,
    });
    toast.present();
  }
  async componentDidLoad() {
    if (!(Build === null || Build === void 0 ? void 0 : Build.isBrowser))
      return;
    this.referralId = await getCache("referredBy", null);
  }
  render() {
    var _a, _b, _c, _d;
    return (h("ion-content", null,
      h("div", { class: "banner ion-padding" },
        h("h1", null, "Finish your Profile"),
        h("p", null, "Complete the fields below to finish setting up your profile.")),
      h("fireenjin-form", { class: "ion-padding", name: "onboarding", endpoint: "editUser", documentId: (_a = this.user) === null || _a === void 0 ? void 0 : _a.id, formData: {
          firstName: (_b = this.user) === null || _b === void 0 ? void 0 : _b.firstName,
          lastName: (_c = this.user) === null || _c === void 0 ? void 0 : _c.lastName,
          isOnboarded: true,
          referralId: this.referralId,
        }, resetButton: "Later", resetButtonColor: "medium" },
        h("fireenjin-input", { label: "First Name", labelPosition: "stacked", placeholder: "What is your first name?", name: "firstName", value: this.user.firstName }),
        h("fireenjin-input", { label: "Last Name", labelPosition: "stacked", placeholder: "What is your last name?", name: "lastName", value: this.user.lastName }),
        h("fireenjin-radios", { name: "type", label: "Type", labelPosition: "stacked", options: [
            {
              label: "Referral Partner",
              value: "referral",
            },
            {
              label: "Property Owner / Manager",
              value: "property",
            },
            {
              label: "Claims Representaive",
              value: "insurance",
            },
          ], value: (_d = this.user) === null || _d === void 0 ? void 0 : _d.type }))));
  }
  static get is() { return "modal-onboarding"; }
  static get originalStyleUrls() { return {
    "$": ["modal-onboarding.css"]
  }; }
  static get styleUrls() { return {
    "$": ["modal-onboarding.css"]
  }; }
  static get properties() { return {
    "user": {
      "type": "any",
      "mutable": false,
      "complexType": {
        "original": "any",
        "resolved": "any",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "user",
      "reflect": false,
      "defaultValue": "{}"
    }
  }; }
  static get states() { return {
    "referralId": {}
  }; }
  static get listeners() { return [{
      "name": "fireenjinReset",
      "method": "onReset",
      "target": "body",
      "capture": false,
      "passive": false
    }, {
      "name": "fireenjinSuccess",
      "method": "onSuccess",
      "target": "body",
      "capture": false,
      "passive": false
    }]; }
}
