* Added aria-label for visual readers. * Increased font weight for Models section span to meet contrast ratio visibility requirements.
34 lines
861 B
JavaScript
34 lines
861 B
JavaScript
import React from "react"
|
|
import PropTypes from "prop-types"
|
|
|
|
export default class AuthorizeOperationBtn extends React.Component {
|
|
static propTypes = {
|
|
isAuthorized: PropTypes.bool.isRequired,
|
|
onClick: PropTypes.func
|
|
}
|
|
|
|
onClick =(e) => {
|
|
e.stopPropagation()
|
|
let { onClick } = this.props
|
|
|
|
if(onClick) {
|
|
onClick()
|
|
}
|
|
}
|
|
|
|
render() {
|
|
let { isAuthorized } = this.props
|
|
|
|
return (
|
|
<button className={isAuthorized ? "authorization__btn locked" : "authorization__btn unlocked"}
|
|
aria-label={isAuthorized ? "authorization button locked" : "authorization button unlocked"}
|
|
onClick={this.onClick}>
|
|
<svg width="20" height="20">
|
|
<use href={ isAuthorized ? "#locked" : "#unlocked" } xlinkHref={ isAuthorized ? "#locked" : "#unlocked" } />
|
|
</svg>
|
|
</button>
|
|
|
|
)
|
|
}
|
|
}
|