<commit_before>// @flow
import * as React from 'react'
import * as Kb from '../../../../../../common-adapters/index'
import * as Styles from '../../../../../../styles'
import {formatTimeForMessages} from '../../../../../../util/timestamp'
import UnfurlImage from '../image'

export type Props = {
  title: string,
  url: string,
  siteName: string,
  description?: string,
  publishTime?: number,
  imageURL?: string,
  imageHeight?: number,
  imageWidth?: number,
  faviconURL?: string,
  onClose?: () => void,
  showImageOnSide: boolean,
}

class UnfurlGeneric extends React.Component<Props> {
  render() {
    return (
      <Kb.Box2 style={styles.container} gap="tiny" direction="horizontal">
        {!Styles.isMobile && <Kb.Box2 direction="horizontal" style={styles.quoteContainer} />}
        <Kb.Box2 style={styles.innerContainer} gap="xxtiny" direction="vertical">
          <Kb.Box2 style={styles.siteNameContainer} gap="tiny" fullWidth={true} direction="horizontal">
            {!!this.props.faviconURL && <Kb.Image src={this.props.faviconURL} style={styles.favicon} />}
            <Kb.BoxGrow>
              <Kb.Text type="BodySmall" lineClamp={1}>
                {this.props.siteName}
                {!!this.props.publishTime && (
                  <Kb.Text type="BodySmall">
                    {' '}
                    • Published {formatTimeForMessages(this.props.publishTime)}
                  </Kb.Text>
                )}
              </Kb.Text>
            </Kb.BoxGrow>
            {!!this.props.onClose && (
              <Kb.Icon
                type="iconfont-close"
                onClick={this.props.onClose}
                style={styles.closeBox}
                className="unfurl-closebox"
                fontSize={12}
              />
            )}
          </Kb.Box2>
          <Kb.Text type="BodyPrimaryLink" style={styles.url} onClickURL={this.props.url}>
            {this.props.title}
          </Kb.Text>
          {!!this.props.description && (
            <Kb.Text type="Body" lineClamp={5}>
              {this.props.description}
            </Kb.Text>
          )}
          {!!this.props.imageURL &&
            !!this.props.imageHeight &&
            !!this.props.imageWidth &&
            !Styles.isMobile &&
            !this.props.showImageOnSide && (
              <UnfurlImage
                url={this.props.imageURL}
                height={this.props.imageHeight}
                width={this.props.imageWidth}
                style={styles.bottomImage}
                isVideo={false}
              />
            )}
        </Kb.Box2>
        {!!this.props.imageURL && !Styles.isMobile && this.props.showImageOnSide && (
          <Kb.Image src={this.props.imageURL} style={styles.sideImage} />
        )}
      </Kb.Box2>
    )
  }
}

const styles = Styles.styleSheetCreate({
  bottomImage: {
    marginTop: Styles.globalMargins.xtiny,
  },
  closeBox: Styles.platformStyles({
    isElectron: {
      alignSelf: 'flex-start',
      marginLeft: 'auto',
    },
  }),
  container: Styles.platformStyles({
    common: {
      alignSelf: 'flex-start',
    },
    isElectron: {
      maxWidth: 500,
    },
  }),
  favicon: Styles.platformStyles({
    common: {
      borderRadius: Styles.borderRadius,
      height: 16,
      width: 16,
    },
  }),
  innerContainer: Styles.platformStyles({
    common: {
      alignSelf: 'flex-start',
      minWidth: 150,
    },
    isMobile: {
      borderColor: Styles.globalColors.lightGrey,
      borderRadius: Styles.borderRadius,
      borderWidth: 1,
      padding: Styles.globalMargins.tiny,
    },
  }),
  quoteContainer: Styles.platformStyles({
    common: {
      alignSelf: 'stretch',
      backgroundColor: Styles.globalColors.lightGrey,
      paddingLeft: Styles.globalMargins.xtiny,
    },
  }),
  sideImage: Styles.platformStyles({
    isElectron: {
      maxHeight: 80,
      maxWidth: 80,
    },
  }),
  siteNameContainer: Styles.platformStyles({
    common: {
      alignSelf: 'flex-start',
      minHeight: 16,
    },
  }),
  url: {
    ...Styles.globalStyles.fontSemibold,
  },
})

export default UnfurlGeneric<commit_msg>fix sitename height (#15004)<commit_after>// @flow
import * as React from 'react'
import * as Kb from '../../../../../../common-adapters/index'
import * as Styles from '../../../../../../styles'
import {formatTimeForMessages} from '../../../../../../util/timestamp'
import UnfurlImage from '../image'

export type Props = {
  title: string,
  url: string,
  siteName: string,
  description?: string,
  publishTime?: number,
  imageURL?: string,
  imageHeight?: number,
  imageWidth?: number,
  faviconURL?: string,
  onClose?: () => void,
  showImageOnSide: boolean,
}

class UnfurlGeneric extends React.Component<Props> {
  render() {
    return (
      <Kb.Box2 style={styles.container} gap="tiny" direction="horizontal">
        {!Styles.isMobile && <Kb.Box2 direction="horizontal" style={styles.quoteContainer} />}
        <Kb.Box2 style={styles.innerContainer} gap="xxtiny" direction="vertical">
          <Kb.Box2 style={styles.siteNameContainer} gap="tiny" fullWidth={true} direction="horizontal">
            {!!this.props.faviconURL && <Kb.Image src={this.props.faviconURL} style={styles.favicon} />}
            <Kb.BoxGrow>
              <Kb.Text type="BodySmall" lineClamp={1}>
                {this.props.siteName}
                {!!this.props.publishTime && (
                  <Kb.Text type="BodySmall">
                    {' '}
                    • Published {formatTimeForMessages(this.props.publishTime)}
                  </Kb.Text>
                )}
              </Kb.Text>
            </Kb.BoxGrow>
            {!!this.props.onClose && (
              <Kb.Icon
                type="iconfont-close"
                onClick={this.props.onClose}
                style={styles.closeBox}
                className="unfurl-closebox"
                fontSize={12}
              />
            )}
          </Kb.Box2>
          <Kb.Text type="BodyPrimaryLink" style={styles.url} onClickURL={this.props.url}>
            {this.props.title}
          </Kb.Text>
          {!!this.props.description && (
            <Kb.Text type="Body" lineClamp={5}>
              {this.props.description}
            </Kb.Text>
          )}
          {!!this.props.imageURL &&
            !!this.props.imageHeight &&
            !!this.props.imageWidth &&
            !Styles.isMobile &&
            !this.props.showImageOnSide && (
              <UnfurlImage
                url={this.props.imageURL}
                height={this.props.imageHeight}
                width={this.props.imageWidth}
                style={styles.bottomImage}
                isVideo={false}
              />
            )}
        </Kb.Box2>
        {!!this.props.imageURL && !Styles.isMobile && this.props.showImageOnSide && (
          <Kb.Image src={this.props.imageURL} style={styles.sideImage} />
        )}
      </Kb.Box2>
    )
  }
}

const styles = Styles.styleSheetCreate({
  bottomImage: {
    marginTop: Styles.globalMargins.xtiny,
  },
  closeBox: Styles.platformStyles({
    isElectron: {
      alignSelf: 'flex-start',
      marginLeft: 'auto',
    },
  }),
  container: Styles.platformStyles({
    common: {
      alignSelf: 'flex-start',
    },
    isElectron: {
      maxWidth: 500,
    },
  }),
  favicon: Styles.platformStyles({
    common: {
      borderRadius: Styles.borderRadius,
      height: 16,
      width: 16,
    },
  }),
  innerContainer: Styles.platformStyles({
    common: {
      alignSelf: 'flex-start',
      minWidth: 150,
    },
    isMobile: {
      borderColor: Styles.globalColors.lightGrey,
      borderRadius: Styles.borderRadius,
      borderWidth: 1,
      padding: Styles.globalMargins.tiny,
    },
  }),
  quoteContainer: Styles.platformStyles({
    common: {
      alignSelf: 'stretch',
      backgroundColor: Styles.globalColors.lightGrey,
      paddingLeft: Styles.globalMargins.xtiny,
    },
  }),
  sideImage: Styles.platformStyles({
    isElectron: {
      maxHeight: 80,
      maxWidth: 80,
    },
  }),
  siteNameContainer: Styles.platformStyles({
    common: {
      alignSelf: 'flex-start',
    },
    isElectron: {
      minHeight: 16,
    },
    isMobile: {
      minHeight: 21,
    },
  }),
  url: {
    ...Styles.globalStyles.fontSemibold,
  },
})

export default UnfurlGeneric
{'fraction_non_alphanumeric': 0.15019147917663955, 'fraction_numerical': 0.007539492580181905, 'mean_word_length': 1.9426056338028168, 'pattern_counts': {'":': 0, '<': 47, '<?xml version=': 0, '>': 49, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '15738', 'n_tokens_mistral': 2629, 'n_tokens_neox': 2556, 'n_words': 414}