mirror of
https://git.kescher.at/CatCatNya/catstodon.git
synced 2024-11-25 20:11:37 +01:00
Rewrite Permalink
as functional component
This commit is contained in:
parent
545c0041a0
commit
16499bc097
1 changed files with 23 additions and 35 deletions
|
@ -1,50 +1,38 @@
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { PureComponent } from 'react';
|
import { useCallback } from 'react';
|
||||||
|
|
||||||
import { withOptionalRouter, WithOptionalRouterPropTypes } from 'flavours/glitch/utils/react_router';
|
import { useAppHistory } from './router';
|
||||||
|
|
||||||
class Permalink extends PureComponent {
|
const Permalink = ({ className, href, to, children, onInterceptClick, ...props }) => {
|
||||||
|
const history = useAppHistory();
|
||||||
|
|
||||||
static propTypes = {
|
const handleClick = useCallback((e) => {
|
||||||
className: PropTypes.string,
|
|
||||||
href: PropTypes.string.isRequired,
|
|
||||||
to: PropTypes.string.isRequired,
|
|
||||||
children: PropTypes.node,
|
|
||||||
onInterceptClick: PropTypes.func,
|
|
||||||
...WithOptionalRouterPropTypes,
|
|
||||||
};
|
|
||||||
|
|
||||||
handleClick = (e) => {
|
|
||||||
if (e.button === 0 && !(e.ctrlKey || e.metaKey)) {
|
if (e.button === 0 && !(e.ctrlKey || e.metaKey)) {
|
||||||
if (this.props.onInterceptClick && this.props.onInterceptClick()) {
|
if (onInterceptClick && onInterceptClick()) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.props.history) {
|
if (history) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
this.props.history.push(this.props.to);
|
history.push(to);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
}, [onInterceptClick, history, to]);
|
||||||
|
|
||||||
render () {
|
return (
|
||||||
const {
|
<a target='_blank' href={href} onClick={handleClick} className={`permalink${className ? ' ' + className : ''}`} {...props}>
|
||||||
children,
|
{children}
|
||||||
className,
|
</a>
|
||||||
href,
|
);
|
||||||
to,
|
};
|
||||||
onInterceptClick,
|
|
||||||
...other
|
|
||||||
} = this.props;
|
|
||||||
|
|
||||||
return (
|
Permalink.propTypes = {
|
||||||
<a target='_blank' href={href} onClick={this.handleClick} {...other} className={`permalink${className ? ' ' + className : ''}`}>
|
className: PropTypes.string,
|
||||||
{children}
|
href: PropTypes.string.isRequired,
|
||||||
</a>
|
to: PropTypes.string.isRequired,
|
||||||
);
|
children: PropTypes.node,
|
||||||
}
|
onInterceptClick: PropTypes.func,
|
||||||
|
};
|
||||||
|
|
||||||
}
|
export default Permalink;
|
||||||
|
|
||||||
export default withOptionalRouter(Permalink);
|
|
||||||
|
|
Loading…
Reference in a new issue