pdfer/components/Preview.tsx

import React from 'react'

export default (props) => {
  if (props.pdfIsLoading) {
    return <div>Lade&hellip;</div>
  }

  const errorStyles = {
    padding: '6px 12px',
    color: 'white',
    backgroundColor: '#d81e1e',
    borderRadius: '3px',
  }

  if (props.pdfError) {
    return (
      <div style={errorStyles}>
        <span role="img" aria-label="Crying Man">
          😢
        </span>{' '}
        {props.pdfError}
      </div>
    )
  }

  if (!props.pdfUrl) {
    return <div>Knopf drücken dann gibts hier was zu sehen!</div>
  }

  const styles = {
    width: '700px',
    height: '1050px',
  }

  return <embed src={props.pdfUrl} style={styles} type="application/pdf" />
}