// Metro module 9030 (f9031).
import { View } from "react-native";
import { UserFlags } from "../../../Constants";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import AvatarUtils from "../../../utils/AvatarUtils";
import { Avatar, AvatarSizes } from "../../../design/void/native";
import { Text } from "../../../design/components/Text/native/Text";
import BotTag from "../../applications/native/BotTag";
import { hasFlag } from "../../../_bundle/Module1384";
import { intl, t } from "../../../intl/index.native";
const useStyles = createStyles({
  header: {
    paddingBottom: 16,
    marginHorizontal: 16,
    borderTopLeftRadius: Module712.radii.sm,
    borderTopRightRadius: Module712.radii.sm,
    flexDirection: "column",
    justifyContent: "center",
    alignItems: "center"
  },
  applicationNameWrapper: {
    flexDirection: "row"
  },
  headerIcons: {
    alignItems: "center",
    flexDirection: "row",
    justifyContent: "space-between",
    marginBottom: 24
  },
  ellipseGroup: {
    flexDirection: "row",
    justifyContent: "space-between",
    marginHorizontal: 24
  },
  ellipse: {
    width: 4,
    height: 4,
    marginHorizontal: 2,
    backgroundColor: Module712.colors.MOBILE_TEXT_HEADING_PRIMARY,
    opacity: 0.1,
    borderRadius: 2
  },
  botTag: {
    marginTop: 4,
    marginLeft: 8
  }
});
export default function Header(props) {
  const { user, application, accountScopes, bot } = props;
  const styles = useStyles();
  return <View style={styles.header}>
    <View style={styles.headerIcons}>
      <Avatar source={AvatarUtils.getApplicationIconSource({
        id: application.id,
        icon: application.icon
      })} size={AvatarSizes.XLARGE} />
      <View style={styles.ellipseGroup}>
        <View style={styles.ellipse} />
        <View style={styles.ellipse} />
        <View style={styles.ellipse} />
      </View>
      <Avatar source={user != null ? AvatarUtils.getUserAvatarSource(user) : void 0} size={AvatarSizes.XLARGE} />
    </View>
    <View style={styles.applicationNameWrapper}>
      <Text variant="text-lg/bold" color="mobile-text-heading-primary">{application.name}</Text>
      {bot != null ? <BotTag style={styles.botTag} verified={bot.public_flags != null && hasFlag(bot.public_flags, UserFlags.VERIFIED_BOT)} /> : null}
    </View>
    <Text variant="heading-md/normal" color="text-default">
      {accountScopes.length > 0 ? intl.string(t.jFbDnJ) : intl.string(t["X+Fdpo"])}
    </Text>
  </View>;
};