import React, { Component } from 'react'; import { showGigsFromReact, showShare, slideGigsReact } from '../../utils-profile.js'; import ButtonClick from './ButtonClick.js'; import ButtonLink from './ButtonLink.js'; import ButtonModal from './ButtonModal.js'; import { ModalButton } from './Modal.js'; import PropTypes from 'prop-types'; class ProfileHeader extends Component { constructor(props) { super(props); this.state = { factor: 0.07, dim: 1, limitChar: 9, maxChar: 20, msg: '', len: 0, fitClass: '', } } UNSAFE_componentWillReceiveProps(nextProps) { const { user } = nextProps; const { factor, limitChar, maxChar } = this.state; const re0 = /bartholomew/i; const re1 = /-/; if (user.original.name !== undefined && user.original.name.split(' ').length <= 1) { if (user.original.name.length > limitChar && user.original.name.length < maxChar) { if (re1.test(user.original.name)) { //Name has hyphen '-' no resize this.setState({ fitClass: 'fitClass', }) } else if (re0.test(user.original.name)) { //Bartholomew this.setState({ dim: 0.7, msg: 'Es Bartolo!', }) } else { this.setState({ dim: 1 - ((user.original.name.length - limitChar) * factor) }) } } else if (user.original.name.length >= maxChar) { this.setState({ dim: 0.6, fitClass: 'fitClass', }) } } else if (user.original.name !== undefined && user.original.name.split(' ').length > 1) { const longWords = user.original.name.split(' ').filter((key, index) => key.length > limitChar) if (longWords.length > 0) { let prevLen = 0; longWords.map((key, index) => { prevLen < key.length && key.length < maxChar ? re1.test(key) ? //Name has hyphen '-' no resize this.setState({ fitClass: 'fitClass', }) : re0.test(key) ? //Bartholomew this.setState({ dim: 0.7, msg: 'Es Bartolo!', }) : this.setState({ dim: 1 - ((key.length - limitChar) * factor), msg: key, len: key.length, }) : prevLen < key.length && key.length >= maxChar ? this.setState({ dim: 0.6, msg: key, len: key.length, fitClass: 'fitClass', }) : null prevLen = key.length }) } } } render() { const shareProfileUrl = window._CONFIG_.profileUrl; const { user } = this.props; const { factor, dim, msg, len, fitClass } = this.state; const maingenres = user.genres && user.genres.filter(genre => genre.main_genre == true); const othergenres = user.genres && user.genres.filter(genre => genre.main_genre == false); const hasMusic = user.stripeInfo && user.activeUserAlbums && user.activeUserAlbums.length ? true : false; return (