diff --git a/src/components/podcast-info-card.tsx b/src/components/podcast-info-card.tsx index 22da262..d3b88c6 100644 --- a/src/components/podcast-info-card.tsx +++ b/src/components/podcast-info-card.tsx @@ -1,3 +1,6 @@ +import { Link, useParams } from "react-router-dom"; +import { Wrap } from "./wrap"; + type Props = { title: string; author: string; @@ -11,11 +14,23 @@ export function PodcastInfoCard({ description, imageURL, }: Props) { + const { episodeId, podcastId } = useParams<{ + episodeId?: string; + podcastId?: string; + }>(); + + const href = `/podcast/${podcastId}`; + const shouldWrapWithLink = !!episodeId; + return (
-

{title}

-

{author}

- {title} + + {title} + + +

{title}

+

{author}

+

{description}

); diff --git a/src/components/wrap.tsx b/src/components/wrap.tsx new file mode 100644 index 0000000..9bc6649 --- /dev/null +++ b/src/components/wrap.tsx @@ -0,0 +1,21 @@ +import { createElement, ReactNode } from "react"; + +type Props = { + if?: boolean; + with: (typeof createElement.arguments)[0]; + wrapperProps: (typeof createElement.arguments)[1]; + children: NonNullable; +}; + +export function Wrap({ + if: condition, + with: wrapper, + wrapperProps, + children, +}: Props) { + return condition ? ( + createElement(wrapper, wrapperProps, [children]) + ) : ( + <>{children} + ); +}