garrettmills/commafeed
1
0
Fork 0
forked from Archives/Athou_commafeed
Code Pull Requests Activity

add context menu to navigate to feed if a category is displayed

Browse Source
This commit is contained in:
Athou
2023-02-27 14:18:25 +01:00
parent 69fb11eee0
commit 9f421ec3b0
29 changed files with 140 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
commafeed-client/src/components/content/FeedEntryContextMenu.tsx
View File

@@ -2,13 +2,14 @@ import { t, Trans } from "@lingui/macro"
import { createStyles, Group } from "@mantine/core"
import { Constants } from "app/constants"
import { markEntriesUpToEntry, markEntry, starEntry } from "app/slices/entries"
import { useAppDispatch } from "app/store"
import { redirectToFeed } from "app/slices/redirect"
import { useAppDispatch, useAppSelector } from "app/store"
import { Entry } from "app/types"
import { openLinkInBackgroundTab } from "app/utils"
import { throttle } from "lodash"
import { throttle, truncate } from "lodash"
import { useEffect } from "react"
import { Item, Menu, Separator, useContextMenu } from "react-contexify"
import { TbArrowBarToDown, TbExternalLink, TbEyeCheck, TbEyeOff, TbStar, TbStarOff } from "react-icons/tb"
import { TbArrowBarToDown, TbExternalLink, TbEyeCheck, TbEyeOff, TbRss, TbStar, TbStarOff } from "react-icons/tb"
interface FeedEntryContextMenuProps {
entry: Entry
@@ -30,6 +31,7 @@ const useStyles = createStyles(theme => ({
const menuId = (entry: Entry) => entry.id
export function FeedEntryContextMenu(props: FeedEntryContextMenuProps) {
const { classes, theme } = useStyles()
const sourceType = useAppSelector(state => state.entries.source.type)
const dispatch = useAppDispatch()
return (
@@ -59,27 +61,41 @@ export function FeedEntryContextMenu(props: FeedEntryContextMenuProps) {
<Separator />
<Item onClick={() => dispatch(markEntry({ entry: props.entry, read: !props.entry.read }))}>
<Group>
{props.entry.read ? <TbEyeOff size={iconSize} /> : <TbEyeCheck size={iconSize} />}
{props.entry.read ? t`Keep unread` : t`Mark as read`}
</Group>
</Item>
<Item onClick={() => dispatch(starEntry({ entry: props.entry, starred: !props.entry.starred }))}>
<Group>
{props.entry.starred ? <TbStarOff size={iconSize} /> : <TbStar size={iconSize} />}
{props.entry.starred ? t`Unstar` : t`Star`}
</Group>
</Item>
<Separator />
<Item onClick={() => dispatch(markEntry({ entry: props.entry, read: !props.entry.read }))}>
<Group>
{props.entry.read ? <TbEyeOff size={iconSize} /> : <TbEyeCheck size={iconSize} />}
{props.entry.read ? t`Keep unread` : t`Mark as read`}
</Group>
</Item>
<Item onClick={() => dispatch(markEntriesUpToEntry(props.entry))}>
<Group>
<TbArrowBarToDown size={iconSize} />
<Trans>Mark as read up to here</Trans>
</Group>
</Item>
{sourceType === "category" && (
<>
<Separator />
<Item
onClick={() => {
dispatch(redirectToFeed(props.entry.feedId))
}}
>
<Group>
<TbRss size={iconSize} />
<Trans>Go to {truncate(props.entry.feedName)}</Trans>
</Group>
</Item>
</>
)}
</Menu>
)
}