diff --git a/src/components/buttons/Button.tsx b/src/components/buttons/Button.tsx index 70e2c780..1c1a2b61 100644 --- a/src/components/buttons/Button.tsx +++ b/src/components/buttons/Button.tsx @@ -7,7 +7,9 @@ import { Spinner } from "@/components/layout/Spinner"; interface Props { icon?: Icons; - onClick?: () => void; + onClick?: ( + event: React.MouseEvent, + ) => void; children?: ReactNode; theme?: "white" | "purple" | "secondary" | "danger"; padding?: string; @@ -21,11 +23,19 @@ interface Props { export function Button(props: Props) { const navigate = useNavigate(); const { onClick, href, loading } = props; - const cb = useCallback(() => { - if (loading) return; - if (href) navigate(href); - else onClick?.(); - }, [onClick, href, navigate, loading]); + const cb = useCallback( + ( + event: React.MouseEvent< + HTMLAnchorElement | HTMLButtonElement, + MouseEvent + >, + ) => { + if (loading) return; + if (href && !onClick) navigate(href); + else onClick?.(event); + }, + [onClick, href, navigate, loading], + ); let colorClasses = "bg-white hover:bg-gray-200 text-black"; if (props.theme === "purple") @@ -80,6 +90,7 @@ export function Button(props: Props) { target="_blank" rel="noreferrer" download={props.download} + onClick={cb} > {content}