Add native context menu when using desktop (#1875)

* Add system menu to elements

* Add desktop text context menu control

* Update electron types

---------

Co-authored-by: huchenlei <huchenlei@proton.me>

src/App.vue

@@ -16,6 +16,7 @@ import BlockUI from 'primevue/blockui'
 import ProgressSpinner from 'primevue/progressspinner'
 import GlobalDialog from '@/components/dialog/GlobalDialog.vue'
 import { useEventListener } from '@vueuse/core'
+import { isElectron, showNativeMenu } from './utils/envUtil'
 
 const workspaceStore = useWorkspaceStore()
 const isLoading = computed<boolean>(() => workspaceStore.spinner)
@@ -25,8 +26,23 @@ const handleKey = (e: KeyboardEvent) => {
 useEventListener(window, 'keydown', handleKey)
 useEventListener(window, 'keyup', handleKey)
 
+const showContextMenu = (event: PointerEvent) => {
+  const { target } = event
+  switch (true) {
+    case target instanceof HTMLTextAreaElement:
+    case target instanceof HTMLInputElement && target.type === 'text':
+      // TODO: Context input menu explicitly for text input
+      showNativeMenu({ type: 'text' })
+      return
+  }
+}
+
 onMounted(() => {
   window['__COMFYUI_FRONTEND_VERSION__'] = config.app_version
   console.log('ComfyUI Front-end version:', config.app_version)
+
+  if (isElectron()) {
+    document.addEventListener('contextmenu', showContextMenu)
+  }
 })
 </script>