"use client";

import { useSearchParams } from "next/navigation";
import * as React from "react";
import { ContentList } from "@/components/content-list";
import { ContentService } from "@/services/content.service";

export function HomeContent({
	defaultSort = "trend",
}: {
	defaultSort?: "trend" | "recent";
}) {
	const searchParams = useSearchParams();

	const sort = (searchParams.get("sort") as "trend" | "recent") || defaultSort;
	const category = searchParams.get("category") || undefined;
	const tag = searchParams.get("tag") || undefined;
	const query = searchParams.get("query") || undefined;

	const fetchFn = React.useCallback(
		(params: { limit: number; offset: number }) =>
			ContentService.getExplore({
				...params,
				sort,
				category,
				tag,
				query,
			}),
		[sort, category, tag, query],
	);

	const title = query
		? `Résultats pour "${query}"`
		: category
			? `Catégorie : ${category}`
			: sort === "trend"
				? "Tendances du moment"
				: "Nouveautés";

	return <ContentList fetchFn={fetchFn} title={title} />;
}