<commit_before>import PropTypes from 'prop-types'
import React from 'react'
import {download} from 'tocco-util'

import Link from '../../Link'

const DocumentCompactFormatter = ({value}) => (
  <>
    <Link
      alt={value.alt || value.fileName}
      download={value.fileName}
      icon="external-link"
      look="raised"
      target="_blank"
      href={value.binaryLink}
      onClick={e => {
        e.stopPropagation()
      }}
    />
    <Link
      alt={value.alt || value.fileName}
      download={value.fileName}
      icon="arrow-to-bottom"
      look="raised"
      href={download.getDownloadUrl(value.binaryLink)}
      onClick={e => {
        e.stopPropagation()
      }}
    />
  </>
)

DocumentCompactFormatter.propTypes = {
  value: PropTypes.shape({
    alt: PropTypes.string,
    binaryLink: PropTypes.string.isRequired,
    fileName: PropTypes.string.isRequired
  }).isRequired
}

export default DocumentCompactFormatter
<commit_msg>feat(tocco-ui): add preview popover to DocumentCompactFormatter<commit_after>import PropTypes from 'prop-types'
import React from 'react'
import {download} from 'tocco-util'
import styled from 'styled-components'

import Link from '../../Link'
import Popover from '../../Popover'

const StyledPreviewImage = styled.img`
  width: 200px;
`

const DocumentCompactFormatter = ({value}) => <>
    <Popover content={<StyledPreviewImage alt={value.fileName} src={value.thumbnailLink}/>}>
      <Link
        alt={value.alt || value.fileName}
        download={value.fileName}
        icon="external-link"
        look="raised"
        target="_blank"
        href={value.binaryLink}
        onClick={e => {
          e.stopPropagation()
        }}
      />
    </Popover>
    <Link
      alt={value.alt || value.fileName}
      download={value.fileName}
      icon="arrow-to-bottom"
      look="raised"
      href={download.getDownloadUrl(value.binaryLink)}
      onClick={e => {
        e.stopPropagation()
      }}
    />
  </>

DocumentCompactFormatter.propTypes = {
  value: PropTypes.shape({
    alt: PropTypes.string,
    binaryLink: PropTypes.string.isRequired,
    thumbnailLink: PropTypes.string.isRequired,
    fileName: PropTypes.string.isRequired
  }).isRequired
}

export default DocumentCompactFormatter

{'fraction_non_alphanumeric': 0.13586237318041464, 'fraction_numerical': 0.0013233348037053375, 'mean_word_length': 2.951219512195122, 'pattern_counts': {'":': 0, '<': 14, '<?xml version=': 0, '>': 20, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 10, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1092246', 'n_tokens_mistral': 672, 'n_tokens_neox': 690, 'n_words': 127}