diff --git a/src/applications/resources-and-support/components/ResourcesAndSupportSearchApp.jsx b/src/applications/resources-and-support/components/ResourcesAndSupportSearchApp.jsx
index 82b860ef9961..efd711a81581 100644
--- a/src/applications/resources-and-support/components/ResourcesAndSupportSearchApp.jsx
+++ b/src/applications/resources-and-support/components/ResourcesAndSupportSearchApp.jsx
@@ -1,10 +1,8 @@
-// Node modules.
import React, { useEffect, useState, useCallback } from 'react';
import { VaPagination } from '@department-of-veterans-affairs/component-library/dist/react-bindings';
import URLSearchParams from 'url-search-params';
import { focusElement } from 'platform/utilities/ui';
import { getAppUrl } from 'platform/utilities/registry-helpers';
-// Relative imports.
import SearchBar from './SearchBar';
import SearchResultList from './SearchResultList';
import useArticleData from '../hooks/useArticleData';
@@ -17,6 +15,11 @@ const ResourcesAndSupportSearchApp = () => {
const [query, setQuery] = useState('');
const [page, setPage] = useState(1);
const [results] = useGetSearchResults(articles, query, page);
+ const [previousValue, setPreviousValue] = useState('');
+
+ useEffect(() => {
+ setPreviousValue(userInput);
+ });
const totalPages = Math.ceil(results.length / RESULTS_PER_PAGE);
@@ -29,6 +32,7 @@ const ResourcesAndSupportSearchApp = () => {
const searchParams = new URLSearchParams(window.location.search);
const queryFromUrl = searchParams.get('query');
+
if (queryFromUrl) {
setUserInput(queryFromUrl);
setQuery(queryFromUrl);
@@ -39,14 +43,8 @@ const ResourcesAndSupportSearchApp = () => {
[articles, setUserInput, setQuery],
);
- const onSearch = useCallback(
+ const setSearchData = useCallback(
() => {
- const queryParams = new URLSearchParams();
- queryParams.set('query', userInput);
-
- const newUrl = `${window.location.pathname}?${queryParams}`;
- history.replaceState({}, '', newUrl);
-
setPage(1);
setQuery(userInput);
focusElement('#pagination-summary');
@@ -84,9 +82,10 @@ const ResourcesAndSupportSearchApp = () => {
We didn’t find any resources and support articles for "
{query}
." Try using different words or{' '}
-
- search all of VA.gov
-
+
{truncate(article.introText, { length: 190 })}
diff --git a/src/applications/resources-and-support/tests/components/ResourcesAndSupportSearchApp.unit.spec.jsx b/src/applications/resources-and-support/tests/components/ResourcesAndSupportSearchApp.unit.spec.jsx
index a593c9537bfe..cc1f21378a2b 100644
--- a/src/applications/resources-and-support/tests/components/ResourcesAndSupportSearchApp.unit.spec.jsx
+++ b/src/applications/resources-and-support/tests/components/ResourcesAndSupportSearchApp.unit.spec.jsx
@@ -1,14 +1,10 @@
-// Node modules.
import React from 'react';
import ReactDOM from 'react-dom';
-import { expect } from 'chai';
-import { fireEvent } from '@testing-library/react';
import { rest } from 'msw';
import { setupServer } from 'msw/node';
-// Relative imports.
+import { renderInReduxProvider } from 'platform/testing/unit/react-testing-library-helpers';
import ResourcesAndSupportSearchApp from '../../components/ResourcesAndSupportSearchApp';
import mockData from './articles.json';
-import { renderInReduxProvider } from 'platform/testing/unit/react-testing-library-helpers';
describe('ResourcesAndSupportSearchApp', () => {
let server = null;
@@ -35,59 +31,5 @@ describe('ResourcesAndSupportSearchApp', () => {
it('creates a landmark for the search form', async () => {
const screen = renderInReduxProvider(