@electerm/electerm-react 1.37.6 → 1.37.18

package/client/common/constants.js

@@ -307,6 +307,7 @@ export const localAddrBookmarkLsKey = 'local-addr-bookmark-keys'
 export const sshTunnelHelpLink = 'https://github.com/electerm/electerm/wiki/How-to-use-ssh-tunnel'
 export const batchOpHelpLink = 'https://github.com/electerm/electerm/wiki/batch-operation'
 export const proxyHelpLink = 'https://github.com/electerm/electerm/wiki/proxy-format'
+export const regexHelpLink = 'https://github.com/electerm/electerm/wiki/Terminal-keywords-highlight-regular-expression-exmaples'
 export const modals = {
   hide: 0,
   setting: 1,

package/client/common/resolve.js

@@ -6,7 +6,7 @@
  */
 
 export default (basePath, nameOrDot) => {
-  const sep = basePath.includes('\\') || basePath.includes(':')
+  const sep = basePath.includes('\\') || basePath.includes(':\\')
     ? '\\'
     : '/'
   if (nameOrDot === '..') {
@@ -18,7 +18,7 @@ export default (basePath, nameOrDot) => {
     const res = arr.slice(0, length - 1).join(sep)
     return res || '/'
   }
-  const pre = nameOrDot.includes(':') && basePath === '/'
+  const pre = nameOrDot.includes(':\\') && basePath === '/'
     ? ''
     : basePath
   return pre +

package/client/components/setting-panel/keywords-form.jsx

@@ -30,16 +30,31 @@ export default function KeywordForm (props) {
     props.submit(data)
   }
 
+  function checker (_, value) {
+    try {
+      return Promise.resolve(!!new RegExp(`(${value})`, 'gi'))
+    } catch (e) {
+      console.log(e)
+      return Promise.reject(e)
+    }
+  }
+
   function renderItem (field, i, add, remove) {
     return (
       <Space
         align='center'
         key={field.key}
+        className='mg3r'
       >
         <FormItem
           hasFeedback
         >
-          <FormItem noStyle required name={[field.name, 'keyword']}>
+          <FormItem
+            noStyle
+            required
+            name={[field.name, 'keyword']}
+            rules={[{ validator: checker }]}
+          >
             <Input
               addonBefore={renderBefore(field.name)}
             />

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

@@ -17,7 +17,8 @@ import {
 import deepCopy from 'json-deep-copy'
 import {
   noTerminalBgValue,
-  rendererTypes
+  rendererTypes,
+  regexHelpLink
 } from '../../common/constants'
 import defaultSettings from '../../common/default-setting'
 import ShowItem from '../common/show-item'
@@ -25,6 +26,7 @@ import { osResolve } from '../../common/resolve'
 import { isNumber, isNaN } from 'lodash-es'
 import mapper from '../../common/auto-complete-data-mapper'
 import KeywordForm from './keywords-form'
+import Link from '../common/external-link'
 import HelpIcon from '../common/help-icon'
 import './setting.styl'
 
@@ -406,7 +408,15 @@ export default class SettingTerminal extends Component {
       },
       submit: this.handleSubmitKeywords
     }
-    const terminalLogPath = appPath ? osResolve(appPath, 'electerm', 'session_logs') : window.et.sessionLogPath
+    const terminalLogPath = appPath
+      ? osResolve(appPath, 'electerm', 'session_logs')
+      : window.et.sessionLogPath
+    const tip = (
+      <div>
+        <span className='mg1r'>{f('supportRegexp')}</span>
+        <Link to={regexHelpLink}>wiki</Link>
+      </div>
+    )
     return (
       <div className='form-wrap pd1y pd2x'>
         <div className='pd1y font16 bold'>
@@ -451,7 +461,7 @@ export default class SettingTerminal extends Component {
           <div className='pd1b'>
             <span className='inline-title mg1r'>{f('keywordsHighlight')}</span>
             <HelpIcon
-              title={f('supportRegexp')}
+              title={tip}
             />
           </div>
           <KeywordForm
@@ -480,7 +490,6 @@ export default class SettingTerminal extends Component {
         ))}
         {
           [
-            'addTimeStampToTermLog',
             'cursorBlink',
             'rightClickSelectsWord',
             'pasteWhenContextMenu',

package/client/components/sftp/zip.js

@@ -12,17 +12,17 @@ const isRemote = true
 const temp = '/tmp'
 
 export async function zipCmd (pid, sessionId, filePath) {
-  // tar -czf bin.tar.gz bin
+  // tar -czf bin.tar bin
   const id = generate()
   const { path, name } = getFolderFromFilePath(filePath, isRemote)
-  const np = resolve(temp, `electerm-${id}.tar.gz`)
-  const cmd = `tar -C ${path} -czf ${np} ${name}`
+  const np = resolve(temp, `electerm-${id}.tar`)
+  const cmd = `tar -C ${path} -cf ${np} ${name}`
   await runCmd(pid, sessionId, cmd)
   return np
 }
 
 export function unzipCmd (pid, sessionId, from, to) {
-  const cmd = `tar -xzf "${from}" -C "${to}"`
+  const cmd = `tar -xf "${from}" -C "${to}"`
   return runCmd(pid, sessionId, cmd)
 }
 

package/client/components/shortcuts/shortcut-control.jsx

@@ -5,7 +5,6 @@
 
 import React from 'react'
 import { shortcutExtend } from './shortcut-handler.js'
-import { throttle } from 'lodash-es'
 
 class ShortcutControl extends React.PureComponent {
   componentDidMount () {
@@ -28,18 +27,18 @@ class ShortcutControl extends React.PureComponent {
     window.store.onNewSsh()
   }
 
-  togglefullscreenShortcut = throttle((e) => {
+  togglefullscreenShortcut = (e) => {
     e.stopPropagation()
     const x = document.querySelector('.term-fullscreen-control') ||
-    document.querySelector('.term-fullscreen-control1')
+    document.querySelector('.session-current .term-fullscreen-control1')
     x && x.click()
-  }, 300)
+  }
 
-  splitShortcut = throttle((e) => {
+  splitShortcut = (e) => {
     e.stopPropagation()
-    const x = document.querySelector('.icon-split')
+    const x = document.querySelector('.session-current .icon-split')
     x && x.click()
-  }, 1200)
+  }
 
   zoominShortcut = (e) => {
     e.stopPropagation()

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

@@ -3,10 +3,32 @@ import shortcutsDefaultsGen from './shortcuts-defaults.js'
 import {
   isMacJs
 } from '../../common/constants'
+import { throttle } from 'lodash-es'
 
 function buildConfig (config, filter = d => d) {
   const defs = shortcutsDefaultsGen().filter(filter)
   const { shortcuts = {} } = config
+  return defs.reduce((p, c) => {
+    const propName = isMacJs ? 'shortcutMac' : 'shortcut'
+    if (isMacJs && c.skipMac) {
+      return p
+    }
+    const name = c.name + '_' + propName
+    const [type, func] = c.name.split('_')
+    return {
+      ...p,
+      [name]: {
+        shortcut: c.readonly ? c[propName] : (shortcuts[name] || c[propName]),
+        type,
+        func
+      }
+    }
+  }, {})
+}
+
+function buildConfigForSearch (config) {
+  const defs = shortcutsDefaultsGen()
+  const { shortcuts = {} } = config
   return defs.reduce((p, c) => {
     const propName = isMacJs ? 'shortcutMac' : 'shortcut'
     const name = c.name + '_' + propName
@@ -23,7 +45,7 @@ function buildConfig (config, filter = d => d) {
 }
 
 export function shortcutExtend (Cls) {
-  Cls.prototype.handleKeyboardEvent = function (event) {
+  Cls.prototype.handleKeyboardEvent = throttle(function (event) {
     const {
       code,
       ctrlKey,
@@ -45,7 +67,7 @@ export function shortcutExtend (Cls) {
       (shiftKey ? 'shift+' : '') +
       (altKey ? 'alt+' : '') +
       codeK.toLowerCase()
-    const shortcutsConfig = buildConfig(this.props.config, d => !d.readonly)
+    const shortcutsConfig = buildConfig(this.props.config, d => !d.hidden)
     const keys = Object.keys(shortcutsConfig)
     const len = keys.length
     for (let i = 0; i < len; i++) {
@@ -54,19 +76,19 @@ export function shortcutExtend (Cls) {
       const funcName = conf.func + 'Shortcut'
       if (conf.shortcut.split(',').includes(r)) {
         if (this[funcName]) {
-          this[funcName](event)
-        } else {
-          return false
+          return this[funcName](event)
+        } else if (this.isTerm) {
+          return true
         }
       }
     }
-  }
+  }, 300)
   return Cls
 }
 
 export function shortcutDescExtend (Cls) {
   Cls.prototype.getShortcut = function (name) {
-    const shortcutsConfig = buildConfig(this.props.config)
+    const shortcutsConfig = buildConfigForSearch(this.props.config)
     const propName = isMacJs ? 'shortcutMac' : 'shortcut'
     const n = `${name}_${propName}`
     return shortcutsConfig[n].shortcut

package/client/components/shortcuts/shortcuts-defaults.js

@@ -49,18 +49,21 @@ export default () => {
       name: 'terminal_selectAll',
       shortcut: 'ctrl+a,ctrl+shift+a',
       shortcutMac: 'meta+a',
+      skipMac: true,
       readonly: true
     },
     {
       name: 'terminal_copy',
       shortcut: 'ctrl+c,ctrl+shift+c',
       shortcutMac: 'meta+c',
+      skipMac: true,
       readonly: true
     },
     {
       name: 'terminal_paste',
       shortcut: 'ctrl+v,ctrl+shift+v',
       shortcutMac: 'meta+v',
+      hidden: true,
       readonly: true
     },
     {

package/client/components/tabs/tab-title.jsx

@@ -8,7 +8,7 @@ export default function tabTitle (props) {
     ? { color }
     : {}
   return (
-    <span>
+    <span className='tab-title'>
       <span style={styleTag}>♦</span> {tabCount}. {title}
     </span>
   )

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

@@ -35,8 +35,12 @@ export class KeywordHighlighterAddon {
         color = 'red'
       } = obj || {}
       if (keyword) {
-        const regex = new RegExp(`(${keyword})`, 'gi')
-        text = text.replace(regex, this.colorize(color))
+        try {
+          const regex = new RegExp(`(${keyword})`, 'gi')
+          text = text.replace(regex, this.colorize(color))
+        } catch (e) {
+          window.store.onError(e)
+        }
       }
     }
     return text

package/client/components/terminal/index.jsx

@@ -41,6 +41,7 @@ import { WebLinksAddon } from 'xterm-addon-web-links'
 import { SerializeAddon } from 'xterm-addon-serialize'
 import { CanvasAddon } from 'xterm-addon-canvas'
 import { WebglAddon } from 'xterm-addon-webgl'
+import { LigaturesAddon } from 'xterm-addon-ligatures'
 import getProxy from '../../common/get-proxy'
 import { Zmodem, AddonZmodem } from './xterm-zmodem'
 import { Unicode11Addon } from 'xterm-addon-unicode11'
@@ -86,6 +87,8 @@ class Term extends Component {
     }
   }
 
+  isTerm = true
+
   dataCache = ''
 
   componentDidMount () {
@@ -233,15 +236,14 @@ class Term extends Component {
     this.term.selectAll()
   }
 
-  // copyShortcut = (e) => {
-  //   const sel = this.term.getSelection()
-  //   if (sel) {
-  //     e.stopPropagation()
-  //     e.preventDefault()
-  //     this.copySelectionToClipboard()
-  //     return false
-  //   }
-  // }
+  copyShortcut = (e) => {
+    const sel = this.term.getSelection()
+    if (sel) {
+      e.stopPropagation()
+      this.copySelectionToClipboard()
+      return false
+    }
+  }
 
   searchShortcut = (e) => {
     e.stopPropagation()
@@ -767,12 +769,32 @@ class Term extends Component {
     }
   }
 
+  parse (rawText) {
+    let result = ''
+    const len = rawText.length
+    for (let i = 0; i < len; i++) {
+      if (rawText[i] === '\b') {
+        result = result.slice(0, -1)
+      } else {
+        result += rawText[i]
+      }
+    }
+    return result
+  }
+
+  onKey = ({ key }) => {
+    if (key === '\x7F') {
+      this.dataCache = this.dataCache.slice(0, -1)
+    } else {
+      this.dataCache += key
+    }
+  }
+
   onData = (d) => {
-    if (!d.includes('\r') && !d.includes('\r')) {
-      this.dataCache += d
+    if (!d.includes('\r')) {
       delete this.userTypeExit
     } else {
-      const data = this.dataCache.trim()
+      const data = this.parse(this.dataCache.trim())
       this.dataCache = ''
       if (data === 'exit') {
         this.userTypeExit = true
@@ -815,27 +837,31 @@ class Term extends Component {
       fontSize: tab.fontSize || config.fontSize,
       screenReaderMode: config.screenReaderMode
     })
+
+    // term.onLineFeed(this.onLineFeed)
+    // term.onTitleChange(this.onTitleChange)
+    term.onSelectionChange(this.onSelection)
+    this.loadState(term)
+    term.open(document.getElementById(id), true)
+    this.loadRenderer(term, config)
+    term.textarea.addEventListener('focus', this.setActive)
+    term.onKey(this.onKey)
+    // term.textarea.addEventListener('blur', this.onBlur)
+
+    // term.on('keydown', this.handleEvent)
     this.fitAddon = new FitAddon()
     this.searchAddon = new SearchAddon()
+    const ligtureAddon = new LigaturesAddon()
     this.searchAddon.onDidChangeResults(this.onSearchResultsChange)
     const unicode11Addon = new Unicode11Addon()
     this.serializeAddon = new SerializeAddon()
     term.loadAddon(this.serializeAddon)
     term.loadAddon(unicode11Addon)
+    term.loadAddon(ligtureAddon)
     // activate the new version
     term.unicode.activeVersion = '11'
     term.loadAddon(this.fitAddon)
     term.loadAddon(this.searchAddon)
-    // term.onLineFeed(this.onLineFeed)
-    // term.onTitleChange(this.onTitleChange)
-    term.onSelectionChange(this.onSelection)
-    this.loadState(term)
-    term.open(document.getElementById(id), true)
-    this.loadRenderer(term, config)
-    term.textarea.addEventListener('focus', this.setActive)
-    // term.textarea.addEventListener('blur', this.onBlur)
-
-    // term.on('keydown', this.handleEvent)
     term.onData(this.onData)
     this.term = term
     term.attachCustomKeyEventHandler(this.handleKeyboardEvent.bind(this))

package/package.json

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