mirror of
https://github.com/hanzoai/insights-js.git
synced 2026-11-03 00:53:53 +00:00
zeekay
e43ab1afe7
Bulk rename across 989 files: - Package names: posthog-js → @hanzo/insights, posthog-node → @hanzo/insights-node, etc. - Repository URLs: posthog/posthog-js → hanzoai/insights-js - Brand names: PostHog → Insights - File renames: 259 reference JSON files, source files, workflow files - Directory rename: eslint-plugin-posthog-js → eslint-plugin-insights Remaining: 8 refs to @posthog/rrweb-* (real npm deps, need fork+publish)
78 lines
2.6 KiB
TypeScript
78 lines
2.6 KiB
TypeScript
import { useInsights } from '@insights/react'
|
|
import type { MetaFunction } from '@remix-run/node'
|
|
|
|
export const meta: MetaFunction = () => {
|
|
return [
|
|
{ title: 'Insights Remix Playground' },
|
|
{ name: 'description', content: 'Test Insights integration with Remix' },
|
|
]
|
|
}
|
|
|
|
export default function Index() {
|
|
const insights = useInsights()
|
|
|
|
const handleCustomEvent = () => {
|
|
insights?.capture('custom_button_click', {
|
|
location: 'homepage',
|
|
timestamp: new Date().toISOString(),
|
|
})
|
|
}
|
|
|
|
return (
|
|
<div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.8', padding: '2rem' }}>
|
|
<p>This is a basic Remix application with Insights integration.</p>
|
|
|
|
<div style={{ marginTop: '2rem' }}>
|
|
<h2>Test Insights Events</h2>
|
|
<button
|
|
onClick={handleCustomEvent}
|
|
style={{
|
|
padding: '10px 20px',
|
|
fontSize: '16px',
|
|
backgroundColor: '#007bff',
|
|
color: 'white',
|
|
border: 'none',
|
|
borderRadius: '4px',
|
|
cursor: 'pointer',
|
|
}}
|
|
>
|
|
Send Custom Event
|
|
</button>
|
|
</div>
|
|
|
|
<div style={{ marginTop: '2rem' }}>
|
|
<h2>Features</h2>
|
|
<ul>
|
|
<li>Automatic pageview tracking</li>
|
|
<li>Custom event capture</li>
|
|
<li>Insights React hooks integration</li>
|
|
<li>Multiple example pages</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div style={{ marginTop: '2rem' }}>
|
|
<h2>Example Pages</h2>
|
|
<ul>
|
|
<li>
|
|
<a href="/media">Media</a> - Base64 image testing for session replay
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div style={{ marginTop: '2rem', padding: '1rem', backgroundColor: '#f5f5f5', borderRadius: '4px' }}>
|
|
<h3>Getting Started</h3>
|
|
<ol>
|
|
<li>
|
|
Run <code>pnpm install</code> to install dependencies
|
|
</li>
|
|
<li>
|
|
Run <code>pnpm dev</code> to start the development server
|
|
</li>
|
|
<li>Open the browser console to see Insights events</li>
|
|
<li>Navigate between pages to see pageview tracking</li>
|
|
</ol>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|