rsnext/examples/with-fingerprintjs-pro/components/VisitorDataPresenter.tsx
Ilya Taratukhin a4117c94b0
Adding example with-fingerprintjs-pro for identifying visitors (#37549)
## Documentation / Examples

- [x] Make sure the linting passes by running `pnpm lint`
- [x] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)

Deployed on https://with-fingerprintjs-pro.vercel.app/
2022-06-22 11:48:22 +00:00

38 lines
739 B
TypeScript

import { VisitorData } from '@fingerprintjs/fingerprintjs-pro-react'
function VisitorDataPresenter({
data,
isLoading,
error,
}: {
data?: VisitorData
isLoading?: boolean
error?: Error
}) {
if (error) {
return <p>An error occurred: {error.message}</p>
}
return (
<div className="visitor-data">
<p>
<b>Visitor ID:</b>{' '}
{isLoading
? 'Loading...'
: data
? data.visitorId
: 'not established yet'}
</p>
{data && (
<>
<p>
<b>Full visitor data:</b>
</p>
<pre className="details">{JSON.stringify(data, null, 2)}</pre>
</>
)}
</div>
)
}
export default VisitorDataPresenter