63 lines
1.6 KiB
TypeScript
63 lines
1.6 KiB
TypeScript
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
|
|
import { Button, Panel } from '@freecodecamp/react-bootstrap';
|
|
import React, { Component } from 'react';
|
|
import { TFunction, withTranslation } from 'react-i18next';
|
|
import { connect } from 'react-redux';
|
|
|
|
import { deleteUserToken } from '../../redux';
|
|
import { ButtonSpacer, FullWidthRow, Spacer } from '../helpers';
|
|
|
|
import './user-token.css';
|
|
|
|
type UserTokenProps = {
|
|
deleteUserToken: () => void;
|
|
t: TFunction;
|
|
};
|
|
|
|
const mapDispatchToProps = {
|
|
deleteUserToken
|
|
};
|
|
|
|
class UserToken extends Component<UserTokenProps> {
|
|
static displayName: string;
|
|
|
|
deleteToken = () => {
|
|
this.props.deleteUserToken();
|
|
};
|
|
|
|
render() {
|
|
const { t } = this.props;
|
|
|
|
return (
|
|
<div className='user-token text-center'>
|
|
<FullWidthRow>
|
|
<Panel className='user-panel'>
|
|
<Panel.Heading>{t('user-token.title')}</Panel.Heading>
|
|
<Spacer />
|
|
<p>{t('user-token.delete-p1')}</p>
|
|
<FullWidthRow>
|
|
<ButtonSpacer />
|
|
<Button
|
|
block={true}
|
|
bsSize='lg'
|
|
bsStyle='danger'
|
|
className='btn-info'
|
|
data-cy='delete-user-token'
|
|
onClick={this.deleteToken}
|
|
type='button'
|
|
>
|
|
{t('user-token.delete')}
|
|
</Button>
|
|
<Spacer />
|
|
</FullWidthRow>
|
|
</Panel>
|
|
</FullWidthRow>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
UserToken.displayName = 'UserToken';
|
|
|
|
export default connect(null, mapDispatchToProps)(withTranslation()(UserToken));
|