@oxyhq/services/lib/module/ui/screens/steps/RecoverSuccessStep.js

Reusable OxyHQ module to handle authentication, user management, karma system, device-based session management and more 🚀

"use strict";

import { View, Text, StyleSheet } from 'react-native';
import { Ionicons } from '@expo/vector-icons';
import GroupedPillButtons from '../../components/internal/GroupedPillButtons';
import { useI18n } from '../../hooks/useI18n';
import { STEP_INNER_GAP, stepStyles } from '../../styles/spacing';
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
const RecoverSuccessStep = ({
  colors,
  styles,
  navigate,
  allStepData,
  successMessage
}) => {
  const {
    t
  } = useI18n();
  const baseStyles = stepStyles;
  // Extract identifier from previous steps
  const requestData = allStepData[0] || {};
  const {
    identifier
  } = requestData;
  const handleContinueToReset = () => {
    // Navigate back to SignIn and let host app open its reset flow
    navigate('SignIn', {
      showReset: true,
      identifier
    });
  };
  const handleBackToSignIn = () => {
    navigate('SignIn');
  };
  return /*#__PURE__*/_jsxs(_Fragment, {
    children: [/*#__PURE__*/_jsx(View, {
      style: [baseStyles.container, baseStyles.sectionSpacing, stylesheet.iconContainer],
      children: /*#__PURE__*/_jsx(View, {
        style: [stylesheet.successIcon, {
          backgroundColor: colors.success + '20'
        }],
        children: /*#__PURE__*/_jsx(Ionicons, {
          name: "checkmark-circle",
          size: 40,
          color: colors.success
        })
      })
    }), /*#__PURE__*/_jsxs(View, {
      style: [baseStyles.container, baseStyles.sectionSpacing, baseStyles.header],
      children: [/*#__PURE__*/_jsx(Text, {
        style: [styles.modernTitle, baseStyles.title, {
          color: colors.text,
          marginBottom: 0,
          marginTop: 0
        }],
        children: t('recover.title')
      }), /*#__PURE__*/_jsx(Text, {
        style: [styles.modernSubtitle, baseStyles.subtitle, {
          color: colors.secondaryText,
          marginBottom: 0,
          marginTop: 0
        }],
        children: successMessage || t('recover.resetSuccess')
      })]
    }), /*#__PURE__*/_jsxs(View, {
      style: [baseStyles.container, baseStyles.sectionSpacing],
      children: [/*#__PURE__*/_jsxs(View, {
        style: [stylesheet.infoCard, {
          backgroundColor: colors.inputBackground,
          borderColor: colors.border
        }],
        children: [/*#__PURE__*/_jsx(Text, {
          style: [styles.footerText, stylesheet.infoTitle, {
            color: colors.text
          }],
          children: t('recover.whatsNextTitle') || "What's next?"
        }), /*#__PURE__*/_jsx(Text, {
          style: [styles.footerText, stylesheet.infoBody, {
            color: colors.secondaryText
          }],
          children: t('recover.whatsNextBody') || 'You can now reset your password or return to sign in with your existing credentials.'
        })]
      }), /*#__PURE__*/_jsxs(View, {
        style: [stylesheet.successBanner, {
          backgroundColor: colors.success + '10',
          borderColor: colors.success + '30'
        }],
        children: [/*#__PURE__*/_jsx(Ionicons, {
          name: "shield-checkmark",
          size: 20,
          color: colors.success
        }), /*#__PURE__*/_jsx(Text, {
          style: [styles.footerText, stylesheet.bannerText, {
            color: colors.success
          }],
          children: successMessage || t('recover.completeSecure') || 'Your account recovery is complete and secure.'
        })]
      })]
    }), /*#__PURE__*/_jsx(View, {
      style: [baseStyles.container, baseStyles.sectionSpacing, baseStyles.buttonContainer],
      children: /*#__PURE__*/_jsx(GroupedPillButtons, {
        buttons: [{
          text: t('common.actions.signIn'),
          onPress: handleBackToSignIn,
          icon: 'arrow-back',
          variant: 'transparent'
        }],
        colors: colors
      })
    })]
  });
};
export default RecoverSuccessStep;
const stylesheet = StyleSheet.create({
  iconContainer: {
    alignItems: 'center',
    justifyContent: 'center'
  },
  successIcon: {
    width: 80,
    height: 80,
    borderRadius: 40,
    alignItems: 'center',
    justifyContent: 'center'
  },
  infoCard: {
    padding: STEP_INNER_GAP * 2,
    borderRadius: 16,
    borderWidth: 1,
    marginBottom: STEP_INNER_GAP,
    gap: STEP_INNER_GAP
  },
  infoTitle: {
    fontSize: 16,
    marginBottom: 0
  },
  infoBody: {
    fontSize: 14,
    lineHeight: 20
  },
  successBanner: {
    flexDirection: 'row',
    alignItems: 'center',
    padding: STEP_INNER_GAP,
    borderRadius: 8,
    borderWidth: 1,
    gap: STEP_INNER_GAP
  },
  bannerText: {
    flex: 1,
    fontSize: 14
  }
});
//# sourceMappingURL=RecoverSuccessStep.js.map