import { DataSource, DataSourceDecorator } from '../../shared/framework';
// @ts-ignore
import { CometChat } from '@cometchat/chat-sdk-react-native';
import { ExtensionConstants } from '../ExtensionConstants';
import { getExtentionData } from '../ExtensionModerator';
// import { ThumbnailGenerationConfigurationInterface } from './ThumbnailGenerationConfiguration';
import {
  CometChatImageBubble,
  CometChatVideoBubble,
  ImageBubbleStyleInterface,
  VideoBubbleStyleInterface,
} from '../../shared/views';
// @ts-ignore
import React from 'react';
import { CometChatTheme } from '../../shared/resources/CometChatTheme';
import { ThumbnailGenerationConfigurationInterface } from './ThumbnailGenerationExtension';
import { defaultThumbnail } from './resources';

export class ThumbnailGenerationExtensionDecorator extends DataSourceDecorator {
  thumbnailGenerationConfiguration?: ThumbnailGenerationConfigurationInterface;

  // loggedInUser: CometChat.User;

  constructor(
    dataSource: DataSource,
    thumbnailGenerationConfiguration?: ThumbnailGenerationConfigurationInterface
  ) {
    super(dataSource);
    if (thumbnailGenerationConfiguration != undefined) {
      this.thumbnailGenerationConfiguration = thumbnailGenerationConfiguration;
    }
  }

  getId(): string {
    return 'ThumbnailGeneration';
  }

  checkThumbnail(message: any) {
    let image: { uri: string | null } = { uri: null };
    let thumbnailData = getExtentionData(
      message,
      ExtensionConstants.thumbnailGeneration
    );
    if (thumbnailData == undefined) {
      image = message.getType() === "image" ? { uri: message?.data?.url } : defaultThumbnail;  //default image for type video
    } else {
      let attachmentData = thumbnailData['attachments'];
      if (attachmentData.length) {
        let dataObj = attachmentData[0];

        if (!dataObj['error']) {
          let imageLink = dataObj?.['data']?.['thumbnails']?.['url_small'];
          image = imageLink ? { uri: dataObj['data']['thumbnails']['url_small'] } : defaultThumbnail; //if imageLink is empty or does not exist then load default image
        } else {
          image = defaultThumbnail; //default image
        }
      }
    }
    return image;
  }

  getVideoMessageBubble(
    videoUrl: string,
    thumbnailUrl: string,
    message: CometChat.MediaMessage,
    theme: CometChatTheme,
    videoBubbleStyle: VideoBubbleStyleInterface
  ) {
    const image: any = this.checkThumbnail(message);
    return (
      <CometChatVideoBubble
        videoUrl={videoUrl}
        thumbnailUrl={image}
        style={{
          height: 200,
          width: 200,
          backgroundColor: theme?.palette?.getBackgroundColor() ?? '#fff',
          playIconBackgroundColor:
            theme?.palette?.getAccent500() ?? 'rgba(20,20,20,0.4)',
          playIconTint: theme?.palette?.getBackgroundColor() ?? '#fff',
          ...videoBubbleStyle,
          ...(this.thumbnailGenerationConfiguration?.videoBubbleStyle
            ? this.thumbnailGenerationConfiguration.videoBubbleStyle
            : {}),
        }}
      />
    );
  }

  getImageMessageBubble(
    imageUrl: string,
    caption: string,
    style: ImageBubbleStyleInterface,
    message: CometChat.MediaMessage,
    theme: CometChatTheme
  ): JSX.Element {
    const image: any = this.checkThumbnail(message);
    return (
      <CometChatImageBubble
        imageUrl={imageUrl ? { uri: imageUrl } : image}
        thumbnailUrl={image}
        style={{
          height: 200,
          width: 200,
          backgroundColor: theme?.palette?.getBackgroundColor() ?? '#fff',
          ...style,
        }}
      />
    );
  }
}