# All files / src/Thumbnail ThumbnailPreview.tsx

100% Statements 17/17
93.75% Branches 15/16
100% Functions 4/4
100% Lines 14/14

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    277x
    7x

    65x
    65x

    65x
    61x
    57x
    57x

    4x

    65x
    63x
    11x
    2x

    65x

     import React from 'react'
    import { StyledImageThumbnailPreview } from './Thumbnail.styles'
    import { FilePreviewProps } from './Thumbnail.types'

    export function ThumbnailPreview({ file }: FilePreviewProps) {
      const [fileUrl, setFileUrl] = React.useState('')

      React.useEffect(() => {
        if (!file) {
          setFileUrl('')
          return
        }

        setFileUrl((URL.createObjectURL?.(file) ?? '').toString())
      }, [file])

      React.useEffect(() => {
        return () => {
          if (fileUrl) {
            URL.revokeObjectURL?.(fileUrl)
          }
        }
      }, [fileUrl])

      return fileUrl ? <StyledImageThumbnailPreview $bgImage={fileUrl} /> : null
    }