@glossarist/concept-browser 0.7.139 → 0.7.141

package/src/__tests__/search-bar.test.ts

@@ -5,8 +5,12 @@ import { createRouter, createMemoryHistory } from 'vue-router';
 import SearchBar from '../components/SearchBar.vue';
 import { useVocabularyStore } from '../stores/vocabulary';
 import { useUiStore } from '../stores/ui';
+import { entryStatusColor, entryStatusLabel } from '../utils/concept-helpers';
 import type { Manifest, SearchHit } from '../adapters/types';
 
+const siteConfig = vi.hoisted(() => ({ value: null as null | { defaults: { language?: string; languageOrder?: string[] } } }));
+vi.mock('../config/use-site-config', () => ({ useSiteConfig: () => ({ config: siteConfig }) }));
+
 function makeManifest(): Manifest {
   return {
     id: 'test',
@@ -59,6 +63,8 @@ describe('SearchBar', () => {
   let store: ReturnType<typeof useVocabularyStore>;
 
   beforeEach(async () => {
+    localStorage.removeItem('searchSort');
+    siteConfig.value = null;
     pinia = createPinia();
     setActivePinia(pinia);
     router = await createTestRouter();
@@ -108,6 +114,88 @@ describe('SearchBar', () => {
     }
   });
 
+  it('clears shared search state and does not restore it after remount', async () => {
+    const hits: SearchHit[] = [makeHit({ designation: 'road network' })];
+    store.searchAcrossDatasets = vi.fn(async () => hits);
+    const ui = useUiStore();
+    const wrapper = mountSearch();
+    await wrapper.find('input').setValue('road');
+    await wrapper.find('form').trigger('submit');
+    await flushPromises();
+
+    expect(ui.searchQuery).toBe('road');
+    expect(wrapper.text()).toContain('road network');
+    expect(router.currentRoute.value.query.q).toBe('road');
+
+    const clearBtn = wrapper.findAll('button').find(b => b.find('svg').exists() && b.element.closest('.relative') !== null);
+    expect(clearBtn).toBeDefined();
+    await clearBtn!.trigger('click');
+    await flushPromises();
+
+    expect(wrapper.find('input').element.value).toBe('');
+    expect(ui.searchQuery).toBe('');
+    expect(wrapper.text()).not.toContain('road network');
+    expect(router.currentRoute.value.query.q).toBeUndefined();
+
+    wrapper.unmount();
+    const callsBeforeRemount = vi.mocked(store.searchAcrossDatasets).mock.calls.length;
+    const remounted = mountSearch();
+    await flushPromises();
+    expect(remounted.find('input').element.value).toBe('');
+    expect(vi.mocked(store.searchAcrossDatasets)).toHaveBeenCalledTimes(callsBeforeRemount);
+    remounted.unmount();
+  });
+
+  it('cancels a pending search debounce when cleared', async () => {
+    store.searchAcrossDatasets = vi.fn(async () => []);
+    const wrapper = mountSearch();
+    await wrapper.find('input').setValue('road');
+    expect(vi.getTimerCount()).toBe(1);
+
+    const clearBtn = wrapper.findAll('button').find(b => b.find('svg').exists() && b.element.closest('.relative') !== null);
+    expect(clearBtn).toBeDefined();
+    await clearBtn!.trigger('click');
+    expect(vi.getTimerCount()).toBe(0);
+
+    await vi.advanceTimersByTimeAsync(300);
+    expect(store.searchAcrossDatasets).not.toHaveBeenCalled();
+    wrapper.unmount();
+  });
+
+  it.each(['resolve', 'reject'] as const)('ignores an in-flight search that %s after clearing', async (outcome) => {
+    let resolveSearch!: (hits: SearchHit[]) => void;
+    let rejectSearch!: (error: Error) => void;
+    store.searchAcrossDatasets = vi.fn(() => new Promise<SearchHit[]>((resolve, reject) => {
+      resolveSearch = resolve;
+      rejectSearch = reject;
+    }));
+    const ui = useUiStore();
+    const wrapper = mountSearch();
+    await wrapper.find('input').setValue('road');
+    await wrapper.find('form').trigger('submit');
+    expect(store.searchAcrossDatasets).toHaveBeenCalledWith('road');
+    expect(wrapper.html()).toContain('animate-spin');
+
+    await wrapper.get('button[type="button"]').trigger('click');
+    await flushPromises();
+
+    if (outcome === 'resolve') {
+      resolveSearch([makeHit({ designation: 'road network' })]);
+    } else {
+      rejectSearch(new Error('Late search failure'));
+    }
+    await flushPromises();
+
+    expect(wrapper.find('input').element.value).toBe('');
+    expect(ui.searchQuery).toBe('');
+    expect(wrapper.find('.search-results').exists()).toBe(false);
+    expect(wrapper.text()).not.toContain('road network');
+    expect(wrapper.text()).not.toContain('Late search failure');
+    expect(router.currentRoute.value.query.q).toBeUndefined();
+    expect(wrapper.html()).not.toContain('animate-spin');
+    wrapper.unmount();
+  });
+
   it('shows loading spinner during search', async () => {
     const wrapper = mountSearch();
     // Mock a slow search
@@ -137,6 +225,211 @@ describe('SearchBar', () => {
     expect(wrapper.text()).toContain('road user');
   });
 
+  it('lists English before higher-ranked French hits and navigates in rendered order', async () => {
+    store.searchAcrossDatasets = vi.fn(async () => [
+      makeHit({ conceptId: 'french', designation: 'route', language: 'fra' }),
+      makeHit({ conceptId: 'english', designation: 'road', language: 'eng' }),
+    ]);
+    const wrapper = mountSearch();
+    await wrapper.find('input').setValue('road');
+    await wrapper.find('form').trigger('submit');
+    await flushPromises();
+    expect(wrapper.findAll('.card-hover').map(hit => hit.text())).toEqual([
+      expect.stringContaining('road'), expect.stringContaining('route'),
+    ]);
+    await wrapper.find('input').trigger('keydown', { key: 'ArrowDown' });
+    expect(wrapper.find('.search-hit-selected').text()).toContain('road');
+
+    await wrapper.get('select').setValue('relevance');
+    expect(useUiStore().searchSort).toBe('relevance');
+    expect(localStorage.getItem('searchSort')).toBe('relevance');
+    expect(wrapper.find('.search-hit-selected').exists()).toBe(false);
+    expect(wrapper.findAll('.card-hover').map(hit => hit.text())).toEqual([
+      expect.stringContaining('route'), expect.stringContaining('road'),
+    ]);
+    expect(store.searchAcrossDatasets).toHaveBeenCalledTimes(1);
+    wrapper.unmount();
+  });
+
+  it('includes an English hit beyond raw position 100 on the first page', async () => {
+    store.searchAcrossDatasets = vi.fn(async () => [
+      ...Array.from({ length: 101 }, (_, i) => makeHit({ conceptId: `fra-${i}`, language: 'fra', designation: `route ${i}` })),
+      makeHit({ conceptId: 'english', designation: 'road' }),
+    ]);
+    const wrapper = mountSearch();
+    await wrapper.find('input').setValue('road');
+    await wrapper.find('form').trigger('submit');
+    await flushPromises();
+    expect(wrapper.findAll('.card-hover')[0].text()).toContain('road');
+    expect(wrapper.text()).toContain('1–20 of 102');
+    await wrapper.findAll('button').find(button => button.text() === 'Next')!.trigger('click');
+    expect(wrapper.text()).toContain('21–40 of 102');
+    await wrapper.get('select').setValue('relevance');
+    expect(wrapper.text()).toContain('1–20 of 102');
+    expect(wrapper.findAll('.card-hover')[0].text()).toContain('route 0');
+    wrapper.unmount();
+  });
+
+  it('keeps the English designation when the same concept first matches in French', async () => {
+    store.initialized = true;
+    const english = makeHit({ designation: 'road' });
+    store.datasets.set('test', {
+      manifest: makeManifest(), index: [], ensureAllChunksLoaded: async () => {},
+      search: () => [makeHit({ language: 'fra', designation: 'route' }), english],
+    } as any);
+    expect(await store.searchAcrossDatasets('road')).toEqual([english]);
+  });
+
+  it.each([
+    { language: 'fra' },
+    { language: 'eng', languageOrder: ['fra', 'eng'] },
+  ])('uses configured priorities for listing and concept deduplication: %j', async (defaults) => {
+    siteConfig.value = { defaults };
+    store.initialized = true;
+    store.datasets.set('test', {
+      manifest: makeManifest(), index: [], ensureAllChunksLoaded: async () => {},
+      search: () => [
+        makeHit({ conceptId: 'shared', language: 'eng', designation: 'English duplicate' }),
+        makeHit({ conceptId: 'english', language: 'eng', designation: 'road' }),
+        makeHit({ conceptId: 'shared', language: 'fra', designation: 'route' }),
+      ],
+    } as any);
+    const wrapper = mountSearch();
+    await wrapper.find('input').setValue('road');
+    await wrapper.find('form').trigger('submit');
+    await flushPromises();
+    expect(wrapper.findAll('.card-hover').map(hit => hit.text())).toEqual([
+      expect.stringContaining('route'), expect.stringContaining('road'),
+    ]);
+    expect(wrapper.text()).not.toContain('English duplicate');
+    wrapper.unmount();
+  });
+
+  it('paginates all 23 hits in pages of 20 and disables boundary navigation', async () => {
+    const hits = Array.from({ length: 23 }, (_, index) => makeHit({
+      conceptId: `term-${index + 1}`,
+      designation: `term ${index + 1}`,
+    }));
+    store.searchAcrossDatasets = vi.fn(async () => hits);
+    const wrapper = mountSearch();
+    await wrapper.find('input').setValue('term');
+    await wrapper.find('form').trigger('submit');
+    await flushPromises();
+
+    const pageButtons = () => wrapper.findAll('button').filter(button => ['Prev', 'Next'].includes(button.text()));
+    const hitButtons = () => wrapper.findAll('.search-results button').filter(button => !['Prev', 'Next'].includes(button.text()));
+    expect(wrapper.text()).toContain('1–20 of 23');
+    expect(hitButtons()).toHaveLength(20);
+    expect(hitButtons().map(button => button.text())).toEqual(expect.arrayContaining(
+      hits.slice(0, 20).map(hit => expect.stringContaining(hit.designation)),
+    ));
+    expect(pageButtons().map(button => button.text())).toEqual(['Prev', 'Next']);
+    expect(pageButtons()[0].element.disabled).toBe(true);
+    expect(pageButtons()[1].element.disabled).toBe(false);
+
+    await pageButtons()[1].trigger('click');
+    await vi.advanceTimersByTimeAsync(300);
+    await flushPromises();
+    expect(wrapper.text()).toContain('21–23 of 23');
+    expect(hitButtons()).toHaveLength(3);
+    expect(hitButtons().map(button => button.text())).toEqual(expect.arrayContaining([
+      expect.stringContaining('term 21'),
+      expect.stringContaining('term 22'),
+      expect.stringContaining('term 23'),
+    ]));
+    expect(pageButtons()[0].element.disabled).toBe(false);
+    expect(pageButtons()[1].element.disabled).toBe(true);
+
+    await pageButtons()[0].trigger('click');
+    expect(wrapper.text()).toContain('1–20 of 23');
+    expect(hitButtons()).toHaveLength(20);
+    await pageButtons()[1].trigger('click');
+    expect(hitButtons().map(button => button.text()).join(' ')).toContain('term 23');
+    wrapper.unmount();
+  });
+
+  it('resets pagination when a new search is submitted', async () => {
+    const firstHits = Array.from({ length: 23 }, (_, index) => makeHit({ conceptId: `first-${index + 1}`, designation: `first ${index + 1}` }));
+    const secondHits = [makeHit({ conceptId: 'second-1', designation: 'second result' })];
+    store.searchAcrossDatasets = vi.fn(async (query: string) => query === 'first' ? firstHits : secondHits);
+    const wrapper = mountSearch();
+    const input = wrapper.find('input');
+    await input.setValue('first');
+    await wrapper.find('form').trigger('submit');
+    await flushPromises();
+    await wrapper.findAll('button').find(button => button.text() === 'Next')!.trigger('click');
+    expect(wrapper.text()).toContain('21–23 of 23');
+
+    await input.setValue('second');
+    await wrapper.find('form').trigger('submit');
+    await flushPromises();
+    expect(wrapper.text()).toContain('second result');
+    expect(wrapper.text()).not.toContain('21–23 of 23');
+    expect(wrapper.text()).toContain('1–1 of 1');
+    const paginationButtons = wrapper.findAll('button').filter(button => ['Prev', 'Next'].includes(button.text()));
+    expect(paginationButtons).toHaveLength(2);
+    expect(paginationButtons.every(button => button.element.disabled)).toBe(true);
+    wrapper.unmount();
+  });
+
+  it('resets keyboard selection on page change and selects only current page hits', async () => {
+    const hits = Array.from({ length: 23 }, (_, index) => makeHit({
+      conceptId: `keyboard-${index + 1}`,
+      designation: `keyboard ${index + 1}`,
+    }));
+    store.searchAcrossDatasets = vi.fn(async () => hits);
+    const wrapper = mountSearch();
+    const input = wrapper.find('input');
+    await input.setValue('keyboard');
+    await wrapper.find('form').trigger('submit');
+    await flushPromises();
+
+    for (let index = 0; index < 20; index++) await input.trigger('keydown', { key: 'ArrowDown' });
+    expect(wrapper.find('.search-hit-selected').text()).toContain('keyboard 20');
+    await wrapper.findAll('button').find(button => button.text() === 'Next')!.trigger('click');
+    expect(wrapper.find('.search-hit-selected').exists()).toBe(false);
+    await input.trigger('keydown', { key: 'ArrowDown' });
+    expect(wrapper.find('.search-hit-selected').text()).toContain('keyboard 21');
+    await input.trigger('keydown', { key: 'ArrowDown' });
+    expect(wrapper.find('.search-hit-selected').text()).toContain('keyboard 22');
+    await input.trigger('keydown', { key: 'ArrowDown' });
+    expect(wrapper.find('.search-hit-selected').text()).toContain('keyboard 23');
+    await input.trigger('keydown', { key: 'ArrowDown' });
+    expect(wrapper.find('.search-hit-selected').text()).toContain('keyboard 23');
+    await input.trigger('keydown', { key: 'Enter' });
+    await flushPromises();
+    expect(router.currentRoute.value.params.conceptId).toBe('keyboard-23');
+    wrapper.unmount();
+  });
+
+  it('keeps hits beyond the fifth page reachable', async () => {
+    const hits = Array.from({ length: 103 }, (_, index) => makeHit({
+      conceptId: `many-${index + 1}`,
+      designation: `many ${index + 1}`,
+    }));
+    store.searchAcrossDatasets = vi.fn(async () => hits);
+    const wrapper = mountSearch();
+    await wrapper.find('input').setValue('many');
+    await wrapper.find('form').trigger('submit');
+    await flushPromises();
+
+    for (let page = 1; page < 6; page++) {
+      const next = wrapper.findAll('button').find(button => button.text() === 'Next');
+      expect(next).toBeDefined();
+      expect(next!.element.disabled).toBe(false);
+      await next!.trigger('click');
+    }
+    expect(wrapper.text()).toContain('101–103 of 103');
+    const pageHits = wrapper.findAll('.search-results button').filter(button => !['Prev', 'Next'].includes(button.text()));
+    expect(pageHits.map(button => button.text())).toEqual(expect.arrayContaining([
+      expect.stringContaining('many 101'),
+      expect.stringContaining('many 102'),
+      expect.stringContaining('many 103'),
+    ]));
+    expect(wrapper.findAll('button').find(button => button.text() === 'Next')!.element.disabled).toBe(true);
+    wrapper.unmount();
+  });
+
   it('shows empty state when no results', async () => {
     store.searchAcrossDatasets = vi.fn(async () => []);
     const wrapper = mountSearch();
@@ -189,6 +482,17 @@ describe('SearchBar', () => {
     expect(wrapper.text()).toContain('ID match');
   });
 
+  it('shows the coloured entry status badge for a superseded hit', async () => {
+    store.searchAcrossDatasets = vi.fn(async () => [makeHit({ status: 'superseded' })]);
+    const wrapper = mountSearch();
+    await wrapper.find('input').setValue('road');
+    await wrapper.find('form').trigger('submit');
+    await flushPromises();
+    const badge = wrapper.findAll('.badge').find(b => b.text() === entryStatusLabel('superseded'));
+    expect(badge).toBeDefined();
+    expect(badge!.classes()).toEqual(expect.arrayContaining(entryStatusColor('superseded').split(' ')));
+  });
+
   it('updates URL query parameter on search', async () => {
     store.searchAcrossDatasets = vi.fn(async () => []);
     const wrapper = mountSearch();

package/src/__tests__/search-results.test.ts

@@ -0,0 +1,54 @@
+import { describe, it, expect } from 'vitest';
+import { mount } from '@vue/test-utils';
+import SearchResults from '../components/SearchResults.vue';
+import { entryStatusColor, entryStatusDefinition, entryStatusLabel } from '../utils/concept-helpers';
+import { setupPinia, makeSearchHit } from './test-helpers';
+
+describe('SearchResults', () => {
+  function mountResults(hits: ReturnType<typeof makeSearchHit>[]) {
+    const pinia = setupPinia();
+    return mount(SearchResults, {
+      props: {
+        loading: false,
+        searchError: null,
+        searched: true,
+        searchQuery: 'term',
+        results: hits,
+        groupedResults: [{ registerId: 'test', title: 'Test Dataset', hits }],
+        selectedIdx: -1,
+      },
+      global: { plugins: [pinia] },
+    });
+  }
+
+  it('shows entry status labels, taxonomy colors, and definitions while preserving search-hit behavior', async () => {
+    const valid = makeSearchHit({ conceptId: '1', designation: 'Current term', language: 'eng', matchField: 'id', status: 'valid' });
+    const superseded = makeSearchHit({ conceptId: '2', designation: 'Old term', language: 'fra', status: 'superseded' });
+    const wrapper = mountResults([valid, superseded]);
+    const buttons = wrapper.findAll('button');
+    const validBadge = buttons[0].findAll('.badge').find(badge => badge.text() === entryStatusLabel('valid'));
+    const supersededBadge = buttons[1].findAll('.badge').find(badge => badge.text() === entryStatusLabel('superseded'));
+
+    expect(validBadge).toBeDefined();
+    expect(validBadge!.classes()).toContain('badge-green');
+    expect(validBadge!.classes()).toEqual(expect.arrayContaining(entryStatusColor('valid').split(' ')));
+    expect(validBadge!.attributes('title')).toBe(entryStatusDefinition('valid'));
+    expect(supersededBadge).toBeDefined();
+    expect(supersededBadge!.classes()).toContain('bg-red-50');
+    expect(supersededBadge!.classes()).toContain('text-red-700');
+    expect(supersededBadge!.classes()).toEqual(expect.arrayContaining(entryStatusColor('superseded').split(' ')));
+    expect(supersededBadge!.attributes('title')).toBe(entryStatusDefinition('superseded'));
+
+    expect(buttons[0].text()).toContain('Current term');
+    expect(buttons[0].text()).toContain('ID');
+    expect(buttons[0].text()).toContain('English');
+    expect(buttons[1].text()).toContain('French');
+    await buttons[0].trigger('click');
+    expect(wrapper.emitted('goHit')?.[0]).toEqual([valid]);
+  });
+
+  it('does not render an entry status badge when a hit has no status', () => {
+    const wrapper = mountResults([makeSearchHit({ designation: 'Unclassified term' })]);
+    expect(wrapper.findAll('.badge')).toHaveLength(0);
+  });
+});

package/src/__tests__/search-utils.test.ts

@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest';
-import { deduplicateSearchHits } from '../utils/search';
+import { deduplicateSearchHits, orderSearchHits } from '../utils/search';
 import type { SearchHit } from '../adapters/types';
 
 function makeHit(overrides: Partial<SearchHit> = {}): SearchHit {
@@ -56,4 +56,67 @@ describe('deduplicateSearchHits', () => {
     const result = deduplicateSearchHits([hit1, hit2]);
     expect(result.length).toBe(2);
   });
+
+  it('keeps the designation in the earlier priority language', () => {
+    const fraHit = makeHit({ registerId: 'viml', conceptId: '1', language: 'fra' });
+    const engHit = makeHit({ registerId: 'viml', conceptId: '1', language: 'eng' });
+
+    const result = deduplicateSearchHits([fraHit, engHit], ['eng']);
+
+    expect(result).toEqual([engHit]);
+    expect(deduplicateSearchHits([engHit, fraHit], ['eng'])).toEqual([engHit]);
+    expect(deduplicateSearchHits([fraHit, engHit])).toEqual([fraHit]);
+    expect(deduplicateSearchHits([fraHit, engHit], ['eng', 'fra'])).toEqual([engHit]);
+  });
+
+  it('keeps the first designation when language tiers are equal', () => {
+    const spaHit = makeHit({ registerId: 'viml', conceptId: '1', language: 'spa' });
+    const deuHit = makeHit({ registerId: 'viml', conceptId: '1', language: 'deu' });
+
+    const result = deduplicateSearchHits([spaHit, deuHit], ['eng', 'fra']);
+
+    expect(result).toEqual([spaHit]);
+  });
+
+  it('keeps designation matches ahead of ID matches with language priorities', () => {
+    const idHit = makeHit({ registerId: 'viml', conceptId: '1', matchField: 'id', language: 'eng' });
+    const desHit = makeHit({ registerId: 'viml', conceptId: '1', matchField: 'designation', language: '' });
+
+    expect(deduplicateSearchHits([idHit, desHit], ['eng'])).toEqual([desHit]);
+  });
+});
+
+describe('orderSearchHits', () => {
+  it('orders ID hits first, then configured languages, then one stable unlisted tier', () => {
+    const hits = [
+      makeHit({ conceptId: 'unlisted-a', language: 'ita' }),
+      makeHit({ conceptId: 'fra', language: 'fra' }),
+      makeHit({ conceptId: 'id', language: '', matchField: 'id' }),
+      makeHit({ conceptId: 'spa', language: 'spa' }),
+      makeHit({ conceptId: 'eng', language: 'eng' }),
+      makeHit({ conceptId: 'unlisted-b', language: 'deu' }),
+    ];
+
+    const result = orderSearchHits(hits, ['eng', 'fra', 'spa']);
+
+    expect(result.map(({ conceptId }) => conceptId)).toEqual([
+      'id', 'eng', 'fra', 'spa', 'unlisted-a', 'unlisted-b',
+    ]);
+  });
+
+  it('preserves incoming score and alphabetical order within each language tier without mutating input', () => {
+    const fra = { ...makeHit({ conceptId: 'fra', language: 'fra' }), _score: 9 };
+    const engHigh = { ...makeHit({ conceptId: 'eng-high', designation: 'zebra' }), _score: 8 };
+    const spa = { ...makeHit({ conceptId: 'spa', language: 'spa' }), _score: 7 };
+    const engAlpha = { ...makeHit({ conceptId: 'eng-alpha', designation: 'alpha' }), _score: 2 };
+    const engBeta = { ...makeHit({ conceptId: 'eng-beta', designation: 'beta' }), _score: 2 };
+    const hits = [fra, engHigh, spa, engAlpha, engBeta];
+    const original = [...hits];
+
+    const result = orderSearchHits(hits, ['eng']);
+
+    expect(result).toEqual([engHigh, engAlpha, engBeta, fra, spa]);
+    expect(hits).toEqual(original);
+    expect(result).not.toBe(hits);
+  });
 });