"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = require("react");
var _reactNative = require("react-native");
var _vectorIcons = require("@expo/vector-icons");
var _GroupedPillButtons = _interopRequireDefault(require("../../components/internal/GroupedPillButtons"));
var _PinInput = _interopRequireDefault(require("../../components/internal/PinInput"));
var _useI18n = require("../../hooks/useI18n");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const SignInTotpStep = ({
  colors,
  styles,
  navigate,
  prevStep,
  nextStep,
  username,
  mfaToken,
  completeMfaLogin,
  errorMessage,
  setErrorMessage,
  isLoading
}) => {
  const [code, setCode] = (0, _react.useState)('');
  const inputRef = (0, _react.useRef)(null);
  const {
    t
  } = (0, _useI18n.useI18n)();
  const handleVerify = async () => {
    if (!code || code.length !== 6) {
      setErrorMessage?.(t('recover.enterCode'));
      return;
    }
    try {
      setErrorMessage?.('');
      await completeMfaLogin?.(mfaToken, code);
      // Login completed; higher-level navigation should continue automatically
    } catch (e) {
      setErrorMessage?.(e?.message || t('signin.totp.invalidCode') || 'Invalid code. Please try again.');
      setTimeout(() => inputRef.current?.focus(), 0);
    }
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
      style: styles.modernHeader,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
        style: [styles.modernTitle, {
          color: colors.text
        }],
        children: t('signin.totp.title') || 'Two‑Factor Code'
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
        style: [styles.modernSubtitle, {
          color: colors.secondaryText
        }],
        children: t('signin.totp.subtitle', {
          username
        }) || `Enter the 6‑digit code from your authenticator app for @${username}`
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
      style: styles.modernInputContainer,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_PinInput.default, {
        ref: inputRef,
        value: code,
        onChange: setCode,
        length: 6,
        disabled: isLoading,
        autoFocus: true,
        colors: colors
      }), errorMessage ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
        style: {
          flexDirection: 'row',
          alignItems: 'center',
          marginTop: 16,
          padding: 12,
          backgroundColor: colors.error + '10',
          borderRadius: 8,
          borderWidth: 1,
          borderColor: colors.error + '30'
        },
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
          name: "alert-circle",
          size: 20,
          color: colors.error,
          style: {
            marginRight: 8
          }
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
          style: [styles.footerText, {
            color: colors.error,
            fontSize: 14
          }],
          children: errorMessage
        })]
      }) : null]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GroupedPillButtons.default, {
      buttons: [{
        text: t('common.actions.back'),
        onPress: prevStep,
        icon: 'arrow-back',
        variant: 'transparent'
      }, {
        text: t('signin.actions.verify'),
        onPress: handleVerify,
        icon: 'shield-checkmark',
        variant: 'primary',
        loading: isLoading,
        disabled: isLoading || code.length !== 6
      }],
      colors: colors
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
      style: {
        marginTop: 12,
        alignItems: 'center'
      },
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
        style: [styles.footerText, {
          color: colors.secondaryText
        }],
        children: t('signin.totp.noAccess') || 'No access to your authenticator?'
      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
        style: {
          flexDirection: 'row',
          gap: 12,
          marginTop: 6
        },
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
          onPress: () => navigate('RecoverAccount', {
            prefillUsername: username
          }),
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
            style: [styles.linkText, {
              color: colors.primary
            }],
            children: t('signin.totp.useBackupCode') || 'Use backup code'
          })
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
          style: [styles.footerText, {
            color: colors.secondaryText
          }],
          children: "\u2022"
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
          onPress: () => navigate('RecoverAccount', {
            prefillUsername: username
          }),
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
            style: [styles.linkText, {
              color: colors.primary
            }],
            children: t('signin.totp.useRecoveryKey') || 'Use recovery key'
          })
        })]
      })]
    })]
  });
};
var _default = exports.default = SignInTotpStep;
//# sourceMappingURL=SignInTotpStep.js.map