feat(webext): add a context menu to quickly save videos to bookmarks …

…list
AXeL-dev · Oct 2, 2022 · c34e163 · c34e163
1 parent 1ac400c
commit c34e163
Showing 1 changed file with 29 additions and 0 deletions.
diff --git a/src/ui/components/webext/Background/ContextMenus.tsx b/src/ui/components/webext/Background/ContextMenus.tsx
@@ -4,6 +4,7 @@ import { removeVideoFlag } from 'store/reducers/videos';
 import { Tab, ContextMenu, ContextMenuInfo } from 'types';
 import { dispatch, useAppSelector } from 'store';
 import {
+  selectBookmarkedVideos,
   selectSeenVideos,
   selectWatchLaterVideos,
 } from 'store/selectors/videos';
@@ -26,6 +27,12 @@ const menus: ContextMenu[] = [
     enabled: false,
     contexts: ['page'],
   },
+  {
+    title: 'Add video to bookmarks list',
+    id: 'add_video_to_bookmarks_list',
+    enabled: false,
+    contexts: ['page'],
+  },
   {
     title: 'Mark video as seen',
     id: 'mark_video_as_seen',
@@ -38,6 +45,7 @@ const menus: ContextMenu[] = [
 
 export default function ContextMenus(props: ContextMenusProps) {
   const watchLaterVideos = useAppSelector(selectWatchLaterVideos());
+  const bookmarkedVideos = useAppSelector(selectBookmarkedVideos());
   const seenVideos = useAppSelector(selectSeenVideos());
 
   const handleContextMenusClick = (info: ContextMenuInfo, tab: Tab) => {
@@ -48,6 +56,7 @@ export default function ContextMenus(props: ContextMenusProps) {
     switch (info.menuItemId) {
       case 'add_video_to_watch_later_list':
         closeExtensionTabs().then(() => {
+          browser.contextMenus.update(info.menuItemId, { enabled: false });
           dispatch(
             addVideoById({
               id,
@@ -57,7 +66,20 @@ export default function ContextMenus(props: ContextMenusProps) {
             }),
             true,
           );
+        });
+        break;
+      case 'add_video_to_bookmarks_list':
+        closeExtensionTabs().then(() => {
           browser.contextMenus.update(info.menuItemId, { enabled: false });
+          dispatch(
+            addVideoById({
+              id,
+              flags: {
+                bookmarked: true,
+              },
+            }),
+            true,
+          );
         });
         break;
       case 'mark_video_as_seen': {
@@ -129,6 +151,13 @@ export default function ContextMenus(props: ContextMenusProps) {
               options.enabled = !found;
               break;
             }
+            case 'add_video_to_bookmarks_list': {
+              const found = bookmarkedVideos.find(
+                (video) => video.id === videoId,
+              );
+              options.enabled = !found;
+              break;
+            }
             case 'mark_video_as_seen': {
               const found = seenVideos.find((video) => video.id === videoId);
               options.checked = !!found;