diff options
Diffstat (limited to 'src/components/Button.tsx')
-rw-r--r-- | src/components/Button.tsx | 11 |
1 files changed, 9 insertions, 2 deletions
diff --git a/src/components/Button.tsx b/src/components/Button.tsx index 8f2398b..5724b40 100644 --- a/src/components/Button.tsx +++ b/src/components/Button.tsx @@ -1,6 +1,9 @@ -import React from 'react'; +import React, { useCallback } from 'react'; +import { useHistory } from 'react-router-dom'; interface Props { + onClick?: () => void; + route?: string; variant?: 'contained' | 'outlined'; size?: 'sm' | 'md' | 'lg'; children: string; @@ -18,10 +21,14 @@ const sizes = { sm: 'p-3', }; -const Button: React.FC<Props> = ({ variant = 'contained', size = 'md', children }) => { +const Button: React.FC<Props> = ({ onClick, route, variant = 'contained', size = 'md', children }) => { + const history = useHistory(); + const navigateRoute = useCallback(() => history.push(route || '/'), [route, history]); + return ( <button type="button" + onClick={route ? navigateRoute : onClick} className={`m-3 font-bold tracking-wide hover:underline focus:outline-none ${variants[variant]} ${sizes[size]}`} > {children} |