WIP: refactor SearchPageBase

apps/app/src/components/Layout/SearchResultLayout.tsx

@@ -12,7 +12,6 @@ const SearchResultLayout = ({ children }: Props): JSX.Element => {
 
   return (
     <BasicLayout className={`on-search ${commonStyles['on-search']}`}>
-      <div id="grw-fav-sticky-trigger" className="sticky-top"></div>
       <div id="main" className="main search-page mt-0">
         { children }
       </div>

apps/app/src/components/SearchPage/SearchPageBase.tsx

@@ -169,63 +169,61 @@ const SearchPageBaseSubstance: ForwardRefRenderFunction<ISelectableAll & IReturn
     : undefined;
 
   return (
-    <div className="content-main">
-      <div className="search-result-base d-flex" data-testid="search-result-base">
+    <div className="search-result-base d-flex" data-testid="search-result-base">
 
-        <div className="mw-0 flex-grow-1 flex-basis-0 border boder-gray search-result-list" id="search-result-list">
+      <div className="mw-0 flex-grow-1 flex-basis-0 border boder-gray search-result-list" id="search-result-list">
 
-          {searchControl}
+        {searchControl}
 
-          <div className="search-result-list-scroll">
+        <div className="search-result-list-scroll">
 
-            {/* Loading */}
-            { pages == null && (
-              <div className="mw-0 flex-grow-1 flex-basis-0 m-5 text-muted text-center">
-                <i className="fa fa-2x fa-spinner fa-pulse mr-1"></i>
-              </div>
-            ) }
+          {/* Loading */}
+          { pages == null && (
+            <div className="mw-0 flex-grow-1 flex-basis-0 m-5 text-muted text-center">
+              <i className="fa fa-2x fa-spinner fa-pulse mr-1"></i>
+            </div>
+          ) }
 
-            {/* Loaded */}
-            { pages != null && (
-              <>
-                <div className="my-3 px-md-4 px-3">
-                  {searchResultListHead}
-                </div>
+          {/* Loaded */}
+          { pages != null && (
+            <>
+              <div className="my-3 px-md-4 px-3">
+                {searchResultListHead}
+              </div>
 
-                { pages.length > 0 && (
-                  <div className={`page-list ${styles['page-list']} px-md-4`}>
-                    <SearchResultList
-                      ref={searchResultListRef}
-                      pages={pages}
-                      selectedPageId={selectedPageWithMeta?.data._id}
-                      forceHideMenuItems={forceHideMenuItems}
-                      onPageSelected={page => (setSelectedPageWithMeta(page))}
-                      onCheckboxChanged={checkboxChangedHandler}
-                    />
-                  </div>
-                ) }
-                <div className="my-4 d-flex justify-content-center">
-                  {searchPager}
+              { pages.length > 0 && (
+                <div className={`page-list ${styles['page-list']} px-md-4`}>
+                  <SearchResultList
+                    ref={searchResultListRef}
+                    pages={pages}
+                    selectedPageId={selectedPageWithMeta?.data._id}
+                    forceHideMenuItems={forceHideMenuItems}
+                    onPageSelected={page => (setSelectedPageWithMeta(page))}
+                    onCheckboxChanged={checkboxChangedHandler}
+                  />
                 </div>
-              </>
-            ) }
-
-          </div>
+              ) }
+              <div className="my-4 d-flex justify-content-center">
+                {searchPager}
+              </div>
+            </>
+          ) }
 
         </div>
 
-        <div className="mw-0 flex-grow-1 flex-basis-0 d-none d-lg-block search-result-content">
-          {pages != null && pages.length !== 0 && selectedPageWithMeta != null && (
-            <SearchResultContent
-              pageWithMeta={selectedPageWithMeta}
-              highlightKeywords={highlightKeywords}
-              showPageControlDropdown={!(isGuestUser || isReadOnlyUser)}
-              forceHideMenuItems={forceHideMenuItems}
-            />
-          )}
-        </div>
+      </div>
 
+      <div className="mw-0 flex-grow-1 flex-basis-0 d-none d-lg-block search-result-content">
+        {pages != null && pages.length !== 0 && selectedPageWithMeta != null && (
+          <SearchResultContent
+            pageWithMeta={selectedPageWithMeta}
+            highlightKeywords={highlightKeywords}
+            showPageControlDropdown={!(isGuestUser || isReadOnlyUser)}
+            forceHideMenuItems={forceHideMenuItems}
+          />
+        )}
       </div>
+
     </div>
   );
 };

apps/app/test/cypress/e2e/20-basic-features/20-basic-features--access-to-page.cy.ts

@@ -237,7 +237,7 @@ context('Access to Template Editing Mode', () => {
     cy.waitUntilSkeletonDisappear();
 
     // Check if the template is applied
-    cy.get('.content-main').within(() => {
+    cy.getByTestid('search-result-base').within(() => {
       cy.get('.wiki').should('be.visible');
       cy.get('.wiki').children().first().should('have.text', expectedBody);
     })