@electerm/electerm-react 1.60.50 → 1.70.0

package/client/components/terminal/terminal.jsx

@@ -3,7 +3,7 @@ import { handleErr } from '../../common/fetch.jsx'
 import generate from '../../common/uid.js'
 import { isEqual, pick, debounce, throttle } from 'lodash-es'
 import clone from '../../common/to-simple-obj.js'
-// import runIdle from '../../common/run-idle'
+import resolve from '../../common/resolve.js'
 import {
   ReloadOutlined
 } from '@ant-design/icons'
@@ -51,6 +51,7 @@ import { formatBytes } from '../../common/byte-format.js'
 import * as fs from './fs.js'
 import iconsMap from '../sys-menu/icons-map.jsx'
 import { refs } from '../common/ref.js'
+import createDefaultLogPath from '../../common/default-log-path.js'
 
 const e = window.translate
 
@@ -65,13 +66,13 @@ class Term extends Component {
       passType: 'password',
       lines: []
     }
+    this.id = `term-${this.props.tab.id}`
+    refs.add(this.id, this)
   }
 
   domRef = createRef()
 
   componentDidMount () {
-    this.id = `term-${this.props.tab.id}`
-    refs.add(this.id, this)
     this.initTerminal()
     if (this.props.tab.enableSsh === false) {
       ;(
@@ -154,6 +155,9 @@ clear\r`
 
   componentWillUnmount () {
     refs.remove(this.id)
+    if (window.store.activeTerminalId === this.props.tab.id) {
+      window.store.activeTerminalId = ''
+    }
     if (this.zsession) {
       this.onZmodemEnd()
     }
@@ -172,10 +176,6 @@ clear\r`
       this.term.dispose()
       this.term = null
     }
-    window.removeEventListener(
-      'resize',
-      this.onResize
-    )
     this.attachAddon = null
     this.fitAddon = null
     this.zmodemAddon = null
@@ -314,7 +314,23 @@ clear\r`
   }
 
   onDrop = e => {
-    const files = e?.dataTransfer?.files
+    const dt = e.dataTransfer
+    const fromFile = dt.getData('fromFile')
+
+    if (fromFile) {
+      // Handle SFTP file drop
+      try {
+        const fileData = JSON.parse(fromFile)
+        const filePath = resolve(fileData.path, fileData.name)
+        this.attachAddon._sendData(`"${filePath}" `)
+        return
+      } catch (e) {
+        log.error('Failed to parse fromFile data:', e)
+      }
+    }
+
+    // Handle regular file drop
+    const files = dt.files
     if (files && files.length) {
       this.attachAddon._sendData(
         Array.from(files).map(f => `"${f.path}"`).join(' ')
@@ -1014,6 +1030,7 @@ clear\r`
       ...tab,
       ...extra,
       logName,
+      sessionLogPath: config.sessionLogPath || createDefaultLogPath(),
       ...pick(config, [
         'addTimeStampToTermLog',
         'keepaliveInterval',
@@ -1058,6 +1075,7 @@ clear\r`
       return
     }
     this.setStatus(statusMap.success)
+    refs.get('sftp-' + id)?.initData()
     term.pid = id
     this.pid = id
     const wsUrl = this.buildWsUrl()
@@ -1105,7 +1123,6 @@ clear\r`
   }, 200)
 
   onerrorSocket = err => {
-    this.setStatus(statusMap.error)
     log.error('onerrorSocket', err)
   }
 

package/client/components/terminal-info/base.jsx

@@ -19,6 +19,7 @@ import {
   ApiOutlined,
   PartitionOutlined
 } from '@ant-design/icons'
+import createDefaultSessionLogPath from '../../common/default-log-path'
 import { refs } from '../common/ref'
 
 const e = window.translate
@@ -42,6 +43,10 @@ export default class TerminalInfoBase extends Component {
     this.getState()
   }
 
+  componentWillUnmount () {
+    clearTimeout(this.timer)
+  }
+
   handleToggleTimestamp = () => {
     const { saveTerminalLogToFile, addTimeStampToTermLog } = this.state
     const {
@@ -102,6 +107,8 @@ export default class TerminalInfoBase extends Component {
         saveTerminalLogToFile: term.state.saveTerminalLogToFile,
         addTimeStampToTermLog: term.state.addTimeStampToTermLog
       })
+    } else {
+      this.timer = setTimeout(this.getState, 100)
     }
   }
 
@@ -153,12 +160,10 @@ export default class TerminalInfoBase extends Component {
     const {
       id,
       logName,
-      appPath
+      sessionLogPath
     } = this.props
     const { saveTerminalLogToFile } = this.state
-    const base = appPath
-      ? osResolve(appPath, 'electerm', 'session_logs')
-      : window.et.sessionLogPath
+    const base = sessionLogPath || createDefaultSessionLogPath()
     const path = osResolve(base, logName + '.log')
     const name = e('saveTerminalLogToFile')
     const to = saveTerminalLogToFile

package/client/components/tree-list/bookmark-toolbar.jsx

@@ -10,7 +10,7 @@ import {
 import { Button, Space, Dropdown, Upload } from 'antd'
 import copy from 'json-deep-copy'
 import time from '../../common/time'
-import { find, uniq } from 'lodash-es'
+import { uniq } from 'lodash-es'
 import { fixBookmarks } from '../../common/db-fix'
 import download from '../../common/download'
 import { action } from 'manate'
@@ -59,8 +59,7 @@ export default function BookmarkToolbar (props) {
         if (!bmgTree.has(bg.id)) {
           store.bookmarkGroups.push(bg)
         } else {
-          const bg1 = find(
-            store.bookmarkGroups,
+          const bg1 = store.bookmarkGroups.find(
             b => b.id === bg.id
           )
           bg1.bookmarkIds = uniq(

package/client/components/tree-list/tree-list.jsx

@@ -10,20 +10,19 @@ import {
 } from '@ant-design/icons'
 import createName from '../../common/create-title'
 import InputAutoFocus from '../common/input-auto-focus'
-import { find, uniq, filter, pick } from 'lodash-es'
+import { uniq, filter, pick } from 'lodash-es'
 import {
   maxBookmarkGroupTitleLength,
   defaultBookmarkGroupId,
   settingMap
 } from '../../common/constants'
 import findParentBySel from '../../common/find-parent'
-import copy, { deepCopy } from 'json-deep-copy'
+import copy from 'json-deep-copy'
 import NewButtonsGroup from './bookmark-toolbar'
 import findBookmarkGroupId from '../../common/find-bookmark-group-id'
 import getInitItem from '../../common/init-setting-item'
 import uid from '../../common/uid'
 import { action } from 'manate'
-import deepEqual from 'fast-deep-equal'
 import './tree-list.styl'
 import TreeExpander from './tree-expander'
 import TreeListItem from './tree-list-item'
@@ -43,8 +42,7 @@ export default class ItemListTree extends Component {
       moveItemIsGroup: false,
       bookmarkGroupTitle: '',
       categoryTitle: '',
-      categoryId: '',
-      expandedKeys: props.expandedKeys
+      categoryId: ''
     }
   }
 
@@ -60,17 +58,6 @@ export default class ItemListTree extends Component {
     }, 100)
   }
 
-  componentDidUpdate (prevProps, prevState) {
-    if (
-      !deepEqual(prevProps.expandedKeys, this.props.expandedKeys) &&
-      !deepEqual(this.props.expandedKeys, this.state.expandedKeys)
-    ) {
-      this.setState({
-        expandedKeys: deepCopy(this.props.expandedKeys)
-      })
-    }
-  }
-
   componentWillUnmount () {
     clearTimeout(this.timer)
   }
@@ -83,7 +70,7 @@ export default class ItemListTree extends Component {
     })
   }
 
-  filter = list => {
+  filter = (list) => {
     const { keyword } = this.state
     return keyword
       ? list.filter(item => {
@@ -92,26 +79,26 @@ export default class ItemListTree extends Component {
       : list
   }
 
-  getBookmarkTree = () => {
-    return this.filter(this.props.bookmarks).reduce((tree, bookmark) => {
-      tree[bookmark.id] = bookmark
-      return tree
-    }, {})
-  }
-
   onExpandKey = group => {
-    const nkeys = [
-      ...this.state.expandedKeys,
-      group.id
-    ]
-    this.onExpand(nkeys)
+    const {
+      expandedKeys
+    } = window.store
+    expandedKeys.push(group.id)
+    this.onExpand()
   }
 
   onUnExpandKey = group => {
-    const nkeys = this.state.expandedKeys.filter(
-      d => d !== group.id
+    const {
+      expandedKeys
+    } = window.store
+    const index = expandedKeys.findIndex(
+      d => d === group.id
     )
-    this.onExpand(nkeys)
+    if (index < 0) {
+      return
+    }
+    expandedKeys.splice(index, 1)
+    this.onExpand(expandedKeys)
   }
 
   handleChange = keyword => {
@@ -159,8 +146,7 @@ export default class ItemListTree extends Component {
       return
     }
     const { bookmarkGroups } = window.store
-    const obj = find(
-      bookmarkGroups,
+    const obj = bookmarkGroups.find(
       bg => bg.id === categoryId
     )
     if (!obj) {
@@ -242,8 +228,7 @@ export default class ItemListTree extends Component {
       bookmarkIds: []
     }
     bookmarkGroups.unshift(newCat)
-    const cat = find(
-      bookmarkGroups,
+    const cat = bookmarkGroups.find(
       d => d.id === id
     )
     if (!cat) {
@@ -280,12 +265,8 @@ export default class ItemListTree extends Component {
     })
   }
 
-  onExpand = (expandedKeys) => {
-    this.setState({
-      expandedKeys
-    })
+  onExpand = () => {
     this.closeNewGroupForm()
-    window.store.expandedKeys = deepCopy(expandedKeys)
   }
 
   onSelect = (
@@ -303,8 +284,7 @@ export default class ItemListTree extends Component {
         currentBookmarkGroupId: findBookmarkGroupId(store.bookmarkGroups, id)
       })
       const { bookmarks } = this.props
-      const bookmark = find(
-        bookmarks,
+      const bookmark = bookmarks.find(
         d => d.id === id
       )
       if (bookmark) {
@@ -342,13 +322,10 @@ export default class ItemListTree extends Component {
       return {
         showNewBookmarkGroupForm: true,
         parentId: item.id,
-        bookmarkGroupTitle: '',
-        expandedKeys: uniq([
-          ...old.expandedKeys,
-          item.id
-        ])
+        bookmarkGroupTitle: ''
       }
     })
+    window.store.expandedKeys.push(item.id)
   }
 
   openAll = (item) => {
@@ -745,7 +722,7 @@ export default class ItemListTree extends Component {
       level,
       group,
       keyword: this.state.keyword,
-      expandedKeys: this.state.expandedKeys,
+      expandedKeys: this.props.expandedKeys,
       onExpand: this.onExpandKey,
       onUnExpand: this.onUnExpandKey
     }
@@ -766,7 +743,7 @@ export default class ItemListTree extends Component {
       bookmarkGroupIds = [],
       id
     } = group
-    const shouldRender = this.state.keyword || this.state.expandedKeys.includes(id)
+    const shouldRender = this.state.keyword || this.props.expandedKeys.includes(id)
     if (!shouldRender) {
       return null
     }
@@ -786,8 +763,16 @@ export default class ItemListTree extends Component {
   }
 
   renderChilds = (bookmarkIds, pid) => {
+    const tree = this.props.bookmarksMap
+    const { keyword } = this.state
     const bookmarks = bookmarkIds.map(id => {
-      return this.getBookmarkTree()[id]
+      const item = tree.get(id)
+      if (!item) {
+        return null
+      }
+      return createName(item).toLowerCase().includes(keyword.toLowerCase())
+        ? item
+        : null
     }).filter(d => d)
     return bookmarks.map((node) => {
       return this.renderItemTitle(node, false, pid)

package/client/components/tree-list/tree-search.jsx

@@ -22,6 +22,7 @@ export default memo(function TreeSearchComponent ({ onSearch, keyword }) {
     <Search
       onChange={handleChange}
       value={searchTerm}
+      allowClear
     />
   )
 })

package/client/store/bookmark-group.js

@@ -2,7 +2,6 @@
  * bookmark group functions
  */
 
-import { find } from 'lodash-es'
 import {
   defaultBookmarkGroupId,
   settingMap
@@ -32,7 +31,7 @@ export default Store => {
     const gids = item.bookmarkGroupIds || []
     const bookmarkGroups = store.bookmarkGroups
     for (const gid of gids) {
-      const g = find(bookmarkGroups, g => g.id === gid)
+      const g = bookmarkGroups.find(g => g.id === gid)
       if (g && g.bookmarkIds && g.bookmarkIds.length) {
         ids = [
           ...ids,

package/client/store/init-state.js

@@ -20,6 +20,7 @@ import {
   qmSortByFrequencyKey,
   resolutionsLsKey,
   aiChatHistoryKey,
+  syncServerDataKey,
   splitMap
 } from '../common/constants'
 import { buildDefaultThemes } from '../common/terminal-theme'
@@ -52,6 +53,7 @@ export default () => {
     history: ls.getItemJSON('history', []),
     sshConfigs: [],
     bookmarks: [],
+    bookmarksMap: new Map(),
     sidebarPanelTab: 'bookmarks',
     profiles: [],
     bookmarkGroups: getDefaultBookmarkGroups([]),
@@ -123,6 +125,8 @@ export default () => {
     isSyncUpload: false,
     isSyncDownload: false,
     syncType: syncTypes.github,
+    // syncServerData: {},
+    syncServerStatus: ls.getItemJSON(syncServerDataKey, {}),
 
     // term search
     termSearchOpen: false,

package/client/store/item.js

@@ -2,7 +2,6 @@
  * common db op
  */
 
-import { find } from 'lodash-es'
 import deepCopy from 'json-deep-copy'
 import {
   settingMap
@@ -23,7 +22,7 @@ export default Store => {
   Store.prototype.editItem = function (id, updates, type) {
     const { store } = window
     const items = store.getItems(type)
-    const item = find(items, t => t.id === id)
+    const item = items.find(t => t.id === id)
     if (!item) {
       return
     }

package/client/store/load-data.js

@@ -115,7 +115,7 @@ export default (Store) => {
     if (!arr.length && store.config.initDefaultTabOnStart) {
       store.initFirstTab()
     }
-    setTimeout(store.confirmLoad, 1300)
+    store.confirmLoad()
     const { initTime, loadTime } = window.pre.runSync('getLoadTime')
     if (loadTime) {
       store.loadTime = loadTime
@@ -166,6 +166,11 @@ export default (Store) => {
         for (const { name, data } of arr) {
           const dt = JSON.parse(data || '[]')
           refsStatic.add('oldState-' + name, dt)
+          if (name === 'bookmarks') {
+            ext.bookmarksMap = new Map(
+              dt.map(d => [d.id, d])
+            )
+          }
           ext[name] = dt
         }
       })

package/client/store/setting.js

@@ -2,7 +2,6 @@
  * setting modal
  */
 
-import { find } from 'lodash-es'
 import {
   message
 } from 'antd'
@@ -66,7 +65,7 @@ export default Store => {
     const { store } = window
     const bookmarks = store.bookmarks
     const item = copy(
-      find(bookmarks, it => it.id === id)
+      bookmarks.find(it => it.id === id)
     )
     if (!item) {
       return

package/client/store/store.js

@@ -31,17 +31,18 @@ import deepCopy from 'json-deep-copy'
 import getBrand from '../components/ai/get-brand'
 import {
   settingMap,
-  paneMap,
   settingSyncId,
   settingShortcutsId,
   settingTerminalId,
-  terminalSshConfigType
+  terminalSshConfigType,
+  paneMap
 } from '../common/constants'
 import getInitItem from '../common/init-setting-item'
 import createTitle from '../common/create-title'
 import {
   theme
 } from 'antd'
+import { refs } from '../components/common/ref'
 
 const e = window.translate
 
@@ -65,7 +66,7 @@ class Store {
     const { currentTab } = this
     const { quickCommands } = window.store
     const currentTabQuickCommands = (
-      currentTab.quickCommands || []
+      currentTab?.quickCommands || []
     ).map((d, i) => {
       return {
         ...d,
@@ -82,12 +83,11 @@ class Store {
     const {
       activeTabId
     } = this
-    const { tabs } = window.store
-    const tab = tabs.find(t => t.id === activeTabId)
+    const tab = refs.get('tab-' + activeTabId)
     if (!tab) {
-      return false
+      return null
     }
-    return tab
+    return tab.props.tab
   }
 
   get batchInputSelectedTabIds () {
@@ -112,21 +112,19 @@ class Store {
     if (store.showModal) {
       return false
     }
-    const {
-      currentTab
-    } = store
+    const { currentTab } = store
     if (!currentTab) {
       return false
     }
     const {
-      type,
-      pane
+      type
     } = currentTab
-    if (type === 'rdp' || type === 'vnc' || type === 'web') {
+    if (type === 'web' || type === 'rdp' || type === 'vnc') {
       return false
     }
-    return pane === paneMap.ssh ||
-        pane === paneMap.terminal
+    return currentTab.sshSftpSplitView ||
+      currentTab.pane === paneMap.terminal ||
+      currentTab.pane === paneMap.ssh
   }
 
   get quickCommandTags () {

package/client/store/sync.js

@@ -34,6 +34,13 @@ async function fetchData (type, func, args, token, proxy) {
   return fetch(data)
 }
 
+function updateSyncServerStatusFromGist (store, gist, type) {
+  const status = parseJsonSafe(
+    get(gist, 'files["electerm-status.json"].content')
+  )
+  store.syncServerStatus[type] = status
+}
+
 export default (Store) => {
   Store.prototype.updateSyncSetting = function (data) {
     const { store } = window
@@ -167,6 +174,20 @@ export default (Store) => {
     window[type + 'IsSyncing'] = false
   }
 
+  Store.prototype.previewServerData = async function (type) {
+    const { store } = window
+    const token = store.getSyncToken(type)
+    const gistId = store.getSyncGistId(type)
+    const gist = await fetchData(
+      type,
+      'getOne',
+      [gistId],
+      token,
+      store.getProxySetting()
+    )
+    updateSyncServerStatusFromGist(store, gist, type)
+  }
+
   Store.prototype.uploadSettingAction = async function (type) {
     const { store } = window
     const token = store.getSyncToken(type)
@@ -212,22 +233,33 @@ export default (Store) => {
         }
       }
     }
-    const res = await fetchData(type, 'update', [gistId, {
+    const now = Date.now()
+    const status = {
+      lastSyncTime: now,
+      electermVersion: packVer,
+      deviceName: window.pre.osInfo().find(r => r.k === 'hostname')?.v || 'unknown'
+    }
+    const gistData = {
       description: 'sync electerm data',
       files: {
         ...objs,
         'electerm-status.json': {
-          content: JSON.stringify({
-            lastSyncTime: Date.now(),
-            electermVersion: packVer
-          })
+          content: JSON.stringify(status)
         }
       }
-    }], token, store.getProxySetting())
+    }
+    const res = await fetchData(
+      type,
+      'update',
+      [gistId, gistData],
+      token,
+      store.getProxySetting()
+    )
     if (res) {
       store.updateSyncSetting({
-        [type + 'LastSyncTime']: Date.now()
+        [type + 'LastSyncTime']: now
       })
+      updateSyncServerStatusFromGist(store, gistData, type)
     }
   }
 
@@ -259,6 +291,9 @@ export default (Store) => {
       token,
       store.getProxySetting()
     )
+    if (gist) {
+      updateSyncServerStatusFromGist(store, gist, type)
+    }
     const { names, syncConfig } = store.getDataSyncNames()
     for (const n of names) {
       let str = get(gist, `files["${n}.json"].content`)

package/client/store/terminal-theme.js

@@ -3,7 +3,7 @@
  */
 
 import { message } from 'antd'
-import { find, isEqual } from 'lodash-es'
+import { isEqual } from 'lodash-es'
 import {
   defaultTheme,
   settingMap,
@@ -42,7 +42,7 @@ export default Store => {
   Store.prototype.getThemeConfig = function () {
     const { store } = window
     const all = store.getSidebarList(settingMap.terminalThemes)
-    return (find(all, d => d.id === store.config.theme) || {}).themeConfig || {}
+    return (all.find(d => d.id === store.config.theme) || {}).themeConfig || {}
   }
 
   Store.prototype.fixThemes = function (themes) {
@@ -82,7 +82,7 @@ export default Store => {
   Store.prototype.checkDefaultTheme = async function (terminalThemes) {
     const { store } = window
     const themeId = defaultTheme.id
-    const currentDefaultTheme = find(store.terminalThemes, d => d.id === themeId)
+    const currentDefaultTheme = store.terminalThemes.find(d => d.id === themeId)
     if (
       currentDefaultTheme &&
       (
@@ -102,7 +102,7 @@ export default Store => {
         `${e('default')} ${e('themeConfig')} ${e('updated')}`
       )
     }
-    const hasLightTheme = find(store.getTerminalThemes(), d => d.id === defaultThemeLight.id)
+    const hasLightTheme = store.getTerminalThemes().find(d => d.id === defaultThemeLight.id)
     if (!hasLightTheme) {
       store.addTheme(defaultThemeLight)
     }

package/client/store/ui-theme.js

@@ -2,16 +2,11 @@
  * ui theme functions
  */
 
-/**
- * theme related functions
- */
-
-import { escapeRegExp, find } from 'lodash-es'
+import { escapeRegExp } from 'lodash-es'
 import {
   defaultTheme,
   settingMap
 } from '../common/constants'
-// import fetch from '../common/fetch'
 import copy from 'json-deep-copy'
 
 export default Store => {
@@ -51,10 +46,8 @@ export default Store => {
 
   Store.prototype.getUiThemeConfig = function () {
     const { store } = window
-    const theme = find(
-      store.getSidebarList(settingMap.terminalThemes),
-      d => d.id === store.config.theme
-    )
+    const theme = store.getSidebarList(settingMap.terminalThemes)
+      .find(d => d.id === store.config.theme)
     return theme && theme.uiThemeConfig
       ? copy(theme.uiThemeConfig)
       : defaultTheme.uiThemeConfig