import React, {memo} from 'react';
import {useTranslation} from 'react-i18next';
import {Dialog} from '@components/index';
import {useShowPinLimitReached} from '@modules/chats/store';

function DialogPinMaxLimitComponent() {
  const {t} = useTranslation();
  const [showPinLimitReached, setPinLimitReached] = useShowPinLimitReached();

  const close = () => setPinLimitReached(false);

  return (
    <Dialog
      isVisible={showPinLimitReached}
      title={t('chat.pin.limit_reached')}
      onClose={close}
      footer={{
        primaryButton: {
          text: t('general.understood'),
          onPress: close,
        },
      }}
    />
  );
}

export const DialogPinMaxLimit = memo(DialogPinMaxLimitComponent);
