YPE-1565: Show error when YouVersionProvider has no appKey#264
Merged
Conversation
Render a styled "Missing app key" message instead of a blank page; hooks provider throws for hooks-only consumers. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
🦋 Changeset detectedLatest commit: 434e9fe The changes in this PR will be included in the next version bump. This PR includes changesets to release 4 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
role="alert" already implies aria-live="assertive"; the explicit polite value downgraded announcement urgency for a config error. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
cameronapak
commented
Jun 23, 2026
- Remove redundant `missingAppKey*` translation keys - Reuse generic `errorHeading` and `invalidAppKeyError` strings - Add a `console.error` in `YouVersionProvider` for developers
The previous commit reused errorHeading/invalidAppKeyError and moved the actionable developer guidance to console.error. Update the assertions to match: expect "Error" instead of "Missing app key", and verify the console.error guidance fires. Also refresh the guard comment to reflect that the panel is intentionally generic. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Collaborator
Author
|
@Dustin-Kelley can you review this? I'm no longer adding new strings to this and re-using old ones P.S. I'll learn the new strings process and share that with you soon |
Splits YouVersionProvider so the missing-appKey throw lives in a thin wrapper and the hook-bearing implementation runs in an inner component. The inner component is never entered with an invalid key, so a mounted provider transitioning between valid and empty appKey can't produce an inconsistent hook count. Addresses Greptile P1 review feedback. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Dustin-Kelley
previously approved these changes
Jul 2, 2026
Move the console.error out of the render body so the developer guidance is emitted once per state change instead of on every re-render and twice under React Strict Mode. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
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 free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 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.
Empty/missing
appKeyrendered a blank page. Now: UI provider shows a styled "Missing app key" message; hooks provider throws.MissingAppKeypanel + Storybook storyYPE-1565
🤖 Generated with Claude Code
Greptile Summary
This PR surfaces a clear error when
YouVersionProvideris given a missing or emptyappKey, replacing the previous blank-page failure mode. The UI package renders a styledMissingAppKeypanel with i18n support, while the hooks package throws a descriptive error (for hooks-only consumers who own their own error boundary).YouVersionProviderwrapper (validatesappKey, throws if invalid) and an innerYouVersionProviderInnerthat owns all hook calls, keeping hook order consistent across renders regardless of key validity.console.errorfrom an effect (avoiding Strict Mode double-calls), and renders theMissingAppKeypanel withYvStylesscoped styles and properrole="alert"semantics.Confidence Score: 5/5
Safe to merge. The two-layer guard (styled panel in UI, throw in hooks) is correctly implemented, hook order is preserved by the wrapper/inner split, and all three invalid-key variants are covered by tests.
The wrapper/inner split cleanly separates the validation logic from hook-bearing code, the UI provider calls hooks unconditionally before any conditional return, and the console.error is deferred to an effect to avoid Strict Mode duplication. No logic defects were found in the changed paths.
No files require special attention.
Important Files Changed
missingAppKeyguard with auseEffect-based console.error (avoids Strict Mode duplication) and rendersMissingAppKeypanel withresolveThemebefore ever reaching the base provider.role="alert"semantics (no overridingaria-live), i18n via react-i18next, and scoped Tailwind classes. Usesdata-yv-themefor theming.it.eachtests covering undefined, empty string, and whitespace-only appKey cases; each verifies the correct throw message.role="alert"presence, error heading text, child suppression, andconsole.errorcall withappKeysubstring for all three invalid-key variants.role="alert", heading, and body text.VITE_YVP_APP_KEY, passingundefinedfrom an unset env var as''at the prop boundary so the provider guard triggers correctly.@youversion/platform-react-hooksand@youversion/platform-react-uias minor bumps; description is accurate.Reviews (10): Last reviewed commit: "refactor(ui): log missing-appKey guidanc..." | Re-trigger Greptile