// Metro module 16717 (f16718).
import { View } from "react-native";
import UserStore from "../../../../stores/UserStore";
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
import { NAV_BAR_HEIGHT } from "../../../../design/components/Navigator/native/NavigatorConstants.native";
import Module712 from "../../../../_bundle/Module712";
import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
import { useStateFromStores } from "../../../../_bundle/Module589";
import { Text } from "../../../../design/components/Text/native/Text";
import AuthenticationActionCreators from "../../../../actions/AuthenticationActionCreators";
import { intl } from "../../../../intl/index.native";
import SafetyFlows_messages from "../../SafetyFlows.messages";
const useStyles = createStyles({
  row: {
    height: NAV_BAR_HEIGHT,
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "center",
    paddingHorizontal: Module712.space.PX_16
  },
  logOut: {
    position: "absolute",
    left: Module712.space.PX_16
  }
});
export function ParentalConsentConnectionNavbar() {
  const styles = useStyles();
  const top = useSafeAreaInsets_native().top;
  const stateFromStores = useStateFromStores([UserStore], () => UserStore.getCurrentUser()?.username);
  return <View style={{
    paddingTop: top
  }}>
    <View style={styles.row}>
      <Text accessibilityRole="button" variant="text-md/medium" color="text-link" style={styles.logOut} onPress={() => AuthenticationActionCreators.logout("safety_flows_parental_consent_connection")}>
        {intl.string(SafetyFlows_messages["3HuGuY"])}
      </Text>
      {stateFromStores != null && <Text accessibilityRole="header" variant="text-md/semibold" color="mobile-text-heading-primary">{stateFromStores}</Text>}
    </View>
  </View>;
}