wip

packages/sdks/nextjs/index.tsx

@@ -1,18 +1,16 @@
 // adding .js next/script import fixes an issues
 // with esm and nextjs (when using pages dir)
 import Script from 'next/script.js';
-import React from 'react';
 
 import type {
-  DecrementPayload,
   IdentifyPayload,
-  IncrementPayload,
   OpenPanelMethodNames,
   OpenPanelOptions,
-  TrackProperties,
 } from '@openpanel/web';
+import { ReactiveProfile } from './reactive';
 
 export * from '@openpanel/web';
+export * from './hook';
 
 const CDN_URL = 'https://openpanel.dev/op1.js';
 
@@ -80,6 +78,7 @@ export function OpenPanelComponent({
             .join('\n')}`,
         }}
       />
+      {profileId && <ReactiveProfile profileId={profileId} />}
     </>
   );
 }
@@ -94,6 +93,7 @@ export function IdentifyComponent(props: IdentifyComponentProps) {
           __html: `window.op('identify', ${JSON.stringify(props)});`,
         }}
       />
+      <ReactiveProfile {...props} />
     </>
   );
 }
@@ -109,48 +109,3 @@ export function SetGlobalPropertiesComponent(props: Record<string, unknown>) {
     </>
   );
 }
-
-export function useOpenPanel() {
-  return {
-    track,
-    screenView,
-    identify,
-    increment,
-    decrement,
-    clear,
-    setGlobalProperties,
-  };
-}
-
-function setGlobalProperties(properties: Record<string, unknown>) {
-  window.op?.('setGlobalProperties', properties);
-}
-
-function track(name: string, properties?: TrackProperties) {
-  window.op?.('track', name, properties);
-}
-
-function screenView(properties?: TrackProperties): void;
-function screenView(path: string, properties?: TrackProperties): void;
-function screenView(
-  pathOrProperties?: string | TrackProperties,
-  propertiesOrUndefined?: TrackProperties,
-) {
-  window.op?.('screenView', pathOrProperties, propertiesOrUndefined);
-}
-
-function identify(payload: IdentifyPayload) {
-  window.op?.('identify', payload);
-}
-
-function increment(payload: IncrementPayload) {
-  window.op?.('increment', payload);
-}
-
-function decrement(payload: DecrementPayload) {
-  window.op('decrement', payload);
-}
-
-function clear() {
-  window.op?.('clear');
-}