Fix DMCA Footer link

This commit is contained in:
William Oldham 2023-12-09 14:24:46 +00:00
parent 1b1770ace8
commit 9fb12e7e34
3 changed files with 32 additions and 17 deletions

View file

@ -27,6 +27,7 @@
"node-forge": "^1.3.1",
"ofetch": "^1.0.0",
"react": "^17.0.2",
"type-fest": "^4.3.3",
"react-dom": "^17.0.2",
"react-ga4": "^2.0.0",
"react-google-recaptcha-v3": "^1.10.1",
@ -103,7 +104,6 @@
"tailwind-scrollbar": "^2.0.1",
"tailwindcss": "^3.2.4",
"tailwindcss-themer": "^3.1.0",
"type-fest": "^4.3.3",
"typescript": "^4.6.4",
"vite": "^4.4.12",
"vite-plugin-checker": "^0.5.6",

View file

@ -110,6 +110,9 @@ dependencies:
subsrt-ts:
specifier: ^2.1.1
version: 2.1.1
type-fest:
specifier: ^4.3.3
version: 4.3.3
zustand:
specifier: ^4.3.9
version: 4.4.1(@types/react@17.0.65)(immer@10.0.2)(react@17.0.2)
@ -238,9 +241,6 @@ devDependencies:
tailwindcss-themer:
specifier: ^3.1.0
version: 3.1.0(tailwindcss@3.3.3)
type-fest:
specifier: ^4.3.3
version: 4.3.3
typescript:
specifier: ^4.6.4
version: 4.9.5
@ -6056,7 +6056,7 @@ packages:
/type-fest@4.3.3:
resolution: {integrity: sha512-bxhiFii6BBv6UiSDq7uKTMyADT9unXEl3ydGefndVLxFeB44LRbT4K7OJGDYSyDrKnklCC1Pre68qT2wbUl2Aw==}
engines: {node: '>=16'}
dev: true
dev: false
/typed-array-buffer@1.0.0:
resolution: {integrity: sha512-Y8KTSIglk9OZEr8zywiIHG/kmQ7KWyjseXs1CbSo8vC42w7hg2HgYTxSWwP0+is7bWDc1H+Fo026CpHFwm8tkw==}

View file

@ -1,5 +1,7 @@
import { useCallback } from "react";
import { useTranslation } from "react-i18next";
import { useHistory } from "react-router-dom";
import { RequireExactlyOne } from "type-fest";
import { Icon, Icons } from "@/components/Icon";
import { BrandPill } from "@/components/layout/BrandPill";
@ -7,19 +9,33 @@ import { WideContainer } from "@/components/layout/WideContainer";
import { shouldHaveDmcaPage } from "@/pages/Dmca";
import { conf } from "@/setup/config";
function FooterLink(props: {
href?: string;
onClick?: () => void;
children: React.ReactNode;
icon: Icons;
}) {
// to and href are mutually exclusive
type FooterLinkProps = RequireExactlyOne<
{
children: React.ReactNode;
icon: Icons;
to: string;
href: string;
},
"to" | "href"
>;
function FooterLink(props: FooterLinkProps) {
const history = useHistory();
const navigateTo = useCallback(() => {
if (!props.to) return;
history.push(props.to);
}, [history, props.to]);
return (
<a
href={props.href ?? "#"}
target="_blank"
className="tabbable rounded py-2 px-3 inline-flex items-center space-x-3 transition-colors duration-200 hover:text-type-emphasis"
href={props.href}
target={props.href ? "_blank" : undefined}
rel="noreferrer"
onClick={props.onClick}
className="tabbable rounded py-2 px-3 inline-flex cursor-pointer items-center space-x-3 transition-colors duration-200 hover:text-type-emphasis"
onClick={props.to ? navigateTo : undefined}
>
<Icon icon={props.icon} className="text-2xl" />
<span className="font-medium">{props.children}</span>
@ -29,12 +45,11 @@ function FooterLink(props: {
function Dmca() {
const { t } = useTranslation();
const history = useHistory();
if (!shouldHaveDmcaPage()) return null;
return (
<FooterLink icon={Icons.DRAGON} onClick={() => history.push("/dmca")}>
<FooterLink to="/dmca" icon={Icons.DRAGON}>
{t("footer.links.dmca")}
</FooterLink>
);