feat: send notification for new entries with Gotify, ntfy or Pushover, configurable per feed.

commafeed-client/src/pages/app/FeedDetailsPage.tsx

@@ -3,6 +3,7 @@ import {
     Anchor,
     Box,
     Button,
+    Checkbox,
     Code,
     Container,
     Divider,
@@ -32,6 +33,38 @@ import { FilteringExpressionEditor } from "@/components/content/edit/FilteringEx
 import { Loader } from "@/components/Loader"
 import { RelativeDate } from "@/components/RelativeDate"
 
+function FilteringExpressionDescription() {
+    const example = <Code>url.contains('youtube') or (author eq 'athou' and title.contains('github'))</Code>
+    return (
+        <div>
+            <div>
+                <Trans>
+                    If not empty, an expression evaluating to 'true' or 'false'. If false, new entries for this feed will be marked as read
+                    automatically.
+                </Trans>
+            </div>
+            <div>
+                <Trans>
+                    Available variables are 'title', 'content', 'url' 'author' and 'categories' and their content is converted to lower case
+                    to ease string comparison.
+                </Trans>
+            </div>
+            <div>
+                <Trans>Example: {example}.</Trans>
+            </div>
+            <div>
+                <Trans>
+                    <span>Complete syntax is available </span>
+                    <a href="https://commons.apache.org/proper/commons-jexl/reference/syntax.html" target="_blank" rel="noreferrer">
+                        here
+                    </a>
+                    <span>.</span>
+                </Trans>
+            </div>
+        </div>
+    )
+}
+
 export function FeedDetailsPage() {
     const { id } = useParams()
     if (!id) throw new Error("id required")
@@ -163,6 +196,15 @@ export function FeedDetailsPage() {
                             <FilteringExpressionEditor initialValue={feed.filter} onChange={value => form.setFieldValue("filter", value)} />
                         </Box>
                     </Input.Wrapper>
+                    <TextInput
+                        label={<Trans>Filtering expression</Trans>}
+                        description={<FilteringExpressionDescription />}
+                        {...form.getInputProps("filter")}
+                    />
+                    <Checkbox
+                        label={<Trans>Receive notifications</Trans>}
+                        {...form.getInputProps("notifyOnNewEntries", { type: "checkbox" })}
+                    />
 
                     <Group>
                         <Button variant="default" onClick={async () => await dispatch(redirectToSelectedSource())}>

commafeed-client/src/pages/app/SettingsPage.tsx

@@ -1,8 +1,9 @@
 import { Trans } from "@lingui/react/macro"
 import { Container, Tabs } from "@mantine/core"
-import { TbCode, TbPhoto, TbUser } from "react-icons/tb"
+import { TbBell, TbCode, TbPhoto, TbUser } from "react-icons/tb"
 import { CustomCodeSettings } from "@/components/settings/CustomCodeSettings"
 import { DisplaySettings } from "@/components/settings/DisplaySettings"
+import { NotificationSettings } from "@/components/settings/NotificationSettings"
 import { ProfileSettings } from "@/components/settings/ProfileSettings"
 
 export function SettingsPage() {
@@ -13,6 +14,9 @@ export function SettingsPage() {
                     <Tabs.Tab value="display" leftSection={<TbPhoto size={16} />}>
                         <Trans>Display</Trans>
                     </Tabs.Tab>
+                    <Tabs.Tab value="notifications" leftSection={<TbBell size={16} />}>
+                        <Trans>Notifications</Trans>
+                    </Tabs.Tab>
                     <Tabs.Tab value="customCode" leftSection={<TbCode size={16} />}>
                         <Trans>Custom code</Trans>
                     </Tabs.Tab>
@@ -25,6 +29,10 @@ export function SettingsPage() {
                     <DisplaySettings />
                 </Tabs.Panel>
 
+                <Tabs.Panel value="notifications" pt="xl">
+                    <NotificationSettings />
+                </Tabs.Panel>
+
                 <Tabs.Panel value="customCode" pt="xl">
                     <CustomCodeSettings />
                 </Tabs.Panel>