fix: expose isLoading state initialization in KindeProvider
Explain your changes
KindeProvider.tsxnow setsisLoadingtotrueas soon aslogin,register, orlogoutare invoked, so apps can treat that flag as “Kinde is busy” and delay their own redirects until the SDK finishes.- Wrapped the login flow in a
try/catch, added anERR_LOGINcallback path, and ensure every popup failure or setup error resetsisLoadingback tofalse. - Registration flow mirrors the same behavior:
isLoadingflips on at invocation and drops back tofalseif popup launch or URL generation fails. - Logout now keeps
isLoadingtrue throughout token clearing and redirect, avoiding premature consumer redirects while Kinde completes logout; only real failures clear the loading flag.
Checklist
- [x] I have read the “Pull requests” section in the contributing guidelines.
- [x] I agree to the terms within the code of conduct.
🛟 If you need help, consider asking for advice over in the Kinde community.
Walkthrough
Added forceChildrenRender?: boolean to KindeProvider, introduced initStarted, contextRef, and setLoading() to manage global isLoading and conditional child rendering; callbacks now use contextRef.current. Tests were rewritten with rich mocks and a TestConsumer to validate loading and render behavior.
Changes
| Cohort / File(s) | Summary |
|---|---|
Provider: loading & context ref src/state/KindeProvider.tsx |
Added forceChildrenRender?: boolean; introduced initStarted state, contextRef, and setLoading() helper; updated initialization and rendering to consider forceChildrenRender and initStarted; replaced direct context reads in callbacks with contextRef.current; login/register/logout flows call setLoading(true) at start and restore on completion/error; added memoized mergedCallbacks and adjusted dependency arrays. |
Tests: mocks, consumer & coverage src/state/KindeProvider.test.tsx |
Rewrote tests to use rich mocks for @kinde/js-utils (MemoryStorage/LocalStorage and mocked API functions), added TestConsumer to surface context and trigger login, configured extensive beforeEach/teardown including window.location stubbing, and expanded test cases covering redirect defaults, init/loading states, forceChildrenRender behavior, and isLoading transitions. |
Sequence Diagram(s)
sequenceDiagram
participant Consumer as TestConsumer (Client)
participant Provider as KindeProvider
participant Auth as `@kinde/js-utils` (Auth)
participant Browser as Browser (window.location)
Consumer->>Provider: read context / call login()
Provider->>Provider: setLoading(true) (initStarted when forceChildrenRender)
Provider->>Auth: generateAuthUrl / navigateToKinde / exchangeAuthCode
Auth-->>Provider: return url / token or error
Provider->>Browser: navigate (redirect) or handle popup flow
Provider->>Provider: invoke onSuccess/onError via contextRef.current
Provider->>Provider: setLoading(false)
Provider-->>Consumer: context updated (isLoading changes / children render)
Estimated code review effort
🎯 4 (Complex) | ⏱️ ~45 minutes
- Inspect
contextRefusage for stale-closure or race conditions in async callbacks (src/state/KindeProvider.tsx). - Verify
setLoading()interactions withforceChildrenRender,initStarted, and anyinitRefto ensure consistent rendering and state transitions. - Confirm all error paths (token exchange, popup errors, navigation failures) clear loading and propagate callbacks.
- Review dependency arrays and
useMemoformergedCallbacksto avoid missed updates. - Validate tests/mocks accurately emulate
@kinde/js-utilsbehaviors and that assertions reflect intended loading/render semantics.
Pre-merge checks and finishing touches
✅ Passed checks (3 passed)
| Check name | Status | Explanation |
|---|---|---|
| Title check | ✅ Passed | The title accurately describes the main change—exposing the isLoading state during initialization in KindeProvider—which aligns with the core objective of making isLoading observable when forceChildrenRender is enabled. |
| Description check | ✅ Passed | The description is directly related to the changeset, explaining the problem statement, solution approach, implementation details, and verification steps relevant to the code modifications. |
| Docstring Coverage | ✅ Passed | No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. |
✨ Finishing touches
- [ ] 📝 Generate docstrings
🧪 Generate unit tests (beta)
- [ ] Create PR with unit tests
- [ ] Post copyable unit tests in a comment
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.
Comment @coderabbitai help to get the list of available commands and usage tips.
@dtoxvanilla1991 - Why is this not merged yet?
@dtoxvanilla1991 - Why is this not merged yet? @samirpdl
Had to be reviewed, primarily. Was reviewed earlier today, so hopefully within next few days.