@playpilot/tpi 5.17.0-beta.1 → 5.18.0

package/eslint.config.js

@@ -65,4 +65,20 @@ export default [
       ],
     },
   },
+  {
+    files: ['**/*.ts'],
+    ignores: ['**/*.d.ts'],
+    languageOptions: {
+      parser: tsParser,
+    },
+    rules: {
+      '@typescript-eslint/explicit-function-return-type': [
+        'error',
+        {
+          allowExpressions: true,
+          allowTypedFunctionExpressions: true,
+        },
+      ],
+    },
+  },
 ]

package/events.md

@@ -34,6 +34,9 @@ Event | Action | Info | Payload
 `ali_title_modal_scroll` | _Fires the first time a user scrolls inside of a titel modal._ | | `Title`
 `ali_title_modal_playlink_click` | _Fires any time a playlink is clicked inside of a title modal_ | Includes data on which playlink was clicked. | `Title`, `playlink` (name of the clicked playlink)
 `ali_title_modal_save_click` | _Currently unused, there is no save functionality._ | | `Title`
+`ali_participant_modal_view` | _Fires any time a title modal is viewed_ | The title modal opens when viewing a participant modal both on desktop and mobile | `participant` (name of the participant)
+`ali_participant_modal_close` | _Fires any time a title modal is closed_ | | `participant` (name of the participant) `time_spent` (time between modal_view and modal_close milliseconds)
+'ali_similar_title_click' | _Fires any time a similar titles rail item is clicked_ | Title | `title_source` (original name of the title the rail item was clicked in)
 
 ### Popover
 Event | Action | Info | Payload

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@playpilot/tpi",
-	"version": "5.17.0-beta.1",
+	"version": "5.18.0",
 	"type": "module",
 	"scripts": {
 		"dev": "vite dev",

package/src/app.d.ts

@@ -1,13 +1,13 @@
-// See https://svelte.dev/docs/kit/types#app.d.ts
-// for information about these interfaces
-declare global {
-	namespace App {
-		// interface Error {}
-		// interface Locals {}
-		// interface PageData {}
-		// interface PageState {}
-		// interface Platform {}
-	}
-}
-
-export {};
+// See https://svelte.dev/docs/kit/types#app.d.ts
+// for information about these interfaces
+declare global {
+	namespace App {
+		// interface Error {}
+		// interface Locals {}
+		// interface PageData {}
+		// interface PageState {}
+		// interface Platform {}
+	}
+}
+
+export {}

package/src/lib/actions/heading.ts

@@ -5,7 +5,7 @@
  * We still want headings to be semantically correct, which is all this action does.
  * @example `use:heading{3}`
  */
-export function heading(node: HTMLElement, level = 1) {
-  node.role = "heading"
+export function heading(node: HTMLElement, level = 1): void {
+  node.role = 'heading'
   node.ariaLevel = level.toString()
 }

package/src/lib/actions/middlemouse.ts

@@ -1,5 +1,5 @@
-export function middlemouse(node: HTMLElement, options: { onclick: (event: MouseEvent) => void }) {
-  let { onclick } = options
+export function middlemouse(node: HTMLElement, options: { onclick: (event: MouseEvent) => void }): { destroy(): void } {
+  const { onclick } = options
 
   function mouseup(event: MouseEvent): MouseEvent | null {
     if (event.button !== 1) return null

package/src/lib/{ads.ts → api/ads.ts}

@@ -1,29 +1,26 @@
-import { getApiToken } from "./api"
-import { hasConsentedTo } from "./consent"
-import { apiBaseUrl } from "./constants"
-import { TrackingEvent } from "./enums/TrackingEvent"
-import { track } from "./tracking"
-import type { Campaign, CampaignFormat } from "./types/campaign"
-import type { PlaylinkData } from "./types/playlink"
-
-export async function fetchAds() {
-  if (!hasConsentedTo('ads')) return
-
-  const headers = new Headers({ 'Content-Type': 'application/json' })
+import { getApiToken } from '../token'
+import { hasConsentedTo } from '../consent'
+import { TrackingEvent } from '../enums/TrackingEvent'
+import { track } from '../tracking'
+import type { Campaign, CampaignFormat } from '../types/campaign'
+import type { PlaylinkData } from '../types/playlink'
+import { api } from './api'
+
+export async function fetchAds(): Promise<Campaign[]> {
+  if (!hasConsentedTo('ads')) return []
+
   const apiToken = getApiToken()
 
   if (!apiToken) throw new Error('No token was provided')
 
-  const response = await fetch(apiBaseUrl + `/ads/browse/?region=nl&api-token=${apiToken}`, { headers })
+  try {
+    const response = await api<Campaign[]>(`/ads/browse/?region=nl&api-token=${apiToken}`)
 
-  if (!response.ok) {
-    track(TrackingEvent.AdsFetchFailed, null, { status: response.status })
-    throw response
+    return response
+  } catch (error: any) {
+    track(TrackingEvent.AdsFetchFailed, null, { status: error.status })
+    throw error
   }
-
-  const parsed = await response.json()
-
-  return parsed
 }
 
 /**
@@ -52,7 +49,7 @@ export function campaignToPlaylink(campaign: Campaign): PlaylinkData {
     cta_text: campaign.content.subheader,
     action_text: campaign.cta.header,
     extra_info: {
-      category: 'SVOD'
-    }
+      category: 'SVOD',
+    },
   }
 }

package/src/lib/api/api.ts

@@ -0,0 +1,21 @@
+import { apiBaseUrl } from '$lib/constants'
+
+type Options = {
+  headers?: Record<string, string>
+  method?: 'POST' | 'GET'
+  body?: null | Record<string, any>
+}
+
+export async function api<T>(path: string, { headers = {}, method = 'GET', body = null }: Options = {}): Promise<T> {
+  const baseHeaders = { 'Content-Type': 'application/json' }
+
+  const response = await fetch(apiBaseUrl + path, {
+    method,
+    headers: new Headers({ ...baseHeaders, ...headers }),
+    body: body ? JSON.stringify(body as BodyInit) : null,
+  })
+
+  if (!response?.ok) throw response
+
+  return await response.json()
+}

package/src/lib/{auth.ts → api/auth.ts}

@@ -1,7 +1,7 @@
-import { getApiToken } from './api'
-import { apiBaseUrl } from './constants'
-import { TrackingEvent } from './enums/TrackingEvent'
-import { track } from './tracking'
+import { getApiToken } from '$lib/token'
+import { TrackingEvent } from '../enums/TrackingEvent'
+import { track } from '../tracking'
+import { api } from './api'
 
 const cookieName = 'EncryptedToken'
 const urlParam = 'articleReplacementEditToken'
@@ -13,8 +13,6 @@ const editorialParam = 'playpilot-editorial-mode'
  * @returns Whether the user is authorized or not
  */
 export async function authorize(href: string = window.location.href): Promise<boolean> {
-  const headers = new Headers({ 'Content-Type': 'application/json' })
-
   try {
     const apiToken = getApiToken()
     if (!apiToken) throw new Error('No token was provided')
@@ -22,16 +20,14 @@ export async function authorize(href: string = window.location.href): Promise<bo
     const authToken = getAuthToken(href)
     if (!authToken) throw new Error('Could not be authenticated')
 
-    const response = await fetch(apiBaseUrl + `/external-pages/edit-authorization?api-token=${apiToken}`, {
-      headers,
+    // Nothing is done with the response. If it's ok, we're good, if not, it throws and is caught below.
+    await api(`/external-pages/edit-authorization?api-token=${apiToken}`, {
       method: 'POST',
-      body: JSON.stringify(({
+      body: {
         private_token: authToken,
-      })),
+      },
     })
 
-    if (!response.ok) throw response
-
     setAuthCookie(authToken)
 
     return true

package/src/lib/api/config.ts

@@ -0,0 +1,16 @@
+import { getApiToken } from '$lib/token'
+import type { ConfigResponse } from '$lib/types/config'
+import { api } from './api'
+
+export async function fetchConfig(): Promise<ConfigResponse | null> {
+  const apiToken = getApiToken()
+
+  if (!apiToken) throw new Error('No token was provided')
+
+  try {
+    const response = await api(`/domains/config?api-token=${apiToken}`)
+    return await response || null
+  } catch {
+    return null
+  }
+}

package/src/lib/{api.ts → api/externalPages.ts}

@@ -1,11 +1,11 @@
 import { authorize, getAuthToken, isEditorialModeEnabled } from './auth'
-import { apiBaseUrl } from './constants'
-import { generateRandomHash, stringToHash } from './hash'
-import { getLanguage } from './localization'
-import { getDatetime, getPageMetaData } from './meta'
-import type { ConfigResponse } from './types/config'
-import type { LinkInjectionResponse, LinkInjection } from './types/injection'
-import { getFullUrlPath } from './url'
+import { generateRandomHash, stringToHash } from '../hash'
+import { getLanguage } from '../localization'
+import { getDatetime, getPageMetaData } from '../meta'
+import type { LinkInjectionResponse, LinkInjection } from '../types/injection'
+import { getFullUrlPath } from '../url'
+import { api } from './api'
+import { getApiToken } from '$lib/token'
 
 let pollTimeout: ReturnType<typeof setTimeout> | null = null
 
@@ -20,15 +20,15 @@ let pollTimeout: ReturnType<typeof setTimeout> | null = null
 export async function fetchLinkInjections(
   pageText: string | null,
   { url = getFullUrlPath(), hash = stringToHash(pageText || ''), params = {} }:
-  { url?: string, hash?: string, params?: Record<string, any> } = {}
+  { url?: string, hash?: string, params?: Record<string, any> } = {},
 ): Promise<LinkInjectionResponse> {
-  const headers = new Headers({ 'Content-Type': 'application/json' })
   const apiToken = getApiToken()
   const isEditorialMode = isEditorialModeEnabled() ? await authorize() : false
   const language = getLanguage()
 
   if (!apiToken) throw new Error('No token was provided')
 
+  params.url = url
   params.metadata = getPageMetaData()
 
   // Add additional parameters if request is made to run the AI. We only include these when saving new data.
@@ -38,23 +38,15 @@ export async function fetchLinkInjections(
     params.page_text = pageText
   }
 
-  const response = await fetch(apiBaseUrl + `/external-pages/?api-token=${apiToken}&include_title_details=true${isEditorialMode ? '&editorial_mode_enabled=true' : ''}&language=${language}`, {
-    headers,
+  const response = await api<LinkInjectionResponse>(`/external-pages/?api-token=${apiToken}&include_title_details=true${isEditorialMode ? '&editorial_mode_enabled=true' : ''}&language=${language}`, {
     method: 'POST',
-    body: JSON.stringify({
-      url,
-      ...params
-    }),
+    body: params,
   })
 
-  if (!response.ok) throw response
-
-  const parsed = await response.json()
-
   // This is used when debugging (using window.PlayPilotLinkInjections.debug())
-  window.PlayPilotLinkInjections.last_successful_fetch = parsed
+  window.PlayPilotLinkInjections.last_successful_fetch = response
 
-  return parsed
+  return response
 }
 
 /**
@@ -64,7 +56,7 @@ export async function fetchLinkInjections(
 export async function pollLinkInjections(
   pageText: string,
   { requireCompletedResult = false, runAiWhenRelevant = false, pollInterval = 3000, maxTries = 600, onpoll = () => null }:
-  { requireCompletedResult?: boolean, runAiWhenRelevant?: boolean, pollInterval?: number, maxTries?: number, onpoll?: (_response: LinkInjectionResponse) => void } = {}
+  { requireCompletedResult?: boolean, runAiWhenRelevant?: boolean, pollInterval?: number, maxTries?: number, onpoll?: (_response: LinkInjectionResponse) => void } = {},
 ): Promise<LinkInjectionResponse> {
   let currentTry = 0
 
@@ -144,7 +136,7 @@ export async function saveLinkInjections(linkInjections: LinkInjection[], pageTe
     after_article_style: linkInjection.after_article_style || null,
     in_text: linkInjection.in_text ?? true,
     inactive: !!linkInjection.inactive,
-    removed: !!linkInjection.removed
+    removed: !!linkInjection.removed,
   }))
 
   const response = await fetchLinkInjections(pageText, {
@@ -160,25 +152,6 @@ export async function saveLinkInjections(linkInjections: LinkInjection[], pageTe
   return linkInjections
 }
 
-export async function fetchConfig(): Promise<ConfigResponse | null> {
-  const headers = new Headers({ 'Content-Type': 'application/json' })
-  const apiToken = getApiToken()
-
-  if (!apiToken) throw new Error('No token was provided')
-
-  const response = await fetch(apiBaseUrl + `/domains/config?api-token=${apiToken}`, {
-    headers,
-  })
-
-  if (!response.ok) throw response
-
-  try {
-    return await response.json() || null
-  } catch {
-    return null
-  }
-}
-
 /**
  * Insert random keys into link injections. These are used to identify the links on the page.
  * We can't just use SIDs, as a page might include multiple links of the same title
@@ -186,8 +159,8 @@ export async function fetchConfig(): Promise<ConfigResponse | null> {
 function insertRandomKeys(linkInjections: LinkInjection[]): LinkInjection[] {
   return linkInjections.map((linkInjection: LinkInjection) => ({
     ...linkInjection,
-    key: generateInjectionKey(linkInjection.sid)
-  }));
+    key: generateInjectionKey(linkInjection.sid),
+  }))
 }
 
 /**
@@ -198,7 +171,3 @@ function insertRandomKeys(linkInjections: LinkInjection[]): LinkInjection[] {
 export function generateInjectionKey(sid: string): string {
   return sid + '-' + generateRandomHash()
 }
-
-export function getApiToken(): string | undefined {
-  return window.PlayPilotLinkInjections?.token
-}

package/src/lib/api/search.ts

@@ -0,0 +1,14 @@
+import { getApiToken } from '$lib/token'
+import type { TitleData } from '../types/title'
+import { api } from './api'
+
+/**
+ * Search for movies & shows. Requires valid API token.
+ */
+export async function searchTitles(query: string): Promise<TitleData[]> {
+  const apiToken = getApiToken()
+
+  if (!apiToken) throw new Error('No token was provided')
+
+  return await api<TitleData[]>(`/search/titles/?api-token=${apiToken}&query=${query}`)
+}

package/src/lib/{session.ts → api/session.ts}

@@ -1,6 +1,6 @@
-import { fetchLinkInjections } from "./api"
-import { generateRandomHash } from "./hash"
-import type { SessionResponse } from "./types/session"
+import { fetchLinkInjections } from './externalPages'
+import { generateRandomHash } from '../hash'
+import type { SessionResponse } from '../types/session'
 
 export const sessionKey = 'PlayPilotEditorialSessionId'
 export const sessionPollPeriodMilliseconds = 5000

package/src/lib/array.ts

@@ -1,4 +1,4 @@
-import type { Range } from "./types/range"
+import type { Range } from './types/range'
 
 /**
  * Returns the largest number in an array of numbers. Returns 0 if the array has no entries.
@@ -24,6 +24,6 @@ export function getNumberOfOccurrencesInArray<T>(array: T[], item: T, keys: stri
   return array.filter(i => keys.every(key => i[key] === item[key])).length
 }
 
-export function isIndexInAnyRange(index: number, ranges: Range[]) {
+export function isIndexInAnyRange(index: number, ranges: Range[]): boolean {
   return ranges.some(range => index >= range.start && index < range.end)
 }

package/src/lib/consent.ts

@@ -1,4 +1,4 @@
-import type { ConsentKeys, ConsentOptions } from "./types/consent"
+import type { ConsentKeys, ConsentOptions } from './types/consent'
 
 export function setConsent(options: ConsentOptions): void {
   if (!window.PlayPilotLinkInjections) return

package/src/lib/data/translations.ts

@@ -44,7 +44,7 @@ export const translations = {
   'Commission Disclaimer': {
     [Language.English]: 'We may earn a commission if you make a purchase through these links. In collaboration with',
     [Language.Swedish]: 'Vi kan tjäna en provision om du gör ett köp via dessa länkar. I samarbete med',
-  [Language.Danish]: 'Vi kan tjene en kommission, hvis du foretager et køb via disse links. I samarbejde med',
+    [Language.Danish]: 'Vi kan tjene en kommission, hvis du foretager et køb via disse links. I samarbejde med',
   },
   'And': {
     [Language.English]: 'and',

package/src/lib/enums/SplitTest.ts

@@ -2,10 +2,10 @@ export const SplitTest = {
   TopScrollFormat: {
     key: 'top_scroll_format',
     numberOfVariants: 2,
-    variantNames: ['Separated', 'Inline'] as string[]
+    variantNames: ['Separated', 'Inline'] as string[],
   },
   ParticipantPlaylinkFormat: {
     key: 'participant_playlink_format',
     numberOfVariants: 2,
-  }
+  },
 } as const

package/src/lib/enums/TrackingEvent.ts

@@ -1,32 +1,44 @@
 /** @see /events.md */
 export const TrackingEvent = Object.freeze({
+  // General
   ArticlePageView: 'ali_article_page_view',
   ArticleInjected: 'ali_links_injected',
   InjectionVisible: 'ali_injection_visible',
 
+  // Modal
   TitleModalView: 'ali_title_modal_view',
   TitleModalClose: 'ali_title_modal_close',
   TitleModalScroll: 'ali_title_modal_scroll',
   TitleModalPlaylinkClick: 'ali_title_modal_playlink_click',
   TitleModalSaveClick: 'ali_title_modal_save_click',
+  ParticipantModalView: 'ali_participant_modal_view',
+  ParticipantModalClose: 'ali_participant_modal_close',
 
+  // Popover
   TitlePopoverView: 'ali_title_popover_view',
   TitlePopoverClose: 'ali_title_popover_close',
   TitlePopoverSaveClick: 'ali_title_popover_save_click',
   TitlePopoverPlaylinkClick: 'ali_title_popover_playlink_click',
 
+  // Rails
+  SimilarTitleClick: 'ali_similar_title_click',
+
+  // After article
   AfterArticlePlaylinkClick: 'ali_after_article_playlink_click',
   AfterArticleModalButtonClick: 'ali_after_article_modal_button_click',
 
+  // Fails
   InjectionFailed: 'ali_injection_failed',
   TotalInjectionsCount: 'ali_injection_count',
   FetchingConfigFailed: 'ali_fetch_config_failed',
   AuthFailed: 'ali_auth_failed',
 
+  // Errors
   ManualReport: 'ali_manual_report',
   EditorError: 'ali_editor_error',
   InjectionError: 'ali_injection_error',
 
+  // Ads
   TopScrollView: 'ali_top_scroll_view',
   TopScrollClick: 'ali_top_scroll_click',
   DisplayAdView: 'ali_display_ad_view',
@@ -34,6 +46,7 @@ export const TrackingEvent = Object.freeze({
   DisplayedAdPlaylickClick: 'ali_display_ad_playlink_click',
   AdsFetchFailed: 'ali_ads_fetch_failed',
 
+  // Split tests
   SplitTestView: 'ali_split_test_view',
   SplitTestAction: 'ali_split_test_action',
 })

package/src/lib/event.ts

@@ -1,6 +1,6 @@
 /**
  * Returns true when user performs event that should open a link in a new tab
  */
-export function isHoldingSpecialKey(event: MouseEvent) {
+export function isHoldingSpecialKey(event: MouseEvent): boolean {
   return event.ctrlKey || event.metaKey || event.button !== 0
 }

package/src/lib/fakeData.ts

@@ -1,7 +1,7 @@
-import type { Campaign } from "./types/campaign"
-import type { LinkInjection } from "./types/injection"
-import type { ParticipantData } from "./types/participant"
-import type { TitleData } from "./types/title"
+import type { Campaign } from './types/campaign'
+import type { LinkInjection } from './types/injection'
+import type { ParticipantData } from './types/participant'
+import type { TitleData } from './types/title'
 
 export const title: TitleData = {
   sid: 'tig9r9F',

package/src/lib/hash.ts

@@ -13,6 +13,6 @@ export function stringToHash(string: string): string {
   return hash.toString(16)
 }
 
-export function generateRandomHash() {
+export function generateRandomHash(): string {
   return (Math.random() + 1).toString(36).substring(7)
 }

package/src/lib/image.ts

@@ -1,5 +1,5 @@
-import { imageBaseUrl } from "./constants"
-import type { ImageDimensions } from "./enums/ImageDimensions"
+import { imageBaseUrl } from './constants'
+import type { ImageDimensions } from './enums/ImageDimensions'
 
 /**
  * NOTE: This is a temporary measure. Images url from the API use a previous format which is to be replaced,

package/src/lib/{linkInjection.ts → injection.ts}

@@ -8,8 +8,8 @@ import { playFallbackViewTransition } from './viewTransition'
 import { prefersReducedMotion } from 'svelte/motion'
 import { getNumberOfOccurrencesInArray } from './array'
 import { mobileBreakpoint } from './constants'
+import { isEditorialModeEnabled } from './api/auth'
 import { destroyAllModals, openModal } from './modal'
-import { isEditorialModeEnabled } from './auth'
 import { track } from './tracking'
 import { TrackingEvent } from './enums/TrackingEvent'
 
@@ -238,7 +238,10 @@ export function injectLinksInDocument(elements: HTMLElement[], injections: LinkI
 
   return mergedInjections.filter(i => i.title_details).map((injection, index) => {
     // Favour manual injections over AI injections
-    const duplicate = injection.duplicate ?? (!injection.manual && isAvailableAsManualInjection(injection, index, mergedInjections))
+    const hasManualEquivalent = !injection.manual && isAvailableAsManualInjection(injection, index, mergedInjections)
+    const duplicate = injection.duplicate ?? hasManualEquivalent
+
+    if (duplicate) failedMessages[injection.key] = hasManualEquivalent ? 'Injection was manually removed.' : 'Injection was marked as duplicate.'
 
     const matchingElement = document.querySelector(`[${keyDataAttribute}="${injection.key}"]`)
     const failed = isValidPlaylinkType(injection) && !injection.inactive && !injection.after_article && !matchingElement
@@ -253,7 +256,7 @@ export function injectLinksInDocument(elements: HTMLElement[], injections: LinkI
       inactive: injection.inactive ?? false,
       duplicate,
       failed,
-      failed_message: failedMessage
+      failed_message: failedMessage,
     }
   })
 }
@@ -353,7 +356,7 @@ function addLinkInjectionEventListeners(injections: LinkInjection[]): void {
     playFallbackViewTransition(() => {
       destroyLinkPopover(false)
       openModal({ event, injection, data: injection.title_details })
-    }, !prefersReducedMotion.current && window.innerWidth >= mobileBreakpoint && !window.matchMedia("(pointer: coarse)").matches)
+    }, !prefersReducedMotion.current && window.innerWidth >= mobileBreakpoint && !window.matchMedia('(pointer: coarse)').matches)
   })
 
   window.addEventListener('mousemove', (event) => {
@@ -426,20 +429,24 @@ function openLinkPopover(event: MouseEvent, injection: LinkInjection): void {
 /**
  * Unmount the popover, removing it from the dom
  */
-function destroyLinkPopover(outro: boolean = true) {
-  if (!activePopoverInsertedComponent) {
-    // In some cases a popover lingers even if it should have been removed. This happens sometimes during
-    // HMR during development. In that case we remove the element straight from the dom.
-    // Doing this will prevent the outro animation from playing, but this being a fallback, that's ok.
-    document.querySelectorAll<HTMLElement>('[data-playpilot-title-popover]').forEach(element => element.remove())
-
-    return
-  }
+async function destroyLinkPopover(outro: boolean = true) {
+  if (activePopoverInsertedComponent) {
+    const promise = unmount(activePopoverInsertedComponent, { outro })
 
-  unmount(activePopoverInsertedComponent, { outro })
+    currentlyHoveredInjection = null
+    activePopoverInsertedComponent = null
 
-  currentlyHoveredInjection = null
-  activePopoverInsertedComponent = null
+    // Await the unmount promise after setting the variables above to prevent race conditions when
+    // mounting a new popover. The promise resolves after the element has transitioned fully out.
+    await promise
+  }
+
+  // In some cases a popover lingers even if it should have been removed. This happens sometimes during
+  // HMR during development, but I've seen it happen on production too.
+  // In that case we remove the element straight from the dom.
+  // Doing this will prevent the outro animation from playing, but this being a fallback, that's ok.
+  // TODO: Find the actual cause of this bug.
+  document.querySelectorAll<HTMLElement>('[data-playpilot-title-popover]').forEach(element => element.remove())
 }
 
 /**
@@ -463,8 +470,8 @@ export function insertAfterArticlePlaylinks(elements: HTMLElement[], injections:
     target,
     props: {
       linkInjections: injections,
-      onclickmodal: (event, injection) => openModal({ event, injection, data: injection.title_details })
-    }
+      onclickmodal: (event, injection) => openModal({ event, injection, data: injection.title_details }),
+    },
   })
 }
 

package/src/lib/meta.ts

@@ -1,4 +1,4 @@
-import { getLinkInjectionsParentElement } from './linkInjection'
+import { getLinkInjectionsParentElement } from './injection'
 import type { ArticleMetaData } from './types/injection'
 
 /**

package/src/lib/modal.ts

@@ -2,11 +2,11 @@ import { mount, unmount } from "svelte"
 import { isHoldingSpecialKey } from "./event"
 import TitleModal from "../routes/components/TitleModal.svelte"
 import type { LinkInjection } from "./types/injection"
-import { getPlayPilotWrapperElement } from "./linkInjection"
 import ParticipantModal from "../routes/components/ParticipantModal.svelte"
 import type { TitleData } from "./types/title"
 import type { ParticipantData } from "./types/participant"
 import { mobileBreakpoint } from "./constants"
+import { getPlayPilotWrapperElement } from "./injection"
 
 type ModalType = 'title' | 'participant'
 

package/src/lib/playlink.ts

@@ -1,4 +1,4 @@
-import type { PlaylinkData } from "./types/playlink"
+import type { PlaylinkData } from './types/playlink'
 
 /**
  * Merge playlinks of the same provider of BUY and RENT categories into a shared TVOD category.

package/src/lib/routes.ts

@@ -0,0 +1,9 @@
+import { playPilotBaseUrl } from "./constants"
+import type { TitleData } from "./types/title"
+
+/**
+ * @returns Full url to PlayPilot page for the given title
+ */
+export function titleUrl(title: TitleData): string {
+  return `${playPilotBaseUrl}/${title.type}/${title.slug}/`
+}