Debug broken anchor (#9494)

* Debug broken anchor

* Fix anchors and broken note

* Enhance Popover component to render only on the client side

* Cleanup from debug

* Apply Prettier formatting

---------

Co-authored-by: gfbollingerHakuna <[email protected]>

Author: rachelwhitton

src/components/popover.js

@@ -1,11 +1,22 @@
-import React from "react"
+import React, { useState, useEffect } from 'react';
 
-import { Popover as PDSPopover } from "@pantheon-systems/pds-toolkit-react"
+import { Popover as PDSPopover } from '@pantheon-systems/pds-toolkit-react';
 
 const Popover = ({ icon, title, content }) => {
-  const processedContent = <div dangerouslySetInnerHTML={{ __html: content }} />
+  const processedContent = (
+    <div dangerouslySetInnerHTML={{ __html: content }} />
+  );
+  const [isClient, setIsClient] = useState(false);
 
-  return <PDSPopover content={processedContent} title={title} />
-}
+  useEffect(() => {
+    setIsClient(true);
+  }, []);
 
-export default Popover
+  if (!isClient) {
+    return null;
+  }
+
+  return <PDSPopover content={processedContent} title={title} />;
+};
+
+export default Popover;