This commit is contained in:
2026-02-04 09:39:58 -05:00
parent bd4747679d
commit f7df578461
26 changed files with 907 additions and 783 deletions

View File

@@ -14,8 +14,7 @@ type PodcastCardProps = {
}
export function PodcastCard(props: PodcastCardProps) {
const handleSubscribeClick = (e: MouseEvent) => {
e.stopPropagation?.()
const handleSubscribeClick = () => {
props.onSubscribe?.()
}
@@ -28,55 +27,43 @@ export function PodcastCard(props: PodcastCardProps) {
>
{/* Title Row */}
<box flexDirection="row" gap={2} alignItems="center">
<text>
<span fg={props.selected ? "cyan" : "white"}>
<strong>{props.podcast.title}</strong>
</span>
<text fg={props.selected ? "cyan" : "white"}>
<strong>{props.podcast.title}</strong>
</text>
<Show when={props.podcast.isSubscribed}>
<text>
<span fg="green">[+]</span>
</text>
<text fg="green">[+]</text>
</Show>
</box>
{/* Author */}
<Show when={props.podcast.author && !props.compact}>
<text>
<span fg="gray">by {props.podcast.author}</span>
</text>
<text fg="gray">by {props.podcast.author}</text>
</Show>
{/* Description */}
<Show when={props.podcast.description && !props.compact}>
<text>
<span fg={props.selected ? "white" : "gray"}>
{props.podcast.description!.length > 80
? props.podcast.description!.slice(0, 80) + "..."
: props.podcast.description}
</span>
<text fg={props.selected ? "white" : "gray"}>
{props.podcast.description!.length > 80
? props.podcast.description!.slice(0, 80) + "..."
: props.podcast.description}
</text>
</Show>
{/* Categories and Subscribe Button */}
<box flexDirection="row" justifyContent="space-between" marginTop={props.compact ? 0 : 1}>
<box flexDirection="row" gap={1}>
<Show when={props.podcast.categories && props.podcast.categories.length > 0}>
{props.podcast.categories!.slice(0, 2).map((cat) => (
<text>
<span fg="yellow">[{cat}]</span>
</text>
<Show when={(props.podcast.categories ?? []).length > 0}>
{(props.podcast.categories ?? []).slice(0, 2).map((cat) => (
<text fg="yellow">[{cat}]</text>
))}
</Show>
</box>
<Show when={props.selected}>
<box onMouseDown={handleSubscribeClick}>
<text>
<span fg={props.podcast.isSubscribed ? "red" : "green"}>
{props.podcast.isSubscribed ? "[Unsubscribe]" : "[Subscribe]"}
</span>
<text fg={props.podcast.isSubscribed ? "red" : "green"}>
{props.podcast.isSubscribed ? "[Unsubscribe]" : "[Subscribe]"}
</text>
</box>
</Show>