@playpilot/tpi 7.0.1 → 7.0.3

package/package.json

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

package/src/lib/api/participants.ts

@@ -1,10 +1,21 @@
+import { getLanguage } from '$lib/language'
 import { getApiToken } from '$lib/token'
 import type { ParticipantData } from '$lib/types/participant'
+import { paramsToString } from '$lib/url'
 import type { TitleData } from '../types/title'
 import { api } from './api'
+import { getRegionBasedOnIp } from './region'
 
 export async function fetchTitlesForParticipant(participant: ParticipantData, { page = 1 }: { page?: number } = {}): Promise<TitleData[]> {
-  const response = await api<{ results: TitleData[] }>(`/titles/browse?api-token=${getApiToken()}&participant_sid=${participant.sid}&page=${page}`)
+  const params = {
+    language: getLanguage(),
+    region: await getRegionBasedOnIp(),
+    include_count: 'false',
+    participant_sid: participant.sid,
+    page,
+  }
+
+  const response = await api<{ results: TitleData[] }>(`/titles/browse?api-token=${getApiToken()}&${paramsToString(params)}`)
 
   return response.results
 }

package/src/lib/data/translations.ts

@@ -236,6 +236,21 @@ export const translations = {
     [Language.Swedish]: 'Sök',
     [Language.Danish]: 'Søg',
   },
+  'Born On': {
+    [Language.English]: 'Born on',
+    [Language.Swedish]: 'Född den',
+    [Language.Danish]: 'Født den',
+  },
+  'Died On': {
+    [Language.English]: 'Died on',
+    [Language.Swedish]: 'Död den',
+    [Language.Danish]: 'Død den',
+  },
+  'Credits': {
+    [Language.English]: 'Credits',
+    [Language.Swedish]: 'Medverkande',
+    [Language.Danish]: 'Medvirkende',
+  },
 
   // Genres
   'All': {

package/src/routes/+layout.svelte

@@ -97,6 +97,12 @@
           <li>Anatomy of a Fall</li>
           <li>Killers of the Flower Moon</li>
         </ul>
+
+        <h2>Example of short manual match</h2>
+        <div>
+          <p><em>The Testaments</em> er en spændende fortsættelse i universet fra <em>The Handmaid’s Tale</em> og bygger på Margaret Atwoods populære bog. Serien dykker endnu dybere ned i det dystopiske samfund Gilead og følger nye karakterer, der kæmper imod regimet.</p><p><strong>Star Wars: Maul – Shadow Lord</strong></p>
+          <p>Denne serie handler om at Maul forsøger at genopbygge sit kriminelle syndikat på en planet, der endnu ikke er under Imperiets kontrol. Her møder han en desillusioneret ung jedi-padawan, som måske kan blive den lærling, han har brug for i sin jagt på hævn.</p>
+        </div>
       </article>
     {/key}
   {/if}

package/src/routes/components/ContextMenu.svelte

@@ -54,7 +54,7 @@
 
     &:hover {
       cursor: pointer;
-      color: white;
+      color: theme(text-color);
     }
   }
 

package/src/routes/components/Debugger.svelte

@@ -183,6 +183,7 @@
   }
 
   hr {
+    margin: margin(0.5) 0;
     border-color: theme(primary);
   }
 

package/src/routes/components/Editorial/Editor.svelte

@@ -367,9 +367,8 @@
     }
 
     &[disabled] {
-      opacity: 0.75;
+      opacity: 0.65;
       background: theme(lighter);
-      color: theme(content-light);
     }
   }
 

package/src/routes/components/Editorial/EditorItem.svelte

@@ -310,6 +310,7 @@
 
     &:hover {
       filter: brightness(1.2);
+      outline: 1px solid currentColor;
     }
   }
 

package/src/routes/components/Editorial/ManualInjection.svelte

@@ -87,8 +87,9 @@
     // Get the node the text is in. If the content of the node is very short we use the parent node instead.
     // This is meant for content that is inside of other elements such as <p>Some <strong>word</strong> in a sentence</p>
     // If we selected "word", we'd still want the full sentence, rather than just the "word".
+    // We don't do this if the node is a paragraph, since that implies it is a full sentence by itself at least.
     let node = range.startContainer
-    while((node.textContent || '').length <= selectionText.length * 3 && node.parentNode) {
+    while((node.textContent || '').length <= selectionText.length * 3 && node.parentNode && node.nodeName !== 'P') {
       // Stop when reaching the parent or any child of the parent that doesn't contain any extra content.
       // This prevents matching on text outside of elements that are top level already.
       if (node.parentNode.textContent === injectionsParent.textContent) break
@@ -103,9 +104,8 @@
     const absoluteStart = getAbsoluteOffset(node, range.startContainer, range.startOffset)
     const absoluteEnd = getAbsoluteOffset(node, range.endContainer, range.endOffset)
 
-    // Find sentence boundaries
     const before = fullText.slice(0, absoluteStart).lastIndexOf('.')
-    const afterMatch = fullText.slice(absoluteEnd).match(/[.!?]/)
+    const afterMatch = fullText.slice(absoluteEnd).match(/[.!?\n]/)
     const after = afterMatch ? absoluteEnd + afterMatch.index! : fullText.length
 
     const sentenceStart = before === -1 ? 0 : before + 1

package/src/routes/components/ListTitle.svelte

@@ -4,6 +4,7 @@
   import IconArrow from './Icons/IconArrow.svelte'
   import IconIMDb from './Icons/IconIMDb.svelte'
   import TitlePoster from './TitlePoster.svelte'
+  import { t } from '$lib/localization'
 
   interface Props {
     title: TitleData
@@ -30,7 +31,7 @@
       </div>
 
       <div>{title.year}</div>
-      <div>{title.type}</div>
+      <div>{t(`Type: ${title.type}`)}</div>
 
       {#if title.length}
         <div>{title.length} min</div>

package/src/routes/components/Participant.svelte

@@ -57,13 +57,13 @@
 
   {#if birth_date}
     <p class="dates">
-      Born on <strong>{formatDate(birth_date)}</strong>{#if death_date}, died on <strong>{formatDate(death_date)}</strong>{/if}
+      {t('Born On')} <strong>{formatDate(birth_date)}</strong>{#if death_date}, {t('Died On')} <strong>{formatDate(death_date)}</strong>{/if}
     </p>
   {/if}
 </div>
 
 <div class="content">
-  <div class="heading small" use:heading={3} id="credits">Credits</div>
+  <div class="heading small" use:heading={3} id="credits">{t('Credits')}</div>
 
   <div class="list">
     {#each titles as title}

package/src/routes/components/RoundButton.svelte

@@ -35,6 +35,7 @@
     &:hover {
       filter: brightness(1.2);
       transform: scale(1.05);
+      outline: 1px solid theme(button-hover-border-color, text-color-alt);
     }
   }
 </style>

package/src/tests/lib/api/participants.test.js

@@ -0,0 +1,61 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+
+import { api } from '$lib/api/api'
+import { fetchTitlesForParticipant } from '$lib/api/participants'
+import { participants, title } from '$lib/fakeData'
+import { getApiToken } from '$lib/token'
+import { fakeFetch } from '../../helpers'
+
+vi.mock('$lib/token', () => ({
+  getApiToken: vi.fn(),
+}))
+
+vi.mock('$lib/api/api', () => ({
+  api: vi.fn(),
+}))
+
+describe('$lib/api/participants', () => {
+  beforeEach(() => {
+    // @ts-ignore
+    window.PlayPilotLinkInjections = {}
+
+    vi.resetAllMocks()
+    vi.mocked(getApiToken).mockReturnValue('some-token')
+    fakeFetch()
+  })
+
+  describe('fetchTitlesForParticipant', () => {
+    it('Should call api with given parameters and always include include_count=false and return titles', async () => {
+      vi.mocked(api).mockResolvedValueOnce({ results: [title] })
+
+      const response = await fetchTitlesForParticipant(participants[0])
+
+      expect(api).toHaveBeenCalledWith(`/titles/browse?api-token=some-token&language=en-US&include_count=false&participant_sid=${participants[0].sid}&page=1`)
+      expect(response).toEqual([title])
+    })
+
+    it('Should use given page number', async () => {
+      vi.mocked(api).mockResolvedValueOnce({ results: [title] })
+
+      await fetchTitlesForParticipant(participants[0], { page: 5 })
+
+      expect(api).toHaveBeenCalledWith(expect.stringContaining('page=5'))
+    })
+
+    it('Should throw when api returns error', async () => {
+      vi.mocked(api).mockRejectedValueOnce({ error: 'message' })
+
+      await expect(async () => await fetchTitlesForParticipant(participants[0])).rejects.toThrow()
+    })
+
+    it('Should include region if set', async () => {
+      vi.mocked(api).mockResolvedValueOnce({ results: [] })
+
+      window.PlayPilotLinkInjections.region = 'nl'
+
+      await fetchTitlesForParticipant(participants[0])
+
+      expect(api).toHaveBeenCalledWith(`/titles/browse?api-token=some-token&language=en-US&region=nl&include_count=false&participant_sid=${participants[0].sid}&page=1`)
+    })
+  })
+})

package/src/tests/lib/api/titles.test.js

@@ -4,6 +4,7 @@ import { api } from '$lib/api/api'
 import { fetchSimilarTitles, fetchTitles } from '$lib/api/titles'
 import { title } from '$lib/fakeData'
 import { getApiToken } from '$lib/token'
+import { fakeFetch } from '../../helpers'
 
 vi.mock('$lib/token', () => ({
   getApiToken: vi.fn(),
@@ -13,10 +14,11 @@ vi.mock('$lib/api/api', () => ({
   api: vi.fn(),
 }))
 
-describe('$lib/api/ads', () => {
+describe('$lib/api/titles', () => {
   beforeEach(() => {
     vi.resetAllMocks()
     vi.mocked(getApiToken).mockReturnValue('some-token')
+    fakeFetch()
   })
 
   describe('fetchTitles', () => {

package/src/tests/routes/components/Editorial/ManualInjection.test.js

@@ -186,6 +186,48 @@ describe('ManualInjection.svelte', () => {
     })
   })
 
+  it('Should not select parent if content is too short but is in a paragraph', async () => {
+    vi.mocked(searchTitles).mockResolvedValueOnce([title])
+    vi.mocked(getIndexOfSelection).mockReturnValueOnce({ start: 0, end: 0 })
+
+    document.body.innerHTML = '<main><p>Some paragraph</p> <p>Some other paragraph</p></main>'
+
+    const container = document.querySelectorAll('p')[1]
+
+    // @ts-ignore
+    window.getSelection = vi.fn(() => ({
+      toString: () => 'Some other paragraph',
+      getRangeAt: () => ({
+        commonAncestorContainer: container,
+        startContainer: container,
+        startOffset: 0,
+        endOffset: 0,
+        cloneContents: () => ({ childNodes: [] }),
+      }),
+      anchorNode: container,
+      focusNode: container,
+    }))
+
+    const onsave = vi.fn()
+    const { getByText } = render(ManualInjection, { pageText: document.body.innerText, onsave })
+
+    await fireEvent.mouseUp(window)
+    await fireEvent.click(getByText(title.title))
+    await fireEvent.click(getByText('Add playlink'))
+
+    expect(onsave).toHaveBeenCalledWith({
+      sid: title.sid,
+      title: 'Some other paragraph',
+      sentence: 'Some other paragraph',
+      playpilot_url: `https://www.playpilot.com/show/${title.slug}`,
+      key: expect.any(String),
+      title_details: title,
+      manual: true,
+      phrase_before: expect.any(String),
+      phrase_after: expect.any(String),
+    })
+  })
+
   it('Should not select content if it is outside of given parent', async () => {
     vi.mocked(searchTitles).mockResolvedValueOnce([title])
     vi.mocked(getIndexOfSelection).mockReturnValueOnce({ start: 0, end: 0 })