fix context menu & shortcuts

src/components/article.tsx

@@ -114,11 +114,22 @@ class Article extends React.Component<ArticleProps, ArticleState> {
                 case "ArrowRight":
                     this.props.offsetItem(input.key === "ArrowLeft" ? -1 : 1)
                     break
-                case "l": 
+                case "l": case "L":
                     this.toggleWebpage()
                     break
                 default:
                     this.props.shortcuts(this.props.item, input.key)
+                    const keyboardEvent = new KeyboardEvent("keydown", {
+                        code: input.code,
+                        key: input.key,
+                        shiftKey: input.shift,
+                        altKey: input.alt,
+                        ctrlKey: input.control,
+                        metaKey: input.meta,
+                        repeat: input.isAutoRepeat,
+                        bubbles: true
+                    })
+                    document.dispatchEvent(keyboardEvent)
                     break
             }
         }

src/components/nav.tsx

@@ -7,14 +7,15 @@ import { ProgressIndicator } from "@fluentui/react"
 import { getWindowBreakpoint } from "../scripts/utils"
 
 type NavProps = {
-    state: AppState,
+    state: AppState
-    itemShown: boolean,
+    itemShown: boolean
-    fetch: () => void,
+    menu: () => void
-    menu: () => void,
+    search: () => void
-    logs: () => void,
-    views: () => void,
-    settings: () => void,
     markAllRead: () => void
+    fetch: () => void
+    logs: () => void
+    views: () => void
+    settings: () => void
 }
 
 type NavState = {
@@ -44,6 +45,9 @@ class Nav extends React.Component<NavProps, NavState> {
                 case "F1":
                     this.props.menu()
                     break
+                case "F2":
+                    this.props.search()
+                    break
                 case "F5":
                     this.fetch()
                     break

src/components/page.tsx

@@ -7,6 +7,7 @@ import ArticleSearch from "./utils/article-search"
 
 type PageProps = {
     menuOn: boolean
+    contextOn: boolean
     settingsOn: boolean
     feeds: string[]
     itemId: string
@@ -35,6 +36,7 @@ class Page extends React.Component<PageProps> {
             </div>}
             {this.props.itemId && (
                 <FocusTrapZone 
+                    disabled={this.props.contextOn}
                     ignoreExternalFocusing={true}
                     isClickableOutsideFocusTrap={true}
                     className="article-container"

src/components/utils/article-search.tsx

@@ -41,6 +41,7 @@ class ArticleSearch extends React.Component<SearchProps, SearchState> {
 
     componentDidUpdate(prevProps: SearchProps) {
         if (this.props.searchOn && !prevProps.searchOn) {
+            this.setState({ query: this.props.initQuery })
             this.inputRef.current.focus()
         }
     }

src/containers/nav-container.tsx

@@ -5,7 +5,7 @@ import { createSelector } from "reselect"
 import { RootState } from "../scripts/reducer"
 import { fetchItems, markAllRead } from "../scripts/models/item"
 import { toggleMenu, toggleLogMenu, toggleSettings, openViewMenu } from "../scripts/models/app"
-import { ViewType } from "../scripts/models/page"
+import { ViewType, toggleSearch } from "../scripts/models/page"
 import Nav from "../components/nav"
 
 const getState = (state: RootState) => state.app
@@ -25,6 +25,7 @@ const mapDispatchToProps = (dispatch) => ({
     logs: () => dispatch(toggleLogMenu()),
     views: () => dispatch(openViewMenu()),
     settings: () => dispatch(toggleSettings()),
+    search: () => dispatch(toggleSearch()),
     markAllRead: () => {
         remote.dialog.showMessageBox(remote.getCurrentWindow(), {
             title: intl.get("nav.markAllRead"),

src/containers/page-container.tsx

@@ -4,17 +4,20 @@ import { RootState } from "../scripts/reducer"
 import Page from "../components/page"
 import { AppDispatch } from "../scripts/utils"
 import { dismissItem, showOffsetItem } from "../scripts/models/page"
+import { ContextMenuType } from "../scripts/models/app"
 
 const getPage = (state: RootState) => state.page
 const getSettings = (state: RootState) => state.app.settings.display
 const getMenu = (state: RootState) => state.app.menu
+const getContext = (state: RootState) => state.app.contextMenu.type != ContextMenuType.Hidden
 
 const mapStateToProps = createSelector(
-    [getPage, getSettings, getMenu],
+    [getPage, getSettings, getMenu, getContext],
-    (page, settingsOn, menuOn) => ({
+    (page, settingsOn, menuOn, contextOn) => ({
         feeds: [page.feedId],
         settingsOn: settingsOn,
         menuOn: menuOn,
+        contextOn: contextOn,
         itemId: page.itemId,
         viewType: page.viewType
     })

src/electron.ts

@@ -66,8 +66,12 @@ if (process.platform === 'darwin') {
         {
             label: "Edit",
             submenu: [
+                { label: "Undo", accelerator: "CmdOrCtrl+Z", selector: "undo:" },
+                { label: "Redo", accelerator: "Shift+CmdOrCtrl+Z", selector: "redo:" },
+                { label: "Cut", accelerator: "CmdOrCtrl+X", selector: "cut:" },
                 { label: "Copy", accelerator: "CmdOrCtrl+C", selector: "copy:" },
                 { label: "Paste", accelerator: "CmdOrCtrl+V", selector: "paste:" },
+                { label: "Select All", accelerator: "CmdOrCtrl+A", selector: "selectAll:" }
             ]
         }
     ]

src/scripts/models/app.ts

@@ -266,10 +266,7 @@ export function appReducer(
         }
         case INIT_FEEDS:
             switch (action.status) {
-                case ActionStatus.Request: return {
+                case ActionStatus.Request: return state
-                    ...state,
-                    feedInit: false
-                }
                 default: return {
                     ...state,
                     feedInit: true

src/scripts/models/item.ts

@@ -266,17 +266,18 @@ export function toggleHidden(item: RSSItem): AppThunk {
 export function itemShortcuts(item: RSSItem, key: string): AppThunk {
     return (dispatch) => {
         switch (key) {
-            case "m": 
+            case "m": case "M":
                 if (item.hasRead) dispatch(markUnread(item))
                 else dispatch(markRead(item))
                 break
-            case "b": 
+            case "b": case "B":
+                if (!item.hasRead) dispatch(markRead(item))
                 openExternal(item.link)
                 break
-            case "s": 
+            case "s": case "S":
                 dispatch(toggleStarred(item))
                 break
-            case "h": 
+            case "h": case "H":
                 dispatch(toggleHidden(item))
                 break
         }

src/scripts/models/page.ts

@@ -1,5 +1,5 @@
-import { ALL, SOURCE, loadMore, FeedFilter, FilterType, initFeeds } from "./feed"
+import { ALL, SOURCE, loadMore, FeedFilter, FilterType, initFeeds, FeedActionTypes, INIT_FEED } from "./feed"
-import { getWindowBreakpoint, AppThunk } from "../utils"
+import { getWindowBreakpoint, AppThunk, ActionStatus } from "../utils"
 import { getDefaultView } from "../settings"
 import { RSSItem, markRead } from "./item"
 import { SourceActionTypes, DELETE_SOURCE } from "./source"
@@ -104,7 +104,7 @@ export const toggleSearch = (): AppThunk => {
     return (dispatch, getState) => {
         let state = getState()
         dispatch(({ type: TOGGLE_SEARCH }))
-        if (!getWindowBreakpoint()) {
+        if (!getWindowBreakpoint() && state.app.menu) {
             dispatch(toggleMenu())
         }
         if (state.page.searchOn) {
@@ -214,7 +214,7 @@ export class PageState {
 
 export function pageReducer(
     state = new PageState(),
-    action: PageActionTypes | SourceActionTypes
+    action: PageActionTypes | SourceActionTypes | FeedActionTypes
 ): PageState {
     switch (action.type) {
         case SELECT_PAGE:
@@ -244,6 +244,14 @@ export function pageReducer(
             ...state,
             itemId: action.item._id
         }
+        case INIT_FEED: switch (action.status) {
+            case ActionStatus.Success: return {
+                ...state,
+                itemId: (action.feed._id === state.feedId && action.items.filter(i => i._id === state.itemId).length === 0)
+                    ? null : state.itemId
+            }
+            default: return state
+        }
         case DELETE_SOURCE:
         case DISMISS_ITEM: return {
             ...state,