make download button use real link, and improve PC download text

Co-authored-by: Jip Frijlink <JipFr@users.noreply.github.com>
This commit is contained in:
mrjvs 2023-10-22 20:17:28 +02:00
parent ade84013d1
commit ca2bab30a4

View File

@ -1,13 +1,27 @@
import { useMemo } from "react";
import { Icon, Icons } from "@/components/Icon"; import { Icon, Icons } from "@/components/Icon";
import { OverlayPage } from "@/components/overlays/OverlayPage"; import { OverlayPage } from "@/components/overlays/OverlayPage";
import { Menu } from "@/components/player/internals/ContextMenu"; import { Menu } from "@/components/player/internals/ContextMenu";
import { useOverlayRouter } from "@/hooks/useOverlayRouter"; import { useOverlayRouter } from "@/hooks/useOverlayRouter";
import { usePlayerStore } from "@/stores/player/store"; import { usePlayerStore } from "@/stores/player/store";
function useDownloadLink() {
const source = usePlayerStore((s) => s.source);
const currentQuality = usePlayerStore((s) => s.currentQuality);
const url = useMemo(() => {
if (source?.type === "file" && currentQuality)
return source.qualities[currentQuality]?.url ?? null;
return null;
}, [source, currentQuality]);
return url;
}
export function DownloadView({ id }: { id: string }) { export function DownloadView({ id }: { id: string }) {
const router = useOverlayRouter(id); const router = useOverlayRouter(id);
const source = usePlayerStore((s) => s.source); const downloadUrl = useDownloadLink();
if (source?.type === "hls") return null;
if (!downloadUrl) return null;
return ( return (
<> <>
@ -36,7 +50,7 @@ export function DownloadView({ id }: { id: string }) {
</Menu.Paragraph> </Menu.Paragraph>
<a <a
href="https://pastebin.com/x9URMct0" href={downloadUrl}
rel="noreferrer" rel="noreferrer"
target="_blank" target="_blank"
download download
@ -95,15 +109,8 @@ function PCExplanationView({ id }: { id: string }) {
</Menu.BackLink> </Menu.BackLink>
<Menu.Section> <Menu.Section>
<Menu.Paragraph> <Menu.Paragraph>
On PC, click the{" "} On PC, right click the video and select{" "}
<Menu.Highlight> <Menu.Highlight>Save video as</Menu.Highlight>
three dots
<Icon
className="inline-block text-xl -mb-1"
icon={Icons.MORE_VERTICAL}
/>
</Menu.Highlight>{" "}
and click <Menu.Highlight>download</Menu.Highlight>.
</Menu.Paragraph> </Menu.Paragraph>
</Menu.Section> </Menu.Section>
</> </>