homeflowjs 1.0.59 → 1.0.61

package/hooks/index.js

@@ -7,9 +7,11 @@ import useLoadBranches from './use-load-branches';
 import useLoadPreviousProperties from './use-load-previous-properties';
 import useRecaptcha from './use-recaptcha';
 import useScrollTo from './use-scroll-to.hook';
+import useSearchFromFragment from './use-search-from-fragment';
 
 export {
   useDefaultSort,
+  useSearchFromFragment,
   useGeolocate,
   useOutsideClick,
   useOnScreen,

package/hooks/use-search-from-fragment.js

@@ -0,0 +1,53 @@
+import { useCallback, useEffect, useState } from 'react';
+import 'regenerator-runtime/runtime';
+
+const useSearchFromFragment = ({
+  fragment,
+  channel = 'sales',
+  count = 6, // page size
+  placeId,
+}) => {
+  const [foundProperties, setFoundProperties] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+
+  const searchUrl = useCallback(() => {
+    let buildUrl = `/search.ljson?channel=${channel}`;
+
+    if (placeId) buildUrl = buildUrl += `&place_id=${placeId}`
+    if (count) buildUrl = buildUrl += `&count=${count}`
+    
+    buildUrl += `&fragment=${fragment}`
+
+    return buildUrl;
+  }, []);
+  
+  useEffect(() => {
+    const findProperties = async () => {
+      try {
+        const searchResponse = await fetch(searchUrl());
+        if (!searchResponse.ok) {
+          throw new Error('Failed to fetch properties data');
+        }
+        const { properties } = await searchResponse.json();
+        setFoundProperties(properties);
+      } catch (error) {
+        setError(error);
+        console.error(error);
+      } finally {
+        setLoading(false);
+      }
+    };
+
+
+    if (foundProperties === null) findProperties();
+  }, []);
+
+  return {
+    foundProperties,
+    error,
+    loading,
+  };
+}
+
+export default useSearchFromFragment;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "homeflowjs",
-  "version": "1.0.59",
+  "version": "1.0.61",
   "sideEffects": [
     "modal/**/*",
     "user/default-profile/**/*",

package/properties/load-more-button/load-more-button.component.jsx

@@ -8,12 +8,6 @@ import { addSearchToLocalStorage } from '../../app/user-history';
 import { Link } from 'react-router-dom';
 
 const LoadMoreButton = (props) => {
-  const dispatch = useDispatch();
-  const currentSearch = useSelector((state) => state.search?.currentSearch);
-  const pagination = useSelector((state) => state.properties?.pagination);
-
-  if (!pagination.has_next_page) return null;
-
   const {
     isRouterLink,
     children,
@@ -21,21 +15,38 @@ const LoadMoreButton = (props) => {
     isHidden,
     ...otherProps
   } = props;
-
+  const dispatch = useDispatch();
+  const pagination = useSelector((state) => state.properties?.pagination);
+  const currentSearch = useSelector((state) => state.search?.currentSearch);
   const [loading, setLoading] = useState(false);
   const [targetURL, setTargetURL] = useState(window.location.href);
 
-  // Updating the url for the link to follow the next page,
-  // replacing the page with current page with the next page value
-  // to avoid duplicated pages in url pattern such as page-2/page-3.
-  const updatePageLink = (url) => {
+  /**
+   * There might be a slight delay between the pagination and the properties
+   * update in the redux store and the execution of the dispatch.then()
+   * that can affect the page number link. This is hacks that possible delay.
+   */
+  const updateLinkUrlWithDelay = () => setTimeout(
+    () => setTargetURL(window.location.href), 250,
+  );
+
+  /**
+   * Updating the url for the link to follow the next page,
+   * replacing the page with current page with the next page value
+   * to avoid duplicated pages in url pattern such as page-2/page-3.
+   */
+  const updatePageLink = (pageUrl) => {
+    const url = pageUrl.replace('#/', '');
+
     if (url.includes('page-')) {
       return url.replace(/page-\d+/, `page-${pagination.current_page + 1}`);
     } else {
       // Fix for the page-2 when the url does not have a value for page-1
-      return url + (url.endsWith('/') ? '' : '/') + `page-${pagination.current_page + 1}`;
+      return url
+        + (url.endsWith('/') ? '' : '/')
+        + (pagination.has_next_page ? `page-${pagination.current_page + 1}` : '');
     }
-  }
+  };
 
   const handleClick = (e) => {
     e.preventDefault();
@@ -49,14 +60,20 @@ const LoadMoreButton = (props) => {
         
         setLoading(false);
         addSearchToLocalStorage(searchToLocal);
-        setTargetURL(window.location.href);
+        updateLinkUrlWithDelay();
         return false;
       });
     return false;
   }
 
-  {/* Load More Button component uses Link from react-router-dom to avoid navigating pages for themes using the component inside a react router wrapper. */}
+  /*
+   * Load More Button component uses Link from react-router-dom to
+   * avoid navigating pages for themes using the component inside 
+   * a react router wrapper.
+   */
   const RouterLinkComponent = () => {
+    if (!pagination.has_next_page) return null;
+
     return (
       <Link 
         onClick={(e) => handleClick(e)}
@@ -69,6 +86,8 @@ const LoadMoreButton = (props) => {
   }
 
   const LinkComponent = () => {
+    if (!pagination.has_next_page) return null;
+
     return (
       <a
         onClick={(e) => handleClick(e)}
@@ -80,8 +99,14 @@ const LoadMoreButton = (props) => {
     )
   };
 
-  {/* Hidden link for themes using InfiniteScroll: allows Googlebot to discover the Next page link for indexing, while users trigger infinite scroll without actual navigation. */}
+  /*
+  * Hidden link for themes using InfiniteScroll: allows Googlebot to discover
+  * the Next page link for indexing, while users trigger infinite scroll
+  * without actual navigation.
+  */
   const HiddenLinkComponent = () => {
+    if (!pagination.has_next_page) return null;
+
     return (
       <a
         style={{ display: 'none' }}