Browse Source

Merge pull request #975 from qtchaos/fix/button-navigate

When navigating to own pages, use `useNavigate()`
pull/967/head
William Oldham 1 year ago committed by GitHub
parent
commit
27aff99969
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
  1. 10
      src/components/buttons/Button.tsx

10
src/components/buttons/Button.tsx

@ -1,5 +1,6 @@ @@ -1,5 +1,6 @@
import classNames from "classnames";
import { ReactNode, useCallback } from "react";
import { useNavigate } from "react-router-dom";
import { Icon, Icons } from "@/components/Icon";
import { Spinner } from "@/components/layout/Spinner";
@ -20,6 +21,7 @@ interface Props { @@ -20,6 +21,7 @@ interface Props {
}
export function Button(props: Props) {
const navigate = useNavigate();
const { onClick, href, loading } = props;
const cb = useCallback(
(
@ -31,10 +33,14 @@ export function Button(props: Props) { @@ -31,10 +33,14 @@ export function Button(props: Props) {
if (loading) return;
if (href && !onClick) {
event.preventDefault();
window.open(href, "_blank", "noreferrer");
if (!href.includes("http")) {
navigate(href);
} else {
window.open(href, "_blank", "noreferrer");
}
} else onClick?.(event);
},
[onClick, href, loading],
[loading, href, onClick, navigate],
);
let colorClasses = "bg-white hover:bg-gray-200 text-black";

Loading…
Cancel
Save