Migrating registration link to functional component
This commit is contained in:
parent
108ecf59f7
commit
a550988f35
1 changed files with 56 additions and 63 deletions
|
@ -1,6 +1,6 @@
|
|||
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
import React from 'react'
|
||||
import React, {useEffect, useState} from 'react'
|
||||
import {injectIntl, IntlShape} from 'react-intl'
|
||||
|
||||
import {IWorkspace} from '../blocks/workspace'
|
||||
|
@ -17,81 +17,74 @@ type Props = {
|
|||
intl: IntlShape
|
||||
}
|
||||
|
||||
type State = {
|
||||
workspace?: IWorkspace
|
||||
wasCopied: boolean
|
||||
}
|
||||
const RegistrationLink = React.memo((props: Props) => {
|
||||
const {intl, onClose} = props
|
||||
|
||||
class RegistrationLink extends React.PureComponent<Props, State> {
|
||||
state: State = {wasCopied: false}
|
||||
const [wasCopied, setWasCopied] = useState(false)
|
||||
const [workspace, setWorkspace] = useState<IWorkspace>()
|
||||
|
||||
componentDidMount() {
|
||||
this.loadData()
|
||||
const loadData = async () => {
|
||||
const updatedWorkspace = await client.getWorkspace()
|
||||
setWorkspace(updatedWorkspace)
|
||||
setWasCopied(false)
|
||||
}
|
||||
|
||||
private async loadData() {
|
||||
const workspace = await client.getWorkspace()
|
||||
this.setState({workspace, wasCopied: false})
|
||||
}
|
||||
useEffect(() => {
|
||||
loadData()
|
||||
}, [])
|
||||
|
||||
render(): JSX.Element {
|
||||
const {intl} = this.props
|
||||
const {workspace} = this.state
|
||||
|
||||
const registrationUrl = window.location.origin + '/register?t=' + workspace?.signupToken
|
||||
|
||||
return (
|
||||
<Modal
|
||||
position='bottom-right'
|
||||
onClose={this.props.onClose}
|
||||
>
|
||||
<div className='RegistrationLink'>
|
||||
{workspace && <>
|
||||
<div className='row'>
|
||||
{intl.formatMessage({id: 'RegistrationLink.description', defaultMessage: 'Share this link for others to create accounts:'})}
|
||||
</div>
|
||||
<div className='row'>
|
||||
<a
|
||||
className='shareUrl'
|
||||
href={registrationUrl}
|
||||
target='_blank'
|
||||
rel='noreferrer'
|
||||
>
|
||||
{registrationUrl}
|
||||
</a>
|
||||
<Button
|
||||
filled={true}
|
||||
onClick={() => {
|
||||
Utils.copyTextToClipboard(registrationUrl)
|
||||
this.setState({wasCopied: true})
|
||||
}}
|
||||
>
|
||||
{this.state.wasCopied ? intl.formatMessage({id: 'RegistrationLink.copiedLink', defaultMessage: 'Copied!'}) : intl.formatMessage({id: 'RegistrationLink.copyLink', defaultMessage: 'Copy link'})}
|
||||
</Button>
|
||||
</div>
|
||||
<div className='row'>
|
||||
<Button onClick={this.onRegenerateToken}>
|
||||
{intl.formatMessage({id: 'RegistrationLink.regenerateToken', defaultMessage: 'Regenerate token'})}
|
||||
</Button>
|
||||
</div>
|
||||
</>}
|
||||
</div>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
|
||||
private onRegenerateToken = async () => {
|
||||
const {intl} = this.props
|
||||
const regenerateToken = async () => {
|
||||
// eslint-disable-next-line no-alert
|
||||
const accept = window.confirm(intl.formatMessage({id: 'RegistrationLink.confirmRegenerateToken', defaultMessage: 'This will invalidate previously shared links. Continue?'}))
|
||||
if (accept) {
|
||||
await client.regenerateWorkspaceSignupToken()
|
||||
await this.loadData()
|
||||
await loadData()
|
||||
|
||||
const description = intl.formatMessage({id: 'RegistrationLink.tokenRegenerated', defaultMessage: 'Registration link regenerated'})
|
||||
sendFlashMessage({content: description, severity: 'low'})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const registrationUrl = window.location.origin + '/register?t=' + workspace?.signupToken
|
||||
|
||||
return (
|
||||
<Modal
|
||||
position='bottom-right'
|
||||
onClose={onClose}
|
||||
>
|
||||
<div className='RegistrationLink'>
|
||||
{workspace && <>
|
||||
<div className='row'>
|
||||
{intl.formatMessage({id: 'RegistrationLink.description', defaultMessage: 'Share this link for others to create accounts:'})}
|
||||
</div>
|
||||
<div className='row'>
|
||||
<a
|
||||
className='shareUrl'
|
||||
href={registrationUrl}
|
||||
target='_blank'
|
||||
rel='noreferrer'
|
||||
>
|
||||
{registrationUrl}
|
||||
</a>
|
||||
<Button
|
||||
filled={true}
|
||||
onClick={() => {
|
||||
Utils.copyTextToClipboard(registrationUrl)
|
||||
setWasCopied(true)
|
||||
}}
|
||||
>
|
||||
{wasCopied ? intl.formatMessage({id: 'RegistrationLink.copiedLink', defaultMessage: 'Copied!'}) : intl.formatMessage({id: 'RegistrationLink.copyLink', defaultMessage: 'Copy link'})}
|
||||
</Button>
|
||||
</div>
|
||||
<div className='row'>
|
||||
<Button onClick={regenerateToken}>
|
||||
{intl.formatMessage({id: 'RegistrationLink.regenerateToken', defaultMessage: 'Regenerate token'})}
|
||||
</Button>
|
||||
</div>
|
||||
</>}
|
||||
</div>
|
||||
</Modal>
|
||||
)
|
||||
})
|
||||
|
||||
export default injectIntl(RegistrationLink)
|
||||
|
|
Loading…
Reference in a new issue