// Metro module 13923 (f13924).
import { View } from "react-native";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import UserUtils from "../../../utils/UserUtils";
import { Text } from "../../../design/components/Text/native/Text";
const useStyles = createStyles({
  container: {
    justifyContent: "center"
  }
});
export default function FamilyCenterUsernameHeader(props) {
  const user = props.user;
  return <View style={useStyles().container}>
    <Text variant="text-md/semibold" color="mobile-text-heading-primary" lineClamp={1}>
      {UserUtils.useName(user)}
      <Text variant="text-md/medium" color="text-muted" lineClamp={1}>
        {` (@${UserUtils.getUserTag(user, {
          decoration: "never"
        })})`}
      </Text>
    </Text>
  </View>;
};