@playpilot/tpi 5.27.1 → 5.29.0

package/package.json

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

package/src/routes/components/Debugger.svelte

@@ -38,9 +38,7 @@
   function onkeydown(event: KeyboardEvent): void {
     if (shown) return
 
-    const key = event.key
-
-    lastInputs.push(key)
+    lastInputs.push(event.key)
 
     // Check all secrets. Both "tpidebug" and "debugtpi" are accepted because remembering is hard.
     // It's checked by comparing the last inputs to each secret.

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

@@ -152,7 +152,7 @@
   .loading-bar-progress {
     height: 0.5em;
     border-radius: 0.25rem;
-    background: theme(dark);
+    background: theme(lighter);
   }
 
   .loading-bar-fill {

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

@@ -239,14 +239,7 @@
 </section>
 
 <style lang="scss">
-  @use "lib/scss/_theme";
-
   .editor {
-    // Reset any possible theme overrides back to their defaults
-    @each $name, $value in theme.$variables {
-      --playpilot-#{$name}: #{$value};
-    }
-
     z-index: 2147483646; // 1 less than as high as she goes;
     display: flex;
     flex-direction: column;
@@ -375,7 +368,7 @@
 
     &[disabled] {
       opacity: 0.75;
-      background: theme(light);
+      background: theme(lighter);
       color: theme(content-light);
     }
   }

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

@@ -266,7 +266,7 @@
 
     &[disabled] {
       cursor: default;
-      background: theme(light);
+      background: theme(lighter);
       opacity: 0.5;
       color: theme(text-color-alt);
     }

package/src/routes/components/Editorial/Search/TitleSearch.svelte

@@ -78,7 +78,7 @@
     height: 30vh;
     max-height: margin(10);
     border-radius: margin(0.5);
-    background: theme(light);
+    background: theme(lighter);
     scrollbar-width: thin;
     overflow: auto;
   }

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

@@ -18,7 +18,7 @@
     padding: margin(0.5) margin(1);
     border: 0;
     border-radius: margin(2);
-    background: theme(light);
+    background: theme(lighter);
     color: theme(text-color-alt);
     font-size: margin(0.75);
     font-family: theme(font-family);

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

@@ -1,7 +1,9 @@
 <script lang="ts">
   import { fetchParticipantsForTitle } from '$lib/api/participants'
   import { TrackingEvent } from '$lib/enums/TrackingEvent'
+  import { getLinkInjectionElements, getLinkInjectionsParentElement, getPageText } from '$lib/injection'
   import { openModal } from '$lib/modal'
+  import { cleanPhrase, findNumberOfMatchesInString } from '$lib/text'
   import { track } from '$lib/tracking'
   import type { ParticipantData } from '$lib/types/participant'
   import type { TitleData } from '$lib/types/title'
@@ -13,6 +15,31 @@
 
   const { title }: Props = $props()
 
+  /**
+   * 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
+   * boosted. Often times if an actor is mentioned at least once, their full name will be somewhere in the
+   * page text, so the goal is still the same; to list participants that are mentioned in the page text before
+   * other participants.
+   */
+  function orderParticipantsByPageTextOccurrence(participants: ParticipantData[]): ParticipantData[] {
+    const pageText = cleanPhrase(getPageText(getLinkInjectionElements(getLinkInjectionsParentElement())))
+
+    // Create a new object with all participants by their sid with the number of times their names appear in the page text
+    const participantsByOccurrence: Record<string, { participant: ParticipantData, count: number }> = {}
+    for(const participant of participants) {
+      const count = findNumberOfMatchesInString(pageText, cleanPhrase(participant.name))
+
+      participantsByOccurrence[participant.sid] = { participant, count }
+    }
+
+    // Sort all participants by their occurrences. If a participant did not occur their positioned will be retained
+    // relative to where it was before
+    const participantsSortedByCount = Object.values(participantsByOccurrence).sort((a, b) => b.count - a.count)
+
+    return participantsSortedByCount.map(({ participant }) => participant)
+  }
+
   function onclick(event: MouseEvent, participant: ParticipantData): void {
     openModal({ event, type: 'participant', data: participant })
     track(TrackingEvent.ParticipantClick, null, { title_source: title.original_title, participant: participant.name })
@@ -28,7 +55,7 @@
 {:then participants}
   {#if participants?.length}
     <Rail heading="Cast">
-      {#each participants.slice(0, 15) as participant}
+      {#each orderParticipantsByPageTextOccurrence(participants).slice(0, 15) as participant}
         <button class="participant" data-testid="participant" onclick={event => onclick(event, participant)}>
           <span class="truncate">{participant.name}</span>
 

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

@@ -1,5 +1,5 @@
 import { fireEvent, render, waitFor } from '@testing-library/svelte'
-import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { describe, expect, it, vi } from 'vitest'
 
 import ParticipantsRail from '../../../../routes/components/Rails/ParticipantsRail.svelte'
 import { openModal } from '$lib/modal'
@@ -21,10 +21,13 @@ vi.mock('$lib/api/participants', () => ({
 }))
 
 describe('ParticipantsRail.svelte', () => {
+  beforeEach(() => {
+    document.body.innerHTML = ''
+  })
+
   it('Should render each given participant', async () => {
     vi.mocked(fetchParticipantsForTitle).mockResolvedValueOnce(participants)
 
-    // @ts-ignore
     const { getByText } = render(ParticipantsRail, { title })
 
     await waitFor(() => {
@@ -33,6 +36,19 @@ describe('ParticipantsRail.svelte', () => {
     })
   })
 
+  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([])