@electerm/electerm-react 1.72.48 → 1.80.3

package/client/common/constants.js

@@ -38,7 +38,7 @@ export const contextMenuPaddingTop = 10
 export const sftpControlHeight = 42 + 30
 export const sidebarWidth = 43
 export const maxHistory = 50
-export const maxTransport = 1
+export const maxTransport = 5
 export const maxSftpHistory = 20
 export const maxZoom = 8
 export const minZoom = 0.5

package/client/common/sftp.js

@@ -33,12 +33,14 @@ class Sftp {
             type: func
           })
         }
-        const uid = func + ':' + id
+        const fid = generate()
+        const uid = func + ':' + fid
         // let ws = await initWs()
         return new Promise((resolve, reject) => {
           ws.s({
             action: 'sftp-func',
             id,
+            uid,
             func,
             args,
             sessionId

package/client/components/ai/ai-config.jsx

@@ -82,6 +82,9 @@ export default function AIConfigForm ({ initialValues, onSubmit, showAIConfig })
         type='info'
         className='mg2y'
       />
+      <p>
+        Full Url: {initialValues?.baseURLAI}{initialValues?.apiPathAI}
+      </p>
       <Form
         form={form}
         onFinish={handleSubmit}
@@ -112,10 +115,13 @@ export default function AIConfigForm ({ initialValues, onSubmit, showAIConfig })
             <Form.Item
               label='API PATH'
               name='apiPathAI'
+              rules={[
+                { required: true, message: 'Please input API PATH' }
+              ]}
               noStyle
             >
               <Input
-                placeholder='Enter API path'
+                placeholder='/chat/completions'
                 style={{ width: '25%' }}
               />
             </Form.Item>

package/client/components/batch-op/batch-op.jsx

@@ -18,7 +18,8 @@ import {
   sidebarWidth,
   statusMap,
   batchOpHelpLink,
-  modals
+  modals,
+  fileActions
 } from '../../common/constants'
 import HelpIcon from '../common/help-icon'
 import download from '../../common/download'
@@ -216,9 +217,7 @@ export default class BatchOp extends PureComponent {
         toPath: resolveFilePath(isDown ? conf.localPath : conf.remotePath, name),
         typeFrom: isDown ? 'remote' : 'local',
         typeTo: isDown ? 'local' : 'remote',
-        skipExpand: true,
-        zip: true,
-        skipConfirm: true
+        resolvePolicy: fileActions.mergeOrOverwrite
       }
       const { store } = window
       store.addTransferList([obj])
@@ -229,7 +228,7 @@ export default class BatchOp extends PureComponent {
       this.ref1 = autoRun(() => {
         const { transferHistory } = store
         const first = transferHistory.find(t => {
-          return (t.id === obj.id || t.originalId === obj.id) && t.unzip
+          return t.id === obj.id || t.originalId === obj.id
         })
         if (first && first.sessionId === tab.sessionId) {
           this.ref1 && this.ref1.stop()

package/client/components/bg/css-overwrite.jsx

@@ -0,0 +1,179 @@
+/**
+* btns
+*/
+import { Component } from 'react'
+import fs from '../../common/fs'
+import { noTerminalBgValue } from '../../common/constants'
+import { generateMosaicBackground } from './shapes'
+
+export default class CssOverwrite extends Component {
+  static styleTag = null
+
+  shouldComponentUpdate (nextProps) {
+    if (!this.props.wsInited && nextProps.wsInited) {
+      return true
+    }
+
+    const bgProps = [
+      'terminalBackgroundImagePath',
+      'terminalBackgroundFilterBlur',
+      'terminalBackgroundFilterOpacity',
+      'terminalBackgroundFilterBrightness',
+      'terminalBackgroundFilterContrast',
+      'terminalBackgroundFilterGrayscale'
+    ]
+    const globalChanged = bgProps.some(prop => this.props[prop] !== nextProps[prop])
+    if (globalChanged) {
+      return true
+    }
+
+    const currentTabs = this.props.tabs || []
+    const nextTabs = nextProps.tabs || []
+    if (currentTabs.length !== nextTabs.length) {
+      return true
+    }
+
+    // If no tabs in both cases
+    if (!currentTabs.length && !nextTabs.length) {
+      return false
+    }
+
+    // Since tab bg settings never change, we only need to compare tab IDs
+    const currentIds = new Set(currentTabs.map(t => t.id))
+    const nextIds = new Set(nextTabs.map(t => t.id))
+
+    // Check if all current IDs exist in next IDs
+    for (const id of currentIds) {
+      if (!nextIds.has(id)) return true
+    }
+
+    return false
+  }
+
+  componentDidUpdate (prevProps) {
+    if (!prevProps.wsInited && this.props.wsInited) {
+      this.writeCss()
+      return
+    }
+    this.updateCss()
+  }
+
+  // Common function to handle background image style creation
+  createBackgroundStyle = async (imagePath) => {
+    if (!imagePath || imagePath === '') {
+      return ''
+    }
+
+    let content = ''
+    let st = ''
+    const isWebImg = /^https?:\/\//.test(imagePath)
+    if (imagePath === 'randomShape') {
+      st = `url(${generateMosaicBackground()})`
+    } else if (imagePath === 'index') {
+      st = 'index'
+    } else if (noTerminalBgValue === imagePath) {
+      st = 'none'
+    } else if (imagePath && !isWebImg) {
+      content = await fs.readFileAsBase64(imagePath)
+        .catch(log.error)
+      if (content) {
+        st = `url(data:image;base64,${content})`
+      }
+    } else if (imagePath && isWebImg) {
+      st = `url(${imagePath})`
+    }
+    return st
+  }
+
+  // Common function to create filter styles
+  createFilterStyle = (props, tabProps = null) => {
+    return `blur(${
+      (tabProps?.terminalBackgroundFilterBlur || props.terminalBackgroundFilterBlur)
+  }px) opacity(${
+    +(tabProps?.terminalBackgroundFilterOpacity || props.terminalBackgroundFilterOpacity)
+  }) brightness(${
+    +(tabProps?.terminalBackgroundFilterBrightness || props.terminalBackgroundFilterBrightness)
+  }) contrast(${
+    +(tabProps?.terminalBackgroundFilterContrast || props.terminalBackgroundFilterContrast)
+  }) grayscale(${
+    +(tabProps?.terminalBackgroundFilterGrayscale || props.terminalBackgroundFilterGrayscale)
+  })`
+  }
+
+  createStyleForTab = async (tab) => {
+    const bg = tab.terminalBackground || {}
+    const img = bg.terminalBackgroundImagePath || this.props.terminalBackgroundImagePath
+    const st = await this.createBackgroundStyle(img)
+
+    if (!st) {
+      return ''
+    }
+
+    const selector = `#container .sessions .session-${tab.id} .xterm-screen::before`
+    const styles = []
+    if (st === 'index') {
+      styles.push(`content: '${tab.tabCount}'`)
+    } else if (st !== 'none') {
+      styles.push(
+        `background-image: ${st}`,
+        'background-position: center',
+        `filter: ${this.createFilterStyle(this.props, tab)}`
+      )
+    }
+    return `${selector} {
+    ${styles.join(';')};
+  }`
+  }
+
+  createGlobalStyle = async () => {
+    const st = await this.createBackgroundStyle(this.props.terminalBackgroundImagePath)
+    if (!st) {
+      return '#container .session-batch-active .xterm-screen::before {' +
+      'background-image: url("./images/electerm-watermark.png");' +
+      '}'
+    }
+
+    const styles = []
+
+    if (st !== 'none' && st !== 'index') {
+      styles.push(
+        `background-image: ${st}`,
+        'background-position: center',
+        `filter: ${this.createFilterStyle(this.props)}`
+      )
+    }
+
+    return `#container .session-batch-active .xterm-screen::before {
+    ${styles.join(';')};
+  }`
+  }
+
+  writeCss = async () => {
+    if (!CssOverwrite.styleTag) {
+      CssOverwrite.styleTag = document.createElement('style')
+      CssOverwrite.styleTag.type = 'text/css'
+      CssOverwrite.styleTag.id = 'css-overwrite-terminal-backgrounds'
+      document.getElementsByTagName('head')[0].appendChild(CssOverwrite.styleTag)
+    }
+
+    const { tabs = [] } = this.props
+    const tabStyles = await Promise.all(
+      tabs
+        .map(tab => this.createStyleForTab(tab))
+    )
+    const globalStyle = await this.createGlobalStyle()
+    const allStyles = [
+      globalStyle,
+      ...tabStyles
+    ].filter(Boolean).join('\n')
+    CssOverwrite.styleTag.innerHTML = allStyles
+  }
+
+  updateCss = async () => {
+    await this.writeCss()
+  }
+
+  render () {
+    return null
+  }
+}