enhance: set up observers for various searches

Valik3201 · Dec 29, 2023 · 487752e · 487752e
1 parent bfa4701
commit 487752e
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 5 deletions.
diff --git a/src/app/js/formSearch.js b/src/app/js/formSearch.js
@@ -7,6 +7,8 @@ import {
   clearGallery,
 } from "./searchService.js";
 
+import { intersectionObserver } from "./popularSearch.js";
+
 /**
  * Handle the submission of the search form.
  *
@@ -26,11 +28,13 @@ const handleSearchFormSubmit = async (event) => {
   // If the search query is not empty, perform Pixabay image search and render the results
   if (searchQuery !== "") {
     // Perform Pixabay image search and get the total number of hits
-    const totalHits = await searchAndRenderPixabayImages(searchQuery);
+    const totalHits = await searchAndRenderPixabayImages(searchQuery, "form");
 
     // Update the UI with information about the search results
     updateResultsInfo(searchQuery, totalHits);
   }
+
+  intersectionObserver.disconnect();
 };
 
 // Add an event listener to the search form for form submission handling

diff --git a/src/app/js/loadMoreButton.js b/src/app/js/loadMoreButton.js
@@ -18,7 +18,7 @@ const handleLoadMoreButtonClick = async () => {
   // If the search query is not empty, perform Pixabay image search and render more results
   if (searchQuery !== "") {
     // Perform Pixabay image search and render additional results
-    await searchAndRenderPixabayImages(searchQuery);
+    await searchAndRenderPixabayImages(searchQuery, "form");
   }
 };
 

diff --git a/src/app/js/searchService.js b/src/app/js/searchService.js
@@ -76,7 +76,7 @@ export const updateResultsInfo = (query, totalHits) => {
  * @param {string} query - The search query.
  * @returns {Promise<number>} - The total number of hits.
  */
-export const searchAndRenderPixabayImages = async (query) => {
+export const searchAndRenderPixabayImages = async (query, typeSearch) => {
   try {
     // Display loading dots while fetching data.
     Loading.dots();
@@ -98,8 +98,12 @@ export const searchAndRenderPixabayImages = async (query) => {
       Notify.info("We're sorry, but you've reached the end of search results.");
     }
 
-    // Show or hide the load more button based on the number of hits.
-    loadMoreButton.style.display = hits.length >= perPage ? "block" : "none";
+    if (typeSearch === "form") {
+      // Show or hide the load more button based on the number of hits.
+      loadMoreButton.style.display = hits.length >= perPage ? "block" : "none";
+    } else {
+      loadMoreButton.style.display = "none";
+    }
 
     // Increment the page for the next search.
     incrementPage();