@electerm/electerm-react 2.8.8 → 2.10.6

package/client/common/constants.js

@@ -67,7 +67,8 @@ export const connectionMap = buildConst([
   'web',
   'rdp',
   'vnc',
-  'ftp'
+  'ftp',
+  'spice'
 ])
 
 export const authTypeMap = buildConst([
@@ -143,6 +144,7 @@ export const terminalSerialType = 'serial'
 export const terminalTelnetType = 'telnet'
 export const terminalLocalType = 'local'
 export const terminalFtpType = 'ftp'
+export const terminalSpiceType = 'spice'
 export const openedSidebarKey = 'opened-sidebar'
 export const sidebarPinnedKey = 'sidebar-pinned'
 export const pinnedQuickCommandBarKey = 'pinned-quick-command-bar'
@@ -242,8 +244,6 @@ export const proxyHelpLink = 'https://github.com/electerm/electerm/wiki/proxy-fo
 export const regexHelpLink = 'https://github.com/electerm/electerm/wiki/Terminal-keywords-highlight-regular-expression-exmaples'
 export const connectionHoppingWikiLink = 'https://github.com/electerm/electerm/wiki/Connection-Hopping-Behavior-Change-in-electerm-since-v1.50.65'
 export const aiConfigWikiLink = 'https://github.com/electerm/electerm/wiki/AI-model-config-guide'
-export const rdpWikiLink = 'https://github.com/electerm/electerm/wiki/RDP-limitation'
-export const vncWikiLink = 'https://github.com/electerm/electerm/wiki/VNC-session-known-issues'
 export const modals = {
   hide: 0,
   setting: 1,

package/client/common/pre.js

@@ -12,32 +12,6 @@ const props = runSync('getConstants')
 props.env = JSON.parse(props.env)
 props.versions = JSON.parse(props.versions)
 
-// Encoding function
-function encodeUint8Array (uint8Array) {
-  let str = ''
-  const len = uint8Array.byteLength
-
-  for (let i = 0; i < len; i++) {
-    str += String.fromCharCode(uint8Array[i])
-  }
-
-  return btoa(str)
-}
-
-// Decoding function
-function decodeBase64String (base64String) {
-  const str = atob(base64String)
-  const len = str.length
-
-  const uint8Array = new Uint8Array(len)
-
-  for (let i = 0; i < len; i++) {
-    uint8Array[i] = str.charCodeAt(i)
-  }
-
-  return uint8Array
-}
-
 window.pre = {
   requireAuth: runSync('shouldAuth'),
   readClipboard: () => {
@@ -71,101 +45,8 @@ const path = {
   basename: window.pre.basename
 }
 
-const fs = {
-  stat: (path, cb) => {
-    window.fs.statCustom(path)
-      .catch(err => cb(err))
-      .then(obj => {
-        obj.isDirectory = () => obj.isD
-        obj.isFile = () => obj.isF
-        cb(undefined, obj)
-      })
-  },
-  access: (...args) => {
-    const cb = args.pop()
-    window.fs.access(...args)
-      .then((data) => cb(undefined, data))
-      .catch((err) => cb(err))
-  },
-  open: (...args) => {
-    const cb = args.pop()
-    if (window.et.isWebApp) {
-      window.fs.openCustom(...args)
-        .then((data) => cb(undefined, data))
-        .catch((err) => cb(err))
-      return
-    }
-    runGlobalAsync('fsOpen', ...args)
-      .then((data) => cb(undefined, data))
-      .catch((err) => cb(err))
-  },
-  read: (p1, arr, ...args) => {
-    const cb = args.pop()
-    if (window.et.isWebApp) {
-      window.fs.readCustom(
-        p1,
-        arr.length,
-        ...args
-      )
-        .then((data) => {
-          const { n, newArr } = data
-          const newArr1 = decodeBase64String(newArr)
-          cb(undefined, n, newArr1)
-        })
-        .catch(err => cb(err))
-      return
-    }
-    runGlobalAsync('fsRead', p1, arr.length, ...args)
-      .then((data) => {
-        const { n, buffer } = data
-        cb(undefined, n, buffer)
-      })
-      .catch(err => cb(err))
-  },
-  close: (fd, cb) => {
-    if (window.et.isWebApp) {
-      window.fs.closeCustom(fd)
-        .then((data) => cb(undefined, data))
-        .catch((err) => cb(err))
-      return
-    }
-    runGlobalAsync('fsClose', fd)
-      .then((data) => cb(undefined, data))
-      .catch((err) => cb(err))
-  },
-  readdir: (p, cb) => {
-    window.fs.readdir(p)
-      .then((data) => cb(undefined, data))
-      .catch((err) => cb(err))
-  },
-  mkdir: (...args) => {
-    const cb = args.pop()
-    window.fs.mkdir(...args)
-      .then((data) => cb(undefined, data))
-      .catch((err) => cb(err))
-  },
-  write: (p1, buf, cb) => {
-    if (window.et.isWebApp) {
-      window.fs.writeCustom(p1, encodeUint8Array(buf))
-        .then((data) => cb(undefined, data))
-        .catch((err) => cb(err))
-      return
-    }
-    runGlobalAsync('fsWrite', p1, buf)
-      .then((data) => cb(undefined, data))
-      .catch((err) => cb(err))
-  },
-  realpath: (p, cb) => {
-    window.fs.realpath(p)
-      .then((data) => cb(undefined, data))
-      .catch((err) => cb(err))
-  },
-  constants: runSync('getFsContants')
-}
-
 window.reqs = {
-  path,
-  fs
+  path
 }
 
 function require (name) {

package/client/components/bookmark-form/ai-bookmark-form.jsx

@@ -0,0 +1,324 @@
+/**
+ * AI-powered bookmark generation form
+ */
+import { useState } from 'react'
+import { Button, Input, message, Space, Alert } from 'antd'
+import {
+  RobotOutlined,
+  LoadingOutlined,
+  CheckOutlined,
+  CloseOutlined,
+  EditOutlined,
+  CopyOutlined,
+  DownloadOutlined,
+  EyeOutlined
+} from '@ant-design/icons'
+import SimpleEditor from '../text-editor/simple-editor'
+import { copy } from '../../common/clipboard'
+import download from '../../common/download'
+import AICategorySelect from './common/ai-category-select.jsx'
+import HelpIcon from '../common/help-icon'
+import Modal from '../common/modal.jsx'
+import { buildPrompt } from './bookmark-schema.js'
+import { fixBookmarkData } from './fix-bookmark-default.js'
+import generate from '../../common/id-with-stamp'
+
+const { TextArea } = Input
+const e = window.translate
+
+export default function AIBookmarkForm (props) {
+  const { onCancel } = props
+  const [description, setDescription] = useState('')
+  const [loading, setLoading] = useState(false)
+  const [showConfirm, setShowConfirm] = useState(false)
+  const [editMode, setEditMode] = useState(false)
+  const [editorText, setEditorText] = useState('')
+  const [selectedCategory, setSelectedCategory] = useState('default')
+
+  const handleGenerate = async () => {
+    if (window.store.aiConfigMissing()) {
+      window.store.toggleAIConfig()
+      return
+    }
+
+    if (!description.trim()) {
+      return message.warning(e('description') + ' required')
+    }
+
+    setLoading(true)
+
+    try {
+      const config = window.store.config
+      const prompt = buildPrompt(description)
+
+      const aiResponse = await window.pre.runGlobalAsync(
+        'AIchat',
+        prompt,
+        config.modelAI,
+        'You are a helpful assistant that generates bookmark configurations in JSON format.',
+        config.baseURLAI,
+        config.apiPathAI,
+        config.apiKeyAI,
+        config.proxyAI,
+        false // Disable streaming for structured response
+      )
+
+      if (aiResponse && aiResponse.error) {
+        throw new Error(aiResponse.error)
+      }
+
+      let bookmarkData
+      if (aiResponse && aiResponse.response) {
+        // Parse the JSON response
+        let jsonStr = aiResponse.response.trim()
+        // Remove markdown code blocks if present
+        if (jsonStr.startsWith('```json')) {
+          jsonStr = jsonStr.slice(7)
+        } else if (jsonStr.startsWith('```')) {
+          jsonStr = jsonStr.slice(3)
+        }
+        if (jsonStr.endsWith('```')) {
+          jsonStr = jsonStr.slice(0, -3)
+        }
+        jsonStr = jsonStr.trim()
+
+        bookmarkData = JSON.parse(jsonStr)
+        const pretty = JSON.stringify(bookmarkData, null, 2)
+        setEditorText(pretty)
+        // set default category when preview opens
+        setSelectedCategory('default')
+        setShowConfirm(true)
+      }
+    } catch (error) {
+      console.error('AI bookmark generation error:', error)
+      message.error(e('aiGenerateError') || 'AI generation failed: ' + error.message)
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  function getGeneratedData () {
+    if (!editorText) return message.warning(e('noData') || 'No data')
+    let parsed = null
+    try {
+      parsed = fixBookmarkData(JSON.parse(editorText))
+    } catch (err) {
+      return message.error(e('invalidJson') || 'Invalid JSON')
+    }
+    if (!parsed) return []
+    return Array.isArray(parsed) ? parsed : [parsed]
+  }
+
+  const createBookmark = async (bm) => {
+    const { store } = window
+    const { addItem } = store
+    const fixedBm = fixBookmarkData(bm)
+    if (!fixedBm.id) {
+      fixedBm.id = generate()
+    }
+    if (fixedBm.connectionHoppings?.length) {
+      fixedBm.hasHopping = true
+    }
+
+    // Add bookmark
+    addItem(fixedBm, 'bookmarks')
+
+    // Ensure the bookmark id is registered in its group
+    try {
+      const groupId = fixedBm.category || selectedCategory || 'default'
+      const group = window.store.bookmarkGroups.find(g => g.id === groupId)
+      if (group) {
+        group.bookmarkIds = [
+          ...new Set([...(group.bookmarkIds || []), fixedBm.id])
+        ]
+        fixedBm.color = group.color
+      }
+    } catch (err) {
+      console.error('Failed to update bookmark group:', err)
+    }
+  }
+
+  const handleConfirm = async () => {
+    const parsed = getGeneratedData()
+    if (!parsed.length) {
+      return
+    }
+    for (const item of parsed) {
+      // set defaults like mcpAddBookmark would
+      await createBookmark(item)
+    }
+    setShowConfirm(false)
+    setDescription('')
+    message.success(e('Done'))
+  }
+
+  const handleCancelConfirm = () => {
+    setShowConfirm(false)
+  }
+
+  const handleCancel = () => {
+    setDescription('')
+    if (onCancel) {
+      onCancel()
+    }
+  }
+
+  const handleToggleEdit = () => {
+    setEditMode(!editMode)
+  }
+
+  const handleEditorChange = (e) => {
+    // SimpleEditor passes event-like or value via onChange
+    const val = e && e.target ? e.target.value : e
+    setEditorText(val)
+  }
+
+  const handleCopy = () => {
+    copy(editorText)
+  }
+
+  const handleSaveToFile = async () => {
+    const parsed = getGeneratedData()
+    if (!parsed.length) {
+      return
+    }
+    const date = new Date().toISOString().slice(0, 10)
+    const fileName = `bookmarks-${date}.json`
+    await download(fileName, editorText)
+  }
+
+  const renderEditor = () => {
+    const editorProps = {
+      value: editorText,
+      onChange: handleEditorChange
+    }
+    return (
+      <SimpleEditor
+        {...editorProps}
+      />
+    )
+  }
+
+  const renderPreview = () => {
+    if (editMode) {
+      return renderEditor()
+    }
+    return (
+      <pre className='ai-bookmark-json-preview'>
+        {editorText}
+      </pre>
+    )
+  }
+
+  const renderCategorySelect = () => {
+    return (
+      <AICategorySelect
+        bookmarkGroups={window.store.bookmarkGroups}
+        value={selectedCategory}
+        onChange={setSelectedCategory}
+      />
+    )
+  }
+
+  const textAreaProps = {
+    value: description,
+    onChange: e => setDescription(e.target.value),
+    placeholder: e('createBookmarkByAI'),
+    autoSize: { minRows: 4, maxRows: 8 },
+    disabled: loading
+  }
+
+  const generateBtnProps = {
+    type: 'primary',
+    onClick: handleGenerate,
+    disabled: !description.trim(),
+    icon: loading ? <LoadingOutlined /> : <RobotOutlined />,
+    loading
+  }
+
+  const modalProps = {
+    title: e('confirmBookmarkData') || 'Confirm Bookmark Data',
+    open: showConfirm,
+    onCancel: handleCancelConfirm,
+    footer: (
+      <div className='custom-modal-footer-buttons'>
+        <Button onClick={handleCancelConfirm}>
+          <CloseOutlined /> {e('cancel')}
+        </Button>
+        <Button type='primary' onClick={handleConfirm}>
+          <CheckOutlined /> {e('confirm')}
+        </Button>
+      </div>
+    ),
+    width: '80%'
+  }
+
+  const editBtnProps = {
+    icon: editMode ? <EyeOutlined /> : <EditOutlined />,
+    title: editMode ? e('preview') : e('edit'),
+    onClick: handleToggleEdit
+  }
+
+  const copyBtnProps = {
+    icon: <CopyOutlined />,
+    title: e('copy'),
+    onClick: handleCopy
+  }
+
+  const downloadBtnProps = {
+    icon: <DownloadOutlined />,
+    title: e('download'),
+    onClick: handleSaveToFile
+  }
+
+  const cancelProps = {
+    onClick: handleCancel,
+    title: e('cancel'),
+    icon: <CloseOutlined />,
+    className: 'mg1l'
+  }
+
+  return (
+    <div className='ai-bookmark-form pd2'>
+      <div className='pd1b ai-bookmark-header'>
+        <span className='ai-title'>
+          <RobotOutlined className='mg1r' />
+          {e('createBookmarkByAI')}
+        </span>
+        <HelpIcon link='https://github.com/electerm/electerm/wiki/Create-bookmark-by-AI' />
+      </div>
+      <div className='pd1b'>
+        <Alert
+          type='info'
+          showIcon
+          title={e('aiSecurityNotice')}
+        />
+      </div>
+      <div className='pd1b'>
+        <TextArea {...textAreaProps} />
+      </div>
+      <div className='pd1t'>
+        <Button {...generateBtnProps}>
+          {e('submit')}
+        </Button>
+        <Button {...cancelProps}>
+          {e('cancel')}
+        </Button>
+      </div>
+
+      <Modal {...modalProps}>
+        <div className='pd1y'>
+          <Space.Compact className='ai-action-buttons'>
+            <Button {...editBtnProps} />
+            <Button {...copyBtnProps} />
+            <Button {...downloadBtnProps} />
+          </Space.Compact>
+        </div>
+        <div className='pd1y'>
+          {renderCategorySelect()}
+        </div>
+        {renderPreview()}
+      </Modal>
+    </div>
+  )
+}

package/client/components/bookmark-form/bookmark-form.styl

@@ -14,4 +14,4 @@
     .item-item-use
       display inline-block
 .number-input
-  min-width 210px
+  min-width 210px

package/client/components/bookmark-form/bookmark-schema.js

@@ -0,0 +1,179 @@
+const bookmarkSchema = {
+  ssh: {
+    type: 'ssh',
+    host: 'string (required) - hostname or IP address',
+    port: 'number (default: 22) - SSH port',
+    username: 'string (required) - SSH username',
+    password: 'string - password for authentication',
+    privateKey: 'string - private key content or path for key-based auth',
+    passphrase: 'string - passphrase for private key/cetificate',
+    certificate: 'string - certificate content',
+    authType: 'string - auth type (password|privateKey|profiles)',
+    profile: 'string - profile id to reuse saved auth',
+    title: 'string - bookmark title',
+    description: 'string - bookmark description',
+    startDirectoryRemote: 'string - remote starting directory',
+    startDirectoryLocal: 'string - local starting directory',
+    enableSsh: 'boolean - enable ssh, default is true',
+    enableSftp: 'boolean - enable sftp, default is true',
+    sshTunnels: 'array - ssh tunnel definitions (see sshTunnels items)',
+    connectionHoppings: 'array - connection hopping definitions',
+    useSshAgent: 'boolean - use SSH agent, default is true',
+    sshAgent: 'string - ssh agent path',
+    serverHostKey: 'array - server host key algorithms',
+    cipher: 'array - cipher list',
+    runScripts: 'array - run scripts after connected ({delay,script})',
+    quickCommands: 'array - quick commands ({name,command})',
+    proxy: 'string - proxy address (socks5://...)',
+    x11: 'boolean - enable x11 forwarding, default is false',
+    term: 'string - terminal type, default is xterm-256color, required',
+    displayRaw: 'boolean - display raw output, default is false',
+    encode: 'string - charset, default is utf8',
+    envLang: 'string - ENV LANG, default is en_US.UTF-8',
+    setEnv: 'string - environment variables, format: `KEY1=VALUE1 KEY2=VALUE2`',
+    color: 'string - tag color, like #000000',
+    interactiveValues: 'strings separated by newline'
+  },
+  sshTunnelsItem: {
+    sshTunnel: 'string - forwardRemoteToLocal|forwardLocalToRemote|dynamicForward',
+    sshTunnelLocalHost: 'string',
+    sshTunnelLocalPort: 'number',
+    sshTunnelRemoteHost: 'string',
+    sshTunnelRemotePort: 'number',
+    name: 'string - optional tunnel name'
+  },
+  connectionHoppingsItem: {
+    host: 'string',
+    port: 'number',
+    username: 'string',
+    password: 'string',
+    privateKey: 'string',
+    passphrase: 'string - passphrase',
+    certificate: 'string',
+    authType: 'string',
+    profile: 'string - profile id'
+  },
+  telnet: {
+    type: 'telnet',
+    host: 'string (required) - hostname or IP address',
+    port: 'number (default: 23) - Telnet port',
+    username: 'string - username',
+    password: 'string - password',
+    title: 'string - bookmark title',
+    description: 'string - bookmark description',
+    loginPrompt: 'string - login prompt regex',
+    passwordPrompt: 'string - password prompt regex',
+    runScripts: 'array - run scripts after connected ({delay,script})',
+    startDirectoryRemote: 'string - remote starting directory',
+    startDirectoryLocal: 'string - local starting directory',
+    profile: 'string - profile id',
+    proxy: 'string - proxy address (socks5://...)'
+  },
+  serial: {
+    type: 'serial',
+    path: 'string (required) - serial port path, e.g., /dev/ttyUSB0 or COM1',
+    baudRate: 'number (default: 9600) - baud rate',
+    dataBits: 'number (default: 8) - data bits',
+    stopBits: 'number (default: 1) - stop bits',
+    parity: 'string - "none", "even", "odd", "mark", "space"',
+    title: 'string - bookmark title',
+    rtscts: 'boolean - enable RTS/CTS flow control, default is false',
+    xon: 'boolean - enable XON flow control, default is false',
+    xoff: 'boolean - enable XOFF flow control, default is false',
+    xany: 'boolean - enable XANY flow control, default is false',
+    runScripts: 'array - run scripts after connected ({delay,script})',
+    description: 'string - bookmark description'
+  },
+  vnc: {
+    type: 'vnc',
+    host: 'string (required) - hostname or IP address',
+    port: 'number (default: 5900) - VNC port',
+    username: 'string - VNC username',
+    password: 'string - VNC password',
+    viewOnly: 'boolean - view only mode, default is false',
+    clipViewport: 'boolean - clip viewport to window, default is false',
+    scaleViewport: 'boolean - scale viewport to window, default is true',
+    qualityLevel: 'number (0-9) - VNC quality level, lower is faster, default is 3',
+    compressionLevel: 'number (0-9) - VNC compression level, lower is faster, default is 1',
+    shared: 'boolean - shared session, default is true',
+    proxy: 'string - proxy address (socks5://...)',
+    title: 'string - bookmark title',
+    description: 'string - bookmark description',
+    profile: 'string - profile id'
+  },
+  rdp: {
+    type: 'rdp',
+    host: 'string (required) - hostname or IP address',
+    port: 'number (default: 3389) - RDP port',
+    username: 'string - username',
+    password: 'string - password',
+    title: 'string - bookmark title',
+    description: 'string - bookmark description',
+    profile: 'string - profile id',
+    proxy: 'string - proxy address (socks5://...)',
+    domain: 'string - login domain'
+  },
+  ftp: {
+    type: 'ftp',
+    host: 'string (required) - hostname or IP address',
+    port: 'number (default: 21) - FTP port',
+    user: 'string - username',
+    secure: 'boolean - use secure FTP (FTPS), default is false',
+    password: 'string - password',
+    title: 'string - bookmark title',
+    profile: 'string - profile id',
+    description: 'string - bookmark description'
+  },
+  web: {
+    type: 'web',
+    url: 'string (required) - website URL',
+    title: 'string - bookmark title',
+    description: 'string - bookmark description',
+    useragent: 'string - custom user agent'
+  },
+  local: {
+    type: 'local',
+    title: 'string - bookmark title',
+    description: 'string - bookmark description',
+    startDirectoryLocal: 'string - local starting directory',
+    runScripts: 'array - run scripts after connected ({delay,script})'
+  }
+}
+
+export function buildPrompt (description) {
+  const lang = window.store.config.languageAI || window.store.getLangName()
+  const schemaDescription = Object.entries(bookmarkSchema)
+    .map(([type, fields]) => {
+      const fieldList = Object.entries(fields)
+        .map(([key, desc]) => `    ${key}: ${desc}`)
+        .join('\n')
+      return `  ${type}:\n${fieldList}`
+    })
+    .join('\n\n')
+
+  return `You are a bookmark configuration generator. Based on the user's natural language description, generate bookmark configurations in JSON format.
+
+Available bookmark types and their fields:
+${schemaDescription}
+
+Important rules:
+1. Analyze the user's description to determine the most appropriate connection type
+2. For SSH connections, use type "ssh" and default port 22 unless specified
+3. For Telnet connections, use type "telnet" and default port 23 unless specified
+4. For VNC connections, use type "vnc" and default port 5900 unless specified
+5. For RDP connections, use type "rdp" and default port 3389 unless specified
+6. For FTP connections, use type "ftp" and default port 21 unless specified
+7. For Serial connections, use type "serial"
+8. For Web/Browser connections, use type "web" with a URL field
+9. For Local terminal, use type "local"
+10. Only include fields that are relevant to the connection type
+11. Always include a meaningful title if not specified
+12. Respond ONLY with valid JSON, no markdown formatting or explanations
+13. Reply in ${lang} language
+
+User description: ${description}
+
+Generate the bookmark JSON:`
+}
+
+export default bookmarkSchema

package/client/components/bookmark-form/common/ai-category-select.jsx

@@ -0,0 +1,32 @@
+import { TreeSelect } from 'antd'
+import formatBookmarkGroups from './bookmark-group-tree-format'
+
+const e = window.translate
+
+export default function AICategorySelect ({
+  bookmarkGroups = [],
+  value,
+  onChange
+}) {
+  const tree = formatBookmarkGroups(bookmarkGroups)
+
+  const handleChange = (categoryId) => {
+    if (onChange) {
+      onChange(categoryId)
+    }
+  }
+
+  return (
+    <div className='pd1b'>
+      <label className='iblock mg1r'>{e('bookmarkCategory')}</label>
+      <TreeSelect
+        value={value}
+        treeData={tree}
+        treeDefaultExpandAll
+        showSearch
+        onChange={handleChange}
+        style={{ minWidth: 200 }}
+      />
+    </div>
+  )
+}