From abd439d0a84d12d31cae3c9d6ca1c58c9aef62b1 Mon Sep 17 00:00:00 2001
From: Dzmitry Hramyka <grom.dima.grom@gmail.com>
Date: Thu, 7 Sep 2023 13:22:19 +0200
Subject: [PATCH] feat: Acknowledgements in about view (#42) (#44)

---
 frontend/src/api/__tests__/utils.spec.ts      | 15 +++++++-
 frontend/src/api/utils.ts                     |  5 +++
 frontend/src/views/AboutView.vue              | 37 +++++++++++++++++++
 .../src/views/__tests__/AboutView.spec.ts     |  2 +
 4 files changed, 57 insertions(+), 2 deletions(-)

diff --git a/frontend/src/api/__tests__/utils.spec.ts b/frontend/src/api/__tests__/utils.spec.ts
index a4766e0f..d4040af7 100644
--- a/frontend/src/api/__tests__/utils.spec.ts
+++ b/frontend/src/api/__tests__/utils.spec.ts
@@ -46,8 +46,19 @@ describe('search method', () => {
     })
   })
 
-  it.skip('should return null if no match', () => {
-    const result = search('foo', 'foo37')
+  it('should return null if no entry', () => {
+    const result = search('', 'foo37')
     expect(result).toBe(null)
   })
+
+  it('should remove whitespace', () => {
+    const result = search(' HGNC:1100  ', 'ghcr37')
+    expect(result).toEqual({
+      name: 'gene',
+      params: {
+        searchTerm: 'HGNC:1100',
+        genomeRelease: 'ghcr37'
+      }
+    })
+  })
 })
diff --git a/frontend/src/api/utils.ts b/frontend/src/api/utils.ts
index 4b794025..ae5dccab 100644
--- a/frontend/src/api/utils.ts
+++ b/frontend/src/api/utils.ts
@@ -130,6 +130,11 @@ export const search = (searchTerm: string, genomeRelease: string) => {
   ]
 
   for (const [regexp, getRoute] of SEARCH_REGEXPS) {
+    // Remove trailing whitespace
+    searchTerm = searchTerm.trim()
+    if (!searchTerm) {
+      return null
+    }
     if (regexp.test(searchTerm)) {
       const routeLocation = getRoute()
       console.log(`term ${searchTerm} matched ${regexp}, route is`, routeLocation)
diff --git a/frontend/src/views/AboutView.vue b/frontend/src/views/AboutView.vue
index c738195e..6cee4ea5 100644
--- a/frontend/src/views/AboutView.vue
+++ b/frontend/src/views/AboutView.vue
@@ -1,5 +1,23 @@
 <script setup lang="ts">
 import HeaderDefault from '@/components/HeaderDefault.vue'
+
+const Acknowledgements = {
+  ClinVar: {
+    name: 'ClinVar',
+    url: 'https://www.ncbi.nlm.nih.gov/clinvar/',
+    description:
+      'ClinVar is a freely accessible, public archive ' +
+      'of reports of the relationships among human variations ' +
+      'and phenotypes, with supporting evidence.',
+    doi: 'DOI: 10.1093/nar/gkx1153'
+  },
+  Coral: {
+    name: 'Coral emoji',
+    url: 'https://openmoji.org/library/emoji-1FAB8/',
+    description: 'Coral emoji from OpenMoji',
+    doi: ''
+  }
+}
 </script>
 
 <template>
@@ -21,6 +39,25 @@ import HeaderDefault from '@/components/HeaderDefault.vue'
         </p>
       </v-col>
     </v-row>
+    <v-row>
+      <v-col cols="12">
+        <h2 class="title">Acknowledgements:</h2>
+        <p class="description">
+          <v-list lines="two">
+            <v-list-item v-for="ack in Object.values(Acknowledgements)" :key="ack.name">
+              <v-list-item-title>
+                <a :href="ack.url" target="_blank">{{ ack.name }}</a>
+              </v-list-item-title>
+              <v-list-item-subtitle>{{ ack.description }}</v-list-item-subtitle>
+              <!-- If there is a doi, then display it -->
+              <v-list-item-subtitle v-if="ack.doi">
+                <a :href="'https://doi.org/' + ack.doi" target="_blank">{{ ack.doi }}</a>
+              </v-list-item-subtitle>
+            </v-list-item>
+          </v-list>
+        </p>
+      </v-col>
+    </v-row>
   </v-container>
 </template>
 
diff --git a/frontend/src/views/__tests__/AboutView.spec.ts b/frontend/src/views/__tests__/AboutView.spec.ts
index 7a2e5646..ec2cd695 100644
--- a/frontend/src/views/__tests__/AboutView.spec.ts
+++ b/frontend/src/views/__tests__/AboutView.spec.ts
@@ -66,5 +66,7 @@ describe('AboutView', async () => {
     const mainContent = wrapper.find('.about-view')
     expect(mainContent.exists()).toBe(true)
     expect(mainContent.html()).toMatch('REEV: Explanation and Evaluation of Variants')
+    expect(mainContent.html()).toMatch('ClinVar is a freely accessible, public archive')
+    expect(mainContent.html()).toMatch('Coral emoji from OpenMoji')
   })
 })