From c42440f52fa560ea7971f6b8d3aff8289f624098 Mon Sep 17 00:00:00 2001
From: Yugay Vasiliy <vasyayugay99@gmail.com>
Date: Mon, 19 Feb 2024 10:41:18 +0000
Subject: [PATCH] Added provenance search tab for fragmentarium Added tests for
 proveance search tab ui

---
 .../application/FragmentService.test.ts       |   1 +
 .../application/FragmentService.ts            |   4 +
 .../infrastructure/FragmentRepository.ts      |   3 +
 .../ui/ArchaeologySearchForm.sass             |   3 +
 .../ui/ArchaeologySearchForm.tsx              |  38 ++++++
 src/fragmentarium/ui/SearchForm.test.tsx      |  36 +++++
 src/fragmentarium/ui/SearchForm.tsx           |  21 +++
 src/fragmentarium/ui/SearchHelp.tsx           |  10 ++
 .../ui/front-page/Fragmentarium.test.tsx      |   1 +
 .../ui/search/FragmentariumSearch.test.tsx    |   1 +
 .../FragmentariumSearch.test.tsx.snap         | 126 +++++++++++++++---
 src/query/FragmentQuery.ts                    |   1 +
 12 files changed, 223 insertions(+), 22 deletions(-)
 create mode 100644 src/fragmentarium/ui/ArchaeologySearchForm.sass
 create mode 100644 src/fragmentarium/ui/ArchaeologySearchForm.tsx

diff --git a/src/fragmentarium/application/FragmentService.test.ts b/src/fragmentarium/application/FragmentService.test.ts
index 207c0023b..dbca368e0 100644
--- a/src/fragmentarium/application/FragmentService.test.ts
+++ b/src/fragmentarium/application/FragmentService.test.ts
@@ -59,6 +59,7 @@ const fragmentRepository = {
   updateNotes: jest.fn(),
   updateLemmatization: jest.fn(),
   fetchGenres: jest.fn(),
+  fetchArchaeologies: jest.fn(),
   updateGenres: jest.fn(),
   updateScript: jest.fn(),
   updateDate: jest.fn(),
diff --git a/src/fragmentarium/application/FragmentService.ts b/src/fragmentarium/application/FragmentService.ts
index 2c0c7defb..c09ce61a1 100644
--- a/src/fragmentarium/application/FragmentService.ts
+++ b/src/fragmentarium/application/FragmentService.ts
@@ -56,6 +56,7 @@ export interface FragmentRepository {
   ): Bluebird<Fragment>
   findInCorpus(number: string): Bluebird<ReadonlyArray<ManuscriptAttestation>>
   fetchGenres(): Bluebird<string[][]>
+  fetchArchaeologies(): Bluebird<string[][]>
   fetchPeriods(): Bluebird<string[]>
   updateGenres(number: string, genres: Genres): Bluebird<Fragment>
   updateScript(number: string, script: Script): Bluebird<Fragment>
@@ -176,6 +177,9 @@ export class FragmentService {
   fetchGenres(): Bluebird<string[][]> {
     return this.fragmentRepository.fetchGenres()
   }
+  fetchArchaeologies(): Bluebird<string[][]> {
+    return this.fragmentRepository.fetchArchaeologies()
+  }
 
   fetchPeriods(): Bluebird<string[]> {
     return this.fragmentRepository.fetchPeriods()
diff --git a/src/fragmentarium/infrastructure/FragmentRepository.ts b/src/fragmentarium/infrastructure/FragmentRepository.ts
index 6841a81da..0cae0c5c3 100644
--- a/src/fragmentarium/infrastructure/FragmentRepository.ts
+++ b/src/fragmentarium/infrastructure/FragmentRepository.ts
@@ -196,6 +196,9 @@ class ApiFragmentRepository
   fetchGenres(): Promise<string[][]> {
     return this.apiClient.fetchJson('/genres', false)
   }
+  fetchArchaeologies(): Promise<string[][]> {
+    return this.apiClient.fetchJson('/provenances', false)
+  }
 
   fetchPeriods(): Promise<string[]> {
     return this.apiClient.fetchJson('/periods', false)
diff --git a/src/fragmentarium/ui/ArchaeologySearchForm.sass b/src/fragmentarium/ui/ArchaeologySearchForm.sass
new file mode 100644
index 000000000..9cc213404
--- /dev/null
+++ b/src/fragmentarium/ui/ArchaeologySearchForm.sass
@@ -0,0 +1,3 @@
+.archaeology-selector
+    &__menu
+        z-index: 99 !important
\ No newline at end of file
diff --git a/src/fragmentarium/ui/ArchaeologySearchForm.tsx b/src/fragmentarium/ui/ArchaeologySearchForm.tsx
new file mode 100644
index 000000000..d3e63a616
--- /dev/null
+++ b/src/fragmentarium/ui/ArchaeologySearchForm.tsx
@@ -0,0 +1,38 @@
+import React from 'react'
+import withData from 'http/withData'
+import Select from 'react-select'
+import FragmentService from 'fragmentarium/application/FragmentService'
+import './ArchaeologySearchForm.sass'
+
+export default withData<
+  {
+    onChange: (value: string | null) => void
+    value?: string | null
+  },
+  { fragmentService: FragmentService },
+  ReadonlyArray<ReadonlyArray<string>>
+>(
+  ({ data, value, onChange }) => {
+    const options = data.map((archaeology) => ({
+      value: archaeology[0],
+      label: archaeology[0],
+    }))
+    const defaultOption = value ? { value: value, label: value } : null
+
+    return (
+      <Select
+        aria-label="select-archaeology"
+        placeholder="Provenance"
+        options={options}
+        value={defaultOption}
+        onChange={(selection) => {
+          onChange(selection?.value || null)
+        }}
+        isSearchable={true}
+        classNamePrefix={'archaeology-selector'}
+        isClearable
+      />
+    )
+  },
+  (props) => props.fragmentService.fetchArchaeologies()
+)
diff --git a/src/fragmentarium/ui/SearchForm.test.tsx b/src/fragmentarium/ui/SearchForm.test.tsx
index 20f164df2..5bd8fe295 100644
--- a/src/fragmentarium/ui/SearchForm.test.tsx
+++ b/src/fragmentarium/ui/SearchForm.test.tsx
@@ -41,6 +41,13 @@ const genres = [
   ['MONUMENTAL'],
 ]
 
+const provenances = [
+  ['Standard Text'],
+  ['Assyria'],
+  ['Aššur'],
+  ['Dūr-Katlimmu'],
+]
+
 let query: FragmentQuery
 
 let history: MemoryHistory
@@ -82,6 +89,9 @@ beforeEach(async () => {
     Promise.resolve(Object.keys(Periods))
   )
   fragmentService.fetchGenres.mockReturnValue(Promise.resolve(genres))
+  fragmentService.fetchArchaeologies.mockReturnValue(
+    Promise.resolve(provenances)
+  )
   wordService.searchLemma.mockReturnValue(Promise.resolve([word]))
   wordService.findAll.mockReturnValue(Promise.resolve([]))
   session.isAllowedToReadFragments.mockReturnValue(true)
@@ -213,6 +223,32 @@ describe('Script period selection form', () => {
   })
 })
 
+describe('Provenance selection form', () => {
+  beforeEach(() => {
+    userEvent.type(screen.getByLabelText('select-archaeology'), 'Assur')
+  })
+  it('displays user input', async () => {
+    await waitFor(() =>
+      expect(screen.getByLabelText('select-archaeology')).toHaveValue('Assur')
+    )
+  })
+
+  it('shows options', async () => {
+    await waitFor(() => {
+      expect(screen.getByText('Aššur')).toBeVisible()
+    })
+  })
+
+  it('selects option when clicked', async () => {
+    userEvent.click(screen.getByText('Aššur'))
+    userEvent.click(screen.getByText('Search'))
+    await waitFor(() =>
+      expect(history.push).toHaveBeenCalledWith(
+        `/fragmentarium/search/?site=${encodeURIComponent('Aššur')}`
+      )
+    )
+  })
+})
 describe('Genre selection form', () => {
   beforeEach(() => {
     userEvent.type(screen.getByLabelText('select-genre'), 'arch')
diff --git a/src/fragmentarium/ui/SearchForm.tsx b/src/fragmentarium/ui/SearchForm.tsx
index b030532e5..60aeebfd8 100644
--- a/src/fragmentarium/ui/SearchForm.tsx
+++ b/src/fragmentarium/ui/SearchForm.tsx
@@ -28,10 +28,12 @@ import {
   LemmaSearchHelp,
   ScriptSearchHelp,
   GenreSearchHelp,
+  ProvenanceSearchHelp,
 } from './SearchHelp'
 import GenreSearchForm from './GenreSearchForm'
 import BibliographyService from 'bibliography/application/BibliographyService'
 import { ResearchProjects } from 'research-projects/researchProject'
+import ArchaeologySearchForm from './ArchaeologySearchForm'
 
 interface State {
   number: string | null
@@ -47,6 +49,7 @@ interface State {
   scriptPeriodModifier: PeriodModifierString
   genre: string | null
   isValid: boolean
+  site: string | null
 }
 
 type Props = {
@@ -82,6 +85,7 @@ class SearchForm extends Component<Props, State> {
       scriptPeriod: fragmentQuery.scriptPeriod || '',
       scriptPeriodModifier: fragmentQuery.scriptPeriodModifier || '',
       genre: fragmentQuery.genre || '',
+      site: fragmentQuery.archaeology || '',
       isValid: isValidNumber(fragmentQuery.number),
     }
 
@@ -137,6 +141,7 @@ class SearchForm extends Component<Props, State> {
           : '',
         scriptPeriod: state.scriptPeriod,
         genre: state.genre,
+        site: state.site,
         project: this.props.project,
       },
       (value) => !value
@@ -230,6 +235,22 @@ class SearchForm extends Component<Props, State> {
               />
             </Col>
           </Form.Group>
+          <Form.Group as={Row} controlId="site">
+            <Col
+              sm={2}
+              as={Form.Label}
+              className="TransliterationSearchForm__label"
+            >
+              <HelpTrigger overlay={ProvenanceSearchHelp()} />
+            </Col>
+            <Col>
+              <ArchaeologySearchForm
+                fragmentService={this.props.fragmentService}
+                onChange={this.onChange('site')}
+                value={this.state.site}
+              />
+            </Col>
+          </Form.Group>
           <Form.Group as={Row} controlId="genre">
             <Col
               sm={2}
diff --git a/src/fragmentarium/ui/SearchHelp.tsx b/src/fragmentarium/ui/SearchHelp.tsx
index aaab15329..15a606543 100644
--- a/src/fragmentarium/ui/SearchHelp.tsx
+++ b/src/fragmentarium/ui/SearchHelp.tsx
@@ -106,3 +106,13 @@ export function GenreSearchHelp(): JSX.Element {
     </Popover>
   )
 }
+
+export function ProvenanceSearchHelp(): JSX.Element {
+  return (
+    <Popover id={_.uniqueId('ScriptSearchHelp-')} title="Search Period">
+      <Popover.Content>
+        Filter by provenance (only takes effect on fragment search)
+      </Popover.Content>
+    </Popover>
+  )
+}
diff --git a/src/fragmentarium/ui/front-page/Fragmentarium.test.tsx b/src/fragmentarium/ui/front-page/Fragmentarium.test.tsx
index b4119d5d2..e52cfe583 100644
--- a/src/fragmentarium/ui/front-page/Fragmentarium.test.tsx
+++ b/src/fragmentarium/ui/front-page/Fragmentarium.test.tsx
@@ -59,6 +59,7 @@ beforeEach(() => {
   wordService.findAll.mockReturnValue(Promise.resolve([]))
   fragmentService.fetchPeriods.mockReturnValueOnce(Promise.resolve([]))
   fragmentService.fetchGenres.mockReturnValueOnce(Promise.resolve([]))
+  fragmentService.fetchArchaeologies.mockRejectedValueOnce(Promise.resolve([]))
 })
 
 describe('Statistics', () => {
diff --git a/src/fragmentarium/ui/search/FragmentariumSearch.test.tsx b/src/fragmentarium/ui/search/FragmentariumSearch.test.tsx
index 811950636..b1bf42509 100644
--- a/src/fragmentarium/ui/search/FragmentariumSearch.test.tsx
+++ b/src/fragmentarium/ui/search/FragmentariumSearch.test.tsx
@@ -77,6 +77,7 @@ beforeEach(async () => {
   session = new MemorySession(['read:fragments'])
   fragmentService.fetchPeriods.mockReturnValueOnce(Promise.resolve([]))
   fragmentService.fetchGenres.mockReturnValueOnce(Promise.resolve([]))
+  fragmentService.fetchArchaeologies.mockReturnValueOnce(Promise.resolve([]))
 })
 
 describe('Search', () => {
diff --git a/src/fragmentarium/ui/search/__snapshots__/FragmentariumSearch.test.tsx.snap b/src/fragmentarium/ui/search/__snapshots__/FragmentariumSearch.test.tsx.snap
index 299ec1e42..f162f726f 100644
--- a/src/fragmentarium/ui/search/__snapshots__/FragmentariumSearch.test.tsx.snap
+++ b/src/fragmentarium/ui/search/__snapshots__/FragmentariumSearch.test.tsx.snap
@@ -134,7 +134,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                             autocapitalize="none"
                             autocomplete="off"
                             autocorrect="off"
-                            id="react-select-32-input"
+                            id="react-select-37-input"
                             spellcheck="false"
                             style="box-sizing: content-box; width: 2px; border: 0px; opacity: 1; outline: 0; padding: 0px;"
                             tabindex="0"
@@ -229,7 +229,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                             autocapitalize="none"
                             autocomplete="off"
                             autocorrect="off"
-                            id="react-select-33-input"
+                            id="react-select-38-input"
                             spellcheck="false"
                             style="box-sizing: content-box; width: 2px; border: 0px; opacity: 1; outline: 0; padding: 0px;"
                             tabindex="0"
@@ -299,7 +299,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                             autocapitalize="none"
                             autocomplete="off"
                             autocorrect="off"
-                            id="react-select-35-input"
+                            id="react-select-40-input"
                             spellcheck="false"
                             style="box-sizing: content-box; width: 2px; border: 0px; opacity: 1; outline: 0; padding: 0px;"
                             tabindex="0"
@@ -340,6 +340,88 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                 </div>
               </div>
             </div>
+            <div
+              class="form-group row"
+            >
+              <label
+                class="TransliterationSearchForm__label col-sm-2 form-label"
+                for="site"
+              >
+                <i
+                  class="fas fa-info-circle"
+                />
+              </label>
+              <div
+                class="col"
+              >
+                <div
+                  class=" css-2b097c-container"
+                >
+                  <div
+                    class="archaeology-selector__control css-yk16xz-control"
+                  >
+                    <div
+                      class="archaeology-selector__value-container css-g1d714-ValueContainer"
+                    >
+                      <div
+                        class="archaeology-selector__placeholder css-1wa3eu0-placeholder"
+                      >
+                        Provenance
+                      </div>
+                      <div
+                        class="css-b8ldur-Input"
+                      >
+                        <div
+                          class="archaeology-selector__input"
+                          style="display: inline-block;"
+                        >
+                          <input
+                            aria-autocomplete="list"
+                            aria-label="select-archaeology"
+                            autocapitalize="none"
+                            autocomplete="off"
+                            autocorrect="off"
+                            id="react-select-41-input"
+                            spellcheck="false"
+                            style="box-sizing: content-box; width: 2px; border: 0px; opacity: 1; outline: 0; padding: 0px;"
+                            tabindex="0"
+                            type="text"
+                            value=""
+                          />
+                          <div
+                            style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-family: -webkit-small-control; letter-spacing: normal; text-transform: none;"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      class="archaeology-selector__indicators css-1hb7zxy-IndicatorsContainer"
+                    >
+                      <span
+                        class="archaeology-selector__indicator-separator css-1okebmr-indicatorSeparator"
+                      />
+                      <div
+                        aria-hidden="true"
+                        class="archaeology-selector__indicator archaeology-selector__dropdown-indicator css-tlfecz-indicatorContainer"
+                      >
+                        <svg
+                          aria-hidden="true"
+                          class="css-6q0nyr-Svg"
+                          focusable="false"
+                          height="20"
+                          viewBox="0 0 20 20"
+                          width="20"
+                        >
+                          <path
+                            d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
+                          />
+                        </svg>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
             <div
               class="form-group row"
             >
@@ -381,7 +463,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                             autocapitalize="none"
                             autocomplete="off"
                             autocorrect="off"
-                            id="react-select-36-input"
+                            id="react-select-42-input"
                             spellcheck="false"
                             style="box-sizing: content-box; width: 2px; border: 0px; opacity: 1; outline: 0; padding: 0px;"
                             tabindex="0"
@@ -463,7 +545,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                             autocapitalize="none"
                             autocomplete="off"
                             autocorrect="off"
-                            id="react-select-37-input"
+                            id="react-select-43-input"
                             spellcheck="false"
                             style="box-sizing: content-box; width: 2px; border: 0px; opacity: 1; outline: 0; padding: 0px;"
                             tabindex="0"
@@ -533,7 +615,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                             autocapitalize="none"
                             autocomplete="off"
                             autocorrect="off"
-                            id="react-select-34-input"
+                            id="react-select-39-input"
                             spellcheck="false"
                             style="box-sizing: content-box; width: 2px; border: 0px; opacity: 1; outline: 0; padding: 0px;"
                             tabindex="0"
@@ -12441,7 +12523,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="score-799"
+                        aria-controls="score-805"
                         aria-expanded="true"
                         aria-label="Show score"
                         class="fas fa-caret-down"
@@ -12491,7 +12573,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="note-800"
+                        aria-controls="note-806"
                         aria-expanded="false"
                         aria-label="Show notes"
                         class="fas fa-book"
@@ -12502,7 +12584,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="parallels-801"
+                        aria-controls="parallels-807"
                         aria-expanded="false"
                         aria-label="Show parallels"
                         class="fas fa-quote-right"
@@ -12526,7 +12608,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                   </tr>
                   <tr
                     class="collapse show"
-                    id="score-799"
+                    id="score-805"
                   >
                     <td
                       colspan="7"
@@ -12559,7 +12641,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="score-803"
+                        aria-controls="score-809"
                         aria-expanded="true"
                         aria-label="Show score"
                         class="fas fa-caret-down"
@@ -12609,7 +12691,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="note-804"
+                        aria-controls="note-810"
                         aria-expanded="false"
                         aria-label="Show notes"
                         class="fas fa-book"
@@ -12620,7 +12702,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="parallels-805"
+                        aria-controls="parallels-811"
                         aria-expanded="false"
                         aria-label="Show parallels"
                         class="fas fa-quote-right"
@@ -12644,7 +12726,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                   </tr>
                   <tr
                     class="collapse show"
-                    id="score-803"
+                    id="score-809"
                   >
                     <td
                       colspan="7"
@@ -12716,7 +12798,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="score-807"
+                        aria-controls="score-813"
                         aria-expanded="true"
                         aria-label="Show score"
                         class="fas fa-caret-down"
@@ -12766,7 +12848,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="note-808"
+                        aria-controls="note-814"
                         aria-expanded="false"
                         aria-label="Show notes"
                         class="fas fa-book"
@@ -12777,7 +12859,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="parallels-809"
+                        aria-controls="parallels-815"
                         aria-expanded="false"
                         aria-label="Show parallels"
                         class="fas fa-quote-right"
@@ -12801,7 +12883,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                   </tr>
                   <tr
                     class="collapse show"
-                    id="score-807"
+                    id="score-813"
                   >
                     <td
                       colspan="7"
@@ -12834,7 +12916,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="score-811"
+                        aria-controls="score-817"
                         aria-expanded="true"
                         aria-label="Show score"
                         class="fas fa-caret-down"
@@ -12884,7 +12966,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="note-812"
+                        aria-controls="note-818"
                         aria-expanded="false"
                         aria-label="Show notes"
                         class="fas fa-book"
@@ -12895,7 +12977,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                       class="chapter-display__toggle"
                     >
                       <i
-                        aria-controls="parallels-813"
+                        aria-controls="parallels-819"
                         aria-expanded="false"
                         aria-label="Show parallels"
                         class="fas fa-quote-right"
@@ -12919,7 +13001,7 @@ exports[`Searching fragments by transliteration Displays corpus results when cli
                   </tr>
                   <tr
                     class="collapse show"
-                    id="score-811"
+                    id="score-817"
                   >
                     <td
                       colspan="7"
diff --git a/src/query/FragmentQuery.ts b/src/query/FragmentQuery.ts
index 00b2198b2..9d645bd6e 100644
--- a/src/query/FragmentQuery.ts
+++ b/src/query/FragmentQuery.ts
@@ -18,6 +18,7 @@ export type FragmentQuery = Partial<{
   scriptPeriod: PeriodString
   scriptPeriodModifier: PeriodModifierString
   genre: string
+  archaeology: string
   project: keyof typeof ResearchProjects | null
   latest: boolean
 }>