feat(app): CanonComparisonScreen (#1550) - #1600
Merged
Merged
Conversation
CraigBuckmasterforce-pushed
the
feature/hwgtb-p3-01-canon-comparison
branch
2 times, most recently
from
April 23, 2026 20:20
5b85122 to
2a04075CompareTest Results✅ All tests passed
Coverage
⏱️ Duration: 86.5s |
CraigBuckmasterforce-pushed
the
feature/hwgtb-p3-01-canon-comparison
branch
from
April 23, 2026 20:28
2a04075 to
f53beb9CompareInteractive side-by-side of the four major canon traditions. The conversion-driving screen for the "How We Got The Bible" bundle — readers see the Protestant, Catholic, Orthodox, and Ethiopian canons next to each other, with book-diff highlighting, founding-council timelines, and tap-through to per-book detail. Files added app/src/db/content/canonTraditions.ts — data access layer (getAllCanonTraditions, getCanonTraditionById, defensive sqlite_master table-exists guard) app/src/hooks/useCanonTraditions.ts — loader + book-membership computation (common vs subset book ids per tradition) app/src/components/CanonColumn.tsx — one tradition's column (header, scrollable book list with per-book tradition badges, expandable distinctives, locked-preview variant for free tier) app/src/screens/CanonComparisonScreen.tsx — the screen app/__tests__/screens/CanonComparisonScreen.test.tsx — 12 tests Files touched app/src/db/content/index.ts — barrel export app/src/types/meta.ts — CanonTradition, CanonListSection, CanonDistinctive, CanonFormationEvent, CanonTraditionRow app/src/navigation/types.ts — CanonComparison, ExtraBiblicalIndex, ExtraBiblicalDetail, BookIntro typed for ExploreStack (ExtraBiblical routes typed ahead for cross-stack consistency with #1596/#1597; BookIntro added so the canon-column book tap can route without cross-tab hops) app/src/navigation/ExploreStack.tsx — CanonComparison + BookIntro Stack.Screen registrations via lazySuspense() Layout — useWindowDimensions() driven (no third-party orientation library, no Dimensions.addEventListener per the issue guidance) Landscape (width > height): horizontal scroll across 4 columns, each 320px wide with vertical book lists Portrait (width <= height): tabs at top, one column visible at a time, tap-to-switch Column rendering Header : tradition label + book count + first 2 formation events Book list : scrollable; section headers (OT / NT / etc.); books in all 4 traditions render in neutral style; books unique to a subset carry gold-tinted tradition-id badges (Prot / Cath / EO / Eth) showing which traditions contain them Distinctives: expandable block at the bottom (2-4 entries from the authored content) Tap biblical book (present in books table) → BookIntro Tap extrabiblical book (not in books table) → ExtraBiblicalDetail (HWGTB-P2-03 / PR #1597) Header Back button + title "Canon Comparison" + right-aligned "How did this happen?" CTA → JourneyDetail journeyId='canon-formation' (HWGTB-P3-02 / #1551 — when the journey lands this activates) Formation timeline footer Expandable; merges all formation_events from all 4 traditions, sorted by year, annotated with the source tradition's label. Renders "{N} events across the four traditions" header. Premium gating Free tier: Protestant + Catholic columns fully visible. Orthodox + Ethiopian columns render header + first 5 rows with a gold "✨ Unlock full canon" CTA that fires showUpgrade('feature', 'Canon Comparison'). Premium tier: all 4 columns fully readable. Portrait tab labels show a 🔒 indicator for gated tabs. How verified npx tsc --noEmit — clean npx eslint (touched files) — 0 warnings npx jest (full suite) — 470 suites / 3486 tests pass 12 new tests cover: - portrait: 4 tradition tabs render, active column renders, tab tap switches visible column - landscape: all 4 columns render simultaneously (no tabs) - header "How did this happen?" CTA + navigation to canon-formation journey - premium gating: free-tier 🔒 on Orthodox/Ethiopian tabs, unlock CTA fires showUpgrade, premium user sees no locks - formation timeline: footer renders event count, expand shows merged events sorted by year with tradition annotations Merge order Depends on #1539 (canon_traditions schema) and #1542 (the 4 seeded traditions). Works against a pre-#1539 DB: the table-exists guard returns [] and the screen shows 'Canon data not yet available' cleanly. Pairs with #1548 (PR #1597 — ExtraBiblicalDetail) for extrabib taps, and #1551 (canon-formation journey) for the header CTA. Follow-up activation When #1598's HowWeGotTheBibleLandingScreen ships alongside this, flip its canonComparisonReady = true constant so the landing entry activates live nav (currently rendered as 'Coming soon'). Closes#1550
The CanonComparison screen registered BookIntroScreen on ExploreStack but the param list didn't declare it, causing TS2322 on navigate calls from CanonComparisonScreen. Adds the route to ExploreStackParamList alongside the existing CanonComparison entry. BookIntro also exists on RootStack; same route on two stacks is fine for React Navigation.
CraigBuckmasterforce-pushed
the
feature/hwgtb-p3-01-canon-comparison
branch
from
April 23, 2026 20:36
f53beb9 to
fd5214aCompareUh oh!
There was an error while loading. Please reload this page.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What this does
Interactive side-by-side of the four major canon traditions — the conversion-driving screen for the "How We Got The Bible" bundle. Readers see the Protestant, Catholic, Orthodox, and Ethiopian canons next to each other, with book-diff highlighting, founding-council timelines, and tap-through to per-book detail.
Closes
Closes#1550
Files added
app/src/db/content/canonTraditions.ts— data access layer with defensivesqlite_mastertable-exists guard (110 LOC)app/src/hooks/useCanonTraditions.ts— loader + book-membership computation (87 LOC)app/src/components/CanonColumn.tsx— one tradition's column, reused in both layouts (395 LOC)app/src/screens/CanonComparisonScreen.tsx— the screen itself (567 LOC)app/__tests__/screens/CanonComparisonScreen.test.tsx— 12 testsFiles touched
app/src/db/content/index.ts— barrel exportapp/src/types/meta.ts—CanonTradition,CanonListSection,CanonDistinctive,CanonFormationEvent,CanonTraditionRowapp/src/navigation/types.ts—CanonComparison,ExtraBiblicalIndex,ExtraBiblicalDetail,BookIntrotyped forExploreStackParamListapp/src/navigation/ExploreStack.tsx—CanonComparison+BookIntroStack.Screenregistrations vialazySuspense()Layout —
useWindowDimensions()drivenPer issue guidance (no third-party orientation lib, no
Dimensions.addEventListener):Column rendering (
CanonColumn.tsx)canon_list[].section); books in all 4 traditions render in neutral style; books unique to a subset carry gold-tinted tradition-id badges (Prot / Cath / EO / Eth) showing which traditions contain thembookstable) →BookIntrobookstable) →ExtraBiblicalDetail(HWGTB-P2-03 / PR feat(app): ExtraBiblicalDetailScreen (#1548) #1597)Header
JourneyDetailwithjourneyId: 'canon-formation'(HWGTB-P3-02 / [HWGTB-P3-02] Content: "Canon Formation" thematic journey (12 stops) #1551 — activates when that journey lands)Formation timeline footer
Expandable; merges all
formation_eventsfrom all 4 traditions, sorted by year, annotated with the source tradition's label. Renders "{N} events across the four traditions" header.Premium gating
showUpgrade('feature', 'Canon Comparison').How I verified
npx tsc --noEmit— clean ✅npx eslinton touched files with--max-warnings 0— 0 warnings ✅npx jest(full suite) — 470 suites / 3486 tests pass ✅Tests (12/12 passing)
Merge order
Depends on:
canon_traditionsmeta table #1539 (canon_traditionsschema — PR feat: add canon_traditions meta table + validator (#1539) #1587) — the screen renders "Canon data not yet available" cleanly against a pre-[HWGTB-P1-02] Schema:canon_traditionsmeta table #1539 DB thanks to the table-exists guardgetAllCanonTraditions()returns[]and the screen shows the same empty statePairs with:
ExtraBiblicalDetailScreen#1548 (PR feat(app): ExtraBiblicalDetailScreen (#1548) #1597 —ExtraBiblicalDetailScreen) — canon-column extrabiblical book taps land hereHowWeGotTheBibleLandingScreen) — when both this and feat(app): Explore hero card + HowWeGotTheBibleLandingScreen (#1549) #1598 merge, flipcanonComparisonReady = truein the landing screen to activate the "Canon Comparison" entry live (currently rendered as "Coming soon")Rollback
Revert this PR.
CanonComparisonroute unregisters;BookIntroroute removal fromExploreStackis additive (still registered inReadStack). TheCanonColumncomponent and query module disappear — no other screen references them.Generated by Claude Code