@playpilot/tpi 8.15.1 → 8.16.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@playpilot/tpi",
-	"version": "8.15.1",
+	"version": "8.16.0",
 	"type": "module",
 	"scripts": {
 		"dev": "vite dev",
@@ -16,7 +16,7 @@
 		"release": "node release.js"
 	},
 	"devDependencies": {
-		"@playpilot/retargeting-tracking": "^0.1.0",
+		"@playpilot/retargeting-tracking": "^1.1.0",
 		"@sveltejs/adapter-auto": "^7.0.1",
 		"@sveltejs/kit": "^2.56.1",
 		"@sveltejs/vite-plugin-svelte": "^4.0.0",

package/src/lib/modal.ts

@@ -6,7 +6,6 @@ import type { ParticipantData } from './types/participant'
 import { mobileBreakpoint } from './constants'
 import TitleModal from '../routes/components/Modals/TitleModal.svelte'
 import ParticipantModal from '../routes/components/Modals/ParticipantModal.svelte'
-import ExploreModal from '../routes/components/Modals/ExploreModal.svelte'
 import { getPlayPilotWrapperElement, keyDataAttribute, keySelector } from './injection'
 import { playFallbackViewTransition } from './viewTransition'
 import { destroyLinkPopover } from './popover'
@@ -16,7 +15,7 @@ import TitlesRailModal from '../routes/components/Modals/TitlesRailModal.svelte'
 type Modal = {
   injection?: LinkInjection | null
   component?: object
-  type: 'title' | 'participant' | 'explore' | 'titles-rail'
+  type: 'title' | 'participant' | 'titles-rail'
   data: TitleData | TitleData[] | ParticipantData | null
   scrollPosition?: number
 }
@@ -52,7 +51,6 @@ function getModalComponentByType(
   { type = 'title', target, data, props = {} }:
   { type: Modal['type'], target: Element, data: Modal['data'], props?: Record<string, any> }): ReturnType<typeof mount> {
   if (type === 'participant') return mount(ParticipantModal, { target, props: { participant: data as ParticipantData, ...props  } })
-  if (type === 'explore') return mount(ExploreModal, { target, props: { ...props  } })
   if (type === 'titles-rail') return mount(TitlesRailModal, { target, props: { titles: data as TitleData[], ...props } })
   return mount(TitleModal, { target, props: { title: data as TitleData, ...props } })
 }

package/src/lib/pixel.ts

@@ -1,6 +1,14 @@
+import { RETARGETING_USER_ID_KEY } from '@playpilot/retargeting-tracking'
 import { hasConsentedTo } from './consent'
+import { getUserId } from './user'
 
 export function isPixelAllowed(): boolean {
   if (!window.PlayPilotLinkInjections.config?.allow_retargeting_pixels) return false
-  return hasConsentedTo('pixels')
+
+  if (!hasConsentedTo('pixels')) return false
+
+  // @ts-ignore
+  window[RETARGETING_USER_ID_KEY] = getUserId()
+
+  return true
 }

package/src/routes/elements/+page.svelte

@@ -197,10 +197,6 @@
     {/key}
   </div>
 
-  <div class="item">
-    <button onclick={() => openModal({ type: 'explore' })}>Show explore modal</button>
-  </div>
-
   <div class="item">
     <button onclick={insertExplore}>Insert explore component</button>
     <button onclick={insertExploreIntoNavigation}>Insert explore into navigation</button>

package/src/tests/lib/pixel.test.js

@@ -1,16 +1,25 @@
 import { hasConsentedTo } from '$lib/consent'
 import { isPixelAllowed } from '$lib/pixel'
+import { getUserId } from '$lib/user'
+import { RETARGETING_USER_ID_KEY } from '@playpilot/retargeting-tracking'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 vi.mock('$lib/consent', () => ({
   hasConsentedTo: vi.fn(() => true),
 }))
 
+vi.mock('$lib/user', () => ({
+  getUserId: vi.fn(),
+}))
+
 describe('pixel.ts', () => {
   beforeEach(() => {
     // @ts-ignore
     window.PlayPilotLinkInjections = {}
 
+    // @ts-ignore
+    delete window[RETARGETING_USER_ID_KEY]
+
     vi.mocked(hasConsentedTo).mockImplementation(() => true)
   })
 
@@ -43,11 +52,25 @@ describe('pixel.ts', () => {
       expect(isPixelAllowed()).toBe(true)
     })
 
-    it('Should return true if config object is allow_retargeting_pixels is true but hasConsentedTo is false', () => {
+    it('Should return false if config object is allow_retargeting_pixels is true but hasConsentedTo is false', () => {
       vi.mocked(hasConsentedTo).mockImplementation(() => false)
       window.PlayPilotLinkInjections.config = { allow_retargeting_pixels: true }
 
       expect(isPixelAllowed()).toBe(false)
     })
+
+    it('Should set user id on window', () => {
+      vi.mocked(hasConsentedTo).mockImplementation(() => true)
+      vi.mocked(getUserId).mockImplementation(() => 'abc')
+      window.PlayPilotLinkInjections.config = { allow_retargeting_pixels: true }
+
+      // @ts-ignore
+      expect(window[RETARGETING_USER_ID_KEY]).not.toBeTruthy()
+
+      isPixelAllowed()
+
+      // @ts-ignore
+      expect(window[RETARGETING_USER_ID_KEY]).toBe('abc')
+    })
   })
 })

package/src/routes/components/Modals/ExploreModal.svelte

@@ -1,23 +0,0 @@
-
-<script lang="ts">
-  import Modal from './Modal.svelte'
-  import ExploreRouter from '../Explore/ExploreRouter.svelte'
-
-  interface Props {
-    initialScrollPosition?: number
-  }
-
-  const { initialScrollPosition = 0 }: Props = $props()
-</script>
-
-<Modal {initialScrollPosition} closeButtonStyle="flat" wide>
-  <div class="content">
-    <ExploreRouter />
-  </div>
-</Modal>
-
-<style lang="scss">
-  .content {
-    padding-top: margin(2);
-  }
-</style>