watch: fixed replies for piped api

src/app/watch/Watch.tsx

@@ -3,6 +3,11 @@
 import { useQuery } from "@tanstack/react-query";
 import { useSearchParams } from "next/navigation";
 import { useMemo } from "react";
+import {
+	FiThumbsDown as DislikeIcon,
+	FiThumbsUp as LikeIcon,
+	FiEye as ViewIcon
+} from "react-icons/fi";
 
 import { Chip } from "@nextui-org/chip";
 
@@ -64,10 +69,19 @@ export const Watch: Component = () => {
 							<div className="flex flex-col">
 								<h1 className="text-2xl">{data.video.title}</h1>
 								<div className="flex flex-row gap-4 text-lg tracking-tight text-default-500">
-									<h2>{formatBigNumber(data.video.views)} views</h2>
+									<div className="flex flex-row gap-1 items-center">
+										<ViewIcon />
+										<p>{formatBigNumber(data.video.views)} views</p>
+									</div>
 
-									<h2>{formatBigNumber(data.likes)} likes</h2>
+									<div className="flex flex-row gap-1 items-center">
-									<h2>{formatBigNumber(data.dislikes)} dislikes</h2>
+										<LikeIcon />
+										<p>{formatBigNumber(data.likes)} likes</p>
+									</div>
+									<div className="flex flex-row gap-1 items-center">
+										<DislikeIcon />
+										<p>{formatBigNumber(data.dislikes)} dislikes</p>
+									</div>
 								</div>
 							</div>
 

src/client/adapters/piped/index.ts

@@ -119,7 +119,7 @@ const getComments = async (
 		searchParams.append("nextpage", nextpage);
 	} else url = new URL(path.join("comments", videoId), apiBaseUrl);
 
-	const response = await ky.get(url);
+	const response = await ky.get(url, { searchParams });
 
 	const json = await response.json();
 
@@ -168,11 +168,15 @@ const adapter: Adapter = {
 			},
 
 			async getStream(videoId) {
-				return getStream(url, videoId).then(Transformer.stream);
+				return getStream(url, videoId).then((data) =>
+					Transformer.stream(data, videoId)
+				);
 			},
 
-			async getComments(videoId) {
+			async getComments(videoId, repliesToken?: string) {
-				return getComments(url, videoId).then(Transformer.comments);
+				return getComments(url, videoId, repliesToken).then(
+					Transformer.comments
+				);
 			}
 		};
 	}

src/client/adapters/piped/transformer.ts

@@ -102,7 +102,7 @@ export default class Transformer {
 		return { items, nextCursor: data.nextpage };
 	}
 
-	public static stream(data: PipedStream): Stream {
+	public static stream(data: PipedStream, videoId: string): Stream {
 		const channelId = parseChannelIdFromUrl(data.uploaderUrl) ?? undefined;
 
 		return {
@@ -120,7 +120,7 @@ export default class Transformer {
 				},
 				description: data.description,
 				duration: data.duration * 1000,
-				id: "",
+				id: videoId,
 				live: data.livestream,
 				thumbnail: data.thumbnailUrl,
 				title: data.title,