feat: tablets-feed-listing-and-detail
Stacked on MR !1, Built on top of
feat/app-scaffold-and-styling, targeting that branch, diff will auto-clean once !1 is merged
Summary
Implements the Tablets feature end to end, a home preview strip, a full listing screen, and a detail view, backed by the live cdli-tablet/feed endpoint
What's included
Data layer
- TanStack Query for fetching/caching (24h staleTime/gcTime; the feed changes rarely)
fetchTabletsfetches?all=true(527 items), validates the response, and maps the hyphenated API keys (thumbnail-url,blurb-title,full-info) to a clean camelCaseTablettypeuseTablets(list) anduseTablet(single lookup) hooks; one query shared across all screens
Screens
- Home: horizontal strip of the first 8 tablets
- Tablets (View All): full vertical list with loading and error states, centered header
- Tablet detail: hero image, author badge, formatted date, blurb, and the HTML
full-infodescription with tappable links - Offline / error: a reusable
NoConnectionscreen with a Retry button, shown when the feed fails to load
Custom HTML rendering
parseHTML.ts(string -> node tree) +HtmlContent.tsx(tree -> nested<Text>), supporting<i> <b> <a> <sub> <sup> <p> <br> <font>.- chosen over
react-native-render-htmlbecause that library is unmaintained and predates React 19; the CDLI markup is a small, fixed tag set, so a dependency-free renderer is safer long-term
Notes / API quirks handled
- No
idfield yet:urlis used as the list key and detail lookup. A one-line swap toidonce the backend MR lands - Author placeholder:
CDLIuntil the backend adds an author field.
Screenshot & Video
Edited by Shiva Gupta
