// Metro module 13952 (f13953).
import { useCallback, useState, useMemo } from "react";
import { View } from "react-native";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import ModalActionCreators from "../../../actions/ModalActionCreators";
import UserUtils from "../../../utils/UserUtils";
import { useRequiresParentalConsent } from "../hooks/useUserLinks";
import { presentFailedToast } from "../../toast/native/ToastUtils";
import { intl, t } from "../../../intl/index.native";
import { useFamilyCenterActions } from "../hooks/useFamilyCenterActions";
import { useAgeSpecificText } from "../hooks/useAgeSpecificText";
import FamilyCenter_messages from "../FamilyCenter.messages";
import { ModalScreen } from "../../../design/components/Modal/native/ModalScreen.native";
import { ModalContent } from "../../../design/components/Modal/native/ModalContent.native";
import FamilyCenterAvatarPair from "./FamilyCenterAvatarPair";
import Module7699 from "../../../_bundle/Module7699";
import { Text } from "../../../design/components/Text/native/Text";
import FamilyCenterInlineWarningNotice from "./FamilyCenterInlineWarningNotice";
import { Stack } from "../../../design/components/Stack/native/Stack.native";
import { Checkbox } from "../../../design/components/Checkbox/native/Checkbox.native";
import { ModalFooter } from "../../../design/components/Modal/native/ModalFooter.native";
import { ButtonGroup } from "../../../design/components/ButtonGroup/native/ButtonGroup.native";
import { Button } from "../../../design/components/Button/native/Button.native";
import { getHeaderCloseButton } from "../../../design/components/Navigator/native/NavigatorHeader.native";
import { Modal } from "../../../design/components/Modal/native/Modal.native";
let useStyles;
const FamilyCenterModalDisconnectScreen = function FamilyCenterModalDisconnectScreen(props) {
  let setState, setState2, disconnectLinkRequest, isDisconnectLoading;
  const otherUser = props.otherUser;
  setState = void 0;
  setState2 = void 0;
  disconnectLinkRequest = void 0;
  isDisconnectLoading = void 0;
  const styles = useStyles();
  const callback = useCallback(() => {
    ModalActionCreators.pop();
  }, []);
  const name = UserUtils.useName(otherUser);
  const requiresParentalConsent = useRequiresParentalConsent(otherUser.id);
  let checked;
  [checked, setState] = useState(false);
  let checked2;
  [checked2, setState2] = useState(false);
  const familyCenterActions = useFamilyCenterActions({
    onSuccess: callback,
    onError: useCallback(() => {
      presentFailedToast(intl.string(t.R0RpRX));
      setState(false);
      setState2(false);
    }, [])
  });
  disconnectLinkRequest = familyCenterActions.disconnectLinkRequest;
  isDisconnectLoading = familyCenterActions.isDisconnectLoading;
  const ageSpecificText4 = useAgeSpecificText(intl.format(FamilyCenter_messages.F2lccv, {
    username: name
  }), intl.string(FamilyCenter_messages["WH+Gba"]));
  const ageSpecificText3 = useAgeSpecificText(intl.string(FamilyCenter_messages.hOEHFn), intl.format(FamilyCenter_messages.Or6hgl, {
    username: name
  }));
  const ageSpecificText5 = useAgeSpecificText(intl.format(FamilyCenter_messages.XyRW4c, {
    username: name
  }), intl.format(FamilyCenter_messages.PlrZal, {
    username: name
  }));
  const ageSpecificText2 = useAgeSpecificText(intl.string(FamilyCenter_messages.eiABQz), intl.string(FamilyCenter_messages.PGQBnk));
  const ageSpecificText = useAgeSpecificText(intl.string(FamilyCenter_messages.sCbKs4), intl.string(FamilyCenter_messages["0ki7+P"]));
  const callback2 = useCallback(() => {
    disconnectLinkRequest(otherUser.id);
  }, [disconnectLinkRequest, otherUser.id]);
  const callback3 = useCallback((a0) => {
    if (!isDisconnectLoading) {
      setState(a0);
    }
  }, [isDisconnectLoading]);
  const callback4 = useCallback((a0) => {
    if (!isDisconnectLoading) {
      setState2(a0);
    }
  }, [isDisconnectLoading]);
  return <ModalScreen>
    <ModalContent>
      <View style={styles.header}>
        <FamilyCenterAvatarPair otherUser={otherUser} iconSrc={Module7699} />
        <Text style={styles.title} variant="text-lg/bold">
          {intl.format(FamilyCenter_messages.o0JXuK, {
            username: name
          })}
        </Text>
        <Text style={styles.subtitle} variant="text-sm/bold" color="text-default">{ageSpecificText4}</Text>
      </View>
      {requiresParentalConsent && <FamilyCenterInlineWarningNotice style={styles.warning} text={ageSpecificText3} />}
      <Text style={styles.body} variant="text-md/normal" color="text-default">{ageSpecificText5}</Text>
      <Stack spacing={Module712.space.PX_12}>
        <Checkbox label={ageSpecificText2} checked={checked} onToggle={callback3} />
        <Checkbox label={ageSpecificText} checked={checked2} onToggle={callback4} />
      </Stack>
    </ModalContent>
    <ModalFooter>
      <ButtonGroup>
        <Button variant="destructive" disabled={(checked ? !checked2 : !checked) || isDisconnectLoading} loading={isDisconnectLoading} text={intl.string(FamilyCenter_messages["c5L+sl"])} onPress={callback2} />
        <Button variant="tertiary" text={intl.string(t["3ilveh"])} onPress={ModalActionCreators.pop} />
      </ButtonGroup>
    </ModalFooter>
  </ModalScreen>;
};
useStyles = createStyles({
  header: {
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    marginBottom: Module712.space.PX_16
  },
  title: {
    marginTop: Module712.space.PX_24,
    textAlign: "center"
  },
  subtitle: {
    marginTop: Module712.space.PX_8,
    textAlign: "center"
  },
  warning: {
    marginBottom: Module712.space.PX_12
  },
  body: {
    marginBottom: Module712.space.PX_24
  }
});
export default function FamilyCenterModalDisconnect(props) {
  const otherUser2 = props.otherUser;
  return <Modal initialRouteName="DISCONNECT" screens={useMemo(() => {
    const otherUser3 = otherUser2;
    return {
      DISCONNECT: {
        headerShown: true,
        headerLeft: getHeaderCloseButton(ModalActionCreators.pop),
        headerTitle: () => null,
        render: () => <FamilyCenterModalDisconnectScreen otherUser={otherUser3} />
      }
    };
  }, [otherUser2])} headerBackTitle={intl.string(t["13/7kX"])} />;
};