diff --git a/README.md b/README.md index 007e8ce..698575b 100644 --- a/README.md +++ b/README.md @@ -80,7 +80,8 @@ sudo ln -sf /opt/podtui/podtui /usr/local/bin/podtui ### 3. Arch Linux (AUR) ```bash -yay -S podtui-bin +# Status: PKGBUILD ready, not yet on the AUR (see note below) +yay -S podtui-bin # once published ``` Requires an AUR helper ([paru](https://github.com/morgan/paru)). The AUR @@ -88,6 +89,18 @@ package (PKGBUILD lives in `packaging/aur/`) installs the released binary and its two FFI sibling libraries into `/usr/lib/podtui/` with a `/usr/bin/podtui` symlink, and pulls in `mpv` (the sole audio backend) as a dependency. +> **Not yet on the AUR.** The `podtui-bin` PKGBUILD and `.SRCINFO` are ready +> in `packaging/aur/` and can be built locally today: +> +> ```bash +> cd packaging/aur && makepkg -si +> ``` +> +> Publishing is on hold until [AUR account registrations](https://aur.archlinux.org) +> reopen (suspended while the AUR team works on suspicious-package +> moderation). Once a key can be registered, push `PKGBUILD` + `.SRCINFO` +> with `git push ssh://aur@aur.archlinux.org/podtui-bin` and update this note. + ### 4. From source Requires [Bun](https://bun.sh) ≥ 1.2. diff --git a/discover/featured.json b/discover/featured.json index 780fe19..f35355a 100644 --- a/discover/featured.json +++ b/discover/featured.json @@ -1,5 +1,5 @@ { - "version": 2, + "version": 3, "podcasts": [ { "id": "discover-daily", @@ -7,7 +7,9 @@ "description": "This is how the news should sound. Twenty minutes a day, five days a week, hosted by Michael Barbaro and Sabrina Tavernise. Powered by New York Times journalism.", "feedUrl": "http://rss.art19.com/the-daily", "author": "The New York Times", - "categories": ["News", "Politics"] + "categories": [ + "News & Politics" + ] }, { "id": "discover-up-first", @@ -15,7 +17,9 @@ "description": "NPR's Up First covers the three biggest stories of the day, with reporting and analysis from NPR News — in 10 minutes.", "feedUrl": "https://feeds.npr.org/510318/podcast.xml", "author": "NPR", - "categories": ["News"] + "categories": [ + "News & Politics" + ] }, { "id": "discover-npr-politics", @@ -23,23 +27,29 @@ "description": "Where everyone gathers for the political conversation of the day. NPR's political reporters talk through the biggest news of the week.", "feedUrl": "https://feeds.npr.org/510310/podcast.xml", "author": "NPR", - "categories": ["News", "Politics"] + "categories": [ + "News & Politics" + ] }, { - "id": "discover-code-switch", - "title": "Code Switch", - "description": "Race. In your face. A podcast from NPR that fearlessly explores how race impacts every part of society — from politics to pop culture.", - "feedUrl": "https://feeds.npr.org/510312/podcast.xml", - "author": "NPR", - "categories": ["News", "Culture", "Politics"] + "id": "discover-ben-shapiro", + "title": "The Ben Shapiro Show", + "description": "Ben Shapiro delivers unapologetically conservative commentary on the biggest news stories of the day, blending sharp analysis with his trademark fact-based approach.", + "feedUrl": "https://feeds.megaphone.fm/benshow", + "author": "The Daily Wire", + "categories": [ + "News & Politics" + ] }, { - "id": "discover-rough-translation", - "title": "Rough Translation", - "description": "How are the things we're talking about covered in the rest of the world? NPR's Rough Translation takes you to far-off places and shows you the unexpected.", - "feedUrl": "https://feeds.npr.org/510324/podcast.xml", - "author": "NPR", - "categories": ["News", "Culture"] + "id": "discover-advisory-opinions", + "title": "Advisory Opinions", + "description": "Host Sarah Isgur and permanent guest David French have twice-weekly conversations about the law, the courts, their collision with politics, and why it all matters — from The Dispatch.", + "feedUrl": "https://feeds.megaphone.fm/DISPME4573820108", + "author": "The Dispatch", + "categories": [ + "News & Politics" + ] }, { "id": "discover-crime-junkie", @@ -47,7 +57,9 @@ "description": "Crime Junkie satisfies true crime cravings with host Ashley Flowers' obsessed yet accessible approach to real-life mysteries — from unsolved murders to missing persons.", "feedUrl": "https://feeds.simplecast.com/qm_9xx0g", "author": "audiochuck", - "categories": ["True Crime"] + "categories": [ + "True Crime" + ] }, { "id": "discover-serial", @@ -55,7 +67,10 @@ "description": "Serial Productions makes narrative podcasts that have transformed the medium. From the team that brought you the original Serial, one of the most influential podcasts of all time.", "feedUrl": "https://feeds.simplecast.com/PpzWFGhg", "author": "Serial Productions & The New York Times", - "categories": ["True Crime", "Storytelling"] + "categories": [ + "True Crime", + "Storytelling" + ] }, { "id": "discover-intelligence-matters", @@ -63,7 +78,10 @@ "description": "A deep dive into national security, intelligence, and foreign policy with top former officials and experts hosted by CBS News senior correspondent.", "feedUrl": "https://rss.art19.com/intelligence-matters", "author": "CBS News", - "categories": ["True Crime", "Politics", "News"] + "categories": [ + "True Crime", + "News & Politics" + ] }, { "id": "discover-smartless", @@ -71,7 +89,10 @@ "description": "Jason Bateman, Sean Hayes, and Will Arnett bring you unscripted conversations with surprise celebrity guests — each episode one host reveals the guest to the others.", "feedUrl": "https://rss.art19.com/smartless", "author": "Jason Bateman, Sean Hayes, Will Arnett", - "categories": ["Comedy", "Entertainment"] + "categories": [ + "Comedy", + "Entertainment" + ] }, { "id": "discover-this-past-weekend", @@ -79,7 +100,9 @@ "description": "Comedian Theo Von's uniquely southern perspective blends heartfelt vulnerability and offbeat humor in conversations ranging from celebrity interviews to solo musings.", "feedUrl": "https://feeds.megaphone.fm/thispastweekend", "author": "Theo Von", - "categories": ["Comedy"] + "categories": [ + "Comedy" + ] }, { "id": "discover-joe-rogan", @@ -87,7 +110,10 @@ "description": "The official podcast of comedian Joe Rogan. Long-form conversations with guests from every corner of culture, science, comedy, and beyond.", "feedUrl": "https://feeds.megaphone.fm/GLT1412515089", "author": "Joe Rogan", - "categories": ["Comedy", "Entertainment"] + "categories": [ + "Comedy", + "Entertainment" + ] }, { "id": "discover-comedy-bang-bang", @@ -95,7 +121,9 @@ "description": "A weekly comedy podcast hosted by Scott Aukerman featuring improv, games, and hilarious conversations with celebrities and the world's best comedians.", "feedUrl": "https://rss.art19.com/comedy-bang-bang", "author": "Earwolf", - "categories": ["Comedy"] + "categories": [ + "Comedy" + ] }, { "id": "discover-office-ladies", @@ -103,7 +131,10 @@ "description": "The Office stars Jenna Fischer and Angela Kinsey break down each episode of The Office with behind-the-scenes stories, fun facts, and fan Q&A.", "feedUrl": "https://rss.art19.com/office-ladies", "author": "Earwolf", - "categories": ["Comedy", "Entertainment"] + "categories": [ + "Comedy", + "Entertainment" + ] }, { "id": "discover-how-did-this-get-made", @@ -111,7 +142,10 @@ "description": "Comedians Paul Scheer, June Diane Raphael, and Jason Mantzoukas break down the very best of the worst films ever made — blockbuster flops, cult classics, and Nic Cage movies.", "feedUrl": "https://rss.art19.com/how-did-this-get-made", "author": "Earwolf", - "categories": ["Comedy", "Film"] + "categories": [ + "Comedy", + "Film" + ] }, { "id": "discover-wait-wait", @@ -119,7 +153,10 @@ "description": "NPR's weekly news quiz show. Test your knowledge against the week's biggest news, with panelists and celebrity guests competing in hilarious trivia.", "feedUrl": "https://feeds.npr.org/344098539/podcast.xml", "author": "NPR", - "categories": ["Comedy", "News"] + "categories": [ + "Comedy", + "News & Politics" + ] }, { "id": "discover-new-heights", @@ -127,7 +164,10 @@ "description": "Football's funniest family duo — Super Bowl champions Jason and Travis Kelce — drop weekly insights about the NFL and share inside perspectives on sports headlines.", "feedUrl": "https://rss.art19.com/new-heights", "author": "Jason & Travis Kelce", - "categories": ["Sports", "Comedy"] + "categories": [ + "Sports", + "Comedy" + ] }, { "id": "discover-bill-simmons", @@ -135,7 +175,10 @@ "description": "Bill Simmons and his cadre of opinionated guests discuss sports, pop culture, and everything in between on The Ringer's flagship podcast.", "feedUrl": "https://rss.art19.com/the-bill-simmons-podcast", "author": "The Ringer", - "categories": ["Sports", "Entertainment"] + "categories": [ + "Sports", + "Entertainment" + ] }, { "id": "discover-acquired", @@ -143,7 +186,10 @@ "description": "Acquired tells the stories and strategies of the world's greatest companies. Each episode is a deep dive into a single company's history and the playbooks behind its success.", "feedUrl": "https://feeds.transistor.fm/acquired", "author": "Ben Gilbert & David Rosenthal", - "categories": ["Business", "Technology"] + "categories": [ + "Business", + "Technology" + ] }, { "id": "discover-all-in", @@ -151,7 +197,11 @@ "description": "Four tech industry veterans share their unfiltered perspectives on technology, economics, politics, and culture. Insightful, opinionated, and occasionally controversial.", "feedUrl": "https://allinchamathjason.libsyn.com/rss", "author": "Chamath Palihapitiya, Jason Calacanis, David Sacks & David Friedberg", - "categories": ["Business", "Technology", "Politics"] + "categories": [ + "Business", + "Technology", + "Politics" + ] }, { "id": "discover-planet-money", @@ -159,7 +209,10 @@ "description": "The economy explained. NPR's Planet Money breaks down the economy with creative storytelling that makes sense of a complicated, ever-changing world.", "feedUrl": "https://feeds.npr.org/510289/podcast.xml", "author": "NPR", - "categories": ["Business", "Economics"] + "categories": [ + "Business", + "Economics" + ] }, { "id": "discover-how-i-built-this", @@ -167,7 +220,10 @@ "description": "Guy Raz interviews the world's best-known entrepreneurs to learn how they built their iconic brands. A master-class on innovation, creativity, and leadership.", "feedUrl": "https://feeds.npr.org/510313/podcast.xml", "author": "NPR / Wondery", - "categories": ["Business", "Technology"] + "categories": [ + "Business", + "Technology" + ] }, { "id": "discover-freakonomics", @@ -175,7 +231,11 @@ "description": "Discover the hidden side of everything with Stephen Dubner. Each episode explores the riddles of everyday life using the tools of economics.", "feedUrl": "https://feeds.feedburner.com/freakonomicsradio", "author": "Stephen J. Dubner", - "categories": ["Business", "Economics", "Society"] + "categories": [ + "Business", + "Economics", + "Society" + ] }, { "id": "discover-darknet-diaries", @@ -183,7 +243,10 @@ "description": "True stories from the dark side of the Internet. Host Jack Rhysider investigates hacks, data breaches, cybercrime, and digital espionage with rigorous journalism and captivating storytelling.", "feedUrl": "https://podcast.darknetdiaries.com/", "author": "Jack Rhysider", - "categories": ["Technology", "True Crime"] + "categories": [ + "Technology", + "True Crime" + ] }, { "id": "discover-changelog", @@ -191,7 +254,10 @@ "description": "Software's best weekly news brief, deep technical interviews, and talk show. Conversations with the hackers, leaders, and innovators of the open source and software world.", "feedUrl": "https://changelog.fm/rss", "author": "Changelog Media", - "categories": ["Technology", "Software Engineering"] + "categories": [ + "Technology", + "Software Engineering" + ] }, { "id": "discover-twit", @@ -199,7 +265,9 @@ "description": "Your first podcast of the week, the last word in tech. Leo Laporte and a rotating panel of tech experts discuss the week's biggest tech news.", "feedUrl": "https://feeds.twit.tv/twit.xml", "author": "TWiT", - "categories": ["Technology"] + "categories": [ + "Technology" + ] }, { "id": "discover-radiolab", @@ -207,7 +275,10 @@ "description": "Radiolab is on a curiosity bender. Each episode weaves together science, legal history, and deeply human stories with innovative sound design. Hosted by Lulu Miller and Latif Nasser.", "feedUrl": "http://feeds.wnyc.org/radiolab", "author": "WNYC Studios", - "categories": ["Science", "Storytelling"] + "categories": [ + "Science", + "Storytelling" + ] }, { "id": "discover-huberman-lab", @@ -215,7 +286,10 @@ "description": "Regularly ranked as the #1 health podcast in the world. Dr. Andrew Huberman discusses science and science-based tools for everyday life: sleep, focus, fitness, and performance.", "feedUrl": "https://feeds.megaphone.fm/hubermanlab", "author": "Scicomm Media", - "categories": ["Health", "Science"] + "categories": [ + "Health", + "Science" + ] }, { "id": "discover-skeptics-guide", @@ -223,7 +297,10 @@ "description": "Your guide to reality. A weekly science and critical thinking podcast that explores myths, conspiracies, pseudoscience, and the latest scientific discoveries — with a skeptical eye.", "feedUrl": "https://feeds.feedburner.com/TheSkepticsGuideToTheUniverse", "author": "Steven Novella", - "categories": ["Science", "Philosophy"] + "categories": [ + "Science", + "Philosophy" + ] }, { "id": "discover-throughline", @@ -231,7 +308,10 @@ "description": "The past is never past. NPR's Throughline travels beyond the headlines to answer the question 'How did we get here?' Each episode brings history to life from ancient civilizations to forgotten figures.", "feedUrl": "https://feeds.npr.org/510333/podcast.xml", "author": "NPR", - "categories": ["History", "Politics"] + "categories": [ + "History", + "Politics" + ] }, { "id": "discover-hardcore-history", @@ -239,7 +319,9 @@ "description": "In Hardcore History, journalist and broadcaster Dan Carlin applies his unorthodox, 'Martian' way of thinking to the past. Multi-hour deep dives into pivotal events that blend high drama with masterful narration.", "feedUrl": "https://feeds.feedburner.com/dancarlin/history", "author": "Dan Carlin", - "categories": ["History"] + "categories": [ + "History" + ] }, { "id": "discover-history-of-rome", @@ -247,7 +329,9 @@ "description": "A weekly chronological podcast tracing the entire history of Rome, from its mythical founding to the fall of the Western Empire. A masterclass in narrative history.", "feedUrl": "https://feeds.feedburner.com/TheHistoryOfRome", "author": "Mike Duncan", - "categories": ["History"] + "categories": [ + "History" + ] }, { "id": "discover-philosophize-this", @@ -255,7 +339,10 @@ "description": "Stephen West walks through the entire history of philosophy chronologically, from the pre-Socratics to contemporary thinkers. Making profound ideas accessible without dumbing them down.", "feedUrl": "https://philosophizethis.libsyn.com/rss", "author": "Stephen West", - "categories": ["Philosophy", "Education"] + "categories": [ + "Philosophy", + "Education" + ] }, { "id": "discover-very-bad-wizards", @@ -263,7 +350,10 @@ "description": "A philosopher (Tamler Sommers) and a psychologist (David Pizarro) discuss human nature, ethics, free will, and whatever movie they just watched. Irreverent, insightful, and intellectually honest.", "feedUrl": "https://feeds.libsyn.com/474285/rss", "author": "Tamler Sommers & David Pizarro", - "categories": ["Philosophy", "Science"] + "categories": [ + "Philosophy", + "Science" + ] }, { "id": "discover-big-picture", @@ -271,7 +361,10 @@ "description": "The Ringer's Sean Fennessey and Amanda Dobbins discuss the week in movies, TV, and streaming — from box office analysis to what's worth your time.", "feedUrl": "https://rss.art19.com/the-big-picture", "author": "The Ringer", - "categories": ["Film", "Entertainment"] + "categories": [ + "Film", + "Entertainment" + ] }, { "id": "discover-all-songs-considered", @@ -279,7 +372,9 @@ "description": "NPR's flagship music discovery podcast, delivering the best new releases every week across indie rock, jazz, electronic, and everything in between. Discover music you wouldn't stumble across on your own.", "feedUrl": "https://feeds.npr.org/510019/podcast.xml", "author": "NPR Music", - "categories": ["Music"] + "categories": [ + "Music" + ] }, { "id": "discover-switched-on-pop", @@ -287,7 +382,9 @@ "description": "Musicologist Nate Sloan and songwriter Charlie Harding explain why pop music sounds the way it does — pulling apart chord progressions, production tricks, and cultural trends with zero snobbery.", "feedUrl": "https://feeds.megaphone.fm/switchedonpop", "author": "Vox Media / Panoply", - "categories": ["Music"] + "categories": [ + "Music" + ] }, { "id": "discover-hit-parade", @@ -295,7 +392,10 @@ "description": "Slate's Chris Molanphy traces how songs and genres conquered the Billboard charts, weaving chart history, cultural context, and pure trivia into each episode.", "feedUrl": "https://feeds.megaphone.fm/hitparade", "author": "Slate", - "categories": ["Music", "History"] + "categories": [ + "Music", + "History" + ] }, { "id": "discover-song-exploder", @@ -303,7 +403,10 @@ "description": "Musicians take apart their songs, piece by piece, and tell the story of how they were made. Past guests include Billie Eilish, Fleetwood Mac, and Lin-Manuel Miranda.", "feedUrl": "https://songexploder.net/rss", "author": "Hrishikesh Hirway", - "categories": ["Music", "Arts"] + "categories": [ + "Music", + "Arts" + ] }, { "id": "discover-blank-check", @@ -311,7 +414,10 @@ "description": "Reviews of directors' complete filmographies, episode by episode. Specifically, auteurs whose early successes afforded them the rare 'blank check' from Hollywood. Painstakingly hilarious detail.", "feedUrl": "https://audioboom.com/channels/4278829.rss", "author": "Griffin Newman & David Sims", - "categories": ["Film", "Comedy"] + "categories": [ + "Film", + "Comedy" + ] }, { "id": "discover-99-invisible", @@ -319,7 +425,11 @@ "description": "A sound-rich, narrative podcast about all the thought that goes into the things we don't think about — the unnoticed architecture and design that shape our world. Hosted by Roman Mars.", "feedUrl": "https://feeds.simplecast.com/BqbsxVfO", "author": "Roman Mars", - "categories": ["Design", "Arts", "Culture"] + "categories": [ + "Design", + "Arts", + "Culture" + ] }, { "id": "discover-gastropod", @@ -327,7 +437,11 @@ "description": "Food with a side of science and history. Co-hosts Cynthia Graber and Nicola Twilley explore the hidden history and surprising science behind a different food or farming topic every other week.", "feedUrl": "https://gastropod.com/feed", "author": "Cynthia Graber & Nicola Twilley", - "categories": ["Food", "Science", "History"] + "categories": [ + "Food", + "Science", + "History" + ] }, { "id": "discover-this-american-life", @@ -335,7 +449,10 @@ "description": "Hosted by Ira Glass, each episode weaves together stories around a single theme. Combining investigative reporting with intimate personal narratives, it sets the gold standard for audio storytelling.", "feedUrl": "https://www.thisamericanlife.org/podcast/rss.xml", "author": "This American Life", - "categories": ["Storytelling", "Culture"] + "categories": [ + "Storytelling", + "Culture" + ] }, { "id": "discover-ted-talks-daily", @@ -343,7 +460,10 @@ "description": "Thought-provoking ideas on every subject imaginable from the world's leading thinkers and creators. A new TED Talk every weekday.", "feedUrl": "https://feeds.feedburner.com/TEDTalks_audio", "author": "TED", - "categories": ["Education", "Storytelling"] + "categories": [ + "Education", + "Storytelling" + ] }, { "id": "discover-tim-ferriss", @@ -351,7 +471,10 @@ "description": "Tim Ferriss deconstructs world-class performers — from billionaires to chess prodigies to athletes — to extract the tools, tactics, and routines you can apply to your own life.", "feedUrl": "https://rss.art19.com/tim-ferriss-show", "author": "Tim Ferriss", - "categories": ["Self-Improvement", "Business"] + "categories": [ + "Self-Improvement", + "Business" + ] }, { "id": "discover-jordan-harbinger", @@ -359,7 +482,9 @@ "description": "In-depth conversations with fascinating minds — from Ray Dalio to arms traffickers. Jordan Harbinger unpacks guests' wisdom into practical nuggets for work, life, and relationships.", "feedUrl": "https://rss.art19.com/the-jordan-harbinger-show", "author": "Jordan Harbinger", - "categories": ["Self-Improvement"] + "categories": [ + "Self-Improvement" + ] }, { "id": "discover-on-purpose", @@ -367,7 +492,10 @@ "description": "Jay Shetty hosts conversations and workshops designed to make you happier, healthier, and more healed. Interviews with experts, celebrities, and thought leaders on mindset and habit-building.", "feedUrl": "https://rss.art19.com/on-purpose-with-jay-shetty", "author": "Jay Shetty", - "categories": ["Self-Improvement", "Health"] + "categories": [ + "Self-Improvement", + "Health" + ] }, { "id": "discover-10-percent-happier", @@ -375,7 +503,11 @@ "description": "Self-help for the skeptical. ABC News anchor Dan Harris explores meditation and mindfulness with scientists, monks, and teachers, born from his own panic attack on live TV.", "feedUrl": "https://rss.art19.com/ten-percent-happier", "author": "Dan Harris", - "categories": ["Self-Improvement", "Health", "Philosophy"] + "categories": [ + "Self-Improvement", + "Health", + "Philosophy" + ] }, { "id": "discover-school-of-greatness", @@ -383,7 +515,10 @@ "description": "Former pro athlete Lewis Howes interviews successful people across business, sports, science, and literature to help you unlock your inner greatness and live your best life.", "feedUrl": "https://rss.art19.com/the-school-of-greatness", "author": "Lewis Howes", - "categories": ["Self-Improvement", "Business"] + "categories": [ + "Self-Improvement", + "Business" + ] }, { "id": "discover-sysk", @@ -391,7 +526,10 @@ "description": "If you've ever wanted to know about champagne, satanism, the Stonewall Uprising, chaos theory, LSD, El Nino, true crime or Roswell — Josh and Chuck have got you covered.", "feedUrl": "https://www.omnycontent.com/d/playlist/e73c998e-6e60-432f-8610-ae210140c5b1/A91018A4-EA4F-4130-BF55-AE270180C327/44710ECC-10BB-48D1-93C7-AE270180C33E/podcast.rss", "author": "iHeartPodcasts (Josh Clark & Chuck Bryant)", - "categories": ["Education", "Comedy"] + "categories": [ + "Education", + "Comedy" + ] }, { "id": "discover-in-our-time", @@ -399,7 +537,11 @@ "description": "Melvyn Bragg and guests on BBC Radio 4 discuss the history of ideas — from the Peloponnesian War to the science of photography. A weekly graduate seminar in audio form since 1998.", "feedUrl": "https://podcasts.files.bbci.co.uk/b006qykl.rss", "author": "BBC Radio 4", - "categories": ["History", "Education", "Philosophy"] + "categories": [ + "History", + "Education", + "Philosophy" + ] } ] } diff --git a/src/components/YaziPaneRow.tsx b/src/components/PaneRow.tsx similarity index 97% rename from src/components/YaziPaneRow.tsx rename to src/components/PaneRow.tsx index 596c08f..6d5d80b 100644 --- a/src/components/YaziPaneRow.tsx +++ b/src/components/PaneRow.tsx @@ -1,5 +1,5 @@ /** - * YaziPaneRow — the shared parent | current | preview 3-pane layout primitive. + * PaneRow — the shared parent | current | preview 3-pane layout primitive. * * Implements yazi's `mgr.ratio = [1, 3, 3]` contract: three bordered columns * grow at 1/7 : 3/7 : 3/7 of the row width via Yoga `flexGrow`, so every list @@ -20,7 +20,7 @@ * `focused`, so scroll focus follows the cursor (j/k stay in the current pane). * * Example: - * JSX.Element); type PaneLabel = string | (() => string); -export type YaziPaneRowProps = { +export type PaneRowProps = { /** Parent column content (previous-depth list, or null for a muted * placeholder — the 1/7 slot is always preserved). */ parent?: PaneContent; @@ -95,7 +95,7 @@ function Placeholder(props: { color: () => RGBA }) { } // ── Pane column ───────────────────────────────────────────────────────────── -function YaziPane(props: { +function Pane(props: { grow: number; label: () => string; content: () => JSX.Element | undefined; @@ -149,7 +149,7 @@ function YaziPane(props: { } // ── Row primitive ─────────────────────────────────────────────────────────── -export function YaziPaneRow(props: YaziPaneRowProps) { +export function PaneRow(props: PaneRowProps) { const { theme } = useTheme(); /** true → the current column gets the active-border focus ring. */ @@ -180,7 +180,7 @@ export function YaziPaneRow(props: YaziPaneRowProps) { return ( {/* ── parent (1/7) — previous-depth list; always muted ─────────────── */} - false} /> {/* ── current — the focused list; active-border ring when focused ──────────── */} - {/* ── preview (3/7) — hovered-item detail; always muted ────────────── */} - = { [TABS.FEED]: "Feed", @@ -252,7 +252,7 @@ export function Shell() { } > {/* app root: the tab list is the CURRENT pane, nothing in UP */} - — diff --git a/src/components/TabPanel.tsx b/src/components/TabPanel.tsx index 6f96011..0026e1d 100644 --- a/src/components/TabPanel.tsx +++ b/src/components/TabPanel.tsx @@ -18,6 +18,7 @@ import { For } from "solid-js"; import { useTheme } from "@/context/ThemeContext"; import { useNavigation } from "@/context/NavigationContext"; +import { useScrollIntoView } from "@/hooks/useScrollIntoView"; import { TABS } from "@/utils/navigation"; const TAB_LABEL: Record = { @@ -67,8 +68,10 @@ export function TabListPane(props: { muted?: boolean }) { : isActive() && !active() ? theme.accent : theme.text; + const ref = useScrollIntoView(isCursor); return ( ", action: "Seek backward / forward 10s" }, diff --git a/src/context/KeybindContext.tsx b/src/context/KeybindContext.tsx index b7ac7d8..b4104d4 100644 --- a/src/context/KeybindContext.tsx +++ b/src/context/KeybindContext.tsx @@ -67,6 +67,7 @@ export type KeybindActionName = | "sort" | "toggle-hidden" | "refresh" + | "unsubscribe" | "audio-toggle" | "audio-next" | "audio-prev" diff --git a/src/hooks/useScrollIntoView.ts b/src/hooks/useScrollIntoView.ts new file mode 100644 index 0000000..b046975 --- /dev/null +++ b/src/hooks/useScrollIntoView.ts @@ -0,0 +1,115 @@ +/** + * useScrollIntoView — keeps the ref'd row visible inside its enclosing + * `` whenever the focus accessor is true. + * + * OpenTUI's `ScrollBoxRenderable` has built-in *keyboard* scrolling but does + * NOT auto-scroll to follow a programmatically-focused child (the app moves + * its own cursor via the yazi nav store, so the scrollbox never sees a key + * for row movement). Every scrollable panel therefore drifts out of view the + * moment the cursor crosses the viewport edge. + * + * Attach the returned `ref` callback to the element that represents the + * focused row of a scrollable list and call the hook with a `when()` that is + * true for exactly that row (e.g. `() => index() === focus()`). Whenever the + * accessor flips true, the nearest ScrollBoxRenderable is scrolled just enough + * to bring the element back into the viewport — a "nearest-edge" scroll: + * • scroll up only if the row's top is clipped above the viewport, + * • scroll down only if the row's bottom is clipped below the viewport, + * never snapping more than necessary (matches yazi list behaviour). + * + * Timing: for ordinary cursor movement (j/k) the list layout does not change + * — only background colour and the cursor glyph flip — so the focused row's + * Yoga-computed position is already valid when this effect fires, and the + * scroll is applied synchronously. On first mount / content population the + * layout for the new rows has not yet been computed, so the hook polls on a + * short timer until layout resolves (bounded so it can never loop forever). + */ +import { createEffect, onCleanup } from "solid-js"; + +/** Walk up the renderable parent chain to the nearest ScrollBoxRenderable, + * identified by its `viewport` + `content` + numeric `scrollTop`. */ +function findScrollBox(node: any): any | null { + let p: any = node?.parent; + while (p) { + if (p.viewport && p.content && typeof p.scrollTop === "number") return p; + p = p.parent; + } + return null; +} + +/** Maximum number of retries while waiting for Yoga layout to populate the + * row/viewport dimensions (handles the first-mount frame). */ +const MAX_RETRIES = 12; +const RETRY_MS = 16; + +export function useScrollIntoView(when: () => boolean) { + let el: any = null; + let timer: ReturnType | null = null; + const ref = (node: any) => { + el = node; + }; + + const clearTimer = () => { + if (timer) { + clearTimeout(timer); + timer = null; + } + }; + + /** Compute the target scrollTop that brings `el` into the viewport of its + * enclosing scrollbox, or `null` if no scroll is possible / needed yet. + * Returns the decision so the caller knows whether to poll again. */ + const compute = (): { scroll: number | null; ready: boolean } => { + const node = el; + if (!node) return { scroll: null, ready: false }; + const sb = findScrollBox(node); + if (!sb) return { scroll: null, ready: false }; + const vp = sb.viewport; + const top: number = sb.scrollTop ?? 0; + const vpH: number = vp?.height ?? 0; + // The scrollbar's onChange sets `content.translateY = -scrollTop`, so + // the child's cumulative `.y` already includes `-scrollTop`; subtracting + // the viewport's stable `.y` and re-adding `scrollTop` recovers the + // row's layout-space offset within the content (scroll-independent). + const childTop: number = node.y ?? 0; + const childH: number = node.height ?? 0; + if (!vpH || !childH) return { scroll: null, ready: false }; + + const offset = childTop - (vp.y ?? 0) + top; + let target = top; + if (offset < top) target = offset; + else if (offset + childH > top + vpH) target = offset + childH - vpH; + const max = Math.max(0, (sb.scrollHeight ?? 0) - vpH); + if (target > max) target = max; + if (target < 0) target = 0; + target = Math.round(target); + if (target === Math.round(top)) return { scroll: null, ready: true }; + return { scroll: target, ready: true }; + }; + + const tryScroll = (retriesLeft: number) => { + const { scroll, ready } = compute(); + if (!ready) { + if (retriesLeft > 0) + timer = setTimeout(() => tryScroll(retriesLeft - 1), RETRY_MS); + return; + } + if (scroll != null) { + const sb = findScrollBox(el); + if (sb) sb.scrollTo(scroll); + } + clearTimer(); + }; + + createEffect(() => { + if (!when()) return; + clearTimer(); + tryScroll(MAX_RETRIES); + }); + + onCleanup(() => { + clearTimer(); + }); + + return ref; +} diff --git a/src/index.tsx b/src/index.tsx index 7607f3c..a9150fa 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,225 +1,238 @@ const VERSION = "0.2.0"; interface CliArgs { - version: boolean; - query: string | null; - play: string | null; + version: boolean; + query: string | null; + play: string | null; } function parseArgs(): CliArgs { - const args = process.argv.slice(2); - const result: CliArgs = { - version: false, - query: null, - play: null, - }; + const args = process.argv.slice(2); + const result: CliArgs = { + version: false, + query: null, + play: null, + }; - for (let i = 0; i < args.length; i++) { - const arg = args[i]; - if (arg === "--version" || arg === "-v") { - result.version = true; - } else if (arg === "--query" || arg === "-q") { - result.query = args[i + 1] || ""; - i++; - } else if (arg === "--play" || arg === "-p") { - result.play = args[i + 1] || ""; - i++; - } - } + for (let i = 0; i < args.length; i++) { + const arg = args[i]; + if (arg === "--version" || arg === "-v") { + result.version = true; + } else if (arg === "--query" || arg === "-q") { + result.query = args[i + 1] || ""; + i++; + } else if (arg === "--play" || arg === "-p") { + result.play = args[i + 1] || ""; + i++; + } + } - return result; + return result; } const cliArgs = parseArgs(); if (cliArgs.version) { - console.log(`PodTUI version ${VERSION}`); - process.exit(0); + console.log(`PodTUI version ${VERSION}`); + process.exit(0); } if (cliArgs.query !== null || cliArgs.play !== null) { - import("./utils/feeds-persistence").then(async ({ loadFeedsFromFile }) => { - const feeds = await loadFeedsFromFile(); + import("./utils/feeds-persistence") + .then(async ({ loadFeedsFromFile }) => { + const feeds = await loadFeedsFromFile(); - if (cliArgs.query !== null) { - const query = cliArgs.query; - const normalizedQuery = query.toLowerCase(); + if (cliArgs.query !== null) { + const query = cliArgs.query; + const normalizedQuery = query.toLowerCase(); - const matches = feeds.filter((feed) => { - const title = feed.podcast.title.toLowerCase(); - return title.includes(normalizedQuery); - }); + const matches = feeds.filter((feed) => { + const title = feed.podcast.title.toLowerCase(); + return title.includes(normalizedQuery); + }); - if (matches.length === 0) { - console.log(`No shows found matching: ${query}`); - if (feeds.length > 0) { - console.log("\nAvailable shows:"); - feeds.slice(0, 5).forEach((feed) => { - console.log(` - ${feed.podcast.title}`); - }); - if (feeds.length > 5) { - console.log(` ... and ${feeds.length - 5} more`); - } - } - process.exit(0); - } + if (matches.length === 0) { + console.log(`No shows found matching: ${query}`); + if (feeds.length > 0) { + console.log("\nAvailable shows:"); + feeds.slice(0, 5).forEach((feed) => { + console.log(` - ${feed.podcast.title}`); + }); + if (feeds.length > 5) { + console.log(` ... and ${feeds.length - 5} more`); + } + } + process.exit(0); + } - if (matches.length === 1) { - const feed = matches[0]; - console.log(`\n${feed.podcast.title}`); - if (feed.podcast.description) { - console.log(feed.podcast.description.substring(0, 200) + (feed.podcast.description.length > 200 ? "..." : "")); - } - console.log(`\nRecent episodes (${Math.min(5, feed.episodes.length)}):`); - feed.episodes.slice(0, 5).forEach((ep, idx) => { - const date = ep.pubDate instanceof Date ? ep.pubDate.toLocaleDateString() : String(ep.pubDate); - console.log(` ${idx + 1}. ${ep.title} (${date})`); - }); - process.exit(0); - } + if (matches.length === 1) { + const feed = matches[0]; + console.log(`\n${feed.podcast.title}`); + if (feed.podcast.description) { + console.log( + feed.podcast.description.substring(0, 200) + + (feed.podcast.description.length > 200 ? "..." : ""), + ); + } + console.log( + `\nRecent episodes (${Math.min(5, feed.episodes.length)}):`, + ); + feed.episodes.slice(0, 5).forEach((ep, idx) => { + const date = + ep.pubDate instanceof Date + ? ep.pubDate.toLocaleDateString() + : String(ep.pubDate); + console.log(` ${idx + 1}. ${ep.title} (${date})`); + }); + process.exit(0); + } - console.log(`\nClosest matches for "${query}":`); - matches.slice(0, 5).forEach((feed, idx) => { - console.log(` ${idx + 1}. ${feed.podcast.title}`); - }); - process.exit(0); - } + console.log(`\nClosest matches for "${query}":`); + matches.slice(0, 5).forEach((feed, idx) => { + console.log(` ${idx + 1}. ${feed.podcast.title}`); + }); + process.exit(0); + } - if (cliArgs.play !== null) { - const playArg = cliArgs.play; - const normalizedArg = playArg.toLowerCase(); + if (cliArgs.play !== null) { + const playArg = cliArgs.play; + const normalizedArg = playArg.toLowerCase(); - let feedResult: typeof feeds[0] | null = null; - let episodeResult: typeof feeds[0]["episodes"][0] | null = null; + let feedResult: (typeof feeds)[0] | null = null; + let episodeResult: (typeof feeds)[0]["episodes"][0] | null = null; - if (normalizedArg === "latest") { - let latestFeed: typeof feeds[0] | null = null; - let latestEpisode: typeof feeds[0]["episodes"][0] | null = null; - let latestDate = 0; + if (normalizedArg === "latest") { + let latestFeed: (typeof feeds)[0] | null = null; + let latestEpisode: (typeof feeds)[0]["episodes"][0] | null = null; + let latestDate = 0; - for (const feed of feeds) { - if (feed.episodes.length > 0) { - const ep = feed.episodes[0]; - const epDate = ep.pubDate instanceof Date ? ep.pubDate.getTime() : Number(ep.pubDate); - if (epDate > latestDate) { - latestDate = epDate; - latestFeed = feed; - latestEpisode = ep; - } - } - } + for (const feed of feeds) { + if (feed.episodes.length > 0) { + const ep = feed.episodes[0]; + const epDate = + ep.pubDate instanceof Date + ? ep.pubDate.getTime() + : Number(ep.pubDate); + if (epDate > latestDate) { + latestDate = epDate; + latestFeed = feed; + latestEpisode = ep; + } + } + } - feedResult = latestFeed; - episodeResult = latestEpisode; - } else { - const parts = normalizedArg.split("/"); - const showQuery = parts[0]; - const episodeQuery = parts[1]; + feedResult = latestFeed; + episodeResult = latestEpisode; + } else { + const parts = normalizedArg.split("/"); + const showQuery = parts[0]; + const episodeQuery = parts[1]; - const matchingFeeds = feeds.filter((feed) => - feed.podcast.title.toLowerCase().includes(showQuery) - ); + const matchingFeeds = feeds.filter((feed) => + feed.podcast.title.toLowerCase().includes(showQuery), + ); - if (matchingFeeds.length === 0) { - console.log(`No show found matching: ${showQuery}`); - process.exit(1); - } + if (matchingFeeds.length === 0) { + console.log(`No show found matching: ${showQuery}`); + process.exit(1); + } - const feed = matchingFeeds[0]; + const feed = matchingFeeds[0]; - if (!episodeQuery) { - if (feed.episodes.length > 0) { - feedResult = feed; - episodeResult = feed.episodes[0]; - } else { - console.log(`No episodes available for: ${feed.podcast.title}`); - process.exit(1); - } - } else if (episodeQuery === "latest") { - feedResult = feed; - episodeResult = feed.episodes[0]; - } else { - const matchingEpisode = feed.episodes.find((ep) => - ep.title.toLowerCase().includes(episodeQuery) - ); + if (!episodeQuery) { + if (feed.episodes.length > 0) { + feedResult = feed; + episodeResult = feed.episodes[0]; + } else { + console.log(`No episodes available for: ${feed.podcast.title}`); + process.exit(1); + } + } else if (episodeQuery === "latest") { + feedResult = feed; + episodeResult = feed.episodes[0]; + } else { + const matchingEpisode = feed.episodes.find((ep) => + ep.title.toLowerCase().includes(episodeQuery), + ); - if (matchingEpisode) { - feedResult = feed; - episodeResult = matchingEpisode; - } else { - console.log(`Episode not found: ${episodeQuery}`); - console.log(`Available episodes for ${feed.podcast.title}:`); - feed.episodes.slice(0, 5).forEach((ep, idx) => { - console.log(` ${idx + 1}. ${ep.title}`); - }); - process.exit(1); - } - } - } + if (matchingEpisode) { + feedResult = feed; + episodeResult = matchingEpisode; + } else { + console.log(`Episode not found: ${episodeQuery}`); + console.log(`Available episodes for ${feed.podcast.title}:`); + feed.episodes.slice(0, 5).forEach((ep, idx) => { + console.log(` ${idx + 1}. ${ep.title}`); + }); + process.exit(1); + } + } + } - if (!feedResult || !episodeResult) { - console.log("Could not find episode to play"); - process.exit(1); - } + if (!feedResult || !episodeResult) { + console.log("Could not find episode to play"); + process.exit(1); + } - console.log(`\nPlaying: ${episodeResult.title}`); - console.log(`Show: ${feedResult.podcast.title}`); + console.log(`\nPlaying: ${episodeResult.title}`); + console.log(`Show: ${feedResult.podcast.title}`); - try { - const { createAudioBackend } = await import("./utils/audio-player"); - const backend = createAudioBackend(); - if (episodeResult.audioUrl) { - await backend.play(episodeResult.audioUrl); - console.log("Playback started (use the UI to control)"); - } else { - console.log("No audio URL available for this episode"); - process.exit(1); - } - } catch (err) { - console.error("Playback error:", err); - process.exit(1); - } - } - }).catch((err) => { - console.error("Error:", err); - process.exit(1); - }); + try { + const { createAudioBackend } = await import("./utils/audio-player"); + const backend = createAudioBackend(); + if (episodeResult.audioUrl) { + await backend.play(episodeResult.audioUrl); + console.log("Playback started (use the UI to control)"); + } else { + console.log("No audio URL available for this episode"); + process.exit(1); + } + } catch (err) { + console.error("Playback error:", err); + process.exit(1); + } + } + }) + .catch((err) => { + console.error("Error:", err); + process.exit(1); + }); } else { - import("@opentui/solid").then(async ({ render, useRenderer }) => { - const { App } = await import("./App"); - const { ThemeProvider } = await import("./context/ThemeContext"); - const toast = await import("./ui/toast"); - const { KeybindProvider } = await import("./context/KeybindContext"); - const { NavigationProvider } = await import("./context/NavigationContext"); - const { DialogProvider } = await import("./ui/dialog"); - const { CommandProvider } = await import("./ui/command"); + import("@opentui/solid").then(async ({ render, useRenderer }) => { + const { App } = await import("./App"); + const { ThemeProvider } = await import("./context/ThemeContext"); + const toast = await import("./ui/toast"); + const { KeybindProvider } = await import("./context/KeybindContext"); + const { NavigationProvider } = await import("./context/NavigationContext"); + const { DialogProvider } = await import("./ui/dialog"); + const { CommandProvider } = await import("./ui/command"); - function RendererSetup(props: { children: unknown }) { - const renderer = useRenderer(); - renderer.disableStdoutInterception(); - return props.children; - } + function RendererSetup(props: { children: unknown }) { + const renderer = useRenderer(); + renderer.disableStdoutInterception(); + return props.children; + } - render( - () => ( - - - - - - - - - - - - - - - - - ), - { useThread: false }, - ); - }); + render( + () => ( + + + + + + + + + + + + + + + + + ), + { useThread: false }, + ); + }); } diff --git a/src/pages/Discover/DiscoverPage.tsx b/src/pages/Discover/DiscoverPage.tsx index 028ac72..dc5f5dc 100644 --- a/src/pages/Discover/DiscoverPage.tsx +++ b/src/pages/Discover/DiscoverPage.tsx @@ -8,7 +8,7 @@ * preview — detail of the hovered item (category summary, or * podcast detail + subscribe action). * - * Renders entirely through ``; no bespoke 3-column flexbox JSX + * Renders entirely through ``; no bespoke 3-column flexbox JSX * remains. `l`/Enter drills in (category → results) or subscribes (on a * podcast); `h` pops a depth (noop at 0). j/k move only within the current * column. Moving through categories at depth 0 updates the store's selected @@ -28,8 +28,9 @@ import { } from "@/context/NavigationContext"; import { on, off } from "@/utils/event-bus"; import type { KeybindActionName } from "@/context/KeybindContext"; -import { YaziPaneRow } from "@/components/YaziPaneRow"; +import { PaneRow } from "@/components/PaneRow"; import { TabListPane } from "@/components/TabPanel"; +import { useScrollIntoView } from "@/hooks/useScrollIntoView"; export const DiscoverPaneCount = 1; @@ -39,7 +40,6 @@ function DiscoverPage() { const muted = () => theme.muted || theme.text; const nav = useNavigation(); - const stack = nav.depthStack; const depth = nav.currentDepth; const focus = (d: number = depth()) => nav.depthFocus(d); @@ -160,22 +160,27 @@ function DiscoverPage() { const parentContent = () => ( = 1} fallback={}> - {(cat, index) => ( - - - {index() === nav.depthFocus(0) ? "❯" : " "} - - - {cat.name} - - - )} + {(cat, index) => { + const lf = () => nav.depthFocus(0); + const ref = useScrollIntoView(() => index() === lf()); + return ( + + + {index() === nav.depthFocus(0) ? "❯" : " "} + + + {cat.name} + + + ); + }} ); @@ -188,9 +193,10 @@ function DiscoverPage() { {(cat, index) => { const lf = () => focusedCatIdx(); - const selected = () => cat.id === discoverStore.selectedCategory(); + const ref = useScrollIntoView(() => index() === lf()); return ( {cat.name} - - - * - - ); }} @@ -229,8 +230,10 @@ function DiscoverPage() { {(podcast, index) => { const lf = () => focusedPodIdx(); + const ref = useScrollIntoView(() => index() === lf()); return ( depth() === 0 ? ( - // depth 0 preview: hovered category + // depth 0 preview: shows for the hovered category {(cat) => ( - + {cat().name} - - {(cat() as any).description ?? - `Browse top podcasts in ${cat().name}.`} - + + {(cat() as any).description} + - enter/l: open · h: back + 0} + fallback={ + + No shows in this category yet. :refresh + + } + > + + {(pod) => ( + + {pod.title} + + + by {pod.author} + + + + )} + + )} @@ -347,7 +369,7 @@ function DiscoverPage() { ); return ( - ` (the shared parent|current|preview + * Renders entirely through `` (the shared parent|current|preview * primitive). `l`/Enter plays the focused episode; `h` pops back to the tab * root. j/k move only within the current column. The Shell router drives * everything over `nav.action`; this page only handles list/preview data. @@ -35,8 +35,9 @@ import type { KeybindActionName } from "@/context/KeybindContext"; import type { Episode } from "@/types/episode"; import type { Feed } from "@/types/feed"; import { LoadingIndicator } from "@/components/LoadingIndicator"; -import { YaziPaneRow } from "@/components/YaziPaneRow"; +import { PaneRow } from "@/components/PaneRow"; import { TabListPane } from "@/components/TabPanel"; +import { useScrollIntoView } from "@/hooks/useScrollIntoView"; export const FeedPaneCount = 1; @@ -187,8 +188,10 @@ function FeedPage() { {(item, index) => { const fi = () => focusedEpIdx(); + const ref = useScrollIntoView(() => index() === fi()); return ( `; no bespoke 3-column flexbox JSX + * Renders entirely through ``; no bespoke 3-column flexbox JSX * remains. `l`/Enter drills in (show → episodes); `h` pops a depth (noop at * 0). j/k move only within the current column. */ @@ -31,8 +31,9 @@ import type { KeybindActionName } from "@/context/KeybindContext"; import type { Episode } from "@/types/episode"; import type { Feed } from "@/types/feed"; import { LoadingIndicator } from "@/components/LoadingIndicator"; -import { YaziPaneRow } from "@/components/YaziPaneRow"; +import { PaneRow } from "@/components/PaneRow"; import { TabListPane } from "@/components/TabPanel"; +import { useScrollIntoView } from "@/hooks/useScrollIntoView"; export const MyShowsPaneCount = 1; @@ -164,6 +165,16 @@ export function MyShowsPage() { const show = selectedShow(); if (show) feedStore.refreshFeed(show.id).catch(() => {}); }, + unsubscribe: () => { + if (depth() !== 0) return; + const show = selectedShow(); + if (show) { + // unsubscribe = remove feed + purge its downloaded files + feedStore.removeFeed(show.id); + downloadStore.removeDownloadsForFeed(show.id).catch(() => {}); + ensureFocus(); + } + }, }; function step(delta: number) { nav.move(delta, curLen()); @@ -205,8 +216,10 @@ export function MyShowsPage() { {(feed, index) => { const lf = () => nav.depthFocus(0); + const ref = useScrollIntoView(() => index() === lf()); return ( {(feed, index) => { const lf = () => focusedShowIdx(); + const ref = useScrollIntoView(() => index() === lf()); return ( {(ep, index) => { const lf = () => focusedEpIdx(); + const ref = useScrollIntoView(() => index() === lf()); return ( - enter/l: open · h: back + enter/l: open · h: back · x: unsubscribe )} @@ -408,7 +425,7 @@ export function MyShowsPage() { ); return ( - ); this * page only renders the now-playing surface. `h` at depth 0 returns to the * tab root. @@ -17,7 +17,7 @@ import { useAudio } from "@/hooks/useAudio"; import { useAppStore } from "@/stores/app"; import { useTheme } from "@/context/ThemeContext"; import { useNavigation, DEPTH_CENTER_PANE } from "@/context/NavigationContext"; -import { YaziPaneRow } from "@/components/YaziPaneRow"; +import { PaneRow } from "@/components/PaneRow"; import { TabListPane } from "@/components/TabPanel"; export const PlayerPaneCount = 1; @@ -116,7 +116,7 @@ export function PlayerPage() { ); return ( - {(query, index) => { const lf = () => focus(0); + const ref = useScrollIntoView(() => index() === lf()); return ( {(result, index) => { const fi = () => focusedResultIdx(); + const ref = useScrollIntoView(() => index() === fi()); return ( = 1 << 20) return `${(n / (1 << 20)).toFixed(1)} MB`; + if (n >= 1 << 10) return `${(n / (1 << 10)).toFixed(0)} KB`; + return `${n} B`; +} + +/** Short status badge for an episode download. */ +function statusLabel(s: DownloadStatus): string { + switch (s) { + case DownloadStatus.QUEUED: + return "queued"; + case DownloadStatus.DOWNLOADING: + return "downloading"; + case DownloadStatus.COMPLETED: + return "done"; + case DownloadStatus.FAILED: + return "failed"; + default: + return ""; + } +} + +/** Episode title for a download, resolved from the feed store (reactive). */ +function episodeTitle( + feedStore: ReturnType, + d: DownloadedEpisode, +): string { + const feed = feedStore.getFeed(d.feedId); + const ep = feed?.episodes.find((e) => e.id === d.episodeId); + return ep?.title ?? d.episodeId; +} + +/** Show title for a download's feed id. */ +function feedTitle( + feedStore: ReturnType, + feedId: string, +): string { + const feed = feedStore.getFeed(feedId); + return feed ? feed.customName || feed.podcast.title : feedId; +} + +export function useDownloadItems(): SettingItem[] { + const downloadStore = useDownloadStore(); + const feedStore = useFeedStore(); + + const downloads = () => downloadStore.getAllDownloads(); + + const items: SettingItem[] = [ + { + id: "clear-all", + label: "Delete All Downloads", + kind: "action", + display: () => `${downloads().length} files`, + help: () => + `Delete every downloaded episode (files + metadata) and clear the\nqueue. Enter to run.`, + run: () => { + for (const d of downloads()) { + downloadStore.cancelDownload(d.episodeId); + downloadStore.removeDownload(d.episodeId).catch(() => {}); + } + }, + }, + ]; + + // Group downloads by feed so each show gets a delete-by-show item. + const byFeed = new Map(); + for (const d of downloads()) { + const arr = byFeed.get(d.feedId) ?? []; + arr.push(d); + byFeed.set(d.feedId, arr); + } + for (const [feedId, eps] of byFeed) { + const size = eps.reduce((s, e) => s + e.fileSize, 0); + items.push({ + id: `feed:${feedId}`, + label: `Show: ${feedTitle(feedStore, feedId)}`, + kind: "action", + display: () => `${eps.length} · ${fmtBytes(size)}`, + help: () => + `Delete all ${eps.length} downloads for this show (files + metadata,\naborts any in-flight transfers). Enter to run.`, + run: () => { + downloadStore.removeDownloadsForFeed(feedId).catch(() => {}); + }, + }); + } + + // One item per individual episode download. + for (const d of downloads()) { + items.push({ + id: `ep:${d.episodeId}`, + label: episodeTitle(feedStore, d), + kind: "action", + display: () => + `${feedTitle(feedStore, d.feedId)} · ${statusLabel(d.status)} · ${fmtBytes(d.fileSize)}`, + help: () => + `Delete this single download (file + metadata). Enter to run.`, + run: () => { + downloadStore.removeDownload(d.episodeId).catch(() => {}); + }, + }); + } + + return items; +} diff --git a/src/pages/Settings/SettingsPage.tsx b/src/pages/Settings/SettingsPage.tsx index ad1e038..6c11872 100644 --- a/src/pages/Settings/SettingsPage.tsx +++ b/src/pages/Settings/SettingsPage.tsx @@ -5,7 +5,7 @@ * depth 1 — the focused section's items as a navigable list * depth 2 — per-item editor (for editor-kind items) or value adjuster * - * Renders entirely through `` (parent | current | preview): + * Renders entirely through `` (parent | current | preview): * parent = previous depth's list (sections at depth 1, items at depth 2); * blank placeholder at depth 0 (1/7 slot kept). * current = the current-depth list (or editor at depth 2); the only @@ -33,8 +33,10 @@ import { usePreferencesItems } from "./PreferencesPanel"; import { useVisualizerItems } from "./VisualizerSettings"; import { useSyncItems, closeSyncEditor } from "./SyncPanel"; import { useSourceItems } from "./SourceManager"; -import { YaziPaneRow } from "@/components/YaziPaneRow"; +import { useDownloadItems } from "./DownloadManager"; +import { PaneRow } from "@/components/PaneRow"; import { TabListPane } from "@/components/TabPanel"; +import { useScrollIntoView } from "@/hooks/useScrollIntoView"; export const SettingsPaneCount = 1; @@ -64,6 +66,11 @@ const SECTIONS: SettingsSectionDef[] = [ label: "Account", description: "Account login & OAuth (not yet implemented).", }, + { + id: 5, + label: "Downloads", + description: "Manage downloaded episodes — delete by show or individually.", + }, ]; /** Resolve the items for a section id at render time. Section 4 (Account) has @@ -78,6 +85,8 @@ function sectionItems(sectionId: number): SettingItem[] { return usePreferencesItems(); case 3: return useVisualizerItems(); + case 5: + return useDownloadItems(); default: return []; } @@ -377,7 +386,7 @@ export function SettingsPage() { ); return ( - (props.focused && props.active ? theme.surface : theme.text); + const ref = useScrollIntoView(() => props.focused); return ( >(new Map()) - const [queue, setQueue] = createSignal([]) - const [activeCount, setActiveCount] = createSignal(0) + const [downloads, setDownloads] = createSignal< + Map + >(new Map()); + const [queue, setQueue] = createSignal([]); + const [activeCount, setActiveCount] = createSignal(0); - /** Active AbortControllers keyed by episodeId */ - const abortControllers = new Map() + /** Active AbortControllers keyed by episodeId */ + const abortControllers = new Map(); - // Load persisted downloads on init - ;(async () => { - const loaded = await loadDownloads() - if (loaded.size > 0) setDownloads(loaded) - // Resume any queued downloads from previous session - resumeIncomplete() - })() + // Load persisted downloads on init + (async () => { + const loaded = await loadDownloads(); + if (loaded.size > 0) setDownloads(loaded); + // Resume any queued downloads from previous session + resumeIncomplete(); + })(); - /** Load downloads from JSON file */ - async function loadDownloads(): Promise> { - try { - const filePath = getConfigFilePath(DOWNLOADS_FILE) - const file = Bun.file(filePath) - if (!(await file.exists())) return new Map() + /** Load downloads from JSON file */ + async function loadDownloads(): Promise> { + try { + const filePath = getConfigFilePath(DOWNLOADS_FILE); + const file = Bun.file(filePath); + if (!(await file.exists())) return new Map(); - const raw: DownloadRecord[] = await file.json() - if (!Array.isArray(raw)) return new Map() + const raw: DownloadRecord[] = await file.json(); + if (!Array.isArray(raw)) return new Map(); - const map = new Map() - for (const rec of raw) { - map.set(rec.episodeId, { - episodeId: rec.episodeId, - feedId: rec.feedId, - status: rec.status === DownloadStatus.DOWNLOADING ? DownloadStatus.QUEUED : rec.status, - progress: rec.status === DownloadStatus.COMPLETED ? 100 : 0, - filePath: rec.filePath, - downloadedAt: rec.downloadedAt ? new Date(rec.downloadedAt) : null, - speed: 0, - fileSize: rec.fileSize, - error: rec.error, - }) - } - return map - } catch { - return new Map() - } - } + const map = new Map(); + for (const rec of raw) { + map.set(rec.episodeId, { + episodeId: rec.episodeId, + feedId: rec.feedId, + status: + rec.status === DownloadStatus.DOWNLOADING + ? DownloadStatus.QUEUED + : rec.status, + progress: rec.status === DownloadStatus.COMPLETED ? 100 : 0, + filePath: rec.filePath, + downloadedAt: rec.downloadedAt ? new Date(rec.downloadedAt) : null, + speed: 0, + fileSize: rec.fileSize, + error: rec.error, + }); + } + return map; + } catch { + return new Map(); + } + } - /** Persist downloads to JSON file */ - async function saveDownloads(): Promise { - try { - await ensureConfigDir() - await backupConfigFile(DOWNLOADS_FILE) - const map = downloads() - const records: DownloadRecord[] = [] - for (const [, dl] of map) { - // Find the audioUrl from queue or use empty string - const qItem = queue().find((q) => q.episodeId === dl.episodeId) - records.push({ - episodeId: dl.episodeId, - feedId: dl.feedId, - status: dl.status, - filePath: dl.filePath, - downloadedAt: dl.downloadedAt?.toISOString() ?? null, - fileSize: dl.fileSize, - error: dl.error, - audioUrl: qItem?.audioUrl ?? "", - episodeTitle: qItem?.episodeTitle ?? "", - }) - } - const filePath = getConfigFilePath(DOWNLOADS_FILE) - await Bun.write(filePath, JSON.stringify(records, null, 2)) - } catch { - // Silently ignore write errors - } - } + /** Persist downloads to JSON file */ + async function saveDownloads(): Promise { + try { + await ensureConfigDir(); + await backupConfigFile(DOWNLOADS_FILE); + const map = downloads(); + const records: DownloadRecord[] = []; + for (const [, dl] of map) { + // Find the audioUrl from queue or use empty string + const qItem = queue().find((q) => q.episodeId === dl.episodeId); + records.push({ + episodeId: dl.episodeId, + feedId: dl.feedId, + status: dl.status, + filePath: dl.filePath, + downloadedAt: dl.downloadedAt?.toISOString() ?? null, + fileSize: dl.fileSize, + error: dl.error, + audioUrl: qItem?.audioUrl ?? "", + episodeTitle: qItem?.episodeTitle ?? "", + }); + } + const filePath = getConfigFilePath(DOWNLOADS_FILE); + await Bun.write(filePath, JSON.stringify(records, null, 2)); + } catch { + // Silently ignore write errors + } + } - /** Resume incomplete downloads from a previous session */ - function resumeIncomplete(): void { - const map = downloads() - for (const [, dl] of map) { - if (dl.status === DownloadStatus.QUEUED) { - // Re-queue — but we lack audioUrl from persistence alone. - // These will sit as QUEUED until the user re-triggers them. - } - } - } + /** Resume incomplete downloads from a previous session */ + function resumeIncomplete(): void { + const map = downloads(); + for (const [, dl] of map) { + if (dl.status === DownloadStatus.QUEUED) { + // Re-queue — but we lack audioUrl from persistence alone. + // These will sit as QUEUED until the user re-triggers them. + } + } + } - /** Update a single download entry and trigger reactivity */ - function updateDownload(episodeId: string, updates: Partial): void { - setDownloads((prev) => { - const next = new Map(prev) - const existing = next.get(episodeId) - if (existing) { - next.set(episodeId, { ...existing, ...updates }) - } - return next - }) - } + /** Update a single download entry and trigger reactivity */ + function updateDownload( + episodeId: string, + updates: Partial, + ): void { + setDownloads((prev) => { + const next = new Map(prev); + const existing = next.get(episodeId); + if (existing) { + next.set(episodeId, { ...existing, ...updates }); + } + return next; + }); + } - /** Process the download queue — starts downloads up to MAX_CONCURRENT */ - function processQueue(): void { - const current = activeCount() - const q = queue() + /** Process the download queue — starts downloads up to MAX_CONCURRENT */ + function processQueue(): void { + const current = activeCount(); + const q = queue(); - if (current >= MAX_CONCURRENT || q.length === 0) return + if (current >= MAX_CONCURRENT || q.length === 0) return; - const slotsAvailable = MAX_CONCURRENT - current - const toStart = q.slice(0, slotsAvailable) + const slotsAvailable = MAX_CONCURRENT - current; + const toStart = q.slice(0, slotsAvailable); - // Remove started items from queue - if (toStart.length > 0) { - setQueue((prev) => prev.slice(toStart.length)) - } + // Remove started items from queue + if (toStart.length > 0) { + setQueue((prev) => prev.slice(toStart.length)); + } - for (const item of toStart) { - executeDownload(item) - } - } + for (const item of toStart) { + executeDownload(item); + } + } - /** Execute a single download */ - async function executeDownload(item: QueueItem): Promise { - const controller = new AbortController() - abortControllers.set(item.episodeId, controller) - setActiveCount((c) => c + 1) + /** Execute a single download */ + async function executeDownload(item: QueueItem): Promise { + const controller = new AbortController(); + abortControllers.set(item.episodeId, controller); + setActiveCount((c) => c + 1); - updateDownload(item.episodeId, { - status: DownloadStatus.DOWNLOADING, - progress: 0, - speed: 0, - error: null, - }) + updateDownload(item.episodeId, { + status: DownloadStatus.DOWNLOADING, + progress: 0, + speed: 0, + error: null, + }); - const result = await downloadEpisode( - item.audioUrl, - item.episodeTitle, - item.feedId, - (progress) => { - updateDownload(item.episodeId, { - progress: progress.percent >= 0 ? progress.percent : 0, - speed: progress.speed, - fileSize: progress.totalBytes, - }) - }, - controller.signal, - ) + const result = await downloadEpisode( + item.audioUrl, + item.episodeTitle, + item.feedId, + (progress) => { + updateDownload(item.episodeId, { + progress: progress.percent >= 0 ? progress.percent : 0, + speed: progress.speed, + fileSize: progress.totalBytes, + }); + }, + controller.signal, + ); - abortControllers.delete(item.episodeId) - setActiveCount((c) => Math.max(0, c - 1)) + abortControllers.delete(item.episodeId); + setActiveCount((c) => Math.max(0, c - 1)); - if (result.success) { - updateDownload(item.episodeId, { - status: DownloadStatus.COMPLETED, - progress: 100, - filePath: result.filePath, - fileSize: result.fileSize, - downloadedAt: new Date(), - speed: 0, - error: null, - }) - } else { - updateDownload(item.episodeId, { - status: DownloadStatus.FAILED, - speed: 0, - error: result.error ?? "Unknown error", - }) - } + if (result.success) { + updateDownload(item.episodeId, { + status: DownloadStatus.COMPLETED, + progress: 100, + filePath: result.filePath, + fileSize: result.fileSize, + downloadedAt: new Date(), + speed: 0, + error: null, + }); + } else { + updateDownload(item.episodeId, { + status: DownloadStatus.FAILED, + speed: 0, + error: result.error ?? "Unknown error", + }); + } - saveDownloads().catch(() => {}) - // Process next items in queue - processQueue() - } + saveDownloads().catch(() => {}); + // Process next items in queue + processQueue(); + } - /** Get download status for an episode */ - const getDownloadStatus = (episodeId: string): DownloadStatus => { - return downloads().get(episodeId)?.status ?? DownloadStatus.NONE - } + /** Get download status for an episode */ + const getDownloadStatus = (episodeId: string): DownloadStatus => { + return downloads().get(episodeId)?.status ?? DownloadStatus.NONE; + }; - /** Get download progress for an episode (0-100) */ - const getDownloadProgress = (episodeId: string): number => { - return downloads().get(episodeId)?.progress ?? 0 - } + /** Get download progress for an episode (0-100) */ + const getDownloadProgress = (episodeId: string): number => { + return downloads().get(episodeId)?.progress ?? 0; + }; - /** Get full download info for an episode */ - const getDownload = (episodeId: string): DownloadedEpisode | undefined => { - return downloads().get(episodeId) - } + /** Get full download info for an episode */ + const getDownload = (episodeId: string): DownloadedEpisode | undefined => { + return downloads().get(episodeId); + }; - /** Get the local file path for a completed download */ - const getDownloadedFilePath = (episodeId: string): string | null => { - const dl = downloads().get(episodeId) - if (dl?.status === DownloadStatus.COMPLETED && dl.filePath) { - return dl.filePath - } - return null - } + /** Get the local file path for a completed download */ + const getDownloadedFilePath = (episodeId: string): string | null => { + const dl = downloads().get(episodeId); + if (dl?.status === DownloadStatus.COMPLETED && dl.filePath) { + return dl.filePath; + } + return null; + }; - /** Start downloading an episode */ - const startDownload = (episode: Episode, feedId: string): void => { - const existing = downloads().get(episode.id) - if (existing?.status === DownloadStatus.DOWNLOADING || existing?.status === DownloadStatus.QUEUED) { - return // Already downloading or queued - } + /** Start downloading an episode */ + const startDownload = (episode: Episode, feedId: string): void => { + const existing = downloads().get(episode.id); + if ( + existing?.status === DownloadStatus.DOWNLOADING || + existing?.status === DownloadStatus.QUEUED + ) { + return; // Already downloading or queued + } - // Create download entry - const entry: DownloadedEpisode = { - episodeId: episode.id, - feedId, - status: DownloadStatus.QUEUED, - progress: 0, - filePath: null, - downloadedAt: null, - speed: 0, - fileSize: episode.fileSize ?? 0, - error: null, - } + // Create download entry + const entry: DownloadedEpisode = { + episodeId: episode.id, + feedId, + status: DownloadStatus.QUEUED, + progress: 0, + filePath: null, + downloadedAt: null, + speed: 0, + fileSize: episode.fileSize ?? 0, + error: null, + }; - setDownloads((prev) => { - const next = new Map(prev) - next.set(episode.id, entry) - return next - }) + setDownloads((prev) => { + const next = new Map(prev); + next.set(episode.id, entry); + return next; + }); - // Add to queue - const queueItem: QueueItem = { - episodeId: episode.id, - feedId, - audioUrl: episode.audioUrl, - episodeTitle: episode.title, - } - setQueue((prev) => [...prev, queueItem]) + // Add to queue + const queueItem: QueueItem = { + episodeId: episode.id, + feedId, + audioUrl: episode.audioUrl, + episodeTitle: episode.title, + }; + setQueue((prev) => [...prev, queueItem]); - saveDownloads().catch(() => {}) - processQueue() - } + saveDownloads().catch(() => {}); + processQueue(); + }; - /** Cancel a download */ - const cancelDownload = (episodeId: string): void => { - // Abort active download - const controller = abortControllers.get(episodeId) - if (controller) { - controller.abort() - abortControllers.delete(episodeId) - } + /** Cancel a download */ + const cancelDownload = (episodeId: string): void => { + // Abort active download + const controller = abortControllers.get(episodeId); + if (controller) { + controller.abort(); + abortControllers.delete(episodeId); + } - // Remove from queue - setQueue((prev) => prev.filter((q) => q.episodeId !== episodeId)) + // Remove from queue + setQueue((prev) => prev.filter((q) => q.episodeId !== episodeId)); - // Update status - updateDownload(episodeId, { - status: DownloadStatus.NONE, - progress: 0, - speed: 0, - error: null, - }) + // Update status + updateDownload(episodeId, { + status: DownloadStatus.NONE, + progress: 0, + speed: 0, + error: null, + }); - saveDownloads().catch(() => {}) - } + saveDownloads().catch(() => {}); + }; - /** Remove a completed download (delete file and metadata) */ - const removeDownload = async (episodeId: string): Promise => { - const dl = downloads().get(episodeId) - if (dl?.filePath) { - try { - const { unlink } = await import("fs/promises") - await unlink(dl.filePath) - } catch { - // File may already be gone - } - } + /** Remove a completed download (delete file and metadata) */ + const removeDownload = async (episodeId: string): Promise => { + const dl = downloads().get(episodeId); + if (dl?.filePath) { + try { + const { unlink } = await import("fs/promises"); + await unlink(dl.filePath); + } catch { + // File may already be gone + } + } - setDownloads((prev) => { - const next = new Map(prev) - next.delete(episodeId) - return next - }) + setDownloads((prev) => { + const next = new Map(prev); + next.delete(episodeId); + return next; + }); - saveDownloads().catch(() => {}) - } + saveDownloads().catch(() => {}); + }; - /** Get all downloads as an array */ - const getAllDownloads = (): DownloadedEpisode[] => { - return Array.from(downloads().values()) - } + /** Remove every download (active/queued/completed) belonging to a feed — + * abort in-flight transfers, drop queued items, delete files + metadata. */ + const removeDownloadsForFeed = async (feedId: string): Promise => { + const eps = Array.from(downloads().values()).filter( + (d) => d.feedId === feedId, + ); + for (const d of eps) { + cancelDownload(d.episodeId); + await removeDownload(d.episodeId); + } + }; - /** Get the current queue */ - const getQueue = (): QueueItem[] => { - return queue() - } + /** Get all downloads as an array */ + const getAllDownloads = (): DownloadedEpisode[] => { + return Array.from(downloads().values()); + }; - /** Get count of active downloads */ - const getActiveCount = (): number => { - return activeCount() - } + /** Get the current queue */ + const getQueue = (): QueueItem[] => { + return queue(); + }; - return { - // Getters - getDownloadStatus, - getDownloadProgress, - getDownload, - getDownloadedFilePath, - getAllDownloads, - getQueue, - getActiveCount, + /** Get count of active downloads */ + const getActiveCount = (): number => { + return activeCount(); + }; - // Actions - startDownload, - cancelDownload, - removeDownload, - } + return { + // Getters + getDownloadStatus, + getDownloadProgress, + getDownload, + getDownloadedFilePath, + getAllDownloads, + getQueue, + getActiveCount, + + // Actions + startDownload, + cancelDownload, + removeDownload, + removeDownloadsForFeed, + }; } /** Singleton download store */ -let downloadStoreInstance: ReturnType | null = null +let downloadStoreInstance: ReturnType | null = null; export function useDownloadStore() { - if (!downloadStoreInstance) { - downloadStoreInstance = createDownloadStore() - } - return downloadStoreInstance + if (!downloadStoreInstance) { + downloadStoreInstance = createDownloadStore(); + } + return downloadStoreInstance; } diff --git a/src/utils/dispatch.ts b/src/utils/dispatch.ts index bd50f40..2c03c89 100644 --- a/src/utils/dispatch.ts +++ b/src/utils/dispatch.ts @@ -75,6 +75,7 @@ export const PAGE_ACTIONS: ReadonlySet = "sort", "toggle-hidden", "refresh", + "unsubscribe", ]); /** Resolve a `tab-goto-N` digit action (1..TabsCount) to a TABS value, or null. */ diff --git a/src/utils/keybinds-persistence.ts b/src/utils/keybinds-persistence.ts index 0608d74..54c3500 100644 --- a/src/utils/keybinds-persistence.ts +++ b/src/utils/keybinds-persistence.ts @@ -63,6 +63,7 @@ const DEFAULT_KEYBINDS: KeybindsResolved = { sort: [","], "toggle-hidden": ["."], refresh: ["r"], + unsubscribe: ["x"], // audio transport (preserved; shifted single keys, no collisions) "audio-toggle": ["P"], "audio-next": ["N"], diff --git a/tests/yazi-pane-row.test.tsx b/tests/yazi-pane-row.test.tsx index 2c8013d..e2f124d 100644 --- a/tests/yazi-pane-row.test.tsx +++ b/tests/yazi-pane-row.test.tsx @@ -1,5 +1,5 @@ /** - * YaziPaneRow tests — the 1:3:3 parent|current|preview layout primitive. + * PaneRow tests — the 1:3:3 parent|current|preview layout primitive. * * Verified through the opentui test renderer's captured frames (the same * mechanism the `.harness` drive uses), since `flexGrow` ratios are only @@ -19,7 +19,7 @@ import { describe, test, expect, afterAll } from "bun:test"; import { testRender } from "@opentui/solid"; import { ThemeProvider } from "../src/context/ThemeContext"; -import { YaziPaneRow } from "../src/components/YaziPaneRow"; +import { PaneRow } from "../src/components/PaneRow"; type Span = { text: string; fg: { buffer: ArrayLike } | null }; type Frame = { lines: { spans: Span[] }[] }; @@ -88,7 +88,7 @@ async function renderPaneRow(props: TestPaneProps): Promise<{ const setup = await testRender( () => ( - { }); // ── Unit: three columns at 1:3:3 regardless of null children ─────────────── -describe("YaziPaneRow layout", () => { +describe("PaneRow layout", () => { test("renders three columns at 1:3:3 even with null parent/preview", async () => { const { spans, destroy } = await renderPaneRow({ parent: null, @@ -172,7 +172,7 @@ describe("YaziPaneRow layout", () => { }); // ── Integration: focused toggles the accent ring on the current column ───── -describe("YaziPaneRow focus ring", () => { +describe("PaneRow focus ring", () => { test("focused=true puts the accent border on current; parent/preview stay muted", async () => { const { spans, destroy } = await renderPaneRow({ parent: null,