diff --git a/src/components/post/post-menu/post-menu.tsx b/src/components/post/post-menu/post-menu.tsx index 39dd653d..944c9097 100644 --- a/src/components/post/post-menu/post-menu.tsx +++ b/src/components/post/post-menu/post-menu.tsx @@ -31,16 +31,23 @@ const CopyLinkButton = ({ cid, subplebbitAddress, onClose }: PostMenuProps) => { const ImageSearchButton = ({ url, onClose }: { url: string; onClose: () => void }) => { const [isImageSearchMenuOpen, setIsImageSearchMenuOpen] = useState(false); + + const { refs, floatingStyles } = useFloating({ + placement: 'right-start', + middleware: [flip(), shift({ padding: 10 })], + }); + return (
setIsImageSearchMenuOpen(true)} onMouseLeave={() => setIsImageSearchMenuOpen(false)} + ref={refs.setReference} onClick={onClose} > Image search » {isImageSearchMenuOpen && ( -
+
Google
@@ -59,16 +66,23 @@ const ImageSearchButton = ({ url, onClose }: { url: string; onClose: () => void const ViewOnButton = ({ cid, isDescription, isRules, subplebbitAddress, onClose }: PostMenuProps) => { const [isClientRedirectMenuOpen, setIsClientRedirectMenuOpen] = useState(false); const viewOnOtherClientLink = `p/${subplebbitAddress}${isDescription || isRules ? '' : `/c/${cid}`}`; + + const { refs, floatingStyles } = useFloating({ + placement: 'right-start', + middleware: [flip(), shift({ padding: 10 })], + }); + return (
setIsClientRedirectMenuOpen(true)} onMouseLeave={() => setIsClientRedirectMenuOpen(false)} + ref={refs.setReference} onClick={onClose} > View on » {isClientRedirectMenuOpen && ( -
+