@electerm/electerm-react 5.5.35 → 5.5.56

package/client/components/bookmark-form/common/ssh-agent.jsx

@@ -9,26 +9,36 @@ const e = window.translate
 
 export default function SshAgent () {
   return (
-    <FormItem
-      {...formItemLayout}
-      label={e('useSshAgent')}
-    >
-      <Space align='center'>
-        <FormItem
-          name='useSshAgent'
-          valuePropName='checked'
-          noStyle
-        >
-          <SwitchLabel />
-        </FormItem>
-        <FormItem
-          name='sshAgent'
-          noStyle
-        >
-          <Input placeholder={e('SSH Agent Path')} />
-        </FormItem>
-        <HelpIcon link='https://github.com/electerm/electerm/wiki/ssh-agent' />
-      </Space>
-    </FormItem>
+    <>
+      <FormItem
+        {...formItemLayout}
+        label={e('useSshAgent')}
+      >
+        <Space align='center'>
+          <FormItem
+            name='useSshAgent'
+            valuePropName='checked'
+            noStyle
+          >
+            <SwitchLabel />
+          </FormItem>
+          <FormItem
+            name='sshAgent'
+            noStyle
+          >
+            <Input placeholder={e('SSH Agent Path')} />
+          </FormItem>
+          <HelpIcon link='https://github.com/electerm/electerm/wiki/ssh-agent' />
+        </Space>
+      </FormItem>
+      <FormItem
+        {...formItemLayout}
+        label={e('agentForward')}
+        name='agentForward'
+        valuePropName='checked'
+      >
+        <SwitchLabel />
+      </FormItem>
+    </>
   )
 }

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

@@ -22,6 +22,7 @@ const sshConfig = {
       connectionHoppings: [],
       useSshAgent: true,
       sshAgent: '',
+      agentForward: false,
       serverHostKey: [],
       cipher: [],
       compress: [],

package/client/components/bookmark-form/fix-bookmark-default.js

@@ -6,6 +6,7 @@ const defaultValues = {
     enableSsh: true,
     enableSftp: true,
     useSshAgent: true,
+    agentForward: false,
     x11: false,
     term: 'xterm-256color',
     displayRaw: false,

package/client/components/file-transfer/transfer.jsx

@@ -12,13 +12,6 @@ import {
 import resolve from '../../common/resolve'
 import sanitizeFilename from '../../common/sanitize-filename'
 import { refsTransfers, refsStatic, refs } from '../common/ref'
-import {
-  zipCmd,
-  unzipCmd,
-  rmCmd,
-  mvCmd,
-  mkdirCmd
-} from './zip'
 import './transfer.styl'
 
 const { assign } = Object
@@ -279,9 +272,7 @@ export default class TransportAction extends Component {
       typeFrom,
       toFile = {}
     } = transfer
-    const toPath = transfer.zip
-      ? transfer.toPath
-      : this.newPath || transfer.toPath
+    const toPath = this.newPath || transfer.toPath
     const fromFile = transfer.fromFile || this.fromFile
     const fromMode = fromFile.mode
     const transferType = typeFrom === typeMap.local ? transferTypeMap.upload : transferTypeMap.download
@@ -408,12 +399,11 @@ export default class TransportAction extends Component {
         toPath
       } = this.props.transfer
       this.oldPath = toPath
-      const { newPath, newName } = this.handleRename(toPath, typeTo === typeMap.remote)
+      const { newPath } = this.handleRename(toPath, typeTo === typeMap.remote)
       this.update({
         toPath: newPath
       })
       this.newPath = newPath
-      this.newName = newName
     }
 
     const { typeFrom, typeTo } = this.props.transfer
@@ -423,120 +413,14 @@ export default class TransportAction extends Component {
     this.startTransfer()
   }
 
-  zipTransferFolder = async () => {
-    const {
-      transfer
-    } = this.props
-    const {
-      fromPath,
-      typeFrom
-    } = transfer
-    const toPath = this.oldPath || transfer.toPath
-    let p
-    let isFromRemote
-    if (typeFrom === typeMap.local) {
-      isFromRemote = false
-      p = await window.fs.zipFolder(fromPath)
-    } else {
-      isFromRemote = true
-      const terminalId = refs.get('sftp-' + this.tabId)?.terminalId
-      p = await zipCmd(terminalId, fromPath)
-    }
-    this.zipSrc = p
-    const { name } = getFolderFromFilePath(p, isFromRemote)
-    const { path } = getFolderFromFilePath(toPath, !isFromRemote)
-    const nTo = resolve(path, name)
-    this.zipPath = nTo
-    const newTrans1 = {
-      ...copy(transfer),
-      toPath: nTo,
-      fromPath: p
-    }
-    this.transferFile(newTrans1, this.unzipFile)
-  }
-
-  unzipFile = async () => {
-    const { transfer } = this.props
-    const {
-      typeTo
-    } = transfer
-    const toPath = this.zipPath
-    const fromPath = this.zipSrc
-    const isToRemote = typeTo === typeMap.remote
-    const {
-      path,
-      name,
-      targetPath
-    } = this.buildUnzipPath(transfer)
-    const {
-      newName,
-      terminalId
-    } = this
-    if (isToRemote) {
-      if (newName) {
-        await mkdirCmd(terminalId, path)
-      }
-      await unzipCmd(terminalId, toPath, path)
-      if (newName) {
-        const mvFrom = resolve(path, name)
-        const mvTo = resolve(targetPath, newName)
-        await mvCmd(terminalId, mvFrom, mvTo)
-      }
-    } else {
-      if (newName) {
-        await window.fs.mkdir(path)
-      }
-      await window.fs.unzipFile(toPath, path)
-      if (newName) {
-        const mvFrom = resolve(path, name)
-        const mvTo = resolve(targetPath, newName)
-        await window.fs.mv(mvFrom, mvTo)
-      }
-    }
-    await rmCmd(terminalId, !isToRemote ? fromPath : toPath)
-    await window.fs.rmrf(!isToRemote ? toPath : fromPath)
-    if (newName) {
-      if (isToRemote) {
-        await rmCmd(terminalId, path)
-      } else {
-        await window.fs.rmrf(path)
-      }
-    }
-    this.onEnd()
-  }
-
-  buildUnzipPath = (transfer) => {
-    const {
-      typeTo
-    } = transfer
-    const isToRemote = typeTo === typeMap.remote
-    const toPath = this.oldPath || transfer.toPath
-    const {
-      newName
-    } = this
-    const { path } = getFolderFromFilePath(toPath, isToRemote)
-    const oldName = getFolderFromFilePath(toPath, isToRemote).name
-    const np = newName
-      ? resolve(path, 'temp-' + newName)
-      : path
-    return {
-      targetPath: path,
-      path: np,
-      name: oldName
-    }
-  }
-
   startTransfer = async () => {
-    const { fromFile = this.fromFile, zip } = this.props.transfer
+    const { fromFile = this.fromFile } = this.props.transfer
     if (!fromFile) {
       return
     }
     if (!fromFile.isDirectory) {
       return this.transferFile()
     }
-    if (zip) {
-      return this.zipTransferFolder()
-    }
     if (!this.isFtp) {
       return this.transferFile()
     } else {

package/client/components/main/main.jsx

@@ -289,6 +289,7 @@ export default auto(function Index (props) {
     rightPanelTab,
     agentRunning: store.agentRunning,
     aiContextInfo: store.aiContextInfo,
+    aiAutoCompress: store.aiAutoCompress,
     currentChatSessionId: store.currentChatSessionId,
     showChatSessions: store.showChatSessions
   }

package/client/components/session/session-control.jsx

@@ -8,6 +8,7 @@ import {
   PaperClipOutlined,
   ApartmentOutlined,
   MoreOutlined,
+  MenuOutlined,
   ColumnWidthOutlined,
   LogoutOutlined,
   PlusOutlined,
@@ -39,6 +40,7 @@ export default function SessionControl (props) {
     keepaliveEnabled,
     broadcastInput,
     wrapDisabled,
+    pasteWhenContextMenu,
     onChangePane,
     toggleCheckSftpPathFollowSsh,
     onSshSftpSplitView,
@@ -47,6 +49,7 @@ export default function SessionControl (props) {
     toggleWrap,
     onFullscreen,
     onOpenSearch,
+    onOpenContextMenu,
     onExitGracefully,
     onZoomFontSize
   } = props
@@ -279,7 +282,35 @@ export default function SessionControl (props) {
     )
   }
 
-  function renderTermControls () {
+  /**
+   * Touch devices have no right click, so the terminal's context menu needs a
+   * visible way in: this icon, next to the fullscreen icon on the desktop
+   * toolbar and next to the three-dot toggle in the mobile one (see below).
+   * Hidden when there is no menu to open — `pasteWhenContextMenu` turns both
+   * right click and the long press into a paste (see terminal.jsx), and it
+   * only ever acts on the terminal pane.
+   */
+  function renderContextMenuIcon (inMobileBar) {
+    if (
+      !isTouchDevice ||
+      pasteWhenContextMenu ||
+      tab.pane !== paneMap.terminal
+    ) {
+      return null
+    }
+    const cls = classnames(
+      'iblock pointer spliter context-menu-control-icon',
+      inMobileBar ? 'mobile-context-menu-toggle' : 'mg1r icon-info'
+    )
+    return (
+      <MenuOutlined
+        className={cls}
+        onClick={onOpenContextMenu}
+      />
+    )
+  }
+
+  function renderTermControls (skipContextMenuIcon) {
     const { pane } = tab
     if (pane !== paneMap.terminal) {
       return null
@@ -287,6 +318,7 @@ export default function SessionControl (props) {
     return (
       <div className='fright term-controls'>
         {renderFontSizeIcons()}
+        {skipContextMenuIcon ? null : renderContextMenuIcon()}
         {renderFullscreenIcon()}
         {renderSearchIcon()}
       </div>
@@ -303,12 +335,13 @@ export default function SessionControl (props) {
         {renderBroadcastIcon()}
         {renderWrapIcon()}
         {renderExitGracefullyIcon()}
-        {renderTermControls()}
+        {renderTermControls(true)}
       </div>
     )
     return (
       <div className='terminal-control mobile-session-control'>
         {renderPaneControl()}
+        {renderContextMenuIcon(true)}
         <Popover
           content={extraIcons}
           trigger='click'

package/client/components/session/session-control.styl

@@ -14,6 +14,7 @@
     flex 1
     min-width 0
 .mobile-control-toggle
+.mobile-context-menu-toggle
   font-size 16px
   line-height 32px
   color var(--text)
@@ -21,6 +22,10 @@
   &:hover
     color var(--text-light)
 
+// touch-only terminal context menu icon, in the bar next to the toggle above
+.mobile-context-menu-toggle
+  margin-right 10px
+
 // Popover content — icons laid out in a row, wrapping as needed
 .mobile-control-icons
   display flex

package/client/components/session/session.jsx

@@ -480,6 +480,17 @@ export default class SessionWrapper extends Component {
     refs.get('term-' + this.props.tab.id)?.toggleSearch()
   }
 
+  // touch-only: the toolbar menu icon opens the same context menu a right
+  // click (or a long press) does, anchored just below the icon itself
+  handleOpenContextMenu = (evt) => {
+    const term = refs.get('term-' + this.props.tab.id)
+    if (!term) {
+      return
+    }
+    const rect = evt.currentTarget.getBoundingClientRect()
+    term.openContextMenuAtPoint(rect.left, rect.bottom)
+  }
+
   handleZoomFontSize = (v) => {
     const term = refs.get('term-' + this.props.tab.id)
     if (!term?.term) {
@@ -625,6 +636,7 @@ export default class SessionWrapper extends Component {
           keepaliveEnabled={this.state.keepaliveEnabled}
           broadcastInput={this.state.broadcastInput}
           wrapDisabled={this.state.wrapDisabled}
+          pasteWhenContextMenu={!!this.props.config.pasteWhenContextMenu}
           onChangePane={(pane) => this.onChangePane(pane)}
           toggleCheckSftpPathFollowSsh={this.toggleCheckSftpPathFollowSsh}
           onSshSftpSplitView={this.handleSshSftpSplitView}
@@ -634,6 +646,7 @@ export default class SessionWrapper extends Component {
           onFullscreen={this.handleFullscreen}
           onZoomFontSize={this.handleZoomFontSize}
           onOpenSearch={this.handleOpenSearch}
+          onOpenContextMenu={this.handleOpenContextMenu}
           onExitGracefully={this.handleExitGracefully}
         />
         <Suspense fallback={null}>

package/client/components/setting-panel/tab-widgets.jsx

@@ -1,11 +1,13 @@
 import SettingCol from './col'
 import WidgetControl from '../widgets/widget-control'
+import WidgetInstanceDetail from '../widgets/widget-instance-detail'
 import WidgetList from '../widgets/widgets-list'
+import { auto } from 'manate/react'
 import {
   settingMap
 } from '../../common/constants'
 
-export default function TabWidgets (props) {
+export default auto(function TabWidgets (props) {
   const {
     settingTab
   } = props
@@ -15,8 +17,14 @@ export default function TabWidgets (props) {
   const {
     settingItem,
     listProps,
-    formProps
+    formProps,
+    store
   } = props
+  // The right column shows whatever the list selected: a widget definition (run
+  // form) or a running instance (its detail + log). A definition has `info`, an
+  // instance has `widgetId` — and an instance that has been stopped stays the
+  // selected item on purpose, so its log is still readable after it dies.
+  const isInstance = !!(settingItem && settingItem.widgetId)
   return (
     <div
       className='setting-tabs-profile'
@@ -25,11 +33,23 @@ export default function TabWidgets (props) {
         <WidgetList
           {...listProps}
         />
-        <WidgetControl
-          {...formProps}
-          key={settingItem.id}
-        />
+        {
+          isInstance
+            ? (
+              <WidgetInstanceDetail
+                key={settingItem.id}
+                instance={settingItem}
+                store={store}
+              />
+              )
+            : (
+              <WidgetControl
+                {...formProps}
+                key={settingItem.id}
+              />
+              )
+        }
       </SettingCol>
     </div>
   )
-}
+})

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

@@ -902,12 +902,6 @@ export default class FileSection extends React.Component {
     this.transfer()
   }
 
-  zipAndTransfer = async () => {
-    this.transfer(transfer => {
-      transfer.zip = true
-    })
-  }
-
   newFile = () => {
     return this.newItem(false)
   }
@@ -1098,13 +1092,6 @@ export default class FileSection extends React.Component {
         icon: iconType,
         text: transferText
       })
-      // if (isDirectory && !this.props.isFtp) {
-      //   res.push({
-      //     func: 'zipAndTransfer',
-      //     icon: 'FileZipOutlined',
-      //     text: e('compressAndTransfer')
-      //   })
-      // }
     }
     if (!isDirectory && isRealFile && isLocal) {
       res.push({

package/client/components/terminal/mixins/term-touch.js

@@ -41,6 +41,10 @@
  *    `stopPropagation()` is enough to veto xterm's scroll for the duration of
  *    the drag. `preventDefault()` is not an option: React listens to
  *    `touchmove` passively, so it is ignored (with a console warning).
+ *
+ * A long press is not the only way in: the toolbar shows a touch-only menu
+ * icon next to the three-dot toggle (see session-control.jsx), which opens the
+ * same menu through openContextMenuAtPoint() below.
  */
 
 const DEFAULT_WORD_SEPARATOR = './\\()"\'-:,.;<>~!@#$%^&*|+=[]{}`~ ?'
@@ -505,6 +509,20 @@ export const touchMixin = {
     target.dispatchEvent(event)
   },
 
+  /**
+   * Opens the menu from the toolbar icon, which lives outside the antd
+   * dropdown's trigger element — so the event is dispatched on the terminal's
+   * own node and bubbles up to it. The icon's corner is passed in as the point
+   * to drop the menu from, rather than the finger that tapped it.
+   */
+  openContextMenuAtPoint (clientX, clientY) {
+    this.openContextMenuAt(
+      clientX,
+      clientY,
+      this.domRef?.current || this.term?.element
+    )
+  },
+
   cancelLongPress () {
     clearTimeout(this.longPressTimer)
     this.longPressTimer = null

package/client/components/widgets/widget-control.jsx

@@ -46,9 +46,11 @@ export default function WidgetControl ({ formData, widgetInstancesLength }) {
         title: `${widget.info.name} (${result.instanceId})`,
         widgetId: result.widgetId,
         serverInfo: result.serverInfo,
-        config
+        config,
+        startedAt: Date.now()
       }
-      window.store.widgetInstances.push(instance)
+      // assigned, not pushed: see deleteWidgetInstance in store/widgets.js
+      window.store.widgetInstances = [...window.store.widgetInstances, instance]
       if (config.autoRun) {
         window.store.toggleAutoRunWidget(instance)
       }