Mirrors/responsively-app
2
0
Fork 0
mirror of https://github.com/responsively-org/responsively-app synced 2024-11-10 14:54:12 +00:00
Code Issues Projects Releases Packages Wiki Activity

added useDetectionOutside for bookmark

Browse source
This commit is contained in:
Negar 2023-09-21 22:26:54 +01:00
parent af9f72cd07
commit edb1de29c9
1 changed files with 10 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
desktop-app/src/renderer/components/ToolBar/AddressBar/BookmarkButton.tsx
View file

@ -1,8 +1,10 @@
import { Icon } from '@iconify/react';
import { useState, useMemo } from 'react';
import { useDetectClickOutside } from 'react-detect-click-outside';
import { useDispatch, useSelector } from 'react-redux';
import cx from 'classnames';
import Button from 'renderer/components/Button';
import {
IBookmarks,
addBookmark,
@ -21,6 +23,12 @@ interface Props {
const BookmarkButton = ({ currentAddress, pageTitle }: Props) => {
const [openFlyout, setOpenFlyout] = useState<boolean>(false);
const dispatch = useDispatch();
const ref = useDetectClickOutside({
onTriggered: () => {
if (!openFlyout) return;
if (openFlyout) setOpenFlyout(false);
},
});
const initbookmark = {
id: '',
@ -48,7 +56,7 @@ const BookmarkButton = ({ currentAddress, pageTitle }: Props) => {
useKeyboardShortcut(SHORTCUT_CHANNEL.BOOKMARK, handleKeyboardShortcut);
return (
<>
<div ref={ref}>
<div>
<Button
className={cx('rounded-full', {
@ -71,7 +79,7 @@ const BookmarkButton = ({ currentAddress, pageTitle }: Props) => {
/>
)}
</div>
</>
</div>
);
};