import React, { useState } from 'react';
import { animation, Menu } from 'react-contexify';
import {
  getAddModeratorsMenuItem,
  getBlockMenuItem,
  getChangeNicknameMenuItem,
  getClearNicknameMenuItem,
  getCopyMenuItem,
  getDeleteContactMenuItem,
  getDeleteMessagesMenuItem,
  getDisappearingMenuItem,
  getInviteContactMenuItem,
  getLeaveGroupMenuItem,
  getMarkAllReadMenuItem,
  getRemoveModeratorsMenuItem,
  getUpdateGroupNameMenuItem,
} from './Menu';
import { TimerOption } from '../../conversation/ConversationHeader';

export type PropsConversationHeaderMenu = {
  id: string;
  triggerId: string;
  isMe: boolean;
  isPublic?: boolean;
  isKickedFromGroup?: boolean;
  left?: boolean;
  isGroup: boolean;
  isAdmin: boolean;
  timerOptions: Array<TimerOption>;
  isPrivate: boolean;
  isBlocked: boolean;
  hasNickname?: boolean;

  onDeleteMessages?: () => void;
  onDeleteContact?: () => void;
  onCopyPublicKey?: () => void;
  onInviteContacts?: () => void;
  onChangeNickname?: () => void;
  onClearNickname?: () => void;

  onLeaveGroup: () => void;
  onMarkAllRead: () => void;
  onAddModerators: () => void;
  onRemoveModerators: () => void;
  onUpdateGroupName: () => void;
  onBlockUser: () => void;
  onUnblockUser: () => void;
  onSetDisappearingMessages: (seconds: number) => void;
};

export const ConversationHeaderMenu = (props: PropsConversationHeaderMenu) => {
  const {
    id,
    triggerId,
    isMe,
    isPublic,
    isGroup,
    isKickedFromGroup,
    isAdmin,
    timerOptions,
    isBlocked,
    isPrivate,
    left,
    hasNickname,

    onClearNickname,
    onChangeNickname,
    onDeleteMessages,
    onDeleteContact,
    onCopyPublicKey,
    onMarkAllRead,
    onLeaveGroup,
    onAddModerators,
    onRemoveModerators,
    onInviteContacts,
    onUpdateGroupName,
    onBlockUser,
    onUnblockUser,
    onSetDisappearingMessages,
  } = props;


  const [modal, setModal] = useState<any>(null);

  return (
    <>
      {modal ? modal : null}

      <Menu id={triggerId} animation={animation.fade}>


        {getDisappearingMenuItem(
          isPublic,
          isKickedFromGroup,
          left,
          isBlocked,
          timerOptions,
          onSetDisappearingMessages,
          window.i18n
        )}
        {getBlockMenuItem(isMe, isPrivate, isBlocked, onBlockUser, onUnblockUser, window.i18n)}

        {getCopyMenuItem(isPublic, isGroup, onCopyPublicKey, window.i18n)}
        {getMarkAllReadMenuItem(onMarkAllRead, window.i18n)}
        {getChangeNicknameMenuItem(isMe, onChangeNickname, isGroup, window.i18n, id, setModal)}
        {getClearNicknameMenuItem(isMe, hasNickname, onClearNickname, isGroup, window.i18n)}
        {getDeleteMessagesMenuItem(isPublic, onDeleteMessages, window.i18n, id)}
        {getAddModeratorsMenuItem(isAdmin, isKickedFromGroup, onAddModerators, window.i18n)}
        {getRemoveModeratorsMenuItem(isAdmin, isKickedFromGroup, onRemoveModerators, window.i18n)}
        {getUpdateGroupNameMenuItem(isAdmin, isKickedFromGroup, left, onUpdateGroupName, window.i18n)}
        {getLeaveGroupMenuItem(isKickedFromGroup, left, isGroup, isPublic, onLeaveGroup, window.i18n, id)}
        {/* TODO: add delete group */}
        {getInviteContactMenuItem(isGroup, isPublic, onInviteContacts, window.i18n)}
        {getDeleteContactMenuItem(
          isMe,
          isGroup,
          isPublic,
          left,
          isKickedFromGroup,
          onDeleteContact,
          window.i18n
        )}
      </Menu>
    </>
  );
};