refactor: Let parent components provide login button markup

bcgov · Jul 13, 2020 · 4955c74 · 4955c74
1 parent 8259e16
commit 4955c74
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/app/components/LoginButton.tsx b/app/components/LoginButton.tsx
@@ -1,10 +1,8 @@
 import React from 'react';
 import {useRouter} from 'next/router';
-import {Form, Button, ButtonProps} from 'react-bootstrap';
+import {Form} from 'react-bootstrap';
 
-const LoginForm: React.FunctionComponent<
-  React.ComponentPropsWithoutRef<'button'> & ButtonProps
-> = (props) => {
+const LoginForm: React.FunctionComponent = ({children}) => {
   const router = useRouter();
   let loginURI = '/login';
 
@@ -15,7 +13,7 @@ const LoginForm: React.FunctionComponent<
 
   return (
     <Form action={loginURI} method="post">
-      <Button {...props} type="submit" />
+      {children}
     </Form>
   );
 };

diff --git a/app/components/RegistrationLoginButtons.tsx b/app/components/RegistrationLoginButtons.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import {Col, Card} from 'react-bootstrap';
+import {Col, Card, Button} from 'react-bootstrap';
 import LoginButton from './LoginButton';
 import Link from 'next/link';
 
@@ -32,8 +32,10 @@ const RegistrationLoginButtons: React.FunctionComponent<Props> = ({
           </Link>
         </Card.Body>
       </Card>
-      <LoginButton className="login-link" variant="outline-dark">
-        Already have an account? Click here to login.
+      <LoginButton>
+        <Button className="login-link" variant="outline-dark">
+          Already have an account? Click here to login.
+        </Button>
       </LoginButton>
       <style jsx global>{`
         .login-link {