Mirrors/movie-web
2
0
Fork 0
mirror of https://github.com/movie-web/movie-web.git synced 2024-12-27 12:21:49 +01:00
Code Issues Packages Projects Releases Wiki Activity

Proper onClick types and give <a> the callback

Browse Source
This commit is contained in:
Astrid 2024-01-31 22:22:07 +01:00
parent 884a429a7c
commit a562cbeb25
1 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/buttons/Button.tsx
View File

@ -7,7 +7,9 @@ import { Spinner } from "@/components/layout/Spinner";
interface Props {
icon?: Icons;
onClick?: () => void;
onClick?: (
event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement, 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}
</a>