add sharing buttons

commafeed-client/src/components/content/FeedEntryFooter.tsx

@@ -1,17 +1,23 @@
 import { t } from "@lingui/macro"
-import { Checkbox, Group } from "@mantine/core"
+import { Checkbox, Group, Popover } from "@mantine/core"
 import { markEntry, starEntry } from "app/slices/entries"
-import { useAppDispatch } from "app/store"
+import { useAppDispatch, useAppSelector } from "app/store"
 import { Entry } from "app/types"
 import { ActionButton } from "components/ActionButtton"
-import { TbExternalLink, TbStar, TbStarOff } from "react-icons/tb"
+import { TbExternalLink, TbShare, TbStar, TbStarOff } from "react-icons/tb"
+import { ShareButtons } from "./ShareButtons"
 
 interface FeedEntryFooterProps {
     entry: Entry
 }
 
 export function FeedEntryFooter(props: FeedEntryFooterProps) {
+    const sharingSettings = useAppSelector(state => state.user.settings?.sharingSettings)
     const dispatch = useAppDispatch()
+
+    const showSharingButtons =
+        sharingSettings && (Object.values(sharingSettings) as Array<typeof sharingSettings[keyof typeof sharingSettings]>).some(v => v)
+
     const readStatusCheckboxClicked = () => dispatch(markEntry({ entry: props.entry, read: !props.entry.read }))
 
     return (
@@ -32,6 +38,18 @@ export function FeedEntryFooter(props: FeedEntryFooterProps) {
                 label={props.entry.starred ? t`Unstar` : t`Star`}
                 onClick={() => dispatch(starEntry({ entry: props.entry, starred: !props.entry.starred }))}
             />
+
+            {showSharingButtons && (
+                <Popover withArrow withinPortal shadow="md">
+                    <Popover.Target>
+                        <ActionButton icon={<TbShare size={18} />} label={t`Share`} />
+                    </Popover.Target>
+                    <Popover.Dropdown>
+                        <ShareButtons url={props.entry.url} description={props.entry.title} />
+                    </Popover.Dropdown>
+                </Popover>
+            )}
+
             <a href={props.entry.url} target="_blank" rel="noreferrer">
                 <ActionButton icon={<TbExternalLink size={18} />} label={t`Open link`} />
             </a>