Skip to content

Commit

Permalink
Merge pull request #3168 from CVEProject/tat-3160-content
Browse files Browse the repository at this point in the history 
#3160 update content and other fixes and updates
  • Loading branch information
@athu-tran
athu-tran authored Oct 15, 2024
2 parents 182195c + d26345e commit b0827d2
Show file tree
Hide file tree
Showing 9 changed files with 116 additions and 46 deletions.
4 changes: 1 addition & 3 deletions src/assets/data/faqs.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -272,9 +272,7 @@
"questionText": "How do I search the CVE List",
"questionResponseParagraphs": [
"<b><i>Search Tips<i></b>",
"<ul><li>By CVE ID<ul><li>Must include only one CVE ID per search.</li><li>CVE ID must include all letters, numbers, and hyphens associated with the CVE ID, e.g., CVE-2024-12345678.</li><li>“CVE” may be entered as “cve”, “CVE”, or as a combination of uppercase and lowercase, as casing is ignored during search.</li></ul></li><li>By other keyword(s)<ul><li>Must contain only alphanumeric characters.</li><li>May contain one or more keywords, separated by a space.</li><li>Keywords may be entered in lowercase, uppercase, or a combination of both. Casing is ignored during search, e.g., Vulnerabilities, vulnerabilities, VULNERABILITIES.</li></ul></li></ul>",
"<strong>2. Other CVE List search options</strong>",
"<ul><li>Search by keyword(s) across <a href='https://github.com/CVEProject/cvelistV5' target='_blank'>ALL FIELDS of all CVE Records</a> in the cvelistV5 downloads repository using the main search box on GitHub.com.</li><li>Search by keyword(s) in the <a href='https://cve.mitre.org/cve/search_cve_list.html' target='_blank'>Description fields ONLY of all CVE Records</a> using the legacy search page on cve.mitre.org.</li></ul>"
"<ul><li>By CVE ID<ul><li>Must include only one CVE ID per search.</li><li>CVE ID must include all letters, numbers, and hyphens associated with the CVE ID, e.g., CVE-2024-12345678.</li><li>“CVE” may be entered as “cve”, “CVE”, or as a combination of uppercase and lowercase, as casing is ignored during search.</li></ul></li><li>By other keyword(s)<ul><li>Must contain only alphanumeric characters.</li><li>May contain one or more keywords, separated by a space.</li><li>Keywords may be entered in lowercase, uppercase, or a combination of both. Casing is ignored during search, e.g., Vulnerabilities, vulnerabilities, VULNERABILITIES.</li></ul></li></ul>"
]
},
{
Expand Down
17 changes: 12 additions & 5 deletions src/components/PrimaryNavigation.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -125,11 +125,13 @@
<cveRecordSearch/>
</div>
<div class="navbar-item cve-secondary-navbar-item cve-keyword-search">
<span class="icon-text mr-2" style="font-size: 14px">
<router-link to="/ResourcesSupport/FAQs#pc_cve_list_basicssearch_cve" class="cve-dark-blue-text">
Access Search Tips
</router-link>
</span>
<div v-if="searchType">
<span class="icon-text mr-2" style="font-size: 14px">
<router-link to="/ResourcesSupport/FAQs#pc_cve_list_basicssearch_cve" class="cve-dark-blue-text">
Access Search Tips
</router-link>
</span>
</div>
</div>
</div>
<div class="navbar-end is-hidden-touch">
Expand All @@ -151,6 +153,8 @@

<script>
import cveRecordSearch from '@/components/cveRecordSearchModule.vue';
import { useCveListSearchStore } from '@/stores/cveListSearch';
import { mapState } from 'pinia'
export default {
components: { cveRecordSearch },
Expand All @@ -160,6 +164,9 @@ export default {
required: true,
},
},
computed: {
...mapState(useCveListSearchStore, ['searchType'])
},
data() {
return {
isOpen: false,
Expand Down
129 changes: 97 additions & 32 deletions src/components/cveRecordSearchModule.vue
View file
Original file line number Diff line number Diff line change
@@ -1,38 +1,83 @@
<template>
<div class="field mt-1">
<div class="field has-addons">
<div class="control">
<span v-if="websiteEnv !== 'prd'" class="select cve-search-selector">
<select v-model="searchType">
<option>Search CVE List (Beta)</option>
<option>Find a Test CVE Record/ID (Legacy)</option>
</select>
</span>
</div>
<div class="control is-expanded">
<input v-if="searchTypeBoolean" v-model.trim="queryString" @keyup.enter="onKeyUpEnter"
@keyup="validateQueryString" type="text" class="input cve-id-input"
placeholder="Enter keywords (e.g.: CVE ID, sql injection, etc.)" />
<input v-else v-model="cveId" @keyup.enter="onKeyUpEnter" @keyup="validateQueryString" @blur="removeHelpText"
type="text" class="input cve-id-input" placeholder="Enter CVE ID (CVE-YYYY-NNNN)" />
</div>
<div class="control">
<button @click="validate" class="button cve-button cve-button-accent-warm"
:class="{ 'is-loading': cveListSearchStore.isSearching, 'disabled': cveListSearchStore.isSeachButtonDisabled }"
:aria-disabled="cveListSearchStore.isSeachButtonDisabled">
Search {{ websiteEnv === 'test' ? 'CVE List in Test' : '' }}
</button>
<div class="mt-1">
<div>
<div role="alert" class="notification is-warning is-light">
<div class="is-flex is-flex-direction-row is-align-content-flex-start">
<div class="pr-2 pt-2">
<p id="newSearchHelpText" class="is-hidden">info</p>
<font-awesome-icon style="font-size: 1.25em;" icon="info-circle" role="info"
aria-labelledby="newSearchHelpText" aria-hidden="false" />
</div>
<div>
<button class="button is-text is-ghost cve-btn-container pt-0 pr-2 pb-0 pl-1"
@click="showSearchHelpText = !showSearchHelpText"
aria-controls="searchHelpText"
>
The Test website (test.cve.org) has a new drop-down menu below.
<span class="button is-ghost cve-inner-btn">Read {{ showSearchHelpText ? 'less...' : 'more...' }}</span>
</button>
<div v-if="showSearchHelpText" id="searchHelpText" class="cve-help-text" style="max-width: 860px">
<ol>
<li>
<span class="has-text-weight-bold">Search Capability (Beta) Community testers</span> – To beta-test the new search feature, select
“<span class="has-text-weight-bold">Search CVE List (Beta)</span>” in the drop-down menu. The
<span class="has-text-weight-bold">production</span> data is used.
<router-link to="/ResourcesSupport/FAQs#pc_cve_list_basicssearch_cve" class="cve-dark-blue-text">Access Search Tips</router-link>
for more information on this new capability. <a href="https://forms.office.com/g/dFzysrHLpR" target="_blank">
Provide feedback on the new search capability
<span class="icon cve-icon-xxs">
<p id="externalSurveyLink" class="is-hidden">
Survey opens in a new tab or window depending on browser settings
</p>
<font-awesome-icon icon="external-link-alt" aria-labelledby="extenalSurveyLink" aria-hidden="false"/>
</span>.
</a>.
</li>
<li>
<span class="has-text-weight-bold">CNAs</span> – to view your <span class="has-text-weight-bold">test data</span>
(your draft records) select “<span class="has-text-weight-bold">Find a Test CVE Record/ID (Legacy)</span>” in the drop-down menu and
provide a CVE ID to find a specific CVE Record.
</li>
</ol>
</div>
</div>
</div>
</div>
</div>
<div class="notification is-warning is-light" role="alert" v-if="errorMessage.length > 0">
<div class="is-flex is-align-content-flex-start">
<p id="alertIcon" class="is-hidden">alert</p>
<font-awesome-icon style="flex: 0 0 40px; margin-top:3px" size="lg" icon="exclamation-triangle" role="alert"
aria-labelledby="alertIcon" aria-hidden="false" />
<p class="cve-help-text">
{{ errorMessage }}
<router-link to="/ResourcesSupport/FAQs#pc_cve_list_basicssearch_cve" class="cve-dark-blue-text">Access Search Tips.</router-link>
</p>
<div class="field mt-1">
<div class="field has-addons">
<div class="control">
<span v-if="websiteEnv !== 'prd'" class="select cve-search-selector">
<select v-model="searchType">
<option>Search CVE List (Beta)</option>
<option>Find a Test CVE Record/ID (Legacy)</option>
</select>
</span>
</div>
<div class="control is-expanded">
<input v-if="searchTypeBoolean" v-model.trim="queryString" @keyup.enter="onKeyUpEnter"
@keyup="validateQueryString" type="text" class="input cve-id-input"
placeholder="Enter keywords (e.g.: CVE ID, sql injection, etc.)" />
<input v-else v-model.trim="cveId" @keyup.enter="onKeyUpEnter" @keyup="validateQueryString"
type="text" class="input cve-id-input" placeholder="Enter CVE ID (CVE-YYYY-NNNN)" />
</div>
<div class="control">
<button @click="validate" class="button cve-button cve-button-accent-warm"
:class="{ 'is-loading': cveListSearchStore.isSearching, 'disabled': cveListSearchStore.isSeachButtonDisabled }"
:aria-disabled="cveListSearchStore.isSeachButtonDisabled">
Search
</button>
</div>
</div>
<div class="notification is-warning is-light" role="alert" v-if="errorMessage.length > 0">
<div class="is-flex is-align-content-flex-start">
<p id="alertIcon" class="is-hidden">alert</p>
<font-awesome-icon style="flex: 0 0 40px; margin-top:3px" size="lg" icon="exclamation-triangle" role="alert"
aria-labelledby="alertIcon" aria-hidden="false" />
<p class="cve-help-text">
{{ errorMessage }}
</p>
</div>
</div>
</div>
</div>
Expand All @@ -58,12 +103,21 @@ let cveRecordStore = usecveRecordStore();
let searchType = ref('Search CVE List (Beta)');
let cveId = cveRecordStore.cveId;
let showSearchHelpText = ref(false);
// this seems redundant, but it fixes an edge case.
// if a user searches for a particular field, then on the results page flips the toggle, THEN refreshes without searching, this will keep the correct helper text showing.
let searchTypeBoolean = computed(() => {
return searchType.value == 'Search CVE List (Beta)' ? true : false;
});
watch(searchType, () => {
cveListSearchStore.searchType = (searchType.value === 'Search CVE List (Beta)') ? true : false;
cveId = cveRecordStore.cveId = '';
queryString.value = cveListSearchStore.query = '';
errorMessage.value = '';
});
watch(
() => route.query,
() => {
Expand Down Expand Up @@ -183,4 +237,15 @@ const websiteEnv = computed(() => {
width: 470px;
}
}
.cve-btn-container {
background: unset !important;
color: $black !important;
}
.cve-btn-container:hover, .cve-inner-btn:hover {
cursor: pointer;
text-decoration: none !important;
}
</style>
1 change: 1 addition & 0 deletions src/stores/cveListSearch.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ export const useCveListSearchStore = defineStore('cveListSearch ', {
query: '',
recordData: {},
searchResults: [],
searchType: true,
serverError: false,
showHelpText: false,
size: 25,
Expand Down
2 changes: 1 addition & 1 deletion src/views/CVERecord/PublishedRecord.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
<div class="level-right ml-1">
<div class="level-item">
<span class="icon-text">
<a id="cve-view-json" :href="`https://${cveServicesBaseUrl}/api/cve/${usecveRecordStore.cveId}`" target="_blank">
<a id="cve-view-json" :href="`${cveServicesBaseUrl}/api/cve/${usecveRecordStore.cveId}`" target="_blank">
<span class="icon">
<p id="enewsletter" class="is-hidden">external site</p>
<font-awesome-icon icon="file-code" aria-labelledby="enewsletter"></font-awesome-icon>
Expand Down
2 changes: 1 addition & 1 deletion src/views/CVERecord/RejectedRecordOrId.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
<div class="level-right ml-1">
<div class="level-item">
<a id="cve-view-json"
:href="`https://${cveServicesBaseUrl}/api/${ usecveRecordStore.isArecord ?
:href="`${cveServicesBaseUrl}/api/${ usecveRecordStore.isArecord ?
'cve' : 'cve-id'}/${usecveRecordStore.cveId}`"
target="_blank">
View JSON
Expand Down
2 changes: 1 addition & 1 deletion src/views/CVERecord/ReservedId.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
</div>
<div class="level-right">
<div class="level-item">
<a id="cve-view-json" :href="`https://${cveServicesBaseUrl}/api/cve-id/${usecveRecordStore.cveId}`" target="_blank">
<a id="cve-view-json" :href="`${cveServicesBaseUrl}/api/cve-id/${usecveRecordStore.cveId}`" target="_blank">
View JSON
</a>
</div>
Expand Down
2 changes: 1 addition & 1 deletion src/views/CVERecord/SearchResults.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -231,7 +231,7 @@
<div v-else>
<p class="has-text-weight-bold">No search results found for: <span class="is-italic">{{ cveListSearchStore.query }}</span></p>
<p>Please try your search again using different keyword(s) or access the
<router-link to="/ResourcesSupport/FAQs#pc_cve_list_basicssearch_cve_list_tips">search tips</router-link>.
<router-link to="/ResourcesSupport/FAQs#pc_cve_list_basicssearch_cve">search tips</router-link>.
</p>
</div>
</div>
Expand Down
3 changes: 1 addition & 2 deletions src/views/ResourcesSupport/FAQs.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,8 +69,7 @@
<div :id="item.sectionId + qAndA.questionId + 'response'" class="message-body"
:class="{'is-hidden': accordion[item.sectionId + qAndA.questionId]}">
<div v-if="qAndA.questionId == 'search_cve'" class="pb-3">
<p>The following methods are available:</p>
<span class="has-text-weight-bold">1. On this site</span>
<span class="has-text-weight-bold">TEST.CVE.ORG Search CVE List (Beta) Tips</span>
<ul>
<li>Search the CVE List by keywords using the
<router-link :to="{ hash: '#cve-secondary-navbar' }">search box</router-link> at the top of this page.
Expand Down

0 comments on commit b0827d2

Please sign in to comment.