chore: add KnockGuideLocationSensor page, plus a few guide edits #1206
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
| #### Key SDK resources | ||
|
|
||
| When working with Knock's SDKs to fetch and render guides, you'll use the following components and hooks: | ||
| When working with Knock's SDKs to fetch and render guides, you'll use the following components and hooks for React: |
There was a problem hiding this comment.
All of these are React specific, so making that clear.
| - [**useGuides**](/in-app-ui/react/sdk/hooks/use-guides). Hook to fetch multiple guides. | ||
| - [**useGuideContext**](/in-app-ui/react/sdk/hooks/use-guide-context). Hook to access the guide client for advanced use cases. | ||
|
|
||
| Follow this [step-by-step example](/in-app-ui/react/headless/guide) to set up the provider and render your guide components in your React application. |
There was a problem hiding this comment.
I think we should link to the code example from this page earlier, per this slack thread discussion.
There was a problem hiding this comment.
I'm taking a look at where we could move this 👍
| <h3>{guide.step.content.title}</h3> | ||
| <p>{guide.step.content.body}</p> | ||
| <h3>{guide.steps[0].content.title}</h3> | ||
| <p>{guide.steps[0].content.body}</p> |
There was a problem hiding this comment.
Aaron from Everlab flagged this: https://knocklabs.slack.com/archives/C099EMLCXFG/p1762320552813749?thread_ts=1762318032.411729&cid=C099EMLCXFG
| trackLocationFromWindow={true} | ||
| > | ||
| <GuideRenderer /> | ||
| <MyGuideComponent /> |
There was a problem hiding this comment.
"GuideRenderer" might sound like something included in the SDK, whereas "MyGuideComponent" communicates something you need to provide.
| @@ -0,0 +1,56 @@ | |||
| A React helper component intended for use with select supported frameworks, such as [Next.js](https://nextjs.org/) and [Tanstack Router](https://tanstack.com/router/), for detecting route changes. | |||
There was a problem hiding this comment.
A new page covering the KnockGuideLocationSensor helper component.
|
@scoti-knock Your edits look great to me, thanks you for that! I cannot approve this PR since it was me that opened it, but if you feel good with it, then we can ship this whenever you have a chance to approve. |
rachael-t
left a comment
rachael-t
left a comment
There was a problem hiding this comment.
Looks good - thank you both for these updates!
thomaswhyyou
deleted the
thomas-kno-10416-doc-fix-useguides-example-code
branch
Description
Add a page to cover
KnockGuideLocationSensor, and a smattering of small edits.Note
Adds docs for KnockGuideLocationSensor (with Next.js/TanStack examples) and updates guides rendering docs with clearer SDK usage, examples, and FAQs.
content/in-app-ui/react/sdk/components/knock-guide-location-sensor.mdxand typedoctypedocs/react-core/components/knock-guide-location-sensor.mdxwith Next.js and TanStack Router usage.data/sidebars/inAppSidebar.ts) to includeKnockGuideLocationSensorunder React components.typedocs/react-core/components/knock-guide-provider.mdxsample usage component name.content/in-app-ui/guides/render-guides.mdx: clearer fetching overview, React-specific key resources, info callout, FAQ clarifications onuseGuidevsuseGuides(ordering/throttling), and example updated toguide.steps[0].content/in-app-ui/react/headless/guide.mdxrecommendingKnockGuideLocationSensorfor Next.js/TanStack Router.Written by Cursor Bugbot for commit 819d92f. This will update automatically on new commits. Configure here.