import React, { useCallback, useMemo } from 'react';
import { useIntl } from 'react-intl';
import { messages } from '../../../messages';
import ImageIcon from '../../../view/common/image-icon';
import { showFlag } from '../../../view/Flag';
const FLAG_ICON_SIZE = '16px';
const renderIcon = iconUrlOrElement => {
  if (!iconUrlOrElement) {
    return;
  }
  const icon = iconUrlOrElement && typeof iconUrlOrElement === 'string' ? /*#__PURE__*/React.createElement(ImageIcon, {
    height: FLAG_ICON_SIZE,
    testId: "sl-flag",
    url: iconUrlOrElement,
    width: FLAG_ICON_SIZE
  }) : iconUrlOrElement;
  return icon;
};

// Safe wrapper — returns null if IntlProvider is not in the tree
const useIntlSafe = () => {
  try {
    return useIntl();
  } catch {
    return null;
  }
};
const useActionFlags = () => {
  const intl = useIntlSafe();
  const showConnectFlag = useCallback(({
    provider,
    ...flagArgs
  } = {}) => {
    var _provider$text;
    if (!intl) {
      return;
    }
    const context = (_provider$text = provider === null || provider === void 0 ? void 0 : provider.text) !== null && _provider$text !== void 0 ? _provider$text : intl.formatMessage(messages.connect_link_account_success_flag_title_default);
    showFlag({
      icon: renderIcon(provider === null || provider === void 0 ? void 0 : provider.icon),
      title: intl.formatMessage(messages.connect_link_account_success_flag_title, {
        context
      }),
      description: intl.formatMessage(messages.connect_link_account_success_flag_description),
      ...flagArgs
    });
  }, [intl]);
  return useMemo(() => ({
    showConnectFlag
  }), [showConnectFlag]);
};
export default useActionFlags;