@electerm/electerm-react 3.11.0 → 3.11.11

package/client/common/bookmark-schemas.js

@@ -96,6 +96,7 @@ export const serialBookmarkSchema = {
   xon: z.boolean().optional().describe('XON flow control'),
   xoff: z.boolean().optional().describe('XOFF flow control'),
   xany: z.boolean().optional().describe('XANY flow control'),
+  lineEnding: z.enum(['', '\r', '\n', '\r\n']).optional().describe('Line ending for Enter key: "" (none), "\\r" (CR), "\\n" (LF), "\\r\\n" (CR+LF)'),
   description: z.string().optional().describe('Bookmark description')
 }
 

package/client/common/constants.js

@@ -180,6 +180,13 @@ export const commonParities = [
   'none', 'even', 'mark', 'odd', 'space'
 ]
 
+export const commonLineEndings = [
+  { value: '', label: 'none' },
+  { value: '\r', label: 'CR' },
+  { value: '\n', label: 'LF' },
+  { value: '\r\n', label: 'CR+LF' }
+]
+
 export const maxBatchInput = 30
 export const windowControlWidth = 94
 export const baseUpdateCheckUrls = [

package/client/common/parse-quick-connect.js

@@ -115,8 +115,11 @@ function parseQuickConnect (str) {
   }
 
   try {
+    // Strip trailing slashes (supports pasted URLs like host/ or ssh://host/)
+    const input = trimmed.replace(/\/+$/, '')
+
     // Detect protocol
-    const protocolMatch = trimmed.match(/^(ssh|telnet|vnc|rdp|spice|serial|ftp|https?|electerm):\/\//i)
+    const protocolMatch = input.match(/^(ssh|telnet|vnc|rdp|spice|serial|ftp|https?|electerm):\/\//i)
 
     let protocol = ''
     let connectionString = ''
@@ -129,28 +132,28 @@ function parseQuickConnect (str) {
       if (protocol === 'http' || protocol === 'https') {
         protocol = 'web'
       }
-      connectionString = trimmed.slice(protocolMatch[0].length)
+      connectionString = input.slice(protocolMatch[0].length)
     } else {
       // Shortcut format - default to SSH
       // Match user@host or user@host:port or just host or host:port
       // Use last colon to determine port for host:port format
-      if (/^[\w.-]+@[\w.-]+/.test(trimmed)) {
+      if (/^[\w.-]+@[\w.-]+/.test(input)) {
         // user@host or user@host:port
         protocol = 'ssh'
-        connectionString = trimmed
-      } else if (/^[\w.-]+:.*:[\d]+$/.test(trimmed)) {
+        connectionString = input
+      } else if (/^[\w.-]+:.*:[\d]+$/.test(input)) {
         // host:port format with colons in hostname (e.g., localhost:23344, zxd:localhost:23344)
         // Check if the last colon is followed by digits (port number)
         protocol = 'ssh'
-        connectionString = trimmed
-      } else if (/^[\w.-]+:[\d]+$/.test(trimmed)) {
+        connectionString = input
+      } else if (/^[\w.-]+:[\d]+$/.test(input)) {
         // host:port (no username, simple format like host:22)
         protocol = 'ssh'
-        connectionString = trimmed
-      } else if (/^[\w.-]+$/.test(trimmed)) {
+        connectionString = input
+      } else if (/^[\w.-]+$/.test(input)) {
         // just host
         protocol = 'ssh'
-        connectionString = trimmed
+        connectionString = input
       } else {
         return null
       }

package/client/common/sanitize-filename.js

@@ -0,0 +1,66 @@
+/**
+ * Sanitize a filename for cross-platform file transfers.
+ *
+ * When transferring files between different OS (Linux <-> Windows <-> macOS),
+ * filenames may contain characters that are illegal on the destination OS.
+ * Windows is the most restrictive common platform, so we use its rules as
+ * the baseline for maximum compatibility.
+ *
+ * Rules applied:
+ * - Remove control characters (0x00-0x1F)
+ * - Replace reserved characters: < > : " / \ | ? * with _
+ * - Remove leading/trailing dots and spaces (Windows restriction)
+ * - Reject reserved Windows device names: CON, PRN, AUX, NUL, COM1-9, LPT1-9
+ * - Limit filename length to 255 bytes (common filesystem limit)
+ * - Fallback to 'unnamed' if result is empty
+ */
+
+// Characters illegal on Windows (and problematic on many systems)
+// eslint-disable-next-line no-control-regex
+const ILLEGAL_CHARS = /[<>:"/\\|?\x00-\x1f]/g
+
+// Leading/trailing dots and spaces are problematic on Windows
+const LEADING_TRAILING = /^[.\s]+|[.\s]+$/g
+
+// Reserved Windows device names (case-insensitive)
+const RESERVED_NAMES = /^(CON|PRN|AUX|NUL|COM[1-9]|LPT[1-9])(?:\.|$)/i
+
+const MAX_FILENAME_LENGTH = 255
+
+const REPLACEMENT_CHAR = '_'
+
+export default function sanitizeFilename (name) {
+  if (!name || typeof name !== 'string') {
+    return 'unnamed'
+  }
+
+  let safe = name
+    // Replace illegal characters
+    .replace(ILLEGAL_CHARS, REPLACEMENT_CHAR)
+    // Strip leading/trailing dots and spaces
+    .replace(LEADING_TRAILING, '')
+
+  // Handle reserved Windows device names by appending underscore
+  if (RESERVED_NAMES.test(safe)) {
+    safe = safe + REPLACEMENT_CHAR
+  }
+
+  // Truncate to max length
+  if (safe.length > MAX_FILENAME_LENGTH) {
+    const ext = safe.lastIndexOf('.')
+    if (ext > 0) {
+      // Preserve extension when truncating
+      const extension = safe.slice(ext)
+      safe = safe.slice(0, MAX_FILENAME_LENGTH - extension.length) + extension
+    } else {
+      safe = safe.slice(0, MAX_FILENAME_LENGTH)
+    }
+  }
+
+  // Fallback for empty result
+  if (!safe) {
+    return 'unnamed'
+  }
+
+  return safe
+}

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

@@ -81,6 +81,7 @@ const bookmarkSchema = {
     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',
+    lineEnding: 'string - line ending for Enter key: "" (none), "\\r" (CR), "\\n" (LF), "\\r\\n" (CR+LF)',
     runScripts: 'array - run scripts after connected ({delay,script})',
     description: 'string - bookmark description'
   },

package/client/components/bookmark-form/config/serial.js

@@ -1,5 +1,5 @@
 import { formItemLayout } from '../../../common/form-layout.js'
-import { terminalSerialType, commonBaudRates, commonDataBits, commonStopBits, commonParities } from '../../../common/constants.js'
+import { terminalSerialType, commonBaudRates, commonDataBits, commonStopBits, commonParities, commonLineEndings } from '../../../common/constants.js'
 import defaultSettings from '../../../common/default-setting.js'
 import { createBaseInitValues, getTerminalBackgroundDefaults } from '../common/init-values.js'
 import { commonFields } from './common-fields.js'
@@ -57,6 +57,7 @@ const serialConfig = {
         { type: 'switch', name: 'xon', label: 'xon', valuePropName: 'checked' },
         { type: 'switch', name: 'xoff', label: 'xoff', valuePropName: 'checked' },
         { type: 'switch', name: 'xany', label: 'xany', valuePropName: 'checked' },
+        { type: 'select', name: 'lineEnding', label: 'lineEnding', options: commonLineEndings.map(d => ({ value: d.value, label: d.label })) },
         commonFields.runScripts,
         commonFields.description,
         { type: 'input', name: 'type', label: 'type', hidden: true }

package/client/components/common/font-select.jsx

@@ -0,0 +1,45 @@
+import React, { useMemo, useCallback } from 'react'
+import { Select } from 'antd'
+
+const e = window.translate
+
+export default function FontSelect ({
+  value,
+  onChange,
+  placeholder,
+  style
+}) {
+  const { fonts = [] } = window.et || {}
+
+  const options = useMemo(() => {
+    return fonts.map(f => ({
+      value: f,
+      label: (
+        <span
+          className='iblock'
+          style={{ fontFamily: f }}
+        >
+          {f}
+        </span>
+      )
+    }))
+  }, [fonts])
+
+  const handleChange = useCallback((vals) => {
+    onChange(vals)
+  }, [onChange])
+
+  return (
+    <Select
+      mode='tags'
+      value={value}
+      onChange={handleChange}
+      className='width-100'
+      placeholder={placeholder || e('selectFontFamily')}
+      showSearch
+      options={options}
+      filterOption={(input, option) =>
+        (option?.value ?? '').toLowerCase().includes(input.toLowerCase())}
+    />
+  )
+}

package/client/components/session/session.jsx

@@ -35,7 +35,7 @@ import {
 } from '../../common/constants'
 import { SplitViewIcon } from '../icons/split-view'
 import { refs } from '../common/ref'
-import safeName from '../../common/safe-name'
+import sanitizeFilename from '../../common/sanitize-filename.js'
 import { HeartbeatIcon } from '../icons/heartbeat'
 import './session.styl'
 
@@ -343,7 +343,7 @@ export default class SessionWrapper extends Component {
       height
     } = this.calcTermWidthHeight()
     const themeConfig = copy(window.store.getThemeConfig())
-    const logName = safeName(`${tab.title ? tab.title + '_' : ''}${tab.host ? tab.host + '_' : ''}${tab.id}`)
+    const logName = sanitizeFilename(`${tab.title ? tab.title + '_' : ''}${tab.host ? tab.host + '_' : ''}${tab.id}`)
     const pops = {
       ...this.props,
       sftpPathFollowSsh,

package/client/components/setting-panel/setting-terminal.jsx

@@ -28,6 +28,7 @@ import { chooseSaveDirectory } from '../../common/choose-save-folder'
 import mapper from '../../common/auto-complete-data-mapper'
 import KeywordForm from './keywords-form'
 import Link from '../common/external-link'
+import FontSelect from '../common/font-select'
 import HelpIcon from '../common/help-icon'
 import KeywordsTransport from './keywords-transport'
 import fs from '../../common/fs'
@@ -427,36 +428,13 @@ export default class SettingTerminal extends Component {
   }
 
   renderFontFamily = () => {
-    const { fonts = [] } = window.et
     const { fontFamily } = this.props.config
-    const props = {
-      mode: 'multiple',
-      onChange: this.handleChangeFont,
-      value: fontFamily.split(/, */g).filter(d => d.trim()),
-      style: { width: '100%' }
-    }
     return (
-      <Select
-        {...props}
-        showSearch
-      >
-        {
-          fonts.map(f => {
-            return (
-              <Option value={f} key={f}>
-                <span
-                  className='font-option'
-                  style={{
-                    fontFamily: f
-                  }}
-                >
-                  {f}
-                </span>
-              </Option>
-            )
-          })
-        }
-      </Select>
+      <FontSelect
+        onChange={this.handleChangeFont}
+        value={fontFamily.split(/, */g).filter(d => d.trim())}
+        style={{ width: '100%' }}
+      />
     )
   }
 

package/client/components/setting-panel/text-bg-modal.jsx

@@ -3,11 +3,11 @@ import {
   Input,
   InputNumber,
   Space,
-  Select,
   Button,
   Modal
 } from 'antd'
 import { ColorPicker } from '../bookmark-form/common/color-picker.jsx'
+import FontSelect from '../common/font-select'
 
 const { TextArea } = Input
 const e = window.translate
@@ -24,16 +24,16 @@ export default function TextBgModal ({
   const [text, setText] = useState(initialText)
   const [fontSize, setFontSize] = useState(initialSize)
   const [color, setColor] = useState(initialColor)
-  const [fontFamily, setFontFamily] = useState(initialFontFamily)
-
-  const { fonts = [] } = window.et || {}
+  const [fontFamily, setFontFamily] = useState(
+    initialFontFamily.split(/, */g).filter(d => d.trim())
+  )
 
   const handleOk = () => {
     onOk({
       text,
       fontSize,
       color,
-      fontFamily
+      fontFamily: fontFamily.join(', ')
     })
   }
 
@@ -43,7 +43,7 @@ export default function TextBgModal ({
     setText(initialText)
     setFontSize(initialSize)
     setColor(initialColor)
-    setFontFamily(initialFontFamily)
+    setFontFamily(initialFontFamily.split(/, */g).filter(d => d.trim()))
   }
 
   const footer = (
@@ -108,30 +108,11 @@ export default function TextBgModal ({
 
           <div>
             <b>{e('fontFamily')}</b>
-            <Select
+            <FontSelect
               value={fontFamily}
               onChange={setFontFamily}
-              style={{ width: '100%' }}
               placeholder={e('selectFontFamily')}
-              showSearch
-            >
-              {
-                fonts.map(f => {
-                  return (
-                    <Select.Option value={f} key={f}>
-                      <span
-                        className='font-option'
-                        style={{
-                          fontFamily: f
-                        }}
-                      >
-                        {f}
-                      </span>
-                    </Select.Option>
-                  )
-                })
-              }
-            </Select>
+            />
           </div>
         </Space>
       </div>

package/client/components/setting-sync/setting-sync-form.jsx

@@ -309,7 +309,7 @@ export default function SyncForm (props) {
     )
   }
   function createPasswordItem () {
-    if (syncType === syncTypes.cloud || syncType === syncTypes.webdav) {
+    if (syncType === syncTypes.cloud) {
       return null
     }
     return (

package/client/components/sftp/file-item.jsx

@@ -36,6 +36,7 @@ import time from '../../common/time'
 import { filesize } from 'filesize'
 import { createTransferProps } from './transfer-common'
 import generate from '../../common/uid'
+import sanitizeFilename from '../../common/sanitize-filename'
 import { refsStatic, refs, filesRef } from '../common/ref'
 import iconsMap from '../sys-menu/icons-map'
 
@@ -174,7 +175,7 @@ export default class FileSection extends React.Component {
         ? item.replace(/^remote:/, '')
         : item
       const { name } = getFolderFromFilePath(fromPath, isRemote)
-      const toPath = resolve(path, name)
+      const toPath = resolve(path, sanitizeFilename(name))
       res.push({
         typeFrom: isRemote ? typeMap.remote : typeMap.local,
         typeTo: type,
@@ -326,7 +327,7 @@ export default class FileSection extends React.Component {
         toFile = {
           ...toFile,
           ...getFolderFromFilePath(
-            resolve(toFile.path, toFile.name)
+            resolve(toFile.path, sanitizeFilename(toFile.name))
           ),
           id: undefined
         }
@@ -367,7 +368,7 @@ export default class FileSection extends React.Component {
     return this.doTransferSelected(
       null,
       files,
-      resolve(toFile.path, toFile.name),
+      resolve(toFile.path, sanitizeFilename(toFile.name)),
       toFile.type,
       operation
     )
@@ -784,7 +785,7 @@ export default class FileSection extends React.Component {
     if (toPathBase) {
       toPath = toPathBase
     }
-    toPath = resolve(toPath, name)
+    toPath = resolve(toPath, sanitizeFilename(name))
     const obj = {
       host: this.props.tab?.host,
       tabType: this.props.tab?.type,

package/client/components/shortcuts/shortcut-handler.js

@@ -54,6 +54,9 @@ export function handleTerminalSelectionReplace (event, ctx) {
   const isPrintable = key && key.length === 1
   if (!isBackspace && !isDelete && !isPrintable) return false
 
+  const info = getSelectionReplaceInfo(ctx.term)
+  if (!info) return false
+
   if (event && event.preventDefault) {
     event.preventDefault()
   }
@@ -61,9 +64,6 @@ export function handleTerminalSelectionReplace (event, ctx) {
     event.stopPropagation()
   }
 
-  const info = getSelectionReplaceInfo(ctx.term)
-  if (!info) return false
-
   const { startX, endX, cursorX } = info
   const move = startX - cursorX
   if (move > 0) {
@@ -146,6 +146,12 @@ export function shortcutExtend (Cls) {
     if (isInAntdInput()) {
       return
     }
+    // During IME composition, let xterm handle the event through its
+    // CompositionHelper. Intercepting here breaks composition (e.g. first
+    // char lost, closing bracket duplicated when typing Chinese inside brackets).
+    if (event.isComposing) {
+      return
+    }
     if (handleTerminalSelectionReplace(event, this)) {
       return false
     }
@@ -156,12 +162,6 @@ export function shortcutExtend (Cls) {
       !altKey &&
       !ctrlKey
     ) {
-      // If IME is composing, let the browser delete the composition char only
-      // Returning false tells xterm not to process the event (and not to call
-      // preventDefault), so the native textarea backspace still works for IME.
-      if (event.isComposing) {
-        return false
-      }
       this.props.onDelKeyPressed()
       const delKey = this.props.config.backspaceMode === '^?' ? 8 : 127
       const altDelDelKey = delKey === 8 ? 127 : 8

package/client/components/terminal/terminal.jsx

@@ -1263,6 +1263,17 @@ class Term extends Component {
           this.handleError({ message: text, from, srcId })
         }
       })
+    // Guard: component was unmounted while createTerm was pending.
+    // The child process is already running; connect briefly to trigger its cleanup.
+    if (this.onClose) {
+      if (r && r.port) {
+        try {
+          const tmpSock = new WebSocket(this.buildWsUrl(r.port))
+          tmpSock.onopen = () => tmpSock.close()
+        } catch (_e) {}
+      }
+      return
+    }
     if (typeof r === 'string' && r.includes('fail')) {
       return this.promote()
     }

package/client/store/mcp-handler.js

@@ -172,8 +172,28 @@ export default Store => {
 
   // ==================== Bookmark APIs ====================
 
+  const bookmarkSensitiveFields = [
+    'password', 'privateKey', 'passphrase', 'certificate', 'proxy',
+    'connectionHoppings', 'sshTunnels'
+  ]
+  const bookmarkFeatureFields = [
+    'connectionHoppings', 'sshTunnels', 'quickCommands', 'runScripts'
+  ]
+
+  function sanitizeBookmark (b) {
+    const safe = Object.fromEntries(
+      Object.entries(b).filter(([k]) => !bookmarkSensitiveFields.includes(k))
+    )
+    for (const key of bookmarkFeatureFields) {
+      if (Array.isArray(b[key]) && b[key].length) {
+        safe[`has${key.charAt(0).toUpperCase() + key.slice(1)}`] = true
+      }
+    }
+    return safe
+  }
+
   Store.prototype.mcpListBookmarks = function () {
-    return deepCopy(window.store.bookmarks)
+    return deepCopy(window.store.bookmarks).map(sanitizeBookmark)
   }
 
   Store.prototype.mcpGetBookmark = function (args) {
@@ -182,7 +202,7 @@ export default Store => {
     if (!bookmark) {
       throw new Error(`Bookmark not found: ${args.id}`)
     }
-    return deepCopy(bookmark)
+    return deepCopy(sanitizeBookmark(bookmark))
   }
 
   Store.prototype.mcpAddBookmark = async function (args) {

package/client/store/watch.js

@@ -21,49 +21,51 @@ import dataCompare from '../common/data-compare'
 
 export default store => {
   for (const name of dbNamesForWatch) {
+    window[`watch${name}Running`] = false
     window[`watch${name}`] = autoRun(async () => {
-      if (window.migrating) {
+      if (window.migrating || window[`watch${name}Running`]) {
         return
       }
-      const old = refsStatic.get('oldState-' + name)
-      const n = store.getItems(name)
-      const { updated, added, removed } = dataCompare(
-        old,
-        n
-      )
-      for (const item of removed) {
-        await remove(name, item.id)
-      }
-      for (const item of updated) {
-        await update(item.id, item, name, false)
-      }
-      for (const item of added) {
-        await insert(name, item)
-      }
-      const newOrder = (n || []).map(d => d.id)
-      await update(
-        `${name}:order`,
-        newOrder
-      )
-      refsStatic.add('oldState-' + name, deepCopy(n) || [])
-      if (name === 'bookmarks') {
-        store.bookmarksMap = new Map(
-          n.map(d => [d.id, d])
+      window[`watch${name}Running`] = true
+      try {
+        const old = refsStatic.get('oldState-' + name)
+        const n = store.getItems(name)
+        const { updated, added, removed } = dataCompare(
+          old,
+          n
         )
-      }
-      await store.updateLastDataUpdateTime()
-      if (dbNamesForSync.includes(name)) {
-        const syncSetting = store.config.syncSetting || {}
-        const { autoSync, autoSyncInterval, autoSyncDirection } = syncSetting
-        if (autoSync && autoSyncInterval === 0) {
-          if (autoSyncDirection === 'download') {
-            await store.downloadSettingAll()
-          } else {
-            await store.uploadSettingAll()
+        await Promise.all([
+          ...removed.map(item => remove(name, item.id)),
+          ...updated.map(item => update(item.id, item, name, false)),
+          added.length ? insert(name, added) : Promise.resolve()
+        ])
+        const newOrder = (n || []).map(d => d.id)
+        await update(
+          `${name}:order`,
+          newOrder
+        )
+        refsStatic.add('oldState-' + name, deepCopy(n) || [])
+        if (name === 'bookmarks') {
+          store.bookmarksMap = new Map(
+            n.map(d => [d.id, d])
+          )
+        }
+        await store.updateLastDataUpdateTime()
+        if (dbNamesForSync.includes(name)) {
+          const syncSetting = store.config.syncSetting || {}
+          const { autoSync, autoSyncInterval, autoSyncDirection } = syncSetting
+          if (autoSync && autoSyncInterval === 0) {
+            if (autoSyncDirection === 'download') {
+              await store.downloadSettingAll()
+            } else {
+              await store.uploadSettingAll()
+            }
           }
         }
+        return store[name]
+      } finally {
+        window[`watch${name}Running`] = false
       }
-      return store[name]
     })
     window[`watch${name}`].start()
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@electerm/electerm-react",
-  "version": "3.11.0",
+  "version": "3.11.11",
   "description": "react components src for electerm",
   "main": "./client/components/main/main.jsx",
   "license": "MIT",

package/client/common/safe-name.js

@@ -1,19 +0,0 @@
-/**
- * convert string to safe name
- * from https://github.com/Jaliborc/safe-filename/blob/master/index.js
- */
-
-export default (name) => {
-  return name
-    .replace(/\.$/, '')
-    .replace('?', '❓')
-    .replace('\\', ' ⃥')
-    .replace('/', '⟋')
-    .replace('|', '│')
-    .replace(':', '꞉')
-    .replace('<', 'ᐸ')
-    .replace('>', 'ᐳ')
-    .replace('>', 'ᐳ')
-    .replace('"', 'ᐦ')
-    .replace('*', '꘎')
-}