Refactor LinkButton into class component

because setting defaultProps on function components is deprecated

js/components/LinkButton.js

@@ -2,13 +2,37 @@ import {Button} from 'reactstrap';
 import {useRouter} from 'next/router';
 import React from 'react';
 
+class LinkButtonComponent extends React.Component {
+    constructor(props) {
+        super(props);
+        this.defaultProps = {
+            outline: true,
+            color: 'secondary'
+        };
+    }
+
+    handleClick(e) {
+        e.preventDefault();
+        this.props.router.push(this.props.href);
+    }
+
+    render() {
+        return (
+            <Button outline={this.props.outline} color={this.props.color} onClick={e => this.handleClick(e)}>
+                {this.props.children}
+            </Button>
+        );
+    }
+}
+
+LinkButtonComponent.defaultProps = {
+    outline: true,
+    color: 'secondary'
+};
+
+// export default withRouter(LinkButton);
+
 export function LinkButton(props) {
     const router = useRouter();
-
+    return (<LinkButtonComponent {...props} router={router} />);
-    const handleClick = e => {
-        e.preventDefault();
-        router.push(props.href);
-    };
-
-    return (<Button outline='true' onClick={handleClick}>{props.children}</Button>);
 }