mirror of
https://github.com/ershisan99/podcaster.git
synced 2025-12-16 20:59:26 +00:00
feat: make PodcastPreviewCard a link to navigate to the podcast page
This commit is contained in:
@@ -1,15 +1,23 @@
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
type Props = {
|
||||
title: string;
|
||||
author: string;
|
||||
imageUrl: string;
|
||||
detailUrl: string;
|
||||
};
|
||||
|
||||
export function PodcastPreviewCard({ title, author, imageUrl }: Props) {
|
||||
export function PodcastPreviewCard({
|
||||
title,
|
||||
author,
|
||||
imageUrl,
|
||||
detailUrl,
|
||||
}: Props) {
|
||||
return (
|
||||
<div>
|
||||
<Link to={detailUrl}>
|
||||
<img src={imageUrl} alt={title} />
|
||||
<h3>{title}</h3>
|
||||
<h4>{author}</h4>
|
||||
</div>
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -10,6 +10,7 @@ export function Home() {
|
||||
<div className={"grid grid-cols-4"}>
|
||||
{data?.map((podcast) => (
|
||||
<PodcastPreviewCard
|
||||
detailUrl={`/podcast/${podcast.id}`}
|
||||
key={podcast.id}
|
||||
title={podcast.title}
|
||||
author={podcast.author}
|
||||
|
||||
Reference in New Issue
Block a user