@electerm/electerm-react 2.17.16 → 3.0.18

package/client/common/cache.js

@@ -2,6 +2,8 @@
 // keep limit items in cache
 // we persist cache to local storage, so we can keep cache after restart
 
+import { safeGetItem, safeSetItem } from './safe-local-storage.js'
+
 class MapCache {
   constructor (limit, key) {
     this.limit = limit
@@ -11,7 +13,7 @@ class MapCache {
   }
 
   load () {
-    const data = window.localStorage.getItem(this.key)
+    const data = safeGetItem(this.key)
     if (data) {
       const arr = JSON.parse(data)
       for (const item of arr) {
@@ -28,7 +30,7 @@ class MapCache {
         value
       })
     }
-    window.localStorage.setItem(this.key, JSON.stringify(arr))
+    safeSetItem(this.key, JSON.stringify(arr))
   }
 
   set (key, value) {

package/client/common/db.js

@@ -9,7 +9,7 @@ import { without, isArray } from 'lodash-es'
 import handleError from './error-handler'
 import generate from './uid'
 import safeParse from './to-simple-obj'
-import { encObj, decObj } from './pass-enc'
+import { decObj } from './pass-enc'
 
 /**
  * db action, never direct use it
@@ -46,7 +46,7 @@ export function insert (dbName, inst) {
     const { id, _id, ...rest } = obj
     return {
       _id: _id || id || generate(),
-      ...encObj(rest)
+      ...rest
     }
   })
   return dbAction(dbName, 'insert', safeParse(arr))
@@ -76,9 +76,7 @@ export async function remove (dbName, id) {
 export function update (_id, value, db = 'data', upsert = true) {
   const updates = dbNames.includes(db)
     ? {
-        $set: {
-          ...encObj(value)
-        }
+        $set: value
       }
     : {
         $set: {

package/client/common/default-setting.js

@@ -29,7 +29,6 @@ export default {
   terminalBackgroundTextColor: '#ffffff',
   terminalBackgroundTextFontFamily: 'Maple Mono',
   rendererType: 'canvas',
-  enableSixel: true,
   terminalType: 'xterm-256color',
   keepaliveCountMax: 10,
   keyword2FA: 'verification code,otp,one-time,two-factor,2fa,totp,authenticator,duo,yubikey,security code,mfa,passcode',
@@ -73,6 +72,7 @@ export default {
   sessionLogPath: '',
   sshSftpSplitView: false,
   showCmdSuggestions: false,
+  autoReconnectTerminal: false,
   startDirectoryLocal: '',
   allowMultiInstance: false,
   disableDeveloperTool: false

package/client/common/pass-enc.js

@@ -1,12 +1,3 @@
-const enc = (str) => {
-  if (typeof str !== 'string') {
-    return str
-  }
-  return str.split('').map((s, i) => {
-    return String.fromCharCode((s.charCodeAt(0) + i + 1) % 65536)
-  }).join('')
-}
-
 const dec = (str) => {
   if (typeof str !== 'string') {
     return str
@@ -16,18 +7,6 @@ const dec = (str) => {
   }).join('')
 }
 
-/**
- * enc password
- * @param {object} obj
- */
-export function encObj (obj) {
-  if (!obj.passwordEncrypted && obj.password) {
-    obj.password = enc(obj.password)
-    obj.passwordEncrypted = true
-  }
-  return obj
-}
-
 /**
  * dec password
  * @param {object} obj

package/client/common/safe-local-storage.js

@@ -1,4 +1,60 @@
 import { termLSPrefix } from './constants'
+import parseJsonSafe from './parse-json-safe'
+
+// ─── Encryption helpers ───────────────────────────────────────────────────────
+
+// Prefix that marks a value encrypted by this module.
+// Values without this prefix are treated as legacy plaintext.
+const ENC_PREFIX = 'enc1:'
+
+let _encKey = null
+
+function getKey () {
+  if (_encKey !== null) return _encKey
+  try {
+    // window.pre is set by pre.js before the store is used; runSync is synchronous IPC
+    _encKey = (window.pre && window.pre.runSync && window.pre.runSync('getStorageKey')) || ''
+  } catch (e) {
+    _encKey = ''
+  }
+  return _encKey
+}
+
+function encrypt (str) {
+  if (!str) return str
+  const key = getKey()
+  if (!key) return str
+  const strBytes = new TextEncoder().encode(str)
+  const keyBytes = new TextEncoder().encode(key)
+  const out = new Uint8Array(strBytes.length)
+  for (let i = 0; i < strBytes.length; i++) {
+    out[i] = strBytes[i] ^ keyBytes[i % keyBytes.length]
+  }
+  let binary = ''
+  for (let i = 0; i < out.length; i++) {
+    binary += String.fromCharCode(out[i])
+  }
+  return ENC_PREFIX + btoa(binary)
+}
+
+function decrypt (str) {
+  if (!str || !str.startsWith(ENC_PREFIX)) return str
+  const key = getKey()
+  if (!key) return str
+  try {
+    const binary = atob(str.slice(ENC_PREFIX.length))
+    const keyBytes = new TextEncoder().encode(key)
+    const out = new Uint8Array(binary.length)
+    for (let i = 0; i < binary.length; i++) {
+      out[i] = binary.charCodeAt(i) ^ keyBytes[i % keyBytes.length]
+    }
+    return new TextDecoder().decode(out)
+  } catch (e) {
+    return str
+  }
+}
+
+// ─── Internal helper ─────────────────────────────────────────────────────────
 
 function clear () {
   const keys = Object.keys(window.localStorage)
@@ -9,6 +65,8 @@ function clear () {
   }
 }
 
+// ─── Original (plain) functions ──────────────────────────────────────────────
+
 export function setItem (id, str) {
   try {
     window.localStorage.setItem(id, str)
@@ -26,10 +84,57 @@ export function getItem (id) {
 
 export function getItemJSON (id, defaultValue) {
   const str = window.localStorage.getItem(id) || ''
-  return str ? JSON.parse(str) : defaultValue
+  const r = parseJsonSafe(str)
+  if (typeof r === 'string') {
+    return defaultValue
+  }
+  return r || defaultValue
 }
 
 export function setItemJSON (id, obj) {
   const str = JSON.stringify(obj)
   return setItem(id, str)
 }
+
+// ─── Safe (encrypted) functions ──────────────────────────────────────────────
+
+export function safeSetItem (id, str) {
+  if (window.et.isWebApp) {
+    return setItem(id, str)
+  }
+  try {
+    window.localStorage.setItem(id, encrypt(str))
+  } catch (e) {
+    console.log(e)
+    console.log('maybe local storage full, lets reset')
+    clear()
+    window.localStorage.setItem(id, encrypt(str))
+  }
+}
+
+export function safeGetItem (id) {
+  if (window.et.isWebApp) {
+    return getItem(id)
+  }
+  return decrypt(window.localStorage.getItem(id) || '')
+}
+
+export function safeGetItemJSON (id, defaultValue) {
+  if (window.et.isWebApp) {
+    return getItemJSON(id, defaultValue)
+  }
+  const str = decrypt(window.localStorage.getItem(id) || '')
+  const r = parseJsonSafe(str)
+  if (typeof r === 'string') {
+    return defaultValue
+  }
+  return r || defaultValue
+}
+
+export function safeSetItemJSON (id, obj) {
+  if (window.et.isWebApp) {
+    return setItemJSON(id, obj)
+  }
+  const str = JSON.stringify(obj)
+  return safeSetItem(id, str)
+}

package/client/components/ai/ai-chat-history-item.jsx

@@ -1,5 +1,6 @@
-// ai-chat-history-item.jsx
+import { useState, useEffect, useRef, useCallback } from 'react'
 import AIOutput from './ai-output'
+import AIStopIcon from './ai-stop-icon'
 import {
   Alert,
   Tooltip
@@ -12,47 +13,169 @@ import {
   CaretRightOutlined
 } from '@ant-design/icons'
 import { copy } from '../../common/clipboard'
-import { useState } from 'react'
 
 export default function AIChatHistoryItem ({ item }) {
   const [showOutput, setShowOutput] = useState(true)
+  const startedRef = useRef(false)
   const {
-    prompt
+    prompt,
+    isStreaming,
+    sessionId,
+    response,
+    modelAI,
+    roleAI,
+    baseURLAI,
+    apiPathAI,
+    apiKeyAI,
+    proxyAI,
+    languageAI
   } = item
 
   function toggleOutput () {
     setShowOutput(!showOutput)
   }
 
+  function buildRole () {
+    const lang = languageAI || window.store.getLangName()
+    return roleAI + `;用[${lang}]回复`
+  }
+
+  const pollStreamContent = useCallback(async (sid) => {
+    try {
+      const streamResponse = await window.pre.runGlobalAsync('getStreamContent', sid)
+
+      if (streamResponse && streamResponse.error) {
+        if (streamResponse.error === 'Session not found') {
+          return
+        }
+        window.store.removeAiHistory(item.id)
+        return window.store.onError(new Error(streamResponse.error))
+      }
+
+      const index = window.store.aiChatHistory.findIndex(i => i.id === item.id)
+      if (index !== -1) {
+        window.store.aiChatHistory[index].response = streamResponse.content || ''
+        window.store.aiChatHistory[index].isStreaming = streamResponse.hasMore
+        window.store.aiChatHistory = [...window.store.aiChatHistory]
+
+        if (streamResponse.hasMore) {
+          setTimeout(() => pollStreamContent(sid), 200)
+        }
+      }
+    } catch (error) {
+      window.store.removeAiHistory(item.id)
+      window.store.onError(error)
+    }
+  }, [item.id])
+
+  const startRequest = useCallback(async () => {
+    try {
+      const aiResponse = await window.pre.runGlobalAsync(
+        'AIchat',
+        prompt,
+        modelAI,
+        buildRole(),
+        baseURLAI,
+        apiPathAI,
+        apiKeyAI,
+        proxyAI,
+        true
+      )
+
+      if (aiResponse && aiResponse.error) {
+        window.store.removeAiHistory(item.id)
+        return window.store.onError(new Error(aiResponse.error))
+      }
+
+      if (aiResponse && aiResponse.isStream && aiResponse.sessionId) {
+        const index = window.store.aiChatHistory.findIndex(i => i.id === item.id)
+        if (index !== -1) {
+          window.store.aiChatHistory[index].isStreaming = true
+          window.store.aiChatHistory[index].sessionId = aiResponse.sessionId
+          window.store.aiChatHistory[index].response = aiResponse.content || ''
+        }
+        pollStreamContent(aiResponse.sessionId)
+      } else if (aiResponse && aiResponse.response) {
+        const index = window.store.aiChatHistory.findIndex(i => i.id === item.id)
+        if (index !== -1) {
+          window.store.aiChatHistory[index].response = aiResponse.response
+          window.store.aiChatHistory[index].isStreaming = false
+        }
+      }
+    } catch (error) {
+      window.store.removeAiHistory(item.id)
+      window.store.onError(error)
+    }
+  }, [prompt, modelAI, baseURLAI, apiPathAI, apiKeyAI, proxyAI, item.id, pollStreamContent])
+
+  useEffect(() => {
+    if (!response && !startedRef.current) {
+      startedRef.current = true
+      startRequest()
+    }
+  }, [])
+
+  async function handleStop (e) {
+    e.stopPropagation()
+    if (!sessionId) return
+
+    try {
+      await window.pre.runGlobalAsync('stopStream', sessionId)
+      const index = window.store.aiChatHistory.findIndex(i => i.id === item.id)
+      if (index !== -1) {
+        window.store.aiChatHistory[index].isStreaming = false
+        window.store.aiChatHistory = [...window.store.aiChatHistory]
+      }
+    } catch (error) {
+      console.error('Error stopping stream:', error)
+    }
+  }
+
+  function renderStopButton () {
+    if (!isStreaming) {
+      return null
+    }
+    return (
+      <AIStopIcon
+        onClick={handleStop}
+        title='Stop this AI request'
+      />
+    )
+  }
+
   const alertProps = {
     title: (
-      <>
+      <div className='ai-history-item-title'>
         <span className='pointer mg1r' onClick={toggleOutput}>
           {showOutput ? <CaretDownOutlined /> : <CaretRightOutlined />}
         </span>
         <UserOutlined />: {prompt}
-      </>
+        {renderStopButton()}
+      </div>
     ),
     type: 'info'
   }
+
   function handleDel (e) {
     e.stopPropagation()
     window.store.removeAiHistory(item.id)
   }
+
   function handleCopy () {
     copy(prompt)
   }
+
   function renderTitle () {
     return (
       <div>
         <p>
-          <b>Model:</b> {item.modelAI}
+          <b>Model:</b> {modelAI}
         </p>
         <p>
-          <b>Role:</b> {item.roleAI}
+          <b>Role:</b> {roleAI}
         </p>
         <p>
-          <b>Base URL:</b> {item.baseURLAI}
+          <b>Base URL:</b> {baseURLAI}
         </p>
         <p>
           <b>Time:</b> {new Date(item.timestamp).toLocaleString()}
@@ -70,6 +193,7 @@ export default function AIChatHistoryItem ({ item }) {
       </div>
     )
   }
+
   return (
     <div className='chat-history-item'>
       <div className='mg1y'>

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

@@ -14,7 +14,6 @@ import {
 } from '../../common/constants'
 import HelpIcon from '../common/help-icon'
 import { refsStatic } from '../common/ref'
-import AIStopIcon from './ai-stop-icon'
 import './ai.styl'
 
 const { TextArea } = Input
@@ -22,155 +21,43 @@ const MAX_HISTORY = 100
 
 export default function AIChat (props) {
   const [prompt, setPrompt] = useState('')
-  const [isLoading, setIsLoading] = useState(false)
-  const [currentSessionId, setCurrentSessionId] = useState(null)
 
   function handlePromptChange (e) {
     setPrompt(e.target.value)
   }
 
-  function buildRole () {
-    const lang = props.config.languageAI || window.store.getLangName()
-    return props.config.roleAI + `;用[${lang}]回复`
-  }
-
-  const handleSubmit = useCallback(async function () {
+  const handleSubmit = useCallback(function () {
     if (window.store.aiConfigMissing()) {
       window.store.toggleAIConfig()
     }
-    if (!prompt.trim() || isLoading) return
-    setIsLoading(true)
+    if (!prompt.trim()) return
 
-    // Create a placeholder entry for the streaming response
     const chatId = uid()
     const chatEntry = {
       prompt,
-      response: '', // Will be updated as stream arrives
+      response: '',
       isStreaming: false,
       sessionId: null,
       ...pick(props.config, [
         'modelAI',
         'roleAI',
-        'baseURLAI'
+        'baseURLAI',
+        'apiPathAI',
+        'apiKeyAI',
+        'proxyAI',
+        'languageAI'
       ]),
       timestamp: Date.now(),
       id: chatId
     }
 
     window.store.aiChatHistory.push(chatEntry)
-
-    try {
-      const aiResponse = await window.pre.runGlobalAsync(
-        'AIchat',
-        prompt,
-        props.config.modelAI,
-        buildRole(),
-        props.config.baseURLAI,
-        props.config.apiPathAI,
-        props.config.apiKeyAI,
-        props.config.proxyAI,
-        true // Enable streaming for chat
-      )
-
-      if (aiResponse && aiResponse.error) {
-        // Remove the placeholder entry and show error
-        const index = window.store.aiChatHistory.findIndex(item => item.id === chatId)
-        if (index !== -1) {
-          window.store.aiChatHistory.splice(index, 1)
-        }
-        setIsLoading(false)
-        return window.store.onError(
-          new Error(aiResponse.error)
-        )
-      }
-
-      if (aiResponse && aiResponse.isStream && aiResponse.sessionId) {
-        // Handle streaming response with polling
-        const index = window.store.aiChatHistory.findIndex(item => item.id === chatId)
-        if (index !== -1) {
-          window.store.aiChatHistory[index].isStreaming = true
-          window.store.aiChatHistory[index].sessionId = aiResponse.sessionId
-          window.store.aiChatHistory[index].response = aiResponse.content || ''
-        }
-        // Store current session ID for stop functionality
-        setCurrentSessionId(aiResponse.sessionId)
-
-        // Start polling for updates
-        pollStreamContent(aiResponse.sessionId, chatId)
-      } else if (aiResponse && aiResponse.response) {
-        // Handle non-streaming response (fallback)
-        const index = window.store.aiChatHistory.findIndex(item => item.id === chatId)
-        if (index !== -1) {
-          window.store.aiChatHistory[index].response = aiResponse.response
-          window.store.aiChatHistory[index].isStreaming = false
-        }
-        setIsLoading(false)
-      }
-    } catch (error) {
-      // Remove the placeholder entry and show error
-      const index = window.store.aiChatHistory.findIndex(item => item.id === chatId)
-      if (index !== -1) {
-        window.store.aiChatHistory.splice(index, 1)
-      }
-      setIsLoading(false)
-      window.store.onError(error)
-    }
+    setPrompt('')
 
     if (window.store.aiChatHistory.length > MAX_HISTORY) {
       window.store.aiChatHistory.splice(MAX_HISTORY)
     }
-    setPrompt('')
-  }, [prompt, isLoading])
-
-  // Function to poll for streaming content updates
-  const pollStreamContent = async (sessionId, chatId) => {
-    try {
-      const streamResponse = await window.pre.runGlobalAsync('getStreamContent', sessionId)
-
-      if (streamResponse && streamResponse.error) {
-        // Session not found or error - stop polling
-        if (streamResponse.error === 'Session not found') {
-          setCurrentSessionId(null)
-          setIsLoading(false)
-          return
-        }
-        // Remove the entry and show error
-        const index = window.store.aiChatHistory.findIndex(item => item.id === chatId)
-        if (index !== -1) {
-          window.store.aiChatHistory.splice(index, 1)
-        }
-        setIsLoading(false)
-        return window.store.onError(new Error(streamResponse.error))
-      }
-
-      // Update the chat entry with new content
-      const index = window.store.aiChatHistory.findIndex(item => item.id === chatId)
-      if (index !== -1) {
-        window.store.aiChatHistory[index].response = streamResponse.content || ''
-        window.store.aiChatHistory[index].isStreaming = streamResponse.hasMore
-
-        // Force re-render by updating the array reference
-        window.store.aiChatHistory = [...window.store.aiChatHistory]
-
-        // Continue polling if there's more content
-        if (streamResponse.hasMore) {
-          setTimeout(() => pollStreamContent(sessionId, chatId), 200) // Poll every 200ms
-        } else {
-          setCurrentSessionId(null)
-          setIsLoading(false)
-        }
-      }
-    } catch (error) {
-      // Remove the entry and show error
-      const index = window.store.aiChatHistory.findIndex(item => item.id === chatId)
-      if (index !== -1) {
-        window.store.aiChatHistory.splice(index, 1)
-      }
-      setCurrentSessionId(null)
-      setIsLoading(false)
-      window.store.onError(error)
-    }
-  }
+  }, [prompt])
 
   function renderHistory () {
     return (
@@ -188,41 +75,7 @@ export default function AIChat (props) {
     window.store.aiChatHistory = []
   }
 
-  const handleStop = useCallback(async function () {
-    if (!currentSessionId || !isLoading) return
-
-    try {
-      // Call server to stop the stream
-      await window.pre.runGlobalAsync('stopStream', currentSessionId)
-
-      // Reset state
-      setCurrentSessionId(null)
-      setIsLoading(false)
-
-      // Update the chat entry to mark as stopped
-      const chatEntries = window.store.aiChatHistory
-      for (let i = chatEntries.length - 1; i >= 0; i--) {
-        if (chatEntries[i].isStreaming) {
-          chatEntries[i].isStreaming = false
-          break
-        }
-      }
-      window.store.aiChatHistory = [...chatEntries]
-    } catch (error) {
-      console.error('Error stopping stream:', error)
-      setCurrentSessionId(null)
-      setIsLoading(false)
-    }
-  }, [currentSessionId, isLoading])
-
   function renderSendIcon () {
-    if (isLoading) {
-      return (
-        <AIStopIcon
-          onClick={handleStop}
-        />
-      )
-    }
     return (
       <SendOutlined
         onClick={handleSubmit}
@@ -254,7 +107,6 @@ export default function AIChat (props) {
       e.preventDefault()
       handleSubmit()
     }
-    // If Shift+Enter, allow default behavior (new line)
   }
 
   return (
@@ -270,7 +122,6 @@ export default function AIChat (props) {
           onPressEnter={handleKeyPress}
           placeholder='Enter your prompt here'
           autoSize={{ minRows: 3, maxRows: 10 }}
-          disabled={isLoading}
           className='ai-chat-textarea'
         />
         <Flex className='ai-chat-terminals' justify='space-between' align='center'>

package/client/components/ai/ai.styl

@@ -66,9 +66,14 @@
 .ai-stop-icon-square
   width 20px
   height 20px
-  background var(--error)
   border-radius 2px
   display flex
   align-items center
   justify-content center
   font-size 10px
+
+.ai-history-item-title
+  display flex
+  align-items center
+  .ai-stop-icon-square
+    margin-left auto