@playpilot/tpi 8.29.0 → 8.29.2

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@playpilot/tpi",
-	"version": "8.29.0",
+	"version": "8.29.2",
 	"type": "module",
 	"scripts": {
 		"dev": "vite dev",

package/src/routes/components/Rails/ParticipantsRail.svelte

@@ -8,8 +8,10 @@
   import { track } from '$lib/tracking'
   import type { ParticipantData } from '$lib/types/participant'
   import type { TitleData } from '$lib/types/title'
+  import { getContext } from 'svelte'
   import ParticipantImage from '../Participants/ParticipantImage.svelte'
   import Rail from './Rail.svelte'
+  import { exploreModalUrl } from '$lib/routes'
 
   interface Props {
     title: TitleData
@@ -18,6 +20,8 @@
 
   const { title, heading = t('Cast') }: Props = $props()
 
+  const navigate: Function | undefined = getContext('navigate')
+
   /**
    * Order participants by how often their name appears in an the page text. This only takes into account
    * their full name. If an actor is mentioned by first name only, which is often the case, they won't get
@@ -42,8 +46,14 @@
   }
 
   function onclick(event: MouseEvent, participant: ParticipantData): void {
-    openModal({ event, type: 'participant', data: participant })
     track(TrackingEvent.ParticipantClick, null, { title_source: title.original_title || title.title, participant: participant.name })
+
+    if (!window.PlayPilotLinkInjections?.config?.open_tpi_links_in_explore || window.location.href.includes(window.PlayPilotLinkInjections.config.explore_navigation_path || '')) {
+      openModal({ event, type: 'participant', data: participant })
+      return
+    }
+
+    window.location.href = exploreModalUrl(participant.sid)
   }
 </script>
 

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

@@ -19,6 +19,7 @@
         explore_navigation_path: '/explore',
         explore_custom_style: 'main { border: 2px solid white }',
         explore_use_router: true,
+        open_tpi_links_in_explore: true,
       },
       require_consent: false,
     }

package/src/tests/routes/components/Rails/ParticipantsRail.test.js

@@ -1,98 +1,122 @@
-import { fireEvent, render, waitFor } from '@testing-library/svelte'
-import { describe, expect, it, vi, beforeEach } from 'vitest'
-
-import ParticipantsRail from '../../../../routes/components/Rails/ParticipantsRail.svelte'
-import { openModal } from '$lib/modal'
-import { participants, title } from '$lib/fakeData'
-import { track } from '$lib/tracking'
-import { TrackingEvent } from '$lib/enums/TrackingEvent'
-import { fetchParticipantsForTitle } from '$lib/api/participants'
-
-vi.mock('$lib/modal', () => ({
-  openModal: vi.fn(),
-}))
-
-vi.mock('$lib/tracking', () => ({
-  track: vi.fn(),
-}))
-
-vi.mock('$lib/api/participants', () => ({
-  fetchParticipantsForTitle: vi.fn(),
-}))
-
-describe('ParticipantsRail.svelte', () => {
-  beforeEach(() => {
-    document.body.innerHTML = ''
-  })
-
-  it('Should render each given participant', async () => {
-    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participants)
-
-    const { getByText } = render(ParticipantsRail, { title })
-
-    await waitFor(() => {
-      expect(getByText(participants[0].name)).toBeTruthy()
-      expect(getByText(participants[1].name)).toBeTruthy()
-    })
-  })
-
-  it('Should render image only for participants with image', async () => {
-    const participantsWithImage = [...participants]
-    participantsWithImage[0].image = 'some-image.jpg'
-
-    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participantsWithImage)
-
-    const { getAllByRole } = render(ParticipantsRail, { title })
-
-    await waitFor(() => {
-      expect(getAllByRole('presentation')).toHaveLength(1)
-    })
-  })
-
-  it('Should order participants by their number of occurrences on the page', async () => {
-    document.body.innerHTML = `<main>${participants[1].name}. ${participants[2].name}, ${participants[2].name}</main>`
-    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participants)
-
-    const { getAllByTestId } = render(ParticipantsRail, { title })
-
-    await waitFor(() => {
-      expect(getAllByTestId('participant')[0].innerText).toContain(participants[2].name)
-      expect(getAllByTestId('participant')[1].innerText).toContain(participants[1].name)
-      expect(getAllByTestId('participant')[2].innerText).toContain(participants[0].name)
-    })
-  })
-
-  it('Should not render when no participants are returned', async () => {
-    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce([])
-
-    const { container } = render(ParticipantsRail)
-
-    await waitFor(() => {
-      expect(container.querySelectorAll('.participant').length).toBe(0)
-    })
-  })
-
-  it('Should open modal on click of participant', async () => {
-    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participants)
-
-    const { getAllByTestId } = render(ParticipantsRail, { title })
-
-    await waitFor(async () => {
-      await fireEvent.click(getAllByTestId('participant')[0])
-    })
-
-    expect(openModal).toHaveBeenCalledWith({ event: expect.any(Object), type: 'participant', data: participants[0] })
-  })
-
-  it('Should fire track event on click of participant', async () => {
-    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participants)
-
-    const { getAllByTestId } = render(ParticipantsRail, { title })
-
-    await waitFor(async () => {
-      await fireEvent.click(getAllByTestId('participant')[0])
-    })
-
-    expect(track).toHaveBeenCalledWith(TrackingEvent.ParticipantClick, null, { title_source: title.original_title, participant: participants[0].name })
-  })
-})
+import { fireEvent, render, waitFor } from '@testing-library/svelte'
+import { describe, expect, it, vi, beforeEach } from 'vitest'
+
+import ParticipantsRail from '../../../../routes/components/Rails/ParticipantsRail.svelte'
+import { openModal } from '$lib/modal'
+import { participants, title } from '$lib/fakeData'
+import { track } from '$lib/tracking'
+import { TrackingEvent } from '$lib/enums/TrackingEvent'
+import { fetchParticipantsForTitle } from '$lib/api/participants'
+
+vi.mock('$lib/modal', () => ({
+  openModal: vi.fn(),
+}))
+
+vi.mock('$lib/tracking', () => ({
+  track: vi.fn(),
+}))
+
+vi.mock('$lib/api/participants', () => ({
+  fetchParticipantsForTitle: vi.fn(),
+}))
+
+describe('ParticipantsRail.svelte', () => {
+  beforeEach(() => {
+    vi.resetAllMocks()
+
+    // @ts-ignore
+    window.PlayPilotLinkInjections = {}
+    document.body.innerHTML = ''
+  })
+
+  it('Should render each given participant', async () => {
+    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participants)
+
+    const { getByText } = render(ParticipantsRail, { title })
+
+    await waitFor(() => {
+      expect(getByText(participants[0].name)).toBeTruthy()
+      expect(getByText(participants[1].name)).toBeTruthy()
+    })
+  })
+
+  it('Should render image only for participants with image', async () => {
+    const participantsWithImage = [...participants]
+    participantsWithImage[0].image = 'some-image.jpg'
+
+    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participantsWithImage)
+
+    const { getAllByRole } = render(ParticipantsRail, { title })
+
+    await waitFor(() => {
+      expect(getAllByRole('presentation')).toHaveLength(1)
+    })
+  })
+
+  it('Should order participants by their number of occurrences on the page', async () => {
+    document.body.innerHTML = `<main>${participants[1].name}. ${participants[2].name}, ${participants[2].name}</main>`
+    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participants)
+
+    const { getAllByTestId } = render(ParticipantsRail, { title })
+
+    await waitFor(() => {
+      expect(getAllByTestId('participant')[0].innerText).toContain(participants[2].name)
+      expect(getAllByTestId('participant')[1].innerText).toContain(participants[1].name)
+      expect(getAllByTestId('participant')[2].innerText).toContain(participants[0].name)
+    })
+  })
+
+  it('Should not render when no participants are returned', async () => {
+    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce([])
+
+    const { container } = render(ParticipantsRail)
+
+    await waitFor(() => {
+      expect(container.querySelectorAll('.participant').length).toBe(0)
+    })
+  })
+
+  it('Should open modal on click of participant', async () => {
+    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participants)
+
+    const { getAllByTestId } = render(ParticipantsRail, { title })
+
+    await waitFor(async () => {
+      await fireEvent.click(getAllByTestId('participant')[0])
+    })
+
+    expect(openModal).toHaveBeenCalledWith({ event: expect.any(Object), type: 'participant', data: participants[0] })
+  })
+
+  it('Should not open modal on click if if open_tpi_links_in_explore is true and instead set url', async () => {
+    // @ts-ignore
+    window.PlayPilotLinkInjections = {
+      config: {
+        open_tpi_links_in_explore: true,
+        explore_navigation_path: 'some-explore-url.com'
+      },
+    }
+
+    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participants)
+
+    const { getAllByTestId } = render(ParticipantsRail, { title })
+
+    await waitFor(async () => {
+      await fireEvent.click(getAllByTestId('participant')[0])
+    })
+
+    expect(openModal).not.toHaveBeenCalled()
+  })
+
+  it('Should fire track event on click of participant', async () => {
+    vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participants)
+
+    const { getAllByTestId } = render(ParticipantsRail, { title })
+
+    await waitFor(async () => {
+      await fireEvent.click(getAllByTestId('participant')[0])
+    })
+
+    expect(track).toHaveBeenCalledWith(TrackingEvent.ParticipantClick, null, { title_source: title.original_title, participant: participants[0].name })
+  })
+})