|
|
@ -2,6 +2,7 @@
|
|
|
|
|
|
|
|
|
|
|
|
import { useQuery } from "@tanstack/react-query";
|
|
|
|
import { useQuery } from "@tanstack/react-query";
|
|
|
|
import { useSearchParams } from "next/navigation";
|
|
|
|
import { useSearchParams } from "next/navigation";
|
|
|
|
|
|
|
|
import { useMemo } from "react";
|
|
|
|
|
|
|
|
|
|
|
|
import { useClient } from "@/hooks/useClient";
|
|
|
|
import { useClient } from "@/hooks/useClient";
|
|
|
|
|
|
|
|
|
|
|
@ -12,13 +13,16 @@ export const Watch: Component = () => {
|
|
|
|
|
|
|
|
|
|
|
|
const searchParams = useSearchParams();
|
|
|
|
const searchParams = useSearchParams();
|
|
|
|
|
|
|
|
|
|
|
|
const videoId = searchParams.get("v");
|
|
|
|
const videoId = searchParams.get("v") as string;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const videoIdIsInvalid = useMemo(() => videoId === null, [videoId]);
|
|
|
|
|
|
|
|
|
|
|
|
const { data, error } = useQuery({
|
|
|
|
const { data, error } = useQuery({
|
|
|
|
queryKey: ["watch", videoId],
|
|
|
|
queryKey: ["watch", videoId],
|
|
|
|
queryFn: () => {
|
|
|
|
queryFn: () => {
|
|
|
|
return client.getStream(videoId ?? "");
|
|
|
|
return client.getStream(videoId);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
enabled: !videoIdIsInvalid
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
console.log(data, error);
|
|
|
|
console.log(data, error);
|
|
|
|