Add option to show 'Open All' as the first item in the submenu

Author: Brawl345

CHANGES.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 4.1.0
+
+- Add option to show 'Open All' as the first item
+
 ## 4.0.0
 
 - Complete rewrite with Manifest v3 and Svelte framework with a slightly updated UI

public/_locales/de/messages.json

@@ -86,5 +86,8 @@
   },
   "showOpenAll": {
     "message": "'Alle öffnen' anzeigen"
+  },
+  "showOpenAllAtTop": {
+    "message": "'Alle öffnen' als Erstes anzeigen"
   }
 }

public/_locales/en/messages.json

@@ -86,5 +86,8 @@
   },
   "showOpenAll": {
     "message": "Show 'Open All'"
+  },
+  "showOpenAllAtTop": {
+    "message": "Show 'Open All' at the top"
   }
 }

public/manifest.json

@@ -4,7 +4,7 @@
   "name": "__MSG_extensionName__",
   "description": "__MSG_extensionDescription__",
   "author": "Andreas Bielawski",
-  "version": "4.0.0",
+  "version": "4.1.0",
   "icons": {
     "16": "icons/16.png",
     "32": "icons/32.png",

source/default-options.json

@@ -2,6 +2,7 @@
   "openInBackground": false,
   "openTabAt": "right",
   "showOpenAll": true,
+  "showOpenAllAtTop": false,
   "searchAllByDefault": false,
   "storageProviders": [
     {

source/options/components/Form.svelte

@@ -96,6 +96,24 @@
     </div>
   </div>
 
+  <div class="row">
+    <label
+      class="col-sm-3 col-form-label form-check-label"
+      for="showOpenAllAtTop">{getMessage('showOpenAllAtTop')}</label
+    >
+    <div class="col-sm-9">
+      <input
+        id="showOpenAllAtTop"
+        class="form-check-input mt-2"
+        name="showOpenAllAtTop"
+        type="checkbox"
+        bind:checked={$options.showOpenAllAtTop}
+        disabled={$options.searchAllByDefault === true ||
+          $options.showOpenAll === false}
+      />
+    </div>
+  </div>
+
   <div class="row">
     <label
       class="col-sm-3 col-form-label form-check-label"

source/service-worker/service-worker-functions.js

@@ -7,6 +7,7 @@ const OPEN_ALL_ID = 'openAll';
 export const setupContextMenu = ({
   storageProviders,
   showOpenAll,
+  showOpenAllAtTop,
   searchAllByDefault,
 }) => {
   const selectedProviders = storageProviders.filter((p) => p.selected);
@@ -21,13 +22,31 @@ export const setupContextMenu = ({
     return;
   }
 
+  const separator = {
+    parentId: PARENT_ID,
+    id: 'image-reverse-search-separator',
+    type: 'separator',
+  };
+
+  const openAllEntry = {
+    parentId: PARENT_ID,
+    id: OPEN_ALL_ID,
+    title: getMessageForServiceWorker('contextMenuOpenAll'),
+    contexts: ['image'],
+  };
+
   /* Create menu and submenu entries */
   chrome.contextMenus.create({
     id: PARENT_ID,
     title: getMessageForServiceWorker('contextMenuTitle'),
     contexts: ['image'],
   });
 
+  if (showOpenAll && showOpenAllAtTop) {
+    chrome.contextMenus.create(openAllEntry);
+    chrome.contextMenus.create(separator);
+  }
+
   for (const provider of selectedProviders) {
     const contextMenuOptions = {
       parentId: PARENT_ID,
@@ -47,18 +66,9 @@ export const setupContextMenu = ({
     }
   }
 
-  if (showOpenAll) {
-    chrome.contextMenus.create({
-      parentId: PARENT_ID,
-      id: 'imag-ereverse-search-seperator',
-      type: 'separator',
-    });
-    chrome.contextMenus.create({
-      parentId: PARENT_ID,
-      id: OPEN_ALL_ID,
-      title: getMessageForServiceWorker('contextMenuOpenAll'),
-      contexts: ['image'],
-    });
+  if (showOpenAll && !showOpenAllAtTop) {
+    chrome.contextMenus.create(separator);
+    chrome.contextMenus.create(openAllEntry);
   }
 };