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)
|