Modify mark-all button behavior

src/bridges/settings.ts

@@ -124,6 +124,13 @@ const settingsBridge = {
         ipcRenderer.invoke("set-nedb-status", flag)
     },
 
+    getMarkReadDays: (): number => {
+        return ipcRenderer.sendSync("get-mark-read-days");
+    },
+    setMarkReadDays: (days: number) => {
+        ipcRenderer.invoke("set-mark-read-days", days);
+    },
+
     getAll: () => {
         return ipcRenderer.sendSync("get-all-settings") as Object
     },

src/components/context-menu.tsx

@@ -539,6 +539,8 @@ function GroupContextMenu() {
 function MarkReadContextMenu() {
     const dispatch = useAppDispatch()
 
+    const currentMarkReadDays = window.settings.getMarkReadDays()
+
     const menuItems: IContextualMenuItem[] = [
         {
             key: "section_1",
@@ -549,36 +551,51 @@ function MarkReadContextMenu() {
                     {
                         key: "all",
                         text: intl.get("allArticles"),
-                        iconProps: { iconName: "ReceiptCheck" },
+                        iconProps:
+                            currentMarkReadDays === null
+                                ? { iconName: "CheckMark" }
+                                : undefined,
                         onClick: () => {
-                            dispatch(markAllRead())
+                            window.settings.setMarkReadDays(null)
                         },
                     },
                     {
                         key: "1d",
                         text: intl.get("app.daysAgo", { days: 1 }),
+                        iconProps:
+                            currentMarkReadDays === 1
+                                ? { iconName: "CheckMark" }
+                                : undefined,
                         onClick: () => {
                             let date = new Date()
                             date.setTime(date.getTime() - 86400000)
-                            dispatch(markAllRead(null, date))
+                            window.settings.setMarkReadDays(1)
                         },
                     },
                     {
                         key: "3d",
                         text: intl.get("app.daysAgo", { days: 3 }),
+                        iconProps:
+                            currentMarkReadDays === 3
+                                ? { iconName: "CheckMark" }
+                                : undefined,
                         onClick: () => {
                             let date = new Date()
                             date.setTime(date.getTime() - 3 * 86400000)
-                            dispatch(markAllRead(null, date))
+                            window.settings.setMarkReadDays(3)
                         },
                     },
                     {
                         key: "7d",
                         text: intl.get("app.daysAgo", { days: 7 }),
+                        iconProps:
+                            currentMarkReadDays === 7
+                                ? { iconName: "CheckMark" }
+                                : undefined,
                         onClick: () => {
                             let date = new Date()
                             date.setTime(date.getTime() - 7 * 86400000)
-                            dispatch(markAllRead(null, date))
+                            window.settings.setMarkReadDays(7)
                         },
                     },
                 ],

src/components/nav.tsx

@@ -1,7 +1,7 @@
 import * as React from "react"
 import intl from "react-intl-universal"
 import { Icon } from "@fluentui/react/lib/Icon"
-import { AppState } from "../scripts/models/app"
+import { AppState, ContextMenuType } from "../scripts/models/app"
 import { ProgressIndicator, IObjectWithKey } from "@fluentui/react"
 import { getWindowBreakpoint } from "../scripts/utils"
 import { WindowStateListenerType } from "../schema-types"
@@ -11,7 +11,8 @@ type NavProps = {
     itemShown: boolean
     menu: () => void
     search: () => void
-    markAllRead: () => void
+    markAllMenu: () => void
+    markAllRead: (sids?, date?) => void
     fetch: () => void
     logs: () => void
     views: () => void
@@ -70,7 +71,7 @@ class Nav extends React.Component<NavProps, NavState> {
                     this.fetch()
                     break
                 case "F6":
-                    this.props.markAllRead()
+                    this.props.markAllMenu()
                     break
                 case "F7":
                     if (!this.props.itemShown) this.props.logs()
@@ -163,14 +164,26 @@ class Nav extends React.Component<NavProps, NavState> {
                     <a
                         className="btn"
                         id="mark-all-toggle"
-                        onClick={this.props.markAllRead}
                         title={intl.get("nav.markAllRead")}
                         onMouseDown={e => {
-                            if (
-                                this.props.state.contextMenu.event ===
-                                "#mark-all-toggle"
-                            )
+                            if (this.props.state.contextMenu.event === "#mark-all-toggle")
                                 e.stopPropagation()
+                        }}
+                        onClick={() => {
+                            const lastMarkReadDays = window.settings.getMarkReadDays();
+                            if (lastMarkReadDays) {
+                                let date = new Date();
+                                date.setTime(date.getTime() - lastMarkReadDays * 86400000);
+                                this.props.markAllRead(null, date);
+                            } else {
+                                this.props.markAllRead();
+                            }
+                            if (this.props.state.contextMenu.type === ContextMenuType.MarkRead) {
+                                this.props.markAllMenu() // Close the menu on left-click if open.
+                            }
+                        }}
+                        onContextMenu={() => {
+                            this.props.markAllMenu()
                         }}>
                         <Icon iconName="InboxCheck" />
                     </a>

src/containers/nav-container.tsx

@@ -33,7 +33,8 @@ const mapDispatchToProps = dispatch => ({
     views: () => dispatch(openViewMenu()),
     settings: () => dispatch(toggleSettings()),
     search: () => dispatch(toggleSearch()),
-    markAllRead: () => dispatch(openMarkAllMenu()),
+    markAllMenu: () => dispatch(openMarkAllMenu()),
+    markAllRead: (sids?, date?) => dispatch(markAllRead(sids, date)),
 })
 
 const NavContainer = connect(mapStateToProps, mapDispatchToProps)(Nav)

src/main/settings.ts

@@ -204,3 +204,11 @@ ipcMain.on("get-nedb-status", event => {
 ipcMain.handle("set-nedb-status", (_, flag: boolean) => {
     store.set(NEDB_STATUS_STORE_KEY, flag)
 })
+
+const MARK_READ_DAYS_STORE_KEY = "markReadDays";
+ipcMain.on("get-mark-read-days", (event) => {
+    event.returnValue = store.get(MARK_READ_DAYS_STORE_KEY, null);
+});
+ipcMain.handle("set-mark-read-days", (_, days: number | null) => {
+    store.set(MARK_READ_DAYS_STORE_KEY, days);
+});

src/schema-types.ts

@@ -98,4 +98,5 @@ export type SchemaTypes = {
     filterType: number
     listViewConfigs: ViewConfigs
     useNeDB: boolean
+    markReadDays: number
 }