feat: use localStorage to cache consent in browsers

src/BrowserMetrics.ts

@@ -1,10 +1,15 @@
 import Countly from 'countly-sdk-web'
 
 import MetricsProvider, { MetricsProviderConstructorOptions } from './MetricsProvider.js'
+import { BrowserStorageProvider } from './BrowserStorageProvider.js'
 
 export class BrowserMetricsProvider extends MetricsProvider<typeof Countly> {
   constructor (args: Omit<MetricsProviderConstructorOptions<typeof Countly>, 'metricsService'>) {
-    super({ ...args, metricsService: Countly })
+    super({
+      metricsService: Countly,
+      storageProvider: BrowserStorageProvider,
+      ...args
+    })
   }
 }
 

src/BrowserStorageProvider.ts

@@ -0,0 +1,28 @@
+import type { StorageProvider } from './types/index.js'
+
+export const BrowserStorageProvider: StorageProvider = {
+  setStore: (consentArray) => {
+    try {
+      const jsonString = JSON.stringify(consentArray)
+      window.localStorage.setItem('@ipfs-shipyard/ignite-metrics:consent', jsonString)
+    } catch (err) {
+      // eslint-disable-next-line no-console
+      console.error(err)
+    }
+  },
+  getStore: () => {
+    try {
+      const jsonString = window.localStorage.getItem('@ipfs-shipyard/ignite-metrics:consent')
+      if (jsonString != null) {
+        return JSON.parse(jsonString)
+      }
+    } catch (err) {
+      // eslint-disable-next-line no-console
+      console.error(err)
+    }
+    /**
+     * Return minimal consent if there is nothing in the store.
+     */
+    return ['minimal']
+  }
+}

src/MetricsProvider.ts

@@ -2,7 +2,7 @@ import { COUNTLY_SETUP_DEFAULTS } from './config.js'
 
 import type { metricFeatures, CountlyWebSdk } from 'countly-sdk-web'
 import type { CountlyNodeSdk } from 'countly-sdk-nodejs'
-import type { consentTypes, consentTypesExceptAll } from './types/index.js'
+import type { consentTypes, consentTypesExceptAll, StorageProvider } from './types/index.js'
 
 export interface MetricsProviderConstructorOptions<T> {
   appKey: string
@@ -13,9 +13,10 @@ export interface MetricsProviderConstructorOptions<T> {
   session_update?: number
   url?: string
   metricsService: T
+  storageProvider?: StorageProvider | null
 }
 
-export default class MetricsProvider<T extends CountlyWebSdk & CountlyNodeSdk> {
+export default class MetricsProvider<T extends CountlyWebSdk | CountlyNodeSdk> {
   private readonly groupedFeatures: Record<consentTypes, metricFeatures[]> = this.mapAllEvents({
     minimal: ['sessions', 'views', 'events'],
     performance: ['crashes', 'apm'],
@@ -27,14 +28,16 @@ export default class MetricsProvider<T extends CountlyWebSdk & CountlyNodeSdk> {
   private sessionStarted: boolean = false
   private readonly _consentGranted: Set<consentTypes> = new Set()
   private readonly metricsService: T
+  private readonly storageProvider: StorageProvider | null
 
   constructor (config: MetricsProviderConstructorOptions<T>) {
     const serviceConfig = {
       ...COUNTLY_SETUP_DEFAULTS,
       ...config
     }
-    const { appKey, autoTrack, metricsService, url } = serviceConfig
+    const { appKey, autoTrack, metricsService, url, storageProvider } = serviceConfig
     this.metricsService = metricsService
+    this.storageProvider = storageProvider ?? null
     this.metricsService.init({
       app_key: appKey,
       url,
@@ -44,9 +47,11 @@ export default class MetricsProvider<T extends CountlyWebSdk & CountlyNodeSdk> {
     this.metricsService.init(serviceConfig)
     this.metricsService.group_features(this.groupedFeatures)
 
-    if (autoTrack) {
+    if (autoTrack === true) {
       this.setupAutoTrack()
     }
+
+    this.getConsentStore().forEach(this.addConsent.bind(this))
   }
 
   mapAllEvents (eventMap: Record<consentTypesExceptAll, metricFeatures[]>): Record<consentTypes, metricFeatures[]> {
@@ -77,6 +82,7 @@ export default class MetricsProvider<T extends CountlyWebSdk & CountlyNodeSdk> {
     }
     consent.forEach(c => this._consentGranted.add(c))
     this.metricsService.add_consent(consent)
+    this.setConsentStore()
   }
 
   removeConsent (consent: consentTypes | consentTypes[]): void {
@@ -85,6 +91,20 @@ export default class MetricsProvider<T extends CountlyWebSdk & CountlyNodeSdk> {
     }
     consent.forEach(c => this._consentGranted.delete(c))
     this.metricsService.remove_consent(consent, true)
+    this.setConsentStore()
+  }
+
+  private setConsentStore (): void {
+    if (this.storageProvider != null) {
+      this.storageProvider.setStore(Array.from(this._consentGranted))
+    }
+  }
+
+  private getConsentStore (): consentTypes[] {
+    if (this.storageProvider != null) {
+      return this.storageProvider.getStore()
+    }
+    return []
   }
 
   checkConsent (consent: consentTypes | metricFeatures): boolean {

src/NodeMetrics.ts

@@ -4,7 +4,10 @@ import MetricsProvider, { MetricsProviderConstructorOptions } from './MetricsPro
 
 export class NodeMetricsProvider extends MetricsProvider<typeof Countly> {
   constructor (args: Omit<MetricsProviderConstructorOptions<typeof Countly>, 'metricsService'>) {
-    super({ ...args, metricsService: Countly })
+    super({
+      metricsService: Countly,
+      ...args
+    })
   }
 }
 

src/types/index.d.ts

@@ -1,3 +1,8 @@
 
 export type consentTypesExceptAll = 'minimal' | 'performance' | 'ux' | 'feedback' | 'location'
 export type consentTypes = 'all' | consentTypesExceptAll
+
+export interface StorageProvider {
+  setStore: (values: consentTypes[]) => void
+  getStore: () => consentTypes[]
+}