Fix regression maintaining scroll position (#3491)

Signed-off-by: Cintia Sanchez Garcia <[email protected]>
artifacthub · Nov 17, 2023 · 6f48c8e · 6f48c8e
1 parent 95c261e
commit 6f48c8e
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 40 deletions.
diff --git a/web/src/layout/package/Details.tsx b/web/src/layout/package/Details.tsx
@@ -374,7 +374,7 @@ const Details = (props: Props) => {
                   <div>
                     <SmallTitle text="Kind" />
                     {kinds.map((kind: string, index: number) => (
-                      <p
+                      <div
                         data-testid="keptnKind"
                         className={classnames('text-truncate', styles.text, { 'mb-1': index + 1 !== kinds.length })}
                         key={`keptn-kind-${kind}`}
@@ -383,7 +383,7 @@ const Details = (props: Props) => {
                           <span className="pe-1">&#183;</span>
                           <small>{kind}</small>
                         </div>
-                      </p>
+                      </div>
                     ))}
                   </div>
                 )}

diff --git a/web/src/layout/package/index.test.tsx b/web/src/layout/package/index.test.tsx
@@ -179,35 +179,6 @@ describe('Package index', () => {
     });
   });
 
-  // describe('Go back button', () => {
-  //   it('proper behaviour', async () => {
-  //     const searchUrlReferer = {
-  //       tsQueryWeb: 'test',
-  //       filters: {},
-  //       pageNumber: 1,
-  //       deprecated: false,
-  //     };
-  //     const mockPackage = getMockPackage('4');
-  //     mocked(API).getPackage.mockResolvedValue(mockPackage);
-
-  //     render(
-  //       <Router>
-  //         <PackageView searchUrlReferer={searchUrlReferer} />
-  //       </Router>
-  //     );
-
-  //     const goBack = await screen.findByRole('button', { name: /Back to results/ });
-  //     expect(goBack).toBeInTheDocument();
-  //     await userEvent.click(goBack);
-  //     expect(mockHistoryPush).toHaveBeenCalledTimes(1);
-  //     expect(mockHistoryPush).toHaveBeenCalledWith({
-  //       pathname: '/packages/search',
-  //       search: prepareQueryString(searchUrlReferer),
-  //       state: { 'from-detail': true },
-  //     });
-  //   });
-  // });
-
   describe('Repository button', () => {
     it('renders repository link', async () => {
       const mockPackage = getMockPackage('5');

diff --git a/web/src/layout/package/index.tsx b/web/src/layout/package/index.tsx
@@ -759,7 +759,7 @@ const PackageView = () => {
                   }),
                 },
                 {
-                  state: { 'from-detail': true },
+                  state: { fromDetail: true },
                 }
               );
             }}
@@ -790,7 +790,7 @@ const PackageView = () => {
                   pathname: '/packages/starred',
                 },
                 {
-                  state: { 'from-detail': true },
+                  state: { fromDetail: true },
                 }
               );
             }}

diff --git a/web/src/layout/search/index.tsx b/web/src/layout/search/index.tsx
@@ -6,7 +6,7 @@ import isUndefined from 'lodash/isUndefined';
 import { Fragment, useContext, useEffect, useState } from 'react';
 import { FaFilter } from 'react-icons/fa';
 import { IoMdCloseCircleOutline } from 'react-icons/io';
-import { useLocation, useNavigate, useOutletContext } from 'react-router-dom';
+import { NavigationType, useLocation, useNavigate, useNavigationType, useOutletContext } from 'react-router-dom';
 
 import API from '../../api';
 import { AppCtx, updateLimit } from '../../context/AppCtx';
@@ -52,6 +52,7 @@ const SearchView = () => {
   const { ctx, dispatch } = useContext(AppCtx);
   const navigate = useNavigate();
   const location = useLocation();
+  const navType: NavigationType = useNavigationType();
   const { tsQueryWeb, filters, pageNumber, deprecated, operators, verifiedPublisher, cncf, official, sort } =
     buildSearchParams(location.search);
   const sampleQueries = getSampleQueries();
@@ -309,12 +310,7 @@ const SearchView = () => {
         setApiError('An error occurred searching packages, please try again later.');
       } finally {
         setIsSearching(false);
-        if (
-          // TODO - location.action === 'POP' ||
-          fromDetail &&
-          !isUndefined(viewedPackage) &&
-          !isUndefined(scrollPosition)
-        ) {
+        if (navType === 'POP' || (fromDetail && !isUndefined(viewedPackage) && !isUndefined(scrollPosition))) {
           setTimeout(() => {
             scrollToTop(scrollPosition);
           }, 200);