import { components } from "@credify/api-docs"
import { calculateResizeWindow, UserClaimPayload, UserProfile } from "."
import { PASSPORT_APP_TITLE } from "./constants/global"
export { camelize, decamelize } from "@credify/crypto"

const openPopupWindow = (url: string, newWindow?: Window): Window | null => {
  if (newWindow) {
    newWindow.location = url
    return newWindow
  } else {
    const { width, height, top, left, systemZoom } = calculateResizeWindow()
    return window.open(
      url,
      PASSPORT_APP_TITLE,
      `
        scrollbars=yes,
        width=${width},
        height=${height / systemZoom},
        top=${top},
        left=${left}
        `
    )
  }
}

const formatPhoneNumber = (phoneNumber: string) => {
  if (!phoneNumber) return ""

  if (phoneNumber.startsWith("0")) {
    phoneNumber = phoneNumber.substring(1, phoneNumber.length)
  }

  return phoneNumber
}

const formatCountryCode = (countryCode: string) => {
  if (!countryCode) return ""
  return countryCode.startsWith("+") ? countryCode : `+${countryCode}`
}

const parseUserClaims = (jsonObj: object): UserProfile | null => {
  const userClaims = jsonObj as UserClaimPayload
  const entityId = userClaims.entityId
  const claims = userClaims.claims

  if (claims instanceof Array) {
    const phoneObj = claims.find((x) => x?.claimName === "phone_number")
    const familyNameObj = claims.find((x) => x?.claimName === "family_name")
    const givenNameObj = claims.find((x) => x?.claimName === "given_name")
    const nameObj = claims.find((x) => x?.claimName === "name")
    const phone = parsePhoneNumber(phoneObj?.claimValue)
    const userProfile: UserProfile = {
      phoneNumber: phone?.phoneNumber || "",
      countryCode: phone?.countryCode || "",
      firstName: givenNameObj ? givenNameObj["claimValue"] : "",
      lastName: familyNameObj ? familyNameObj["claimValue"] : "",
      fullName: nameObj ? nameObj["claimValue"] : "",
      entityId: entityId,
    }
    return userProfile
  }

  return null
}

const parsePhoneNumber = (
  fullPhoneNumber: string
): components["Phone"] | null => {
  if (!fullPhoneNumber) {
    return null
  }

  const countryCode = fullPhoneNumber.substring(0, 3)
  const phoneNumber = fullPhoneNumber.substring(3)
  return {
    phoneNumber,
    countryCode,
  }
}

/**
 * Sends a request to the specified url from a form. this will be redirected by backend.
 * @param path sends a request to the specified url from a form. this will change the window location.
 * @param params data need to pass when submitting form
 * @param method method
 */
function submitCustomForm(path: string, params: any, method = "post") {
  const form = document.createElement("form")
  form.method = method
  form.action = path
  form.setAttribute("display", "none");
  const values = JSON.stringify(params.payload)

  const tokenField = document.createElement("input")
  tokenField.type = "hidden"
  tokenField.name = "token"
  tokenField.value = params.token
  form.appendChild(tokenField)

  const payloadField = document.createElement("input")
  payloadField.type = "hidden"
  payloadField.name = "payload"
  payloadField.value = values
  form.appendChild(payloadField)

  document.body.appendChild(form)
  form.submit()
}

export {
  openPopupWindow,
  formatPhoneNumber,
  formatCountryCode,
  parseUserClaims,
  submitCustomForm,
}