diff --git a/package-lock.json b/package-lock.json index ec9e70b39..91939a341 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,11 +1,11 @@ { "name": "bluehost-wordpress-plugin", - "version": "3.3.1", + "version": "3.3.2", "lockfileVersion": 2, "requires": true, "packages": { "": { - "version": "3.3.1", + "version": "3.3.2", "license": "GPL-2.0-or-later", "dependencies": { "@heroicons/react": "^2.0.18", diff --git a/src/app/components/section/index.js b/src/app/components/section/index.js index 32638fe6c..75d862ef5 100644 --- a/src/app/components/section/index.js +++ b/src/app/components/section/index.js @@ -1,4 +1,5 @@ import { Button, Title } from "@newfold/ui-component-library"; +import { useState, useEffect} from '@wordpress/element'; import classNames from "classnames"; export const SectionContainer = ({ className, children }) => { @@ -56,9 +57,42 @@ export const SectionHeader = ({ ); } -export const SectionContent = ({ separator = false, className, children }) => { +export const SectionContent = ({ + separator = false, + id, + className, + children +}) => { + const [isTarget, setIsTarget] = useState(false); + const searchParams = new URLSearchParams(window.location.search); + + useEffect(() => { + if (searchParams.has('nfd-target') && searchParams.get('nfd-target') === id) { + setIsTarget(true); + + setTimeout(() => { + setIsTarget(false); + removeTargetQueryParam(); + }, 9500); + } + }, [searchParams]); + + /* + * Remove the 'nfd-target={id}' query param from the URL + */ + const removeTargetQueryParam = () => { + searchParams.delete('nfd-target'); + const currentURL = window.location.href; + const updatedURL = currentURL.replace(`&nfd-target=${id}`, ''); + window.history.replaceState(null, null, updatedURL); + } + return ( -