feat(app): set up PostHog for events data collection

src/background/services/background.ts

@@ -158,14 +158,19 @@ export class Background {
   }
 
   async getAppData(): Promise<AppStore> {
-    const { connected, publicKey, consent } = await this.storage.get([
-      'connected',
-      'publicKey',
-      'consent',
-    ]);
+    const { connected, publicKey, uid, consent, consentTelemetry } =
+      await this.storage.get([
+        'connected',
+        'publicKey',
+        'consent',
+        'uid',
+        'consentTelemetry',
+      ]);
 
     return {
+      uid,
       consent,
+      consentTelemetry,
       connected,
       publicKey,
       transientState: this.storage.getPopupTransientState(),

src/pages/app/lib/context.tsx

@@ -5,21 +5,30 @@ import {
   MessageManager,
   type AppToBackgroundMessage,
 } from '@/shared/messages';
-import { useBrowser } from '@/pages/shared/lib/context';
+import {
+  TelemetryContextProvider,
+  useBrowser,
+} from '@/pages/shared/lib/context';
 import { dispatch } from './store';
 
 export { useBrowser, useTranslation } from '@/pages/shared/lib/context';
 
 export function WaitForStateLoad({ children }: React.PropsWithChildren) {
   const message = useMessage();
   const [isLoading, setIsLoading] = React.useState(true);
+  const [telemetryConfig, setTelemetryConfig] = React.useState<{
+    uid: string;
+    isOptedIn?: boolean;
+  }>({ uid: '' });
 
   React.useEffect(() => {
     async function get() {
       const response = await message.send('GET_DATA_APP');
 
       if (response.success) {
-        void dispatch({ type: 'SET_DATA_APP', data: response.payload });
+        const data = response.payload;
+        dispatch({ type: 'SET_DATA_APP', data });
+        setTelemetryConfig({ uid: data.uid, isOptedIn: data.consentTelemetry });
         setIsLoading(false);
       }
     }
@@ -31,7 +40,11 @@ export function WaitForStateLoad({ children }: React.PropsWithChildren) {
     return 'Loading';
   }
 
-  return <>{children}</>;
+  return (
+    <TelemetryContextProvider {...telemetryConfig}>
+      {children}
+    </TelemetryContextProvider>
+  );
 }
 
 const MessageContext = React.createContext<

src/pages/app/lib/store.ts

@@ -14,7 +14,7 @@ export const store = proxy<AppState>({
 // easier access to the store via this hook
 export const useAppState = () => useSnapshot(store);
 
-export const dispatch = async ({ type, data }: Actions) => {
+export const dispatch = ({ type, data }: Actions) => {
   switch (type) {
     case 'SET_DATA_APP':
       for (const key of Object.keys(data) as Array<keyof AppState>) {

src/shared/types.ts

@@ -172,7 +172,7 @@ export type PopupStore = Omit<
 
 export type AppStore = Pick<
   Storage,
-  'publicKey' | 'connected' | 'consent' | 'consentTelemetry'
+  'publicKey' | 'connected' | 'uid' | 'consent' | 'consentTelemetry'
 > & {
   transientState: PopupTransientState;
 };