Release v1.0.2

cypress/integration/ViewTermsByLetterGenetics.feature

@@ -10,3 +10,12 @@ Feature: View Terms by letter for Genetics
     When user selects letter "Y" from A-Z list
     Then the system returns user to the search results page for the search term "Y" URL has "/expand"
     When user tries to go to this URL, system should return the Expand "No Matches Found" page for language "en"
+
+Scenario: User clicks on a letter in the A-Z list for results and gets no matches found for the selected letter
+    Given user is on landing Genetics Terms page
+    When user selects letter "K" from A-Z list
+    Then the system returns user to the search results page for the search term "K" URL has "/expand"
+    Then search results page displays results title "# result found for: K"
+    And each result in the results listing appears as a link to the term's page
+    And the audio icon and the pronunciation appear beside the term on the same line as the link
+    And each result displays its full definition below the link for the term

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@nciocpl/glossary-app",
-	"version": "1.0.1",
+	"version": "1.0.2",
 	"description": "Glossary React Application",
 	"repository": {
 		"type": "git",

src/components/molecules/search/__tests__/Search.test.js

@@ -36,7 +36,7 @@ describe('<Search /> English', () => {
 	}
 
 	SearchWithLocation.propTypes = {
-		RenderComponent: PropTypes.node,
+		RenderComponent: PropTypes.func,
 	};
 
 	beforeEach(async () => {

src/utils/i18n.js

@@ -55,6 +55,10 @@ export const i18n = {
 		en: 'results found for',
 		es: 'resultados de',
 	},
+	termListTitleSingleResult: {
+		en: 'result found for',
+		es: 'resultado de',
+	},
 	definitionOf: {
 		en: 'Definition of',
 		es: 'Definición de',

src/views/Definition/__tests__/Definition.PrettyURLRedirect.test.js

@@ -25,7 +25,7 @@ function ComponentWithLocation({ RenderComponent }) {
 }
 
 ComponentWithLocation.propTypes = {
-	RenderComponent: PropTypes.node,
+	RenderComponent: PropTypes.func,
 };
 
 test('Ensure page is redirected to the definition page with a pretty URL name', async () => {

src/views/Terms/TermList.jsx

@@ -23,6 +23,8 @@ const getMetaTitle = (dictionaryTitle, siteName) => {
 const TermList = ({ matchType, query, type }) => {
 	const tracking = useTracking();
 	const location = useLocation();
+	const navigate = useNavigate();
+
 	const queryAction =
 		type === queryType.SEARCH
 			? getSearchResults(query, matchType)
@@ -37,9 +39,9 @@ const TermList = ({ matchType, query, type }) => {
 		ExpandPath,
 		ExpandPathSpanish,
 		SearchPath,
-		SearchPathSpanish
+		SearchPathSpanish,
 	} = useAppPaths();
-	const navigate = useNavigate();
+
 	const { pathname } = location;
 	const isHome = pathname === HomePath() || pathname === basePath;
 
@@ -49,8 +51,11 @@ const TermList = ({ matchType, query, type }) => {
 
 	useEffect(() => {
 		if (!loading && payload) {
-
-			if (payload.results && payload.results.length === 1) {
+			if (
+				(type === queryType.SEARCH || type === queryType.SEARCH_SPANISH) &&
+				payload.results &&
+				payload.results.length === 1
+			) {
 				const idOrName = payload.results[0].prettyUrlName
 					? payload.results[0].prettyUrlName
 					: payload.results[0].termId;
@@ -61,7 +66,6 @@ const TermList = ({ matchType, query, type }) => {
 
 			trackLoad(payload);
 		}
-
 	}, [loading, payload]);
 
 	const trackLoad = (payload) => {
@@ -77,14 +81,15 @@ const TermList = ({ matchType, query, type }) => {
 			event: 'GlossaryApp:Load:SearchResults',
 			name:
 				canonicalHost.replace('https://', '') +
-
-				[language === 'en' ?
-					SearchPath({
-						searchText: decodeURIComponent(query)
-					})
-					: SearchPathSpanish({
-						searchText: decodeURIComponent(query)
-					})],
+				[
+					language === 'en'
+						? SearchPath({
+							searchText: decodeURIComponent(query),
+						})
+						: SearchPathSpanish({
+							searchText: decodeURIComponent(query),
+						}),
+				],
 			searchType: matchType === 'Begins' ? 'StartsWith' : 'Contains',
 			searchKeyword: decodeURIComponent(query),
 			...commonParams,
@@ -94,14 +99,18 @@ const TermList = ({ matchType, query, type }) => {
 			event: 'GlossaryApp:Load:ExpandResults',
 			name:
 				canonicalHost.replace('https://', '') +
-				[language === 'en' ?
-					ExpandPath({
-						expandChar: decodeURIComponent(query).toLowerCase()
-					})
-					: ExpandPathSpanish({
-						expandChar: decodeURIComponent(query).toLowerCase()
-					})],
-			...(isHome && { name: canonicalHost.replace('https://', '') + HomePath() }),
+				[
+					language === 'en'
+						? ExpandPath({
+							expandChar: decodeURIComponent(query).toLowerCase(),
+						})
+						: ExpandPathSpanish({
+							expandChar: decodeURIComponent(query).toLowerCase(),
+						}),
+				],
+			...(isHome && {
+				name: canonicalHost.replace('https://', '') + HomePath(),
+			}),
 			letter: decodeURIComponent(query).toLocaleLowerCase(),
 			...commonParams,
 		};
@@ -123,15 +132,17 @@ const TermList = ({ matchType, query, type }) => {
 				<div
 					className="dictionary-list-container results"
 					data-dict-type="term">
-					{payload.results && payload.results.length > 1 ? (
+					{payload.results && payload.results.length >= 1 ? (
 						<>
 							<h4>
-								{payload.meta.totalResults} {i18n.termListTitle[language]}:{' '}
+								{payload.meta.totalResults} {payload.results.length === 1 ? i18n.termListTitleSingleResult[language] : i18n.termListTitle[language]}:{' '}
 								{decodeURIComponent(query)}{' '}
 							</h4>
 							<dl className="dictionary-list">
 								{payload.results.map((result, index) => {
-									return <Term key={index} resultIndex={index} payload={result} />;
+									return (
+										<Term key={index} resultIndex={index} payload={result} />
+									);
 								})}
 							</dl>
 						</>

src/views/Terms/__tests__/Term.test.js

@@ -84,7 +84,7 @@ describe('Term component rendered with English', () => {
 		return <Term payload={term} />;
 	}
 	TermWithLocation.propTypes = {
-		term: PropTypes.string,
+		term: PropTypes.object,
 	};
 
 	afterEach(() => {

src/views/Terms/__tests__/TermList.test.js

@@ -22,14 +22,15 @@ const queryFile = `${query}.json`;
 const { getFixture } = fixtures;
 const fixturePath = `/Terms/expand/Cancer.gov/Patient`;
 
-function ComponentWithLocation({ RenderComponent, query }) {
+// Used for search termlists
+const ComponentWithLocation = ({ RenderComponent, query, type = 'search' }) => {
 	location = useLocation();
-	return <RenderComponent query={query} />;
-}
-
+	return <RenderComponent query={query} type={type} />;
+};
 ComponentWithLocation.propTypes = {
-	RenderComponent: PropTypes.node,
+	RenderComponent: PropTypes.func,
 	query: PropTypes.string,
+	type: PropTypes.string,
 };
 
 describe('TermList component rendered with English', () => {

support/mock-data/Terms/expand/Genetics/HealthProfessional/en/K.json

@@ -0,0 +1,29 @@
+{
+    "meta": {
+      "totalResults": 1,
+      "from": 0
+    },
+    "results": [
+      {
+        "termId": 460158,
+        "language": "en",
+        "dictionary": "Genetics",
+        "audience": "HealthProfessional",
+        "termName": "kindred",
+        "firstLetter": "k",
+        "prettyUrlName": "kindred",
+        "pronunciation": {
+          "key": "(KIN-dred)",
+          "audio": "https://nci-media-dev.cancer.gov/pdq/media/audio/736952.mp3"
+        },
+        "definition": {
+          "html": "An extended family.",
+          "text": "An extended family."
+        },
+        "otherLanguages": [],
+        "relatedResources": [],
+        "media": []
+      }
+    ],
+    "links": null
+  }