All files / client/components/ExternalShare ShareBoxContent.tsx

0% Statements 0/17
0% Branches 0/12
0% Functions 0/5
0% Lines 0/17

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 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80                                                                                                                                                               
import React from 'react'
import { withTranslation, WithTranslation } from 'react-i18next'
import { Button, InputGroup, InputGroupAddon, Input, Alert } from 'reactstrap'
import Icon from 'components/Common/Icon'
import Crowi from 'client/util/Crowi'
import { Share } from 'client/types/crowi'
 
interface Props extends WithTranslation {
  handleOpen?: () => void
  handleCreate?: () => void
  isCreated?: boolean
  isChanging?: boolean
  share: Share | null
  creationError?: boolean
  crowi: Crowi
}
 
class ShareBoxContent extends React.Component<Props> {
  static defaultProps = { isCreated: false }
 
  inputRef?: HTMLInputElement
 
  constructor(props: Props) {
    super(props)
 
    this.selectAction = this.selectAction.bind(this)
    this.createRef = this.createRef.bind(this)
    this.copyAction = this.copyAction.bind(this)
  }
 
  selectAction() {
    if (this.inputRef) {
      this.inputRef.select()
    }
  }
 
  createRef(node: HTMLInputElement) {
    this.inputRef = node
  }
 
  copyAction() {
    if (this.inputRef) {
      this.inputRef.select()
      document.execCommand('copy')
    }
  }
 
  render() {
    const { t, crowi, share, isCreated, isChanging, handleOpen, handleCreate, creationError } = this.props
    if (isCreated && share) {
      const shareId = share.uuid
      const url = `${crowi.location.origin}/_share/${shareId}`
      return (
        <div className="share-box-content">
          <InputGroup>
            <Input className="copy-link" defaultValue={url} readOnly onClick={this.selectAction} innerRef={this.createRef} />
            <InputGroupAddon addonType="append">
              <Button onClick={this.copyAction}>Copy</Button>
            </InputGroupAddon>
          </InputGroup>
          <Button className="d-block ml-auto" onClick={handleOpen}>
            {t('share.link_settings')}
          </Button>
        </div>
      )
    }
    return (
      <div className="share-box-content">
        {creationError && <Alert color="danger">{t('share.error.can_not_create')}</Alert>}
        <p>{t('share.no_link_has_been_created_yet')}</p>
        <Button className="d-block ml-auto" color="primary" onClick={handleCreate} disabled={isChanging}>
          <Icon name={isChanging ? 'loading' : 'link'} spin={isChanging} /> {t('share.create_link')}
        </Button>
      </div>
    )
  }
}
 
export default withTranslation()(ShareBoxContent)