feat(checkout): add useIdentityVerificationCredentials hook to react and react-native - #2020
Conversation
🦋 Changeset detectedLatest commit: 65d34a0 The changes in this PR will be included in the next version bump. This PR includes changesets to release 7 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 |
bc17d69
into
angel/react-native-identity-verification
Prompt To Fix All With AI### Issue 1
packages/client/ui/react-native/examples.json:75-78
**Documentation mixed with implementation**
These user-facing examples are bundled with the hook implementation, preventing the feature and documentation from being reviewed, reverted, or released independently. Repository policy requires documentation changes to be submitted in a separate pull request; the same pattern also occurs in the React example and the rewritten React Native identity-verification example.
---
For each issue above, determine whether it is valid and should be fixed. If so, fix it directly.Reviews (1): Last reviewed commit: "feat(checkout): add useIdentityVerificat..." | Re-trigger Greptile |
| "useIdentityVerificationCredentials": { | ||
| "code": "import {\n CrossmintIdentityVerification,\n useIdentityVerificationCredentials,\n} from \"@crossmint/client-sdk-react-native-ui\";\n\nfunction VerificationStep() {\n const credentials = useIdentityVerificationCredentials();\n\n if (credentials == null) {\n return null;\n }\n\n return (\n <CrossmintIdentityVerification\n credentials={credentials}\n onComplete={({ status }) => console.log(status)}\n />\n );\n}", | ||
| "language": "tsx" | ||
| }, |
There was a problem hiding this comment.
Documentation mixed with implementation
These user-facing examples are bundled with the hook implementation, preventing the feature and documentation from being reviewed, reverted, or released independently. Repository policy requires documentation changes to be submitted in a separate pull request; the same pattern also occurs in the React example and the rewritten React Native identity-verification example.
Rule Used: Documentation changes should be separated into the... (source)
Learned From
Paella-Labs/crossbit-main#20976
Prompt To Fix With AI
This is a comment left during a code review.
Path: packages/client/ui/react-native/examples.json
Line: 75-78
Comment:
**Documentation mixed with implementation**
These user-facing examples are bundled with the hook implementation, preventing the feature and documentation from being reviewed, reverted, or released independently. Repository policy requires documentation changes to be submitted in a separate pull request; the same pattern also occurs in the React example and the rewritten React Native identity-verification example.
**Rule Used:** Documentation changes should be separated into the... ([source](https://app.greptile.com/crossmint/-/custom-context?memory=ce1a162d-c5de-43f7-a3c8-fc554e479bf6))
**Learned From**
[Paella-Labs/crossbit-main#20976](https://github.com/Paella-Labs/crossbit-main/pull/20976)
---
For each issue above, determine whether it is valid and should be fixed. If so, fix it directly.Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
…#2019) * feat(react-native): add CrossmintIdentityVerification * feat(react-native): export identity verification credentials helper * feat(checkout): accept identityVerificationHandling on react-native * refactor(react-native): drop speculative memo and height reset from identity verification * fix(react-native): enable DOM storage for the identity verification WebView * fix(react-native): report failed identity verification loads through onError * feat(checkout): add useIdentityVerificationCredentials hook to react and react-native (#2020)
Closes ENG4-373
getIdentityVerificationCredentialswas the only camelCase non-hook export in either UI package, so merchants plumbed the order themselves:Each package now has a hook that reads the checkout context, so a merchant writes one line at the single call site where they wire the external-KYC flow:
The plain function stays exported.
react-ui@4.4.0already ships it, and it works on any order object (a server fetch, a webhook payload, the server SDK) where a hook cannot run. The hook calls it.Notes
useCrossmintCheckoutcarries its ownCrossmintCheckoutContextin each, one driven bypostMessageand one bylocalEventEmitter.CrossmintIdentityVerificationdoc example over to the hook, since that example is the call site this is for.useContextplus a pure accessor thatclient-sdk-basealready covers, and the build checks the return type (IdentityVerificationCredentials | undefined).examples.jsonandgenerate-reference.mjsthat feat(react-native): identity verification component and takeover flag #2019 introduces, so a branch offmainwould conflict. GitHub retargets this tomainonce feat(react-native): identity verification component and takeover flag #2019 merges.Verification
pnpm turbo buildon both packages. The hook lands in eachdist/index.d.tsreturningIdentityVerificationCredentials | undefined.pnpm generate:docson both. The generated checkout hooks page includes the hook with its JSDoc description and example.pnpm turbo test:vitestonclient-sdk-base,react-uiandreact-native-ui: 41 tests pass.