import { langEnum } from '../types/lang';

import type { GenericObjectType } from '@contentstack/app-sdk/dist/src/types/common.types';
import type { Lang } from '../types/lang';
import type {
  Config,
  ImageVaultAsset,
  InsertResponse,
  PublishDetails,
} from "../types/imagevault";

const metaIds = {
  [langEnum.de]: { altText: 68, title: 77 },
  [langEnum.da]: { altText: 67, title: 76 },
  [langEnum.fi]: { altText: 70, title: 78 },
  [langEnum.no]: { altText: 71, title: 79 },
  [langEnum.sv]: { altText: 74, title: 82 },
  [langEnum.en]: { altText: 69, title: 65 },
};

export function getMetaIds(lang: Lang) {
  return metaIds[lang];
}

export type EntryDataPublishDetails = {
  branch: string;
  contentTypeUid: string;
  locale: Lang;
  stackApiKey: string;
  title: string;
  uid: string;
};

export function getPublishDetails(
  baseUrl: string,
  {
    branch,
    contentTypeUid,
    locale,
    stackApiKey,
    title,
    uid,
  }: EntryDataPublishDetails
): PublishDetails {
  const text = `${title} (${uid})`;
  const url = `${baseUrl}#!/stack/${stackApiKey}/content-type/${contentTypeUid}/${locale}/entry/${uid}/edit?branch=${branch}`;

  return { text, url };
}

export function isInsertResponse(
  res: InsertResponse | GenericObjectType
): res is InsertResponse {
  return (res as InsertResponse).MediaConversions !== undefined;
}

export type ImageVaultDAMConfig = {
  imageVaultUrl: string;
  baseUrl: string;
  formatId: string;
};

export function isImageVaultDAMConfig(
  config: Record<string, string>
): config is ImageVaultDAMConfig {
  return !!(config.baseUrl && config.formatId && config.imageVaultUrl);
}

// Utility function to convert InsertResponse to ImageVaultAsset, used mainly for custom field images
// For RTE this function is not enough since rte:s also need attrs, like position and the size thats 
// chosen in the editor
export function insertResponseToImageVaultAsset(
  response: InsertResponse
): ImageVaultAsset {
  const alt = response.Metadata?.find((meta) =>
    meta.Name.includes("AltText_")
  )?.Value;

  const caption = response.Metadata?.find((meta) =>
    meta.Name.includes("Title_")
  )?.Value;

  return {
    url: response.MediaConversions[0].Url,
    id: response.Id,
    meta: {
      alt,
      caption,
    },
    title: response.Name,
    dimensions: {
      width: response.MediaConversions[0].Width,
      height: response.MediaConversions[0].Height,
      aspectRatio: response.MediaConversions[0].FormatAspectRatio,
    },
  };
}

export type openImageVaultParams = {
  config: ImageVaultDAMConfig;
  entryData: EntryDataPublishDetails;
  onSuccess: (result: InsertResponse) => void;
  onClose?: () => void;
};

export function openImageVault({
  config,
  entryData,
  onSuccess,
  onClose,
}: openImageVaultParams) {
  if (window.ImageVault) {
    const publishDetails = getPublishDetails(config.baseUrl, entryData);
    const metaIdsForLocale = getMetaIds(entryData.locale);

    const insertMediaWindowOptions: Config = {
      imageVaultUiUrl: config.imageVaultUrl,
      uiLang: "en",
      pageLang: "en",
      publishingSource: config.baseUrl,
      mediaUrlBase: config.imageVaultUrl,
      formatId: config.formatId,
      publishDetails,
      insertMultiple: false,
      success: (result) => {
        onSuccess(result.response);
      },
      close: () => {
        if (typeof onClose === "function") {
          onClose();
        }
        windowInserter.containerWindow?.close();
      },
    };

    if (metaIdsForLocale) {
      const additionalMetadataIds = Object.values(metaIdsForLocale).join(",");
      insertMediaWindowOptions.additionalMetadataIds = additionalMetadataIds;
    }

    const windowInserter = new window.ImageVault.InsertMediaWindow(
      insertMediaWindowOptions,
      `left=0,top=0,width=${window.screen.width},height=${window.screen.height}`
    );
    windowInserter.openImageVault();
  } else {
    console.error("Missing ImageVault global. ImageVault script not loaded?");
  }
}