Fix Part of speech not rendered in dictionary preview on page load

sillsdev · Oct 29, 2024 · 4e7519b · 4e7519b
1 parent 18ad522
commit 4e7519b
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 22 deletions.
diff --git a/frontend/tests/viewerPage.test.ts b/frontend/tests/viewerPage.test.ts
@@ -1,10 +1,10 @@
 import * as testEnv from './envVars';
 
-import { UserDashboardPage } from './pages/userDashboardPage';
-import { ViewerPage } from './pages/viewerPage';
-import { expect } from '@playwright/test';
-import { loginAs } from './utils/authHelpers';
-import { test } from './fixtures';
+import {UserDashboardPage} from './pages/userDashboardPage';
+import {ViewerPage} from './pages/viewerPage';
+import {expect} from '@playwright/test';
+import {loginAs} from './utils/authHelpers';
+import {test} from './fixtures';
 
 test('navigate to viewer', async ({ page }) => {
   // Step 1: Login
@@ -58,7 +58,7 @@ test('entry details', async ({ page }) => {
   // -- Dictionary Preview
   const expectPreview = expect(viewerPage.entryDictionaryPreview);
   await expectPreview.toContainText('nthembe');
-  await expectPreview.toContainText(' N. ');
+  await expectPreview.toContainText(' Nome ');
   await expectPreview.toContainText(' Eng ');
   await expectPreview.toContainText('animal skin alone, after it is taken off the body');
   await expectPreview.toContainText(' Por ');

diff --git a/frontend/viewer/src/lib/DictionaryEntry.svelte b/frontend/viewer/src/lib/DictionaryEntry.svelte
@@ -45,13 +45,7 @@
     .map(ws => ({ws: ws.wsId, value: headword(entry, ws.wsId)}))
     .filter(({value}) => !!value);
 
-  const partsOfSpeech = usePartsOfSpeech();
-  function partOfSpeechLabel(id: string | undefined): string | undefined {
-    if (!id) return undefined;
-    const partOfSpeech = $partsOfSpeech.find(pos => pos.id === id);
-    if (!partOfSpeech) return undefined;
-    return pickBestAlternative(partOfSpeech.name, 'analysis', $allWritingSystems)
-  }
+  const partsOfSpeech = usePartsOfSpeech(allWritingSystems);
 </script>
 
 <div>
@@ -68,9 +62,9 @@
       <br />
       <strong class="ml-2">{i + 1} · </strong>
     {/if}
-    {@const partOfSpeech = partOfSpeechLabel(sense.partOfSpeechId)}
+    {@const partOfSpeech = $partsOfSpeech.find(pos => pos.id === sense.partOfSpeechId)?.label}
     {#if partOfSpeech}
-      <i>{partOfSpeech}.</i>
+      <i>{partOfSpeech}</i>
     {/if}
     <span>
       {#each $allWritingSystems.analysis as ws}

diff --git a/frontend/viewer/src/lib/entry-editor/object-editors/SenseEditor.svelte b/frontend/viewer/src/lib/entry-editor/object-editors/SenseEditor.svelte
@@ -12,9 +12,9 @@
 
   export let sense: ISense;
   export let readonly: boolean = false;
-  const partsOfSpeech = usePartsOfSpeech();
-  const semanticDomains = useSemanticDomains();
   const writingSystems = useWritingSystems();
+  const partsOfSpeech = usePartsOfSpeech(writingSystems);
+  const semanticDomains = useSemanticDomains();
   function setSemanticDomains(ids: string[]): void {
     sense.semanticDomains = ids.map(id => $semanticDomains.find(sd => sd.id === id)).filter((sd): sd is SemanticDomain => !!sd);
   }
@@ -34,7 +34,7 @@
                     wsType="analysis" />
   <SingleOptionEditor on:change
                       bind:value={sense.partOfSpeechId}
-                      options={$partsOfSpeech.map(pos => ({value: pos.id, label: pickBestAlternative(pos.name, 'analysis', $writingSystems)}))}
+                      options={$partsOfSpeech.map(pos => ({value: pos.id, label: pos.label}))}
                       {readonly}
                       id="partOfSpeechId"
                       wsType="first-analysis" />

diff --git a/frontend/viewer/src/lib/parts-of-speech.ts b/frontend/viewer/src/lib/parts-of-speech.ts
@@ -1,10 +1,13 @@
 import {derived, type Readable, type Writable, writable} from 'svelte/store';
-import type {PartOfSpeech} from './mini-lcm';
+import type {PartOfSpeech, WritingSystems} from './mini-lcm';
 import {useLexboxApi} from './services/service-provider';
+import {pickBestAlternative} from './utils';
+
+type LabeledPartOfSpeech = PartOfSpeech & {label: string};
 
 let partsOfSpeechStore: Writable<PartOfSpeech[] | null> | null = null;
 
-export function usePartsOfSpeech(): Readable<PartOfSpeech[]> {
+export function usePartsOfSpeech(writingSystemsStore: Readable<WritingSystems>): Readable<LabeledPartOfSpeech[]> {
   if (partsOfSpeechStore === null) {
     partsOfSpeechStore = writable<PartOfSpeech[] | null>([], (set) => {
       useLexboxApi().GetPartsOfSpeech().then(partsOfSpeech => {
@@ -15,7 +18,10 @@ export function usePartsOfSpeech(): Readable<PartOfSpeech[]> {
       });
     });
   }
-  return derived(partsOfSpeechStore, (partsOfSpeech) => {
-    return partsOfSpeech ?? [];
+  return derived([partsOfSpeechStore, writingSystemsStore], ([partsOfSpeech, writingSystems]) => {
+    return (partsOfSpeech ?? []).map(partOfSpeech => ({
+      ...partOfSpeech,
+      label: pickBestAlternative(partOfSpeech.name, 'analysis', writingSystems),
+    }));
   });
 }