@electerm/electerm-react 5.3.26 → 5.5.9

package/client/components/ai/ai-presets.js

@@ -0,0 +1,173 @@
+export const defaultAIPresets = [
+  {
+    id: 'atlascloud',
+    nameAI: 'AtlasCloud',
+    baseURLAI: 'https://api.atlascloud.ai/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'deepseek-ai/deepseek-v4-flash',
+    authHeaderNameAI: 'Authorization: Bearer',
+    siteUrl: 'https://www.atlascloud.ai?ref=PCAEL2',
+    modelAIs: [
+      { value: 'deepseek-ai/deepseek-v4-flash' },
+      { value: 'zai-org/GLM-5.3' },
+      { value: 'moonshotai/Kimi-K3' }
+    ]
+  },
+  {
+    id: 'siliconflow',
+    nameAI: 'SiliconFlow',
+    baseURLAI: 'https://api.siliconflow.cn/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'deepseek-ai/DeepSeek-V4-Flash',
+    authHeaderNameAI: 'Authorization: Bearer',
+    siteUrl: 'https://cloud.siliconflow.cn/i/Xa85Yz6R'
+  },
+  {
+    id: 'ApiSmart',
+    nameAI: 'ApiSmart',
+    baseURLAI: 'https://api.apismart.ai/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'DEEPSEEK_V4_FLASH',
+    authHeaderNameAI: 'Authorization: Bearer',
+    siteUrl: 'https://apismart.ai/?utm_source=electerm_app&utm_medium=link&utm_campaign=electerm'
+  },
+  {
+    id: 'apimart',
+    nameAI: 'ApiMart',
+    baseURLAI: 'https://api.apimart.ai/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'deepseek-v4-flash',
+    authHeaderNameAI: 'Authorization: Bearer',
+    siteUrl: 'https://go.apimart.ai/gh-electerm'
+  },
+  {
+    id: 'deepseek',
+    nameAI: 'DeepSeek',
+    baseURLAI: 'https://api.deepseek.com/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'deepseek-chat',
+    authHeaderNameAI: 'Authorization: Bearer',
+    siteUrl: 'https://platform.deepseek.com/api_keys?utm_source=electerm_app&utm_medium=link&utm_campaign=electerm'
+  },
+  {
+    id: 'openai',
+    nameAI: 'OpenAI',
+    baseURLAI: 'https://api.openai.com/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'gpt-4o',
+    authHeaderNameAI: 'Authorization: Bearer',
+    siteUrl: 'https://platform.openai.com/api-keys?utm_source=electerm_app&utm_medium=link&utm_campaign=electerm'
+  },
+  {
+    id: 'openai-responses',
+    nameAI: 'OpenAI (Responses API)',
+    baseURLAI: 'https://api.openai.com/v1',
+    apiPathAI: '/responses',
+    modelAI: 'gpt-4o',
+    authHeaderNameAI: 'Authorization: Bearer',
+    modelAIs: [
+      { value: 'gpt-4o' },
+      { value: 'gpt-4o-mini' },
+      { value: 'gpt-4.1' },
+      { value: 'o4-mini' }
+    ],
+    siteUrl: 'https://platform.openai.com/api-keys?utm_source=electerm_app&utm_medium=link&utm_campaign=electerm'
+  },
+  {
+    id: 'anthropic',
+    nameAI: 'Anthropic Claude',
+    baseURLAI: 'https://api.anthropic.com/v1',
+    apiPathAI: '/messages',
+    modelAI: 'claude-sonnet-4-5',
+    authHeaderNameAI: 'x-api-key',
+    modelAIs: [
+      { value: 'claude-sonnet-4-5' },
+      { value: 'claude-opus-4-1' },
+      { value: 'claude-haiku-4-5' }
+    ],
+    siteUrl: 'https://console.anthropic.com/settings/keys?utm_source=electerm_app&utm_medium=link&utm_campaign=electerm'
+  },
+  {
+    id: 'openrouter',
+    nameAI: 'OpenRouter',
+    baseURLAI: 'https://openrouter.ai/api/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'openai/gpt-4o-mini',
+    authHeaderNameAI: 'Authorization: Bearer',
+    siteUrl: 'https://openrouter.ai/keys?utm_source=electerm_app&utm_medium=link&utm_campaign=electerm'
+  },
+  {
+    id: 'orcarouter',
+    nameAI: 'OrcaRouter',
+    baseURLAI: 'https://api.orcarouter.ai/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'orcarouter/free',
+    authHeaderNameAI: 'Authorization: Bearer',
+    siteUrl: 'https://www.orcarouter.ai/ref/ref_2c4884ca28b88a82593f'
+  },
+  {
+    id: 'google',
+    nameAI: 'Google Gemini',
+    baseURLAI: 'https://generativelanguage.googleapis.com/v1beta/openai',
+    apiPathAI: '/chat/completions',
+    modelAI: 'gemini-2.0-flash',
+    authHeaderNameAI: 'Authorization: Bearer',
+    siteUrl: 'https://aistudio.google.com/apikey'
+  },
+  {
+    id: 'groq',
+    nameAI: 'Groq',
+    baseURLAI: 'https://api.groq.com/openai/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'llama-3.3-70b-versatile',
+    authHeaderNameAI: 'Authorization: Bearer'
+  },
+  {
+    id: 'together',
+    nameAI: 'Together AI',
+    baseURLAI: 'https://api.together.xyz/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'meta-llama/Llama-3.3-70B-Instruct-Turbo',
+    authHeaderNameAI: 'Authorization: Bearer'
+  },
+  {
+    id: 'mistral',
+    nameAI: 'Mistral AI',
+    baseURLAI: 'https://api.mistral.ai/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'mistral-large-latest',
+    authHeaderNameAI: 'Authorization: Bearer'
+  },
+  {
+    id: 'xai',
+    nameAI: 'xAI (Grok)',
+    baseURLAI: 'https://api.x.ai/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'grok-3-mini',
+    authHeaderNameAI: 'Authorization: Bearer'
+  },
+  {
+    id: 'perplexity',
+    nameAI: 'Perplexity',
+    baseURLAI: 'https://api.perplexity.ai',
+    apiPathAI: '/chat/completions',
+    modelAI: 'sonar',
+    authHeaderNameAI: 'Authorization: Bearer'
+  },
+  {
+    id: 'moonshot',
+    nameAI: 'Moonshot (Kimi)',
+    baseURLAI: 'https://api.moonshot.cn/v1',
+    apiPathAI: '/chat/completions',
+    modelAI: 'moonshot-v1-8k',
+    authHeaderNameAI: 'Authorization: Bearer'
+  }
+]
+
+export function getAIPresets () {
+  const presets = [...defaultAIPresets]
+  if (window.et?.defaultAIPreset) {
+    presets.unshift(window.et.defaultAIPreset)
+  }
+  return presets
+}

package/client/components/ai/ai.styl

@@ -79,6 +79,24 @@
   opacity 0.4
   cursor not-allowed
 
+.ai-chat-attachments
+  padding 0 2px
+  .ant-tag
+    margin 0
+    max-width 100%
+    overflow hidden
+    text-overflow ellipsis
+    white-space nowrap
+
+.ai-chat-item-attachments
+  .ant-tag
+    margin-right 4px
+    margin-bottom 4px
+
+.ai-attachment-dragover
+  outline 2px dashed #1890ff
+  outline-offset -2px
+
 .ai-chat-sessions-wrap
   width 100%
   height 100%
@@ -230,3 +248,68 @@
     transform rotate(0deg)
   to
     transform rotate(360deg)
+
+.ai-chat-empty
+  position relative
+  width 100%
+  min-height 150px
+  display flex
+  align-items center
+  justify-content center
+  overflow hidden
+  padding 10px 0
+
+.ai-chat-empty-inner
+  text-align center
+  padding 0 12px
+  max-width 100%
+
+.ai-chat-watermark
+  width 86%
+  max-width 400px
+  aspect-ratio 766 / 266
+  margin 0 auto 14px
+  background-color var(--text)
+  opacity 0.55
+  pointer-events none
+  user-select none
+  -webkit-mask-image var(--ai-watermark)
+  mask-image var(--ai-watermark)
+  -webkit-mask-repeat no-repeat
+  mask-repeat no-repeat
+  -webkit-mask-position center
+  mask-position center
+  -webkit-mask-size contain
+  mask-size contain
+
+.ai-chat-empty-title
+  font-size 15px
+  font-weight 500
+
+.ai-chat-empty-hint
+  font-size 12px
+  margin-top 4px
+  color var(--text-dark)
+
+.ai-chat-empty-examples
+  margin-top 14px
+  display flex
+  flex-direction column
+  align-items center
+  gap 6px
+
+.ai-chat-empty-example
+  max-width 100%
+  font-size 12px
+  padding 5px 10px
+  border 1px solid var(--main-darker)
+  border-radius 14px
+  color var(--text-dark)
+  cursor pointer
+  transition all 0.2s
+  white-space nowrap
+  overflow hidden
+  text-overflow ellipsis
+  &:hover
+    border-color var(--primary)
+    color var(--text)

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

@@ -7,6 +7,10 @@ import { generateMosaicBackground } from './shapes'
 
 const themeDomId = 'css-overwrite-terminal-backgrounds'
 
+// natural (intrinsic) width of images/electerm-watermark.png, used to keep the
+// default terminal background at its original size on wide terminals
+const watermarkWidth = 766
+
 function createBackgroundStyle (imagePath) {
   if (!imagePath || imagePath === '') {
     return ''
@@ -104,8 +108,15 @@ async function createStyleForTab (tab, props) {
 async function createGlobalStyle (props) {
   const st = await createBackgroundStyle(props.terminalBackgroundImagePath)
   if (!st) {
+    // Default terminal bg = the electerm watermark (766 x 266 natural size).
+    // Without an explicit size the image is just centered at 1:1, so on narrow
+    // panes (mobile / thin split columns) it gets cropped on both sides.
+    // `min(100%, 766px) auto` keeps the aspect ratio and scales it down to fit
+    // the pane width, while leaving the desktop rendering (= natural size)
+    // untouched.
     return '#container .session-batch-active .xterm-screen::before {' +
     'background-image: url("./images/electerm-watermark.png");' +
+    `background-size: min(100%, ${watermarkWidth}px) auto;` +
     '}'
   }
 

package/client/components/bookmark-form/bookmark-schema.js

@@ -25,6 +25,7 @@ const bookmarkSchema = {
     compress: 'array - compression algorithms (zlib@openssh.com, zlib, none)',
     runScripts: 'array - run scripts after connected ({delay,script})',
     quickCommands: 'array - quick commands ({name,command})',
+    triggers: 'array - declarative auto triggers ({id,name,enabled,match:{type:text|regex,value,caseSensitive},action:{type:send|notify,value},sendEnter,mode:repeat|once|cooldown,cooldownMs})',
     proxy: 'string - proxy address (socks5://...)',
     proxyCommand: 'string - ssh proxy command, supports %h (host) %p (port) %r (username) placeholders, e.g. `netbird ssh proxy %h %p` or `cloudflared access ssh --hostname %h`',
     x11: 'boolean - enable x11 forwarding, default is false',
@@ -66,6 +67,7 @@ const bookmarkSchema = {
     loginPrompt: 'string - login prompt regex',
     passwordPrompt: 'string - password prompt regex',
     runScripts: 'array - run scripts after connected ({delay,script})',
+    triggers: 'array - declarative auto triggers, same shape as ssh.triggers',
     startDirectoryRemote: 'string - remote starting directory',
     startDirectoryLocal: 'string - local starting directory',
     profile: 'string - profile id',
@@ -88,6 +90,7 @@ const bookmarkSchema = {
     closeSequence: 'string - key sequence sent to the serial port when the user clicks "exit gracefully" in the terminal controls, supports \\n \\t \\r \\\\ and \\xHH hex bytes, default "\\x01ky" (Ctrl+A, k, y - GNU screen kill-window confirm)',
     closeSequenceDelay: 'number - ms to wait after sending closeSequence before closing the port, default 500',
     runScripts: 'array - run scripts after connected ({delay,script})',
+    triggers: 'array - declarative auto triggers, same shape as ssh.triggers',
     description: 'string - bookmark description'
   },
   vnc: {
@@ -144,6 +147,7 @@ const bookmarkSchema = {
     description: 'string - bookmark description',
     startDirectoryLocal: 'string - local starting directory',
     runScripts: 'array - run scripts after connected ({delay,script})',
+    triggers: 'array - declarative auto triggers, same shape as ssh.triggers',
     execWindows: 'string - Windows exec path (overrides global setting)',
     execMac: 'string - Mac exec path (overrides global setting)',
     execLinux: 'string - Linux exec path (overrides global setting)',

package/client/components/bookmark-form/common/fields.jsx

@@ -16,6 +16,7 @@ import ConnectionHopping from './connection-hopping.jsx'
 import TerminalBackgroundField from './terminal-background.jsx'
 import ExecSettingsField from './exec-settings-field.jsx'
 import useQuickCmds from './quick-commands.jsx'
+import TriggersField from '../../triggers/triggers-field.jsx'
 import ProfileItem from './profile-item.jsx'
 import renderRunScripts from './run-scripts.jsx'
 import SerialPathSelector from './serial-path-selector.jsx'
@@ -173,6 +174,8 @@ export function renderFormItem (item, formItemLayout, form, ctxProps, index) {
       return <ProfileItem key={name} store={ctxProps.store} form={form} profileFilter={item.profileFilter} />
     case 'quickCommands':
       return <Fragment key={name}>{useQuickCmds(form, ctxProps.formData || {})}</Fragment>
+    case 'triggers':
+      return <TriggersField key={name} />
     case 'runScripts':
       return <Fragment key={name}>{renderRunScripts()}</Fragment>
     case 'serialPathSelector':

package/client/components/bookmark-form/config/common-fields.js

@@ -251,6 +251,12 @@ export const commonFields = {
     label: ''
   },
 
+  triggers: {
+    type: 'triggers',
+    name: 'triggers',
+    label: ''
+  },
+
   enableTerminalImage: {
     type: 'switch',
     name: 'enableTerminalImage',
@@ -360,6 +366,12 @@ export const quickCommandsTab = () => ({
   fields: [commonFields.quickCommands]
 })
 
+export const triggersTab = () => ({
+  key: 'triggers',
+  label: e('triggers'),
+  fields: [commonFields.triggers]
+})
+
 export const sshTunnelTab = () => ({
   key: 'tunnel',
   label: e('sshTunnel'),

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

@@ -7,7 +7,7 @@ import {
   getTerminalBackgroundDefaults
 } from '../common/init-values.js'
 import defaultSettings from '../../../common/default-setting.js'
-import { commonFields } from './common-fields.js'
+import { commonFields, triggersTab } from './common-fields.js'
 
 const e = window.translate
 
@@ -56,7 +56,8 @@ const localConfig = {
       fields: [
         commonFields.quickCommands
       ]
-    }
+    },
+    triggersTab()
   ]
 }
 

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

@@ -2,7 +2,7 @@ import { formItemLayout } from '../../../common/form-layout.js'
 import { terminalSerialType, commonBaudRates, commonDataBits, commonStopBits, commonParities, commonTxLineEndings, commonRxLineEndings } from '../../../common/constants.js'
 import defaultSettings from '../../../common/default-setting.js'
 import { createBaseInitValues, getTerminalBackgroundDefaults } from '../common/init-values.js'
-import { commonFields } from './common-fields.js'
+import { commonFields, triggersTab } from './common-fields.js'
 
 const e = window.translate
 
@@ -91,7 +91,8 @@ const serialConfig = {
       fields: [
         { type: 'quickCommands', name: '__quick__', label: '' }
       ]
-    }
+    },
+    triggersTab()
   ]
 }
 

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

@@ -3,7 +3,7 @@ import { formItemLayout } from '../../../common/form-layout.js'
 import { connectionMap, authTypeMap, defaultEnvLang } from '../../../common/constants.js'
 import defaultSetting from '../../../common/default-setting.js'
 import { createBaseInitValues, getTerminalDefaults, getSshDefaults, getTerminalBackgroundDefaults, getAuthTypeDefault } from '../common/init-values.js'
-import { sshAuthFields, sshSettings, quickCommandsTab, sshTunnelTab, connectionHoppingTab } from './common-fields.js'
+import { sshAuthFields, sshSettings, quickCommandsTab, triggersTab, sshTunnelTab, connectionHoppingTab } from './common-fields.js'
 
 const e = window.translate
 
@@ -44,6 +44,7 @@ const sshConfig = {
       fields: sshSettings
     },
     quickCommandsTab(),
+    triggersTab(),
     sshTunnelTab(),
     connectionHoppingTab()
   ]

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

@@ -7,7 +7,7 @@ import {
   getTerminalBackgroundDefaults,
   getAuthTypeDefault
 } from '../common/init-values.js'
-import { telnetAuthFields, terminalSettings, quickCommandsTab } from './common-fields.js'
+import { telnetAuthFields, terminalSettings, quickCommandsTab, triggersTab } from './common-fields.js'
 
 const e = window.translate
 
@@ -39,7 +39,8 @@ const telnetConfig = {
       label: e('settings'),
       fields: terminalSettings
     },
-    quickCommandsTab()
+    quickCommandsTab(),
+    triggersTab()
   ]
 }
 

package/client/components/common/item-filter.jsx

@@ -0,0 +1,76 @@
+/**
+ * Reusable filter control: a filter icon button that opens a checkbox list.
+ * Shared by the terminal info panel and the remote monitor bar.
+ */
+import { Popover } from 'antd'
+import { CheckOutlined, FilterOutlined } from '@ant-design/icons'
+import './item-filter.styl'
+
+const e = window.translate
+
+export default function ItemFilter (props) {
+  const {
+    ids = [],
+    selected,
+    onToggle,
+    onOpenChange,
+    placement = 'bottomRight',
+    className = ''
+  } = props
+  const chosen = selected instanceof Set
+    ? selected
+    : new Set(selected || [])
+  const title = e('filter')
+  const total = ids.length
+  const count = ids.filter(id => chosen.has(id)).length
+  const content = (
+    <div className='item-filter-list' role='menu'>
+      {
+        ids.map(id => {
+          const active = chosen.has(id)
+          return (
+            <div
+              aria-checked={active}
+              className={'item-filter-item' + (active ? ' item-filter-item-on' : '')}
+              data-filter-item={id}
+              key={id}
+              onClick={() => onToggle(id)}
+              onKeyDown={event => {
+                if (event.key === 'Enter' || event.key === ' ') {
+                  event.preventDefault()
+                  onToggle(id)
+                }
+              }}
+              role='menuitemcheckbox'
+              tabIndex={0}
+            >
+              <span className='item-filter-check'>
+                {active ? <CheckOutlined /> : null}
+              </span>
+              <span className='item-filter-label'>{e(id)}</span>
+            </div>
+          )
+        })
+      }
+    </div>
+  )
+  return (
+    <Popover
+      content={content}
+      onOpenChange={onOpenChange}
+      placement={placement}
+      title={title}
+      trigger='click'
+    >
+      <button
+        aria-label={`${title} (${count}/${total})`}
+        className={'item-filter' + (className ? ` ${className}` : '')}
+        title={title}
+        type='button'
+      >
+        <FilterOutlined />
+        <span className='item-filter-count'>({count}/{total})</span>
+      </button>
+    </Popover>
+  )
+}

package/client/components/common/item-filter.styl

@@ -0,0 +1,54 @@
+.item-filter
+  display inline-flex
+  align-items center
+  justify-content center
+  gap 3px
+  height 24px
+  padding 0 4px
+  border 0
+  background transparent
+  color var(--text-dark)
+  font-size 14px
+  cursor pointer
+  &:hover,
+  &:focus-visible
+    color var(--text)
+  &:focus-visible
+    outline 1px solid var(--primary)
+    outline-offset 1px
+
+.item-filter-count
+  color var(--text-disabled)
+  font-size 11px
+  font-variant-numeric tabular-nums
+
+.item-filter-list
+  min-width 140px
+  padding 2px 0
+
+.item-filter-item
+  display flex
+  align-items center
+  gap 6px
+  padding 4px 8px
+  color var(--text)
+  cursor pointer
+  &:hover
+    background var(--main-light)
+  &:focus-visible
+    outline 1px solid var(--primary)
+    outline-offset -1px
+
+.item-filter-item-on
+  color var(--primary)
+
+.item-filter-check
+  flex-shrink 0
+  width 12px
+  font-size 10px
+
+.item-filter-label
+  min-width 0
+  overflow hidden
+  text-overflow ellipsis
+  white-space nowrap

package/client/components/common/lazy-boundary.jsx

@@ -0,0 +1,34 @@
+import { Component } from 'react'
+
+/**
+ * Error boundary for locally lazy-loaded components.
+ *
+ * A failed chunk fetch (stale chunk after a web-app redeploy, flaky network)
+ * throws during render. Without a boundary like this one the error bubbles to
+ * the root ErrorBoundary in `main/index.jsx`, which swaps the *whole* app —
+ * every open terminal/ssh tab included — for the error page. Far too much
+ * collateral for one small chunk that failed to load.
+ *
+ * Renders nothing when the child failed to load, reports the error through the
+ * app's notification, and lets the caller react (e.g. release a mount latch so
+ * the next request retries).
+ *
+ * Note: `React.lazy` caches a rejected `import()` forever, so retrying needs a
+ * *new* lazy component — see `text-editor-entry.jsx` for the `useMemo` version.
+ */
+export default class LazyBoundary extends Component {
+  state = { failed: false }
+
+  static getDerivedStateFromError () {
+    return { failed: true }
+  }
+
+  componentDidCatch (error) {
+    window.store.onError(error)
+    this.props.onError?.(error)
+  }
+
+  render () {
+    return this.state.failed ? null : this.props.children
+  }
+}

package/client/components/common/opacity.jsx

@@ -11,7 +11,9 @@ const opacityDomId = 'opacity-style'
  * @returns {null}
  */
 export default function Opacity ({ opacity }) {
-  // Default to 1 if opacity is not provided
+  // Default to 1 if opacity is not provided.
+  // window opacity is electron-only: this component is lazy-loaded and never
+  // rendered (nor loaded) in web app — see main.jsx
   const currentOpacity = opacity !== undefined ? opacity : 1
   const prevRef = useRef(null)