@electerm/electerm-react 3.0.18 → 3.1.6

package/client/common/constants.js

@@ -190,13 +190,15 @@ export const syncTypes = buildConst([
   'github',
   'gitee',
   'custom',
-  'cloud'
+  'cloud',
+  'webdav'
 ])
 export const syncTokenCreateUrls = {
   gitee: 'https://gitee.com/github-zxdong262/electerm/wikis/Create%20personal%20access%20token?sort_id=3028409',
   github: 'https://github.com/electerm/electerm/wiki/Create-personal-access-token',
   custom: 'https://github.com/electerm/electerm/wiki/Custom-sync-server',
-  cloud: 'https://electerm-cloud.html5beta.com'
+  cloud: 'https://electerm-cloud.html5beta.com',
+  webdav: 'https://github.com/electerm/electerm/wiki/WebDAV-sync'
 }
 export const settingSyncId = 'setting-sync'
 export const settingTerminalId = 'setting-terminal'

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

@@ -31,25 +31,42 @@ export default class ConfirmModalStore extends Component {
       transferToConfirm: null
     }
     this.queue = []
+    this.queuedTransferIds = new Set()
+    this.activeTransferId = null
     this.id = 'transfer-conflict'
     refsStatic.add(this.id, this)
   }
 
   addConflict = (transfer) => {
+    const transferId = transfer?.id
+    if (!transferId) {
+      return
+    }
+    if (this.activeTransferId === transferId || this.queuedTransferIds.has(transferId)) {
+      return
+    }
     this.queue.push(transfer)
-    if (!this.state.transferToConfirm) {
+    this.queuedTransferIds.add(transferId)
+    if (!this.activeTransferId) {
       this.showNext()
     }
   }
 
   showNext = () => {
     const next = this.queue.shift()
+    if (next?.id) {
+      this.queuedTransferIds.delete(next.id)
+    }
+    this.activeTransferId = next?.id || null
     this.setState({
       transferToConfirm: next
     })
   }
 
   act = (action) => {
+    if (!this.state.transferToConfirm) {
+      return
+    }
     const { id, transferBatch } = this.state.transferToConfirm
     const toAll = action.includes('All')
     const policy = toAll ? action.replace('All', '') : action
@@ -60,10 +77,17 @@ export default class ConfirmModalStore extends Component {
     if (doFilter) {
       // Update all existing transfers with same batch ID in DOM
       const prefix = `tr-${transferBatch}-`
+      const pendingConflictIds = new Set([
+        id,
+        ...this.queue
+          .filter(d => d.transferBatch === transferBatch)
+          .map(d => d.id)
+      ])
       for (const [key, r] of window.refsTransfers.entries()) {
         if (key.startsWith(prefix)) {
-          if (key !== trid) {
-            r.resolvePolicy = policy
+          r.resolvePolicy = policy
+          const transferId = r.props.transfer?.id
+          if (key !== trid && pendingConflictIds.has(transferId)) {
             r.onDecision(policy)
           }
         }
@@ -72,9 +96,11 @@ export default class ConfirmModalStore extends Component {
     }
 
     // Resolve current conflict
-    refsTransfers.get(trid)?.onDecision(policy)
+    const currentTransfer = refsTransfers.get(trid)
+    currentTransfer?.onDecision(policy)
 
     // Move to the next item
+    this.activeTransferId = null
     this.setState({
       transferToConfirm: null
     }, this.showNext)

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

@@ -41,7 +41,12 @@ export default class Queue extends Component {
     return new Promise((resolve, reject) => {
       const { fileTransfers } = window.store
       const [id, updateObj] = args
+      let completed = false
       const end = () => {
+        if (completed) {
+          return
+        }
+        completed = true
         this.currentRun && this.currentRun.stop()
         resolve()
       }
@@ -99,10 +104,11 @@ export default class Queue extends Component {
           })()
         }
 
-        // For non-transfer operations, check immediately
-        // if (!isTransferInit) {
-        //   checkCompletion()
-        // }
+        // Progress and delete updates are synchronous store mutations.
+        // Resolve them here so the queue cannot stall waiting for another reaction.
+        if (!isTransferInit) {
+          checkCompletion()
+        }
       }
 
       function checkCompletion () {

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

@@ -77,11 +77,11 @@ export default class TransportAction extends Component {
   }
 
   localCheckExist = (path) => {
-    return getLocalFileInfo(path).catch(console.log)
+    return getLocalFileInfo(path)
+      .catch(() => null)
   }
 
   remoteCheckExist = (path, tabId) => {
-    // return true
     const sftp = refs.get('sftp-' + tabId)?.sftp
     if (!sftp) {
       console.log('remoteCheckExist error', 'sftp not exist')
@@ -373,10 +373,12 @@ export default class TransportAction extends Component {
         toFile
       })
       if (transfer.resolvePolicy) {
-        return this.onDecision(transfer.resolvePolicy)
+        this.onDecision(transfer.resolvePolicy)
+        return true
       }
       if (this.resolvePolicy) {
-        return this.onDecision(this.resolvePolicy)
+        this.onDecision(this.resolvePolicy)
+        return true
       }
       const transferWithToFile = {
         ...copy(transfer),
@@ -386,6 +388,7 @@ export default class TransportAction extends Component {
       refsStatic.get('transfer-conflict')?.addConflict(transferWithToFile)
       return true
     }
+    return false
   }
 
   onDecision = (policy) => {

package/client/components/file-transfer/transports-action-store.jsx

@@ -12,6 +12,11 @@ import { refsStatic } from '../common/ref'
 window.initingFtpTabIds = new Set()
 
 export default class TransportsActionStore extends Component {
+  constructor (props) {
+    super(props)
+    this.pendingInitIds = new Set()
+  }
+
   componentDidMount () {
     this.control()
   }
@@ -29,6 +34,12 @@ export default class TransportsActionStore extends Component {
     const {
       fileTransfers
     } = store
+    this.pendingInitIds = new Set(
+      Array.from(this.pendingInitIds).filter(id => {
+        const transfer = fileTransfers.find(t => t.id === id)
+        return transfer && transfer.inited !== true
+      })
+    )
 
     // First loop: Handle same type transfers
     for (const t of fileTransfers) {
@@ -57,7 +68,7 @@ export default class TransportsActionStore extends Component {
         inited,
         pausing
       } = t
-      return typeTo !== typeFrom && inited && pausing !== true
+      return typeTo !== typeFrom && (inited || this.pendingInitIds.has(t.id)) && pausing !== true
     }).length
 
     if (count >= maxTransport) {
@@ -80,7 +91,7 @@ export default class TransportsActionStore extends Component {
 
       const isTransfer = typeTo !== typeFrom
 
-      if (inited || !isTransfer) {
+      if (inited || this.pendingInitIds.has(id) || !isTransfer) {
         continue
       }
 
@@ -95,6 +106,7 @@ export default class TransportsActionStore extends Component {
 
       if (count < maxTransport) {
         count++
+        this.pendingInitIds.add(id)
         refsStatic.get('transfer-queue')?.addToQueue(
           'update',
           id,

package/client/components/setting-sync/server-data-status.jsx

@@ -1,3 +1,4 @@
+import { syncTypes } from '../../common/constants'
 import { useState } from 'react'
 import { LoadingOutlined, ReloadOutlined } from '@ant-design/icons'
 import dayjs from 'dayjs'
@@ -10,7 +11,7 @@ export default function ServerDataStatus (props) {
   const [loading, setLoading] = useState(false)
   const token = store.getSyncToken(type)
   const gistId = store.getSyncGistId(type)
-  const canSync = token && (gistId || type === 'custom' || type === 'cloud')
+  const canSync = token && (gistId || type === 'custom' || type === 'cloud' || type === syncTypes.webdav)
 
   async function handleReload () {
     setLoading(true)

package/client/components/setting-sync/setting-sync-form.jsx

@@ -41,6 +41,10 @@ export default function SyncForm (props) {
     if (syncType === syncTypes.cloud) {
       return !props.formData.token
     }
+    if (syncType === syncTypes.webdav) {
+      const { serverUrl, username, password } = props.formData
+      return !serverUrl || !username || !password
+    }
     const {
       token,
       gistId
@@ -70,6 +74,14 @@ export default function SyncForm (props) {
     } else {
       up[syncType + 'Proxy'] = ''
     }
+
+    // Handle WebDAV specific fields
+    if (syncType === syncTypes.webdav) {
+      up[syncType + 'ServerUrl'] = res.serverUrl || ''
+      up[syncType + 'Username'] = res.username || ''
+      up[syncType + 'Password'] = res.password || ''
+    }
+
     window.store.updateSyncSetting(up)
     const test = await window.store.testSyncToken(syncType, res.gistId)
     if (isError(test)) {
@@ -180,6 +192,9 @@ export default function SyncForm (props) {
         </p>
       )
     }
+    if (syncType === syncTypes.webdav) {
+      return createWebdavItems()
+    }
     if (syncType !== syncTypes.custom) {
       return null
     }
@@ -199,18 +214,73 @@ export default function SyncForm (props) {
       </FormItem>
     )
   }
+  function createWebdavItems () {
+    return (
+      <div>
+        <FormItem
+          label={createLabel('URL')}
+          name='serverUrl'
+          normalize={trim}
+          rules={[{
+            max: 500, message: '500 chars max'
+          }, {
+            required: true, message: 'Server URL is required'
+          }]}
+        >
+          <Input
+            placeholder='https://your-webdav-server.com/remote.php/dav/files/username'
+            id='sync-input-webdav-server-url'
+          />
+        </FormItem>
+        <FormItem
+          label={createLabel(e('username'))}
+          name='username'
+          normalize={trim}
+          rules={[{
+            max: 200, message: '200 chars max'
+          }, {
+            required: true, message: 'Username is required'
+          }]}
+        >
+          <Input
+            placeholder='WebDAV username'
+            id='sync-input-webdav-username'
+          />
+        </FormItem>
+        <FormItem
+          label={createLabel(e('password'))}
+          name='password'
+          normalize={trim}
+          rules={[{
+            max: 200, message: '200 chars max'
+          }, {
+            required: true, message: 'Password is required'
+          }]}
+        >
+          <Password
+            placeholder='WebDAV password'
+            id='sync-input-webdav-password'
+          />
+        </FormItem>
+      </div>
+    )
+  }
   const desc = syncType === syncTypes.custom
     ? 'jwt secret'
-    : 'personal access token'
+    : syncType === syncTypes.webdav
+      ? 'WebDAV credentials'
+      : 'personal access token'
   const idDesc = syncType === syncTypes.custom
     ? 'user id'
-    : 'gist ID'
+    : syncType === syncTypes.webdav
+      ? 'WebDAV server'
+      : 'gist ID'
   const tokenLabel = createLabel('token', desc)
   const gistLabel = createLabel('gist', idDesc)
   const syncPasswordName = e('encrypt') + ' ' + e('password')
   const syncPasswordLabel = createLabel(syncPasswordName, '')
   function createIdItem () {
-    if (syncType === syncTypes.cloud) {
+    if (syncType === syncTypes.cloud || syncType === syncTypes.webdav) {
       return null
     }
     return (
@@ -231,7 +301,7 @@ export default function SyncForm (props) {
     )
   }
   function createPasswordItem () {
-    if (syncType === syncTypes.cloud) {
+    if (syncType === syncTypes.cloud || syncType === syncTypes.webdav) {
       return null
     }
     return (
@@ -271,17 +341,11 @@ export default function SyncForm (props) {
     type: syncType,
     status: props.serverStatus
   }
-  return (
-    <Form
-      onFinish={save}
-      form={form}
-      className='form-wrap pd1x'
-      name={'setting-sync-form' + syncType}
-      layout='vertical'
-      initialValues={props.formData}
-    >
-      {renderWarning()}
-      {createUrlItem()}
+  function createTokenItem () {
+    if (syncType === syncTypes.webdav) {
+      return null
+    }
+    return (
       <FormItem
         label={tokenLabel}
         hasFeedback
@@ -298,6 +362,20 @@ export default function SyncForm (props) {
           id={createId('token')}
         />
       </FormItem>
+    )
+  }
+  return (
+    <Form
+      onFinish={save}
+      form={form}
+      className='form-wrap pd1x'
+      name={'setting-sync-form' + syncType}
+      layout='vertical'
+      initialValues={props.formData}
+    >
+      {renderWarning()}
+      {createUrlItem()}
+      {createTokenItem()}
       {
         createIdItem()
       }

package/client/components/setting-sync/setting-sync.jsx

@@ -44,7 +44,11 @@ export default auto(function SyncSettingEntry (props) {
       apiUrl: syncSetting[type + 'ApiUrl'],
       lastSyncTime: syncSetting[type + 'LastSyncTime'],
       syncPassword: syncSetting[type + 'SyncPassword'],
-      proxy: syncSetting[type + 'Proxy']
+      proxy: syncSetting[type + 'Proxy'],
+      // WebDAV specific fields
+      serverUrl: syncSetting[type + 'ServerUrl'],
+      username: syncSetting[type + 'Username'],
+      password: syncSetting[type + 'Password']
     }
     return (
       <SyncForm

package/client/components/sidebar/transfer-history-modal.jsx

@@ -98,8 +98,8 @@ export default memo(function TransferHistoryModal (props) {
       pageSize,
       showSizeChanger: true,
       pageSizeOptions: [5, 10, 20, 50, 100],
-      onChange: handlePageSizeChange,
-      position: ['topRight']
+      placement: 'topEnd',
+      onChange: handlePageSizeChange
     },
     size: 'small',
     rowKey: 'id'

package/client/components/tabs/tabs.styl

@@ -168,6 +168,7 @@
   border-radius 0 0 3px 3px
   padding 0
   background var(--main)
+  -webkit-app-region no-drag
 
 .window-control-box
   display inline-block

package/client/components/tabs/window-control.jsx

@@ -23,9 +23,11 @@ export default auto(function WindowControl (props) {
   }
   const maximize = () => {
     window.pre.runGlobalAsync('maximize')
+    window.store.isMaximized = true
   }
   const unmaximize = () => {
     window.pre.runGlobalAsync('unmaximize')
+    window.store.isMaximized = false
   }
   const closeApp = () => {
     window.store.exit()

package/client/components/terminal/transfer-client-base.js

@@ -4,7 +4,7 @@
  */
 
 // import { transferTypeMap } from '../../common/constants.js'
-import { safeGetItem, safeSetItem } from '../../common/safe-local-storage.js'
+import { getItem, setItem } from '../../common/safe-local-storage.js'
 import { getLocalFileInfo } from '../sftp/file-read.js'
 
 /**
@@ -176,6 +176,8 @@ export class TransferClientBase {
 
   /**
    * Open file select dialog
+   * Supports window._apiControlSelectFile for e2e testing
+   * Set window._apiControlSelectFile = ['/path/to/file1', '/path/to/file2'] to bypass native dialog
    * @param {Object} options - Options for file selection
    * @returns {Promise<Array>} - Selected files
    */
@@ -186,20 +188,28 @@ export class TransferClientBase {
       message = 'Choose some files to send'
     } = options
 
-    const properties = [
-      directory ? 'openDirectory' : 'openFile',
-      'multiSelections',
-      'showHiddenFiles',
-      'noResolveAliases',
-      'treatPackageAsDirectory',
-      'dontAddToRecent'
-    ]
-
-    const files = await window.api.openDialog({
-      title,
-      message,
-      properties
-    }).catch(() => false)
+    let files
+    if (window._apiControlSelectFile) {
+      files = Array.isArray(window._apiControlSelectFile)
+        ? window._apiControlSelectFile
+        : [window._apiControlSelectFile]
+      delete window._apiControlSelectFile
+    } else {
+      const properties = [
+        directory ? 'openDirectory' : 'openFile',
+        'multiSelections',
+        'showHiddenFiles',
+        'noResolveAliases',
+        'treatPackageAsDirectory',
+        'dontAddToRecent'
+      ]
+
+      files = await window.api.openDialog({
+        title,
+        message,
+        properties
+      }).catch(() => false)
+    }
 
     if (!files || !files.length) {
       return null
@@ -215,11 +225,22 @@ export class TransferClientBase {
 
   /**
    * Open save folder select dialog
+   * Supports window._apiControlSelectFolder for e2e testing
+   * Set window._apiControlSelectFolder = '/path/to/folder' to bypass native dialog
    * @returns {Promise<string>} - Selected folder path
    */
   openSaveFolderSelect = async () => {
+    if (window._apiControlSelectFolder) {
+      const folder = window._apiControlSelectFolder
+      delete window._apiControlSelectFolder
+      if (this.storageKey) {
+        setItem(this.storageKey, folder)
+      }
+      return folder
+    }
+
     // Try to use last saved path
-    const lastPath = this.storageKey ? safeGetItem(this.storageKey) : null
+    const lastPath = this.storageKey ? getItem(this.storageKey) : null
 
     const savePaths = await window.api.openDialog({
       title: 'Choose a folder to save file(s)',
@@ -240,7 +261,7 @@ export class TransferClientBase {
     }
 
     if (this.storageKey) {
-      safeSetItem(this.storageKey, savePaths[0])
+      setItem(this.storageKey, savePaths[0])
     }
     return savePaths[0]
   }

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

@@ -92,7 +92,6 @@ export default function TerminalInfoDisk (props) {
       },
       render: (v) => {
         if (k === 'up' || k === 'down') {
-          console.log('render traffic', k, v)
           return filesize(v || 0)
         }
         return v

package/client/store/sync.js

@@ -67,6 +67,13 @@ export default (Store) => {
         }
       ).join('####')
     }
+    if (type === syncTypes.webdav) {
+      // WebDAV token format: serverUrl####username####password
+      const serverUrl = get(window.store.config, 'syncSetting.webdavServerUrl')
+      const username = get(window.store.config, 'syncSetting.webdavUsername')
+      const password = get(window.store.config, 'syncSetting.webdavPassword')
+      return [serverUrl, username, password].join('####')
+    }
     return get(window.store.config, 'syncSetting.' + type + 'AccessToken')
   }
 
@@ -158,7 +165,13 @@ export default (Store) => {
     const types = Object.keys(syncTypes)
     for (const type of types) {
       const gistId = store.getSyncGistId(type)
-      if (gistId) {
+      // For WebDAV, check if server URL is configured
+      if (type === syncTypes.webdav) {
+        const serverUrl = get(window.store.config, 'syncSetting.webdavServerUrl')
+        if (serverUrl) {
+          await store.uploadSetting(type)
+        }
+      } else if (gistId) {
         await store.uploadSetting(type)
       }
     }
@@ -183,6 +196,24 @@ export default (Store) => {
     const { store } = window
     const token = store.getSyncToken(type)
     const gistId = store.getSyncGistId(type)
+
+    // Handle WebDAV preview differently
+    if (type === syncTypes.webdav) {
+      const gist = await fetchData(
+        type,
+        'download',
+        [],
+        token,
+        store.getSyncProxy(type)
+      )
+      if (gist && gist.files) {
+        const statusContent = get(gist, 'files["electerm-status.json"].content')
+        const status = statusContent ? parseJsonSafe(statusContent) : undefined
+        store.syncServerStatus[type] = status
+      }
+      return
+    }
+
     const gist = await fetchData(
       type,
       'getOne',
@@ -201,7 +232,7 @@ export default (Store) => {
     //   await store.createGist(type)
     //   gistId = store.getSyncGistId(type)
     // }
-    if (!gistId && type !== syncTypes.custom && type !== syncTypes.cloud) {
+    if (!gistId && type !== syncTypes.custom && type !== syncTypes.cloud && type !== syncTypes.webdav) {
       return
     }
     const pass = store.getSyncPassword(type)
@@ -244,6 +275,31 @@ export default (Store) => {
       electermVersion: packVer,
       deviceName: window.pre.osInfo().find(r => r.k === 'hostname')?.v || 'unknown'
     }
+
+    // Handle WebDAV upload differently
+    if (type === syncTypes.webdav) {
+      const uploadData = {}
+      for (const [key, value] of Object.entries(objs)) {
+        uploadData[key] = value.content
+      }
+      uploadData['electerm-status.json'] = JSON.stringify(status)
+
+      const res = await fetchData(
+        type,
+        'upload',
+        [uploadData],
+        token,
+        store.getSyncProxy(type)
+      )
+      if (res && !res.error) {
+        store.updateSyncSetting({
+          [type + 'LastSyncTime']: now
+        })
+        store.syncServerStatus[type] = status
+      }
+      return
+    }
+
     const gistData = {
       description: 'sync electerm data',
       files: {
@@ -285,10 +341,80 @@ export default (Store) => {
     //   await store.createGist(type)
     //   gistId = store.getSyncGistId(type)
     // }
-    if (!gistId && type !== syncTypes.custom && type !== syncTypes.cloud) {
+    if (!gistId && type !== syncTypes.custom && type !== syncTypes.cloud && type !== syncTypes.webdav) {
       return
     }
     const pass = store.getSyncPassword(type)
+
+    // Handle WebDAV download differently
+    if (type === syncTypes.webdav) {
+      const gist = await fetchData(
+        type,
+        'download',
+        [],
+        token,
+        store.getSyncProxy(type)
+      )
+      if (gist && gist.files) {
+        const statusContent = get(gist, 'files["electerm-status.json"].content')
+        const status = statusContent ? parseJsonSafe(statusContent) : undefined
+        store.syncServerStatus[type] = status
+
+        const { names, syncConfig } = store.getDataSyncNames()
+        for (const n of names) {
+          let str = get(gist, `files["${n}.json"].content`)
+          if (!str) {
+            if (n === settingMap.bookmarks) {
+              throw new Error(('Seems you have a empty WebDAV folder, you can try upload first'))
+            } else {
+              continue
+            }
+          }
+          if (!isJSON(str)) {
+            str = await window.pre.runGlobalAsync('decryptAsync', str, pass)
+          }
+          let arr = JSON.parse(str)
+          if (n === settingMap.terminalThemes) {
+            arr = store.fixThemes(arr)
+          } else if (n === settingMap.bookmarks) {
+            arr = fixBookmarks(arr)
+          }
+          let strOrder = get(gist, `files["${n}.order.json"].content`)
+          if (isJSON(strOrder)) {
+            strOrder = JSON.parse(strOrder)
+            arr.sort((a, b) => {
+              const ai = strOrder.findIndex(r => r === a.id)
+              const bi = strOrder.findIndex(r => r === b.id)
+              return ai - bi
+            })
+          }
+          store.setItems(n, arr)
+        }
+        if (syncConfig) {
+          const userConfig = parseJsonSafe(
+            get(gist, 'files["userConfig.json"].content')
+          )
+          if (userConfig) {
+            store.setConfig(userConfig)
+          }
+          if (userConfig && userConfig.theme) {
+            store.setTheme(userConfig.theme)
+          }
+        }
+
+        const up = {
+          [type + 'LastSyncTime']: Date.now()
+        }
+        if (pass) {
+          up[type + 'SyncPassword'] = pass
+        }
+        store.updateSyncSetting(up)
+      }
+      store.isSyncingSetting = false
+      store.isSyncDownload = false
+      return
+    }
+
     const gist = await fetchData(
       type,
       'getOne',

package/client/store/transfer-list.js

@@ -21,13 +21,13 @@ export default Store => {
   }
 
   Store.prototype.addTransferList = function (items) {
-    // console.log('addTransferList', JSON.stringify(items, null, 2))
     const { fileTransfers } = window.store
     const transferBatch = uid()
-    fileTransfers.push(...items.map(t => {
+    const nextItems = items.map(t => {
       t.transferBatch = transferBatch
       return t
-    }))
+    })
+    fileTransfers.push(...nextItems)
   }
 
   Store.prototype.pauseAll = function () {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@electerm/electerm-react",
-  "version": "3.0.18",
+  "version": "3.1.6",
   "description": "react components src for electerm",
   "main": "./client/components/main/main.jsx",
   "license": "MIT",