@electerm/electerm-react 1.38.19 → 1.38.40

package/client/common/build-ssh-tunnel.js

@@ -2,6 +2,7 @@ export const buildSshTunnels = function (inst) {
   return [{
     sshTunnel: inst.sshTunnel,
     sshTunnelRemotePort: inst.sshTunnelRemotePort,
-    sshTunnelLocalPort: inst.sshTunnelLocalPort
+    sshTunnelLocalPort: inst.sshTunnelLocalPort,
+    sshTunnelRemoteHost: inst.sshTunnelRemoteHost
   }]
 }

package/client/common/choose-save-folder.js

@@ -0,0 +1,22 @@
+const {
+  openDialog
+} = window.api
+
+export async function chooseSaveDirectory () {
+  const savePaths = await openDialog({
+    title: 'Choose a folder to save file(s)',
+    message: 'Choose a folder to save file(s)',
+    properties: [
+      'openDirectory',
+      'showHiddenFiles',
+      'createDirectory',
+      'noResolveAliases',
+      'treatPackageAsDirectory',
+      'dontAddToRecent'
+    ]
+  })
+  if (!savePaths || !savePaths.length) {
+    return undefined
+  }
+  return savePaths[0]
+}

package/client/common/constants.js

@@ -20,7 +20,7 @@ const buildConst = (props) => {
 export const logoPath1 = logoPath1Ref.replace(/^\//, '')
 export const logoPath2 = logoPath2Ref.replace(/^\//, '')
 export const logoPath3 = logoPath3Ref.replace(/^\//, '')
-export const maxEditFileSize = 1024 * 30
+export const maxEditFileSize = 1024 * 3000
 export const defaultBookmarkGroupId = 'default'
 export const newBookmarkIdPrefix = 'new-bookmark'
 export const unexpectedPacketErrorDesc = 'Unexpected packet'

package/client/common/default-setting.js

@@ -43,5 +43,13 @@ export default {
   addTimeStampToTermLog: false,
   sftpPathFollowSsh: false,
   keepaliveInterval: 0,
-  backspaceMode: '^?'
+  backspaceMode: '^?',
+  terminalInfos: [
+    'uptime',
+    'cpu',
+    'mem',
+    'activities',
+    'network',
+    'disks'
+  ]
 }

package/client/common/download.jsx

@@ -0,0 +1,31 @@
+/**
+ * simulate download
+ */
+import { notification } from 'antd'
+import ShowItem from '../components/common/show-item'
+import { chooseSaveDirectory } from './choose-save-folder'
+
+export default async function download (filename, text) {
+  const savePath = await chooseSaveDirectory()
+  if (!savePath) {
+    return
+  }
+  const path = window.require('path')
+  const filePath = path.join(savePath, filename)
+  const r = await window.fs.writeFile(filePath, text).catch(window.store.onError)
+  if (!r) {
+    return
+  }
+  notification.success({
+    message: '',
+    description: (
+      <div>
+        <ShowItem
+          to={filePath}
+        >
+          {filePath}
+        </ShowItem>
+      </div>
+    )
+  })
+}

package/client/common/trzsz.js

@@ -1,4 +1,5 @@
 import { TrzszFilter } from 'trzsz'
+import { chooseSaveDirectory } from './choose-save-folder'
 
 const {
   openDialog
@@ -36,24 +37,7 @@ window.newTrzsz = function (
       })
     },
     // choose a directory to save the received files
-    chooseSaveDirectory: async () => {
-      const savePaths = await openDialog({
-        title: 'Choose a folder to save file(s)',
-        message: 'Choose a folder to save file(s)',
-        properties: [
-          'openDirectory',
-          'showHiddenFiles',
-          'createDirectory',
-          'noResolveAliases',
-          'treatPackageAsDirectory',
-          'dontAddToRecent'
-        ]
-      })
-      if (!savePaths || !savePaths.length) {
-        return undefined
-      }
-      return savePaths[0]
-    },
+    chooseSaveDirectory,
     // the terminal columns
     terminalColumns,
     // there is a windows shell

package/client/components/bookmark-form/render-ssh-tunnel.jsx

@@ -1,5 +1,6 @@
 import {
   Form,
+  Input,
   InputNumber,
   Radio,
   Space,
@@ -47,29 +48,46 @@ export default function renderSshTunnel () {
             </RadioButton>
           </RadioGroup>
         </FormItem>
+        <Space.Compact className='mg2x'>
+          <FormItem
+            label={e('destination')}
+            name={[field.name, 'sshTunnelRemoteHost']}
+            initialValue='127.0.0.1'
+            required
+          >
+            <Input
+              className='compact-input'
+              placeholder={e('host')}
+            />
+          </FormItem>
+          <FormItem
+            label=''
+            name={[field.name, 'sshTunnelRemotePort']}
+            initialValue={22}
+            required
+          >
+            <InputNumber
+              min={1}
+              max={65535}
+              // addonBefore={e('remotePort')}
+              className='compact-input'
+              placeholder={e('port')}
+            />
+          </FormItem>
+        </Space.Compact>
         <FormItem
-          label=''
-          name={[field.name, 'sshTunnelRemotePort']}
-          required
-        >
-          <InputNumber
-            min={1}
-            max={65535}
-            addonBefore={e('remotePort')}
-            className='compact-input'
-          />
-        </FormItem>
-        <FormItem
-          label=''
+          label={e('localPort')}
           name={[field.name, 'sshTunnelLocalPort']}
+          initialValue={22}
           required
           className='mg2x'
         >
           <InputNumber
             min={1}
             max={65535}
-            addonBefore={e('localPort')}
+            // addonBefore={e('localPort')}
             className='compact-input'
+            placeholder={e('port')}
           />
         </FormItem>
         <Button

package/client/components/main/main.jsx

@@ -41,6 +41,7 @@ export default class Index extends Component {
     ipcOnEvent('zoom-reset', store.onZoomReset)
     ipcOnEvent('zoomin', store.onZoomIn)
     ipcOnEvent('zoomout', store.onZoomout)
+    ipcOnEvent('confirm-exit', store.beforeExitApp)
 
     document.addEventListener('drop', function (e) {
       e.preventDefault()
@@ -51,6 +52,9 @@ export default class Index extends Component {
       e.stopPropagation()
     })
     window.addEventListener('offline', store.setOffline)
+    if (window.et.isWebApp) {
+      window.onbeforeunload = store.beforeExit
+    }
     store.isSencondInstance = window.pre.runSync('isSencondInstance')
     store.initData()
     store.checkForDbUpgrade()

package/client/components/quick-commands/quick-commands-box.jsx

@@ -8,7 +8,9 @@ import { find, sortBy } from 'lodash-es'
 import { Button, Input, Select, Space } from 'antd'
 import * as ls from '../../common/safe-local-storage'
 import copy from 'json-deep-copy'
+import generate from '../../common/uid'
 import CmdItem from './quick-command-item'
+import delay from '../../common/wait'
 import {
   EditOutlined,
   CloseCircleOutlined,
@@ -46,7 +48,7 @@ export default class QuickCommandsFooterBox extends Component {
     this.props.store.pinnedQuickCommandBar = !this.props.store.pinnedQuickCommandBar
   }
 
-  handleSelect = (id) => {
+  handleSelect = async (id) => {
     const {
       store
     } = this.props
@@ -57,11 +59,24 @@ export default class QuickCommandsFooterBox extends Component {
         this.props.store.currentQuickCommands,
         a => a.id === id
       )
-      if (qm && qm.command) {
-        const { runQuickCommand } = this.props.store
+      const { runQuickCommand } = this.props.store
+      const qms = qm && qm.commands
+        ? qm.commands
+        : (qm && qm.command
+            ? [
+                {
+                  command: qm.command,
+                  id: generate(),
+                  delay: 100
+                }
+              ]
+            : []
+          )
+      for (const q of qms) {
         const realCmd = isWin
-          ? qm.command.replace(/\n/g, '\n\r')
-          : qm.command
+          ? q.command.replace(/\n/g, '\n\r')
+          : q.command
+        await delay(q.delay || 100)
         runQuickCommand(realCmd, qm.inputOnly)
         store.editQuickCommand(qm.id, {
           clickCount: ((qm.clickCount || 0) + 1)

package/client/components/quick-commands/quick-commands-form-elem.jsx

@@ -1,8 +1,8 @@
-import { Button, Input, Switch, Form, message, Select } from 'antd'
+import { Button, Switch, Form, message, Select } from 'antd'
 import copy from 'json-deep-copy'
 import generate from '../../common/uid'
 import InputAutoFocus from '../common/input-auto-focus'
-const { TextArea } = Input
+import renderQm from './quick-commands-list-form'
 const FormItem = Form.Item
 const { Option } = Select
 const { prefix } = window
@@ -17,13 +17,13 @@ export default function QuickCommandForm (props) {
     const { formData } = props
     const {
       name,
-      command,
+      commands,
       inputOnly,
       labels
     } = res
     const update = copy({
       name,
-      command,
+      commands,
       inputOnly,
       labels
     })
@@ -46,6 +46,13 @@ export default function QuickCommandForm (props) {
   if (!initialValues.labels) {
     initialValues.labels = []
   }
+  if (!initialValues.commands) {
+    initialValues.commands = [{
+      command: initialValues.command || '',
+      id: generate(),
+      delay: 100
+    }]
+  }
   return (
     <Form
       form={form}
@@ -59,7 +66,7 @@ export default function QuickCommandForm (props) {
         rules={[{
           max: 60, message: '60 chars max'
         }, {
-          required: true, message: 'name required'
+          required: true, message: 'Name required'
         }]}
         hasFeedback
         name='name'
@@ -69,17 +76,7 @@ export default function QuickCommandForm (props) {
           autofocustrigger={autofocustrigger}
         />
       </FormItem>
-      <FormItem
-        name='command'
-        label={t('quickCommand')}
-        rules={[{
-          max: 5000, message: '5000 chars max'
-        }, {
-          required: true, message: 'command required'
-        }]}
-      >
-        <TextArea rows={3} />
-      </FormItem>
+      {renderQm()}
       <FormItem
         name='labels'
         label={t('label')}
@@ -108,7 +105,7 @@ export default function QuickCommandForm (props) {
       <FormItem>
         <p>
           <Button
-            type='dashed'
+            type='primary'
             htmlType='submit'
           >{e('save')}
           </Button>

package/client/components/quick-commands/quick-commands-list-form.jsx

@@ -0,0 +1,89 @@
+import {
+  Form,
+  InputNumber,
+  Space,
+  Button,
+  Input
+} from 'antd'
+import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons'
+import { formItemLayout } from '../../common/form-layout'
+
+const FormItem = Form.Item
+const FormList = Form.List
+const { prefix } = window
+const t = prefix('quickCommands')
+
+export default function renderQm () {
+  function renderItem (field, i, add, remove) {
+    return (
+      <Space
+        align='center'
+        key={field.key}
+      >
+        <FormItem
+          label=''
+          name={[field.name, 'delay']}
+          required
+        >
+          <InputNumber
+            min={1}
+            step={1}
+            max={65535}
+            addonBefore={t('delay')}
+            placeholder={100}
+            className='compact-input'
+          />
+        </FormItem>
+        <FormItem
+          label=''
+          name={[field.name, 'command']}
+          required
+          className='mg2x'
+        >
+          <Input.TextArea
+            rows={1}
+            placeholder={t('quickCommand')}
+            className='compact-input'
+          />
+        </FormItem>
+        <Button
+          icon={<MinusCircleOutlined />}
+          onClick={() => remove(field.name)}
+          className='mg24b'
+        />
+      </Space>
+    )
+  }
+
+  return (
+    <FormItem {...formItemLayout} label={t('quickCommands')}>
+      <FormList
+        name='commands'
+      >
+        {
+          (fields, { add, remove }, { errors }) => {
+            return (
+              <div>
+                {
+                  fields.map((field, i) => {
+                    return renderItem(field, i, add, remove)
+                  })
+                }
+                <FormItem>
+                  <Button
+                    type='dashed'
+                    onClick={() => add()}
+                    block
+                    icon={<PlusOutlined />}
+                  >
+                    {t('quickCommand')}
+                  </Button>
+                </FormItem>
+              </div>
+            )
+          }
+        }
+      </FormList>
+    </FormItem>
+  )
+}

package/client/components/session/session.jsx

@@ -472,10 +472,11 @@ export default class SessionWrapper extends Component {
   renderControl = () => {
     const { splitDirection, terminals, sftpPathFollowSsh } = this.state
     const { props } = this
-    const { pane } = props.tab
+    const { pane, enableSsh } = props.tab
+
     const termType = props.tab?.type
     const isSsh = props.tab.authType
-    const isLocal = termType === connectionMap.local || !termType
+    const isLocal = !isSsh && (termType === connectionMap.local || !termType)
     const isHori = splitDirection === terminalSplitDirectionMap.horizontal
     const cls1 = 'mg1r icon-split pointer iblock spliter'
     const cls2 = 'icon-direction pointer iblock spliter'
@@ -542,7 +543,7 @@ export default class SessionWrapper extends Component {
           }
         </div>
         {
-          isSsh || isLocal
+          (isSsh && enableSsh) || isLocal
             ? (
               <Tooltip title={checkTxt}>
                 <span {...checkProps}>
@@ -608,7 +609,7 @@ export default class SessionWrapper extends Component {
     const { pane } = this.props.tab
     const infoProps = {
       infoPanelPinned,
-      ...pick(this.props.config, ['host', 'port', 'saveTerminalLogToFile']),
+      ...pick(this.props.config, ['host', 'port', 'saveTerminalLogToFile', 'terminalInfos']),
       ...infoPanelProps,
       appPath: this.props.appPath,
       rightSidebarWidth: this.props.rightSidebarWidth,

package/client/components/setting-panel/list.styl

@@ -10,6 +10,9 @@
   width 24px
   line-height 35px
   text-align center
+  position absolute
+  right 0
+  top 0
 .list-item-title
   flex-grow: 1
 .item-list-unit

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

@@ -498,6 +498,7 @@ export default class SettingTerminal extends Component {
         {this.renderToggle('saveTerminalLogToFile', (
           <ShowItem to={terminalLogPath} className='mg1l'>{p('open')}</ShowItem>
         ))}
+        {this.renderToggle('addTimeStampToTermLog')}
         {
           [
             'cursorBlink',

package/client/components/setting-panel/tree-list.styl

@@ -9,6 +9,9 @@
   width 16px
   line-height 26px
   height 20px
+  position absolute
+  right 0
+  top 0
 .tree-item
   display flex
   &.is-category
@@ -25,6 +28,7 @@
   overflow hidden
   white-space nowrap
   text-overflow ellipsis
+  padding-right 20px
 .sidebar-panel .tree-item-title
   max-width 180px
 .with-plus

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

@@ -761,13 +761,15 @@ export default class FileSection extends React.Component {
   transferOrEnterDirectory = async (e, edit) => {
     const { file } = this.state
     const { isDirectory, type, size } = file
+    const isLocal = type === typeMap.local
+    const isRemote = type === typeMap.remote
     if (isDirectory) {
       return this.enterDirectory(e)
     }
-    if (!edit && type === typeMap.local) {
+    if (!edit && isLocal) {
       return this.openFile(this.state.file)
     }
-    const remoteEdit = !edit && type === typeMap.remote && size < maxEditFileSize
+    const remoteEdit = !edit && isRemote && size < maxEditFileSize
     if (
       edit === true || remoteEdit
     ) {
@@ -787,13 +789,14 @@ export default class FileSection extends React.Component {
     operation
   ) => {
     const { name, path, type, isDirectory } = file
-    let typeTo = type === typeMap.local
+    const isLocal = type === typeMap.local
+    let typeTo = isLocal
       ? typeMap.remote
       : typeMap.local
     if (_typeTo) {
       typeTo = _typeTo
     }
-    let toPath = type === typeMap.local
+    let toPath = isLocal
       ? this.props[typeMap.remote + 'Path']
       : this.props[typeMap.local + 'Path']
     if (toPathBase) {
@@ -928,10 +931,12 @@ export default class FileSection extends React.Component {
     } = this.props
     const hasHost = !!tab.host
     const { enableSsh } = tab
-    const transferText = type === typeMap.local
+    const isLocal = type === typeMap.local
+    const isRemote = type === typeMap.remote
+    const transferText = isLocal
       ? e(transferTypeMap.upload)
       : e(transferTypeMap.download)
-    const iconType = type === typeMap.local
+    const iconType = isLocal
       ? 'CloudUploadOutlined'
       : 'CloudDownloadOutlined'
     const len = selectedFiles.length
@@ -960,8 +965,8 @@ export default class FileSection extends React.Component {
     if (
       isDirectory && id &&
       (
-        (hasHost && enableSsh && type === typeMap.remote) ||
-        (type === typeMap.local && !hasHost)
+        (hasHost && enableSsh && isRemote) ||
+        (isLocal && !hasHost)
       )
     ) {
       res.push({
@@ -977,14 +982,14 @@ export default class FileSection extends React.Component {
         text: transferText
       })
     }
-    if (!isDirectory && id && type === typeMap.local) {
+    if (!isDirectory && id && isLocal) {
       res.push({
         func: 'transferOrEnterDirectory',
         icon: 'ArrowRightOutlined',
         text: e('open')
       })
     }
-    if (id && type === typeMap.local) {
+    if (id && isLocal) {
       res.push({
         func: 'showInDefaultFileManager',
         icon: 'ContainerOutlined',
@@ -1040,16 +1045,18 @@ export default class FileSection extends React.Component {
         text: m('copyFilePath')
       })
     }
-    res.push({
-      func: 'newFile',
-      icon: 'FileAddOutlined',
-      text: e('newFile')
-    })
-    res.push({
-      func: 'newDirectory',
-      icon: 'FolderAddOutlined',
-      text: e('newFolder')
-    })
+    if (enableSsh || isLocal) {
+      res.push({
+        func: 'newFile',
+        icon: 'FileAddOutlined',
+        text: e('newFile')
+      })
+      res.push({
+        func: 'newDirectory',
+        icon: 'FolderAddOutlined',
+        text: e('newFolder')
+      })
+    }
     res.push({
       func: 'selectAll',
       icon: 'CheckSquareOutlined',