// Metro module 13772 (f13773).
import _slicedToArray from "../../../../_bundle/_slicedToArray";
import { useState } from "react";
import { View } from "react-native";
import { WebAuthnScreens } from "../../WebAuthnConstants";
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
import { useNavigation } from "../../../../design/components/Navigator/native/useNavigation.native";
import { finishRegisterWebAuthnCredential } from "../../WebAuthnActionCreators";
import ToastActionCreators from "../../../toast/native/ToastActionCreators";
import { intl, t } from "../../../../intl/index.native";
import Module9690 from "../../../../_bundle/Module9690";
import { CircleCheckIcon } from "../../../../design/components/Icon/native/redesign/generated/CircleCheckIcon";
import { Form, FormInput, FormDivider } from "../../../../design/void/Form/native/index";
import { ClearButtonVisibility } from "../../../../design/void/native";
import { Button } from "../../../../design/components/Button/native/Button.native";
const useStyles = createStyles({
  margin: {
    margin: 16
  }
});
export default function WebAuthnNameStep(props) {
  let navigation, setState, setState2, state;
  const { ticket, credential } = props;
  let name = props.name;
  navigation = void 0;
  setState = void 0;
  setState2 = void 0;
  state = void 0;
  let _onPress2 = function _onPress() {
    const r9 = async () => {
      let c30666_2;
      let c30666_3 = 0;
      try {
        c30666_3 = 2;
        setState(true);
        await finishRegisterWebAuthnCredential(state, ticket, credential);
        c30666_3 = 0;
        (0, setState)(false);
        ToastActionCreators.open({
          key: "WEBAUTHN_CREDENTIAL_REGISTER_SUCCESS_TOAST_KEY",
          content: intl.string(t.j3d5qI),
          icon: Module9690,
          IconComponent: CircleCheckIcon,
          iconColor: "status-success"
        });
        navigation.push(WebAuthnScreens.SUCCESS, {});
      } catch ($e) {
        const r33 = $e;
        let r7 = r33;
        c30666_2 = r33;
        let r34 = c30666_3;
        if (r34 !== 0) {
          while (true) {
            if (r34 !== 1) {
              try {
                const r100 = c30666_2;
                c30666_3 = 1;
                (0, setState2)(r100.body.message);
                c30666_3 = 0;
                (0, setState)(false);
              } catch (r98) {
                r7 = r98;
                c30666_2 = r98;
                r34 = c30666_3;
                if (r34 === 0) {
                  break;
                }
                continue;
              }
              return void 0;
            }
            try {
              const r115 = c30666_2;
              c30666_3 = 0;
              (0, setState)(false);
              throw r115;
            } catch (r113) {
              r7 = r113;
              c30666_2 = r113;
              r34 = c30666_3;
              if (r34 === 0) {
                break;
              }
            }
          }
        }
        throw r7;
      }
    };
    _onPress2 = r9;
    return r9.apply(this, arguments);
  };
  const styles = useStyles();
  navigation = useNavigation();
  let disabled;
  [disabled, setState] = useState(false);
  let error;
  [error, setState2] = useState(null);
  if (name == null) {
    name = "";
  }
  const r38 = _slicedToArray(useState(name), 2);
  state = r38[0];
  return <Form>
    <FormInput showTopContainer={false} value={state} onChange={r38[1]} style={styles.margin} error={error} title={intl.string(t["Jzd+z/"])} placeholder={intl.string(t["I/sJtJ"])} disabled={disabled} clearButtonVisibility={ClearButtonVisibility.WITH_CONTENT} autoFocus showBorder required large />
    <FormDivider />
    <View style={styles.margin}>
      <Button onPress={function onPress() {
        return _onPress2.apply(this, arguments);
      }} text={intl.string(t["5dyZ1S"])} disabled={state === ""} size="lg" />
    </View>
  </Form>;
};