🍥 About command & context menus

manifests/chromium/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "SN Launcher - ServiceNow utility tool",
-  "version": "1.2.3",
+  "version": "1.2.5",
   "description": "ServiceNow utility tool, search and navigate with a command palette.(personal project, not affiliated to ServiceNow)",
   "icons": {
     "16": "../../assets/icon.png",
@@ -30,21 +30,20 @@
     "default_title": "SN Launcher"
   },
   "commands": {
-    "snl-toggle-launcher-command": {
+    "_execute_action": {
       "suggested_key": {
         "windows": "Ctrl+Shift+L",
         "mac": "Command+Shift+L",
         "chromeos": "Ctrl+Shift+L",
         "linux": "Ctrl+Shift+L"
-      },
-      "description": "Open launcher"
+      }
     },
     "snl-switch-scope-command": {
       "suggested_key": {
-        "windows": "Ctrl+Shift+S",
-        "mac": "Command+Shift+S",
-        "chromeos": "Ctrl+Shift+S",
-        "linux": "Ctrl+Shift+S"
+        "windows": "Alt+Shift+S",
+        "mac": "Alt+Shift+S",
+        "chromeos": "Alt+Shift+S",
+        "linux": "Alt+Shift+S"
       },
       "description": "Switch scope"
     },
@@ -67,5 +66,5 @@
       "description": "Search history"
     }
   },
-  "permissions": ["tabs", "activeTab"]
+  "permissions": ["tabs", "activeTab", "contextMenus"]
 }

manifests/firefox/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 3,
   "name": "SN Launcher - ServiceNow utility tool",
   "description": "ServiceNow utility tool, search and navigate with a command palette.(personal project, not affiliated to ServiceNow)",
-  "version": "1.2.3",
+  "version": "1.2.5",
   "content_scripts": [
     {
       "matches": ["<all_urls>"],
@@ -23,21 +23,20 @@
     "scripts": ["../../src/scripts/background.ts"]
   },
   "commands": {
-    "snl-toggle-launcher-command": {
+    "_execute_action": {
       "suggested_key": {
         "windows": "Ctrl+Shift+L",
         "mac": "Command+Shift+L",
         "chromeos": "Ctrl+Shift+L",
         "linux": "Ctrl+Shift+L"
-      },
-      "description": "Open launcher"
+      }
     },
     "snl-switch-scope-command": {
       "suggested_key": {
-        "windows": "Ctrl+Shift+S",
-        "mac": "Command+Shift+S",
-        "chromeos": "Ctrl+Shift+S",
-        "linux": "Ctrl+Shift+S"
+        "windows": "Alt+Shift+S",
+        "mac": "Alt+Shift+S",
+        "chromeos": "Alt+Shift+S",
+        "linux": "Alt+Shift+S"
       },
       "description": "Switch scope"
     },
@@ -60,7 +59,7 @@
       "description": "Search history"
     }
   },
-  "permissions": ["tabs", "activeTab"],
+  "permissions": ["tabs", "activeTab", "contextMenus"],
   "browser_specific_settings": {
     "gecko": {
       "id": "chengwudev@gmail.com"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sn-launcher",
-  "version": "1.2.3",
+  "version": "1.2.5",
   "description": "Search and navigate Servicenow menus, documentation, components with a simple command palette interface.",
   "scripts": {
     "start": "parcel watch ./manifests/chromium/manifest.json --host localhost --dist-dir dist/chromium",
@@ -31,7 +31,7 @@
   },
   "devDependencies": {
     "@parcel/config-webextension": "^2.13.2",
-    "@types/chrome": "0.0.224",
+    "@types/chrome": "^0.0.287",
     "@types/react": "^18.2.0",
     "@types/react-dom": "^18.2.0",
     "@types/react-window": "^1.8.8",

src/components/layout/Palette/Palette.tsx

@@ -92,11 +92,12 @@ function Palette() {
     }
   };
 
-  // Register extensioncommand shortcuts
-  Object.entries(SN_LAUNCHER_COMMAND_SHORTCUTS).forEach(([shortcut, mode]) => {
+
+  // Register extension command shortcuts
+  Object.entries(SN_LAUNCHER_COMMAND_SHORTCUTS).forEach(([shortcut, { commandMode }]) => {
     useChromeMessage(shortcut, () => {
       reset(!isShown);
-      if (mode) updateCommandMode(mode);
+      if (commandMode) updateCommandMode(commandMode);
     });
   });
 

src/scripts/background.ts

@@ -1,9 +1,13 @@
 import browser from 'webextension-polyfill';
-import { SN_LAUNCHER_ACTIONS } from '../utilities/configs/constants';
+import {
+  SN_LAUNCHER_ABOUT_URL,
+  SN_LAUNCHER_ACTIONS,
+  SN_LAUNCHER_COMMAND_SHORTCUTS,
+} from '../utilities/configs/constants';
 import { LauncherActionValue } from 'types';
 
 interface MessageRequest {
-  action: typeof SN_LAUNCHER_ACTIONS[keyof typeof SN_LAUNCHER_ACTIONS];
+  action: (typeof SN_LAUNCHER_ACTIONS)[keyof typeof SN_LAUNCHER_ACTIONS];
   url?: string;
 }
 
@@ -52,3 +56,38 @@ browser.runtime.onMessage.addListener(async (request: MessageRequest) => {
     console.error('SN Launcher: Error handling message:', error);
   }
 });
+
+browser.runtime.onInstalled.addListener(() => {
+  browser.contextMenus.create({
+    id: 'shortcuts',
+    title: 'Shortcuts',
+    contexts: ['action'],
+  });
+
+  Object.entries(SN_LAUNCHER_COMMAND_SHORTCUTS).forEach(([key, { title, isContextMenu }]) => {
+    if (isContextMenu === true) {
+      browser.contextMenus.create({
+        id: key,
+        parentId: 'shortcuts',
+        title,
+        contexts: ['action'],
+      });
+    }
+  });
+
+  browser.contextMenus.create({
+    id: 'about',
+    title: 'More about SN Launcher',
+    contexts: ['action'],
+  });
+});
+
+browser.contextMenus.onClicked.addListener((info) => {
+  const { menuItemId } = info;
+
+  if (menuItemId === 'about') {
+    browser.tabs.create({ url: SN_LAUNCHER_ABOUT_URL, active: true });
+  } else if (Object.keys(SN_LAUNCHER_COMMAND_SHORTCUTS).includes(menuItemId as string)) {
+    notifyContent(menuItemId as LauncherActionValue);
+  }
+});

src/types/index.ts

@@ -1,4 +1,4 @@
-export type CommandMode = 
+export type CommandMode =
   | 'find_record'
   | 'search_doc'
   | 'search_comp'
@@ -34,14 +34,14 @@ export interface LauncherState {
   initialDataLoaded: boolean;
 }
 
-export type LauncherActionType = 
+export type LauncherActionType =
   | 'TOGGLE_LAUNCHER_COMMAND'
   | 'OPEN_TAB_COMMAND'
   | 'SWITCH_SCOPE_COMMAND'
   | 'SEARCH_TABLE_COMMAND'
   | 'SEARCH_HISTORY_COMMAND';
 
-export type LauncherActionValue = 
+export type LauncherActionValue =
   | 'snl-toggle-launcher-command'
   | 'snl-open-tab-form-launcher-command'
   | 'snl-switch-scope-command'

src/utilities/api/service.ts

@@ -11,6 +11,8 @@ import {
   SN_LAUNCHER_SWITCH_APP_ENDPOINT,
   SN_LAUNCHER_TAB_PREFIX,
   SN_LAUNCHER_ACTIONS,
+  SN_LAUNCHER_ABOUT_URL,
+  SN_LAUNCHER_SCRIPT_ENDPOINT,
 } from '../configs/constants';
 
 /**
@@ -78,8 +80,7 @@ export async function fetchResultViaScript(script: string) {
     const [isValidToken, token] = checkToken();
     if (!isValidToken) return null;
 
-    const { protocol, host } = window.location;
-    const endpoint = `${protocol}//${host}/sys.scripts.do`;
+    const endpoint = `${getBaseUrl()}/${SN_LAUNCHER_SCRIPT_ENDPOINT}`;
 
     const res = await fetch(endpoint, {
       method: 'POST',
@@ -298,7 +299,7 @@ export function searchComponent(input: string) {
  * @param {string} segmentUrl - The URL segment for the tab to navigate to.
  */
 export function gotoTab(segmentUrl: string) {
-  const gotoUrl = `${location.protocol}//${window.location.host}/${segmentUrl}`;
+  const gotoUrl = `${getBaseUrl()}/${segmentUrl}`;
   messageBackground({ action: SN_LAUNCHER_ACTIONS.OPEN_TAB_COMMAND, url: gotoUrl });
 }
 
@@ -327,3 +328,11 @@ export function goto(segment: string) {
     gotoTab(`${SN_LAUNCHER_TAB_PREFIX}${segment}`);
   }
 }
+
+/**
+ * Opens the About page in a new tab.
+ * This function sends a message to the background script to open the ServiceNow Launcher's About URL.
+ */
+export function about() {
+  messageBackground({ action: SN_LAUNCHER_ACTIONS.OPEN_TAB_COMMAND, url: SN_LAUNCHER_ABOUT_URL });
+}

src/utilities/browser/messageBackground.ts

@@ -3,7 +3,6 @@ import browser from 'webextension-polyfill';
 interface Message {
   action: string;
   url?: string;
-  [key: string]: unknown;
 }
 
 /**

src/utilities/configs/commands.ts

@@ -1,8 +1,18 @@
 import React from 'react';
-import { clearCache, searchDoc, searchComponent, goto } from '../api/service';
+import { clearCache, searchDoc, searchComponent, goto, about } from '../api/service';
 import type { CommandMode, CommandItem } from '../../types';
 import { COMMAND_MODES } from './constants';
-import { ArrowRightLeft, Table2, TextSearch, History, Route, Files, Component, GalleryVerticalEnd} from 'lucide-react';
+import {
+  ArrowRightLeft,
+  Table2,
+  TextSearch,
+  History,
+  Route,
+  Files,
+  Component,
+  GalleryVerticalEnd,
+  BadgeInfo,
+} from 'lucide-react';
 
 const commands: CommandItem[] = [
   {
@@ -74,11 +84,18 @@ const commands: CommandItem[] = [
   },
   {
     key: crypto.randomUUID(),
-    fullLabel: 'Clear cache',
     action: clearCache,
+    fullLabel: 'Clear cache',
     subLabel: 'Clear client cache and refresh',
     icon: React.createElement(GalleryVerticalEnd),
   },
+  {
+    key: crypto.randomUUID(),
+    action: about,
+    fullLabel: 'About',
+    subLabel: 'More about this tool',
+    icon: React.createElement(BadgeInfo),
+  },
 ];
 
 /**

src/utilities/configs/constants.ts

@@ -12,6 +12,8 @@ export const SN_LAUNCHER_TABLE_ENDPOINT = 'api/now/table/sys_db_object?sysparm_f
 export const SN_LAUNCHER_MENU_ENDPOINT = 'api/now/ui/polaris/menu';
 export const SN_LAUNCHER_SWITCH_APP_ENDPOINT = 'api/now/ui/concoursepicker/application';
 export const SN_LAUNCHER_TAB_PREFIX = 'now/nav/ui/classic/params/target/';
+export const SN_LAUNCHER_SCRIPT_ENDPOINT = 'sys.scripts.do';
+export const SN_LAUNCHER_ABOUT_URL = 'https://github.com/gnehcwu/sn-launcher';
 export const SN_LAUNCHER_ACTIONS: Record<LauncherActionType, LauncherActionValue> = {
   TOGGLE_LAUNCHER_COMMAND: 'snl-toggle-launcher-command',
   OPEN_TAB_COMMAND: 'snl-open-tab-form-launcher-command',
@@ -30,8 +32,24 @@ export enum COMMAND_MODES {
   TABLE = 'table',
 }
 export const SN_LAUNCHER_COMMAND_SHORTCUTS = {
-  [SN_LAUNCHER_ACTIONS.TOGGLE_LAUNCHER_COMMAND]: undefined,
-  [SN_LAUNCHER_ACTIONS.SWITCH_SCOPE_COMMAND]: COMMAND_MODES.SWITCH_SCOPE,
-  [SN_LAUNCHER_ACTIONS.SEARCH_TABLE_COMMAND]: COMMAND_MODES.TABLE,
-  [SN_LAUNCHER_ACTIONS.SEARCH_HISTORY_COMMAND]: COMMAND_MODES.HISTORY,
+  [SN_LAUNCHER_ACTIONS.TOGGLE_LAUNCHER_COMMAND]: {
+    commandMode: '',
+    title: 'Open SN Launcher',
+    isContextMenu: false,
+  },
+  [SN_LAUNCHER_ACTIONS.SWITCH_SCOPE_COMMAND]: {
+    commandMode: COMMAND_MODES.SWITCH_SCOPE,
+    title: 'Switch scope',
+    isContextMenu: true,
+  },
+  [SN_LAUNCHER_ACTIONS.SEARCH_TABLE_COMMAND]: {
+    commandMode: COMMAND_MODES.TABLE,
+    title: 'Search table',
+    isContextMenu: true,
+  },
+  [SN_LAUNCHER_ACTIONS.SEARCH_HISTORY_COMMAND]: {
+    commandMode: COMMAND_MODES.HISTORY,
+    title: 'Search history',
+    isContextMenu: true,
+  },
 } as const;