@electerm/electerm-react 2.3.198 → 2.4.16

package/client/components/terminal/highlight-addon.js

@@ -1,6 +1,39 @@
 export class KeywordHighlighterAddon {
   constructor (keywords) {
-    this.keywords = keywords
+    this.keywords = keywords || []
+    this.compiledPatterns = this.compilePatterns()
+  }
+
+  // Pre-compile all regex patterns once for better performance
+  compilePatterns = () => {
+    const patterns = []
+    for (const obj of this.keywords) {
+      const { keyword, color = 'red' } = obj || {}
+      if (keyword) {
+        try {
+          patterns.push({
+            regex: new RegExp(keyword, 'gi'),
+            colorCode: this.getColorCode(color)
+          })
+        } catch (e) {
+          console.error('Invalid keyword regex:', keyword, e)
+        }
+      }
+    }
+    return patterns
+  }
+
+  getColorCode = (color) => {
+    const colorMap = {
+      green: '\u001b[32m',
+      yellow: '\u001b[33m',
+      blue: '\u001b[34m',
+      magenta: '\u001b[35m',
+      cyan: '\u001b[36m',
+      white: '\u001b[37m',
+      red: '\u001b[31m'
+    }
+    return colorMap[color] || colorMap.red
   }
 
   escape = str => {
@@ -8,63 +41,71 @@ export class KeywordHighlighterAddon {
       .replace(/\033/g, '\\033')
   }
 
-  colorize = (color) => {
-    // Use a switch statement to map color names to ANSI codes
-    switch (color) {
-      case 'green':
-        return '\u001b[32m$&\u001b[0m'
-      case 'yellow':
-        return '\u001b[33m$&\u001b[0m'
-      case 'blue':
-        return '\u001b[34m$&\u001b[0m'
-      case 'magenta':
-        return '\u001b[35m$&\u001b[0m'
-      case 'cyan':
-        return '\u001b[36m$&\u001b[0m'
-      case 'white':
-        return '\u001b[37m$&\u001b[0m'
-      default:
-        return '\u001b[31m$&\u001b[0m'
+  highlightKeywords = (text) => {
+    // Early exit if no patterns
+    if (this.compiledPatterns.length === 0) {
+      return text
     }
-  }
 
-  highlightKeywords = (text) => {
-    for (const obj of this.keywords) {
-      const {
-        keyword,
-        color = 'red'
-      } = obj || {}
-      if (keyword) {
-        try {
-          const regex = new RegExp(`(${keyword})`, 'gi')
-          if (regex.test(text)) {
-            return text.replace(regex, this.colorize(color))
-          }
-        } catch (e) {
-          window.store.onError(e)
-        }
+    // Split text into segments: ANSI/OSC sequences vs plain text
+    // Match OSC sequences (ESC ] ... BEL or ESC ] ... ESC \) and CSI sequences (ESC [ ... letter)
+    // Use String.fromCharCode to avoid lint warnings about control characters
+    const ESC = String.fromCharCode(27) // \x1b
+    const BEL = String.fromCharCode(7) // \x07
+    // eslint-disable-next-line no-control-regex
+    const ansiPattern = new RegExp('(' + ESC + '\\][^' + BEL + ESC + ']*(?:' + BEL + '|' + ESC + '\\\\)|' + ESC + '\\[[0-9;]*[A-Za-z])', 'g')
+
+    const segments = []
+    let lastIndex = 0
+    let match
+
+    while ((match = ansiPattern.exec(text)) !== null) {
+      // Add plain text before this sequence
+      if (match.index > lastIndex) {
+        segments.push({ type: 'text', content: text.slice(lastIndex, match.index) })
       }
+      // Add the ANSI sequence (don't highlight)
+      segments.push({ type: 'ansi', content: match[0] })
+      lastIndex = ansiPattern.lastIndex
+    }
+
+    // Add remaining plain text
+    if (lastIndex < text.length) {
+      segments.push({ type: 'text', content: text.slice(lastIndex) })
     }
-    return text
+
+    // Highlight only plain text segments
+    const result = segments.map(seg => {
+      if (seg.type === 'ansi') {
+        return seg.content
+      }
+      let content = seg.content
+      for (const { regex, colorCode } of this.compiledPatterns) {
+        regex.lastIndex = 0
+        content = content.replace(regex, (m) => `${colorCode}${m}\u001b[0m`)
+      }
+      return content
+    }).join('')
+
+    return result
   }
 
   activate (terminal) {
     this.terminal = terminal
-    // Override the write method to automatically highlight keywords
-    const originalWrite = terminal.write
-    terminal.write = (data) => {
-      originalWrite.call(
-        terminal,
-        terminal.displayRaw ? this.escape(data) : this.highlightKeywords(data)
+    // Store the original write method properly bound to terminal
+    this.originalWrite = terminal.write.bind(terminal)
+    const self = this
+    terminal.write = function (data) {
+      self.originalWrite(
+        terminal.displayRaw ? self.escape(data) : self.highlightKeywords(data)
       )
     }
-    this.originalWrite = originalWrite
   }
 
   dispose () {
     // Restore the original write method when disposing the addon
     this.terminal.write = this.originalWrite
     this.originalWrite = null
-    this.term = null
+    this.terminal = null
   }
 }

package/client/components/terminal/shell.js

@@ -0,0 +1,138 @@
+/**
+ * Client-side Shell Integration Commands
+ *
+ * These are minimal shell integration commands that can be sent directly
+ * to a local or remote shell from the frontend after connection.
+ * They enable OSC 633 command tracking without needing server-side file sourcing.
+ *
+ * OSC 633 Protocol:
+ * - OSC 633 ; A - Prompt started
+ * - OSC 633 ; B - Command input started (ready for typing)
+ * - OSC 633 ; C - Command execution started
+ * - OSC 633 ; D ; <exitCode> - Command finished
+ * - OSC 633 ; E ; <command> - Command line being executed
+ * - OSC 633 ; P ; Cwd=<path> - Current working directory
+ */
+
+/* eslint-disable no-template-curly-in-string, no-useless-escape */
+
+/**
+ * Get inline shell integration command for bash (one-liner format)
+ * Properly formatted for semicolon joining
+ */
+function getBashInlineIntegration () {
+  // Each statement is complete and can be joined with semicolons
+  return [
+    'if [[ $- == *i* ]] && [[ -z "${ELECTERM_SHELL_INTEGRATION:-}" ]]',
+    'then export ELECTERM_SHELL_INTEGRATION=1',
+    '__e_esc() { local v="$1"; v="${v//\\\\/\\\\\\\\}"; v="${v//;/\\\\x3b}"; printf \'%s\' "$v"; }',
+    '__e_pre() { [[ "$BASH_COMMAND" == "$PROMPT_COMMAND" ]] && return; [[ "$BASH_COMMAND" == "__e_"* ]] && return; [[ "${__e_in:-0}" == "0" ]] && { __e_in=1; printf \'\\e]633;E;%s\\a\\e]633;C\\a\' "$(__e_esc "$BASH_COMMAND")"; }; }',
+    '__e_cmd() { local c="$?"; [[ "${__e_in:-0}" == "1" ]] && { printf \'\\e]633;D;%s\\a\' "$c"; __e_in=0; }; printf \'\\e]633;P;Cwd=%s\\a\\e]633;A\\a\' "$(__e_esc "$PWD")"; return "$c"; }',
+    'trap \'__e_pre\' DEBUG',
+    'PROMPT_COMMAND="__e_cmd${PROMPT_COMMAND:+; $PROMPT_COMMAND}"',
+    'fi'
+  ].join('; ')
+}
+
+/**
+ * Get inline shell integration command for zsh (one-liner format)
+ * Properly formatted for semicolon joining
+ */
+function getZshInlineIntegration () {
+  // Each statement is complete and can be joined with semicolons
+  // Note: 'then' must have a space/newline before the next command, not semicolon
+  return [
+    'if [[ -o interactive ]] && [[ -z "${ELECTERM_SHELL_INTEGRATION:-}" ]]',
+    'then export ELECTERM_SHELL_INTEGRATION=1',
+    '__e_esc() { local v="$1"; v="${v//\\\\/\\\\\\\\}"; v="${v//;/\\\\x3b}"; builtin printf \'%s\' "$v"; }',
+    '__e_preexec() { __e_cmd="$1"; builtin printf \'\\e]633;E;%s\\a\\e]633;C\\a\' "$(__e_esc "$1")"; }',
+    '__e_precmd() { local c="$?"; [[ -n "$__e_cmd" ]] && builtin printf \'\\e]633;D;%s\\a\' "$c"; __e_cmd=""; builtin printf \'\\e]633;P;Cwd=%s\\a\\e]633;A\\a\' "$(__e_esc "$PWD")"; }',
+    'autoload -Uz add-zsh-hook',
+    'add-zsh-hook precmd __e_precmd',
+    'add-zsh-hook preexec __e_preexec',
+    'fi'
+  ].join('; ')
+}
+
+/**
+ * Get inline shell integration command for fish (one-liner format)
+ */
+function getFishInlineIntegration () {
+  return [
+    'if status is-interactive; and not set -q ELECTERM_SHELL_INTEGRATION',
+    'set -g ELECTERM_SHELL_INTEGRATION 1',
+    'function __e_esc; echo $argv | string replace -a \'\\\\\' \'\\\\\\\\\' | string replace -a \';\' \'\\\\x3b\'; end',
+    'function __e_prompt --on-event fish_prompt; printf \'\\e]633;A\\a\\e]633;P;Cwd=%s\\a\' (__e_esc "$PWD"); end',
+    'function __e_preexec --on-event fish_preexec; printf \'\\e]633;E;%s\\a\\e]633;C\\a\' (__e_esc "$argv"); end',
+    'function __e_postexec --on-event fish_postexec; printf \'\\e]633;D;%s\\a\' $status; end',
+    'end'
+  ].join('; ')
+}
+
+/**
+ * Get shell integration command based on detected shell type
+ * @param {string} shellType - 'bash', 'zsh', or 'fish'
+ * @returns {string} Shell integration command to send
+ */
+export function getInlineShellIntegration (shellType) {
+  switch (shellType) {
+    case 'bash':
+      return getBashInlineIntegration()
+    case 'zsh':
+      return getZshInlineIntegration()
+    case 'fish':
+      return getFishInlineIntegration()
+    default:
+      // Try bash as default for sh-compatible shells
+      return getBashInlineIntegration()
+  }
+}
+
+/**
+ * Wrap shell integration command for execution
+ * Now simplified since output suppression is handled at the attach addon level
+ * @param {string} cmd - Shell integration command
+ * @param {string} shellType - Shell type (unused, kept for API compatibility)
+ * @returns {string} Command ready to send to terminal
+ */
+export function wrapSilent (cmd, shellType) {
+  // Escape single quotes for embedding in single-quoted string
+  const escaped = cmd.replace(/'/g, "'\\''")
+  // The leading space prevents the command from being saved to history
+  // The eval wrapper ensures proper execution
+  return ` eval '${escaped}' 2>/dev/null\r`
+}
+
+/**
+ * Get complete shell integration command ready to send
+ * @param {string} shellType - 'bash', 'zsh', or 'fish'
+ * @returns {string} Complete command to send to terminal
+ */
+export function getShellIntegrationCommand (shellType = 'bash') {
+  const cmd = getInlineShellIntegration(shellType)
+  return wrapSilent(cmd, shellType)
+}
+
+/**
+ * Detect shell type from shell path or login script
+ * @param {string} shellPath - Path to shell executable or login script
+ * @returns {string} Shell type: 'bash', 'zsh', 'fish', or 'bash' (default)
+ */
+export function detectShellType (shellPath = '') {
+  if (!shellPath) return 'bash'
+
+  const normalizedPath = shellPath.toLowerCase()
+
+  if (normalizedPath.includes('zsh')) {
+    return 'zsh'
+  } else if (normalizedPath.includes('fish')) {
+    return 'fish'
+  } else if (normalizedPath.includes('bash')) {
+    return 'bash'
+  } else if (normalizedPath.includes('sh')) {
+    // Generic sh, try bash compatibility
+    return 'bash'
+  }
+
+  return 'bash'
+}

package/client/components/terminal/terminal-command-dropdown.jsx

@@ -171,6 +171,7 @@ export default class TerminalCmdSuggestions extends Component {
     const { activeTabId } = window.store
     const terminal = refs.get('term-' + activeTabId)
     if (!terminal) {
+      console.log('No active terminal found')
       return
     }
 
@@ -186,6 +187,8 @@ export default class TerminalCmdSuggestions extends Component {
       txt = pre + command
     }
     terminal.attachAddon._sendData(txt)
+    // Update the terminal's currentInput to reflect the full command
+    terminal.setCurrentInput(command)
     terminal.term.focus()
     this.closeSuggestions()
   }