add cve id validation, remove logging, increase search input width, remove relevancy, and fix decrease show more top spacing

Author: ann-linh-mitre

src/components/cveRecordSearchModule.vue

@@ -25,7 +25,6 @@
           </p>
       </div>
     </div>
-
   </div>
 </template>
 
@@ -70,10 +69,12 @@ function startSearch() {
 }
 
 function validateQueryString() {
-  const alphaNumericDashPattern = new RegExp(/^[a-zA-Z0-9- ]+$/, 'i').test(queryString.value);
-  if (queryString.value.length > 0 && !alphaNumericDashPattern) {
+  const alphaNumericDashPattern = new RegExp(/^[a-zA-Z0-9 ]+$/, 'i').test(queryString.value);
+  const cveIdPattern = new RegExp(/^CVE-\d{4}-\d{4,7}$/, 'i').test(queryString.value);
+
+  if (queryString.value.length > 0 && !alphaNumericDashPattern && !cveIdPattern) {
     cveListSearchStore.isSeachButtonDisabled = true;
-    errorMessage.value = 'Only letters, numbers, and hyphens are allowed.';
+    errorMessage.value = 'Only letters, numbers, and CVE IDs (CVE-YYYY-NNNN) are allowed.';
     cveListSearchStore.showHelpText = true;
   } else if (queryString.value.length === 0) {
     cveListSearchStore.isSeachButtonDisabled = true;
@@ -91,10 +92,8 @@ function onKeyUpEnter() {
 }
 
 function validate() {
-  console.log('>>>>> validate')
   validateQueryString();
   if (!cveListSearchStore.isSeachButtonDisabled) {
-    console.log('>>>>> startsearch')
     startSearch();
   }
 }
@@ -120,7 +119,7 @@ const websiteEnv = computed(() => {
 
 @media screen and (min-width: $desktop) {
   .cve-id-input {
-    width: 400px;
+    width: 470px;
   }
 }
 </style>

src/views/CVERecord/SearchResults.vue

@@ -3,7 +3,7 @@
     <div class="columns is-centered">
       <div class="column is-8-desktop cve-main-column-content-width">
         <main id="cve-main-page-content" role="main">
-          <div class="content">
+          <div>
             <div v-if="cveListSearchStore.showHelpText && cveListSearchStore.totalSearchResultCount < 1">
               <!-- cveListSearchStore.totalSearchResultCount < 1 so when there are results this doesn't flash while user is typing keyword -->
               <p class="has-text-centered">
@@ -48,7 +48,7 @@
                               <p v-if="!description.showMore" class="mb-0">
                                 {{ description.firstChunk }}<span v-if="!description.showMore && description.secondChunk.length > 0">...</span>
                               </p>
-                              <p v-else>{{ description.firstChunk.concat(` ${description.secondChunk}`) }}</p>
+                              <p v-else class="mb-0">{{ description.firstChunk.concat(` ${description.secondChunk}`) }}</p>
                               <button v-if="description.secondChunk.length > 0"
                                 @click="cveListSearchStore.handleShowMoreChange(undefined, index)"
                                 class="button is-ghost cve-is-borderless p-0"
@@ -142,11 +142,6 @@
                                 </div>
                               </div>
                             </div>
-                            <div class="columns cve-columns">
-                              <div class="column cve-column">
-                                <p>Relevancy: {{ result.relevancyScore }}</p>
-                              </div>
-                            </div>
                           </div>
                       </div>
                     </div>