@electerm/electerm-react 1.51.3 → 1.51.8

package/client/components/sftp/transfer-conflict-store.jsx

@@ -12,9 +12,11 @@ import {
   getFileExt,
   checkFolderSize
 } from './file-read'
-import { findIndex, find } from 'lodash-es'
 import generate from '../../common/uid'
 import resolve from '../../common/resolve'
+import deepCopy from 'json-deep-copy'
+
+const { assign } = Object
 
 export default class TransferConflictStore extends PureComponent {
   state = {
@@ -27,7 +29,7 @@ export default class TransferConflictStore extends PureComponent {
 
   componentDidUpdate (prevProps) {
     if (
-      prevProps._fileTransfers !== this.props._fileTransfers
+      prevProps.fileTransferChanged !== this.props.fileTransferChanged
     ) {
       this.watchFile()
     }
@@ -56,17 +58,16 @@ export default class TransferConflictStore extends PureComponent {
     const newName = ext
       ? `${base}(rename-${renameId}).${ext}`
       : `${base}(rename-${renameId})`
-    const res = {
-      ...tr,
+    assign(tr, {
       renameId,
       newName,
       oldName: base,
       toPath: resolve(path, newName)
-    }
+    })
     if (action) {
-      res.action = action
+      tr.action = action
     }
-    return res
+    return tr
   }
 
   updateTransferAction = (data) => {
@@ -79,56 +80,48 @@ export default class TransferConflictStore extends PureComponent {
       fromFile
     } = transfer
     this.clear()
-    let { fileTransfers } = this.props
+
     const { store } = window
-    const index = findIndex(fileTransfers, d => d.id === id)
+    const { fileTransfers } = store
+    const index = fileTransfers.findIndex(d => d.id === id)
     if (index < 0) {
-      return store.setFileTransfers(fileTransfers)
+      return
     }
-    fileTransfers[index].fromFile = fromFile
-    fileTransfers[index].action = action
+    const tr = fileTransfers[index]
+    tr.fromFile = deepCopy(fromFile)
+    tr.action = action
+    tr.r = Math.random()
     if (action === 'skip') {
-      fileTransfers.splice(index, 1)
+      return fileTransfers.splice(index, 1)
     } else if (action === 'cancel') {
-      fileTransfers = fileTransfers.slice(0, index)
+      return store.skipAllTransfersSinceIndex(index)
     }
     if (action.includes('All')) {
-      fileTransfers = fileTransfers.map((t, i) => {
-        if (i < index) {
-          return t
-        }
-        return {
-          ...t,
-          action: action.replace('All', '')
-        }
+      return store.updateTransfersFromIndex(index, {
+        action: action.replace('All', '')
       })
     }
     if (action.includes('rename')) {
-      fileTransfers[index] = this.rename(fileTransfers[index])
-    } else if (action === 'skipAll') {
-      fileTransfers.splice(index, 1)
+      return this.rename(tr)
     }
-    store.setFileTransfers(fileTransfers)
   }
 
   tagTransferError = (id, errorMsg) => {
-    const { fileTransfers } = this.props
-    const tr = find(fileTransfers, d => d.id === id)
-    if (!tr) {
+    this.clear()
+    const { store } = window
+    const { fileTransfers } = store
+    const index = fileTransfers.findIndex(d => d.id === id)
+    if (index < 0) {
       return
     }
-    const { store } = window
-    store.addTransferHistory({
-      ...tr,
+
+    const [tr] = fileTransfers.splice(index, 1)
+    assign(tr, {
       host: tr.host,
       error: errorMsg,
       finishTime: Date.now()
     })
-    const index = findIndex(fileTransfers, d => d.id === id)
-    if (index >= 0) {
-      fileTransfers.splice(index, 1)
-    }
-    store.setFileTransfers(fileTransfers)
+    store.addTransferHistory(tr)
   }
 
   setConflict (tr) {
@@ -157,6 +150,18 @@ export default class TransferConflictStore extends PureComponent {
     window.addEventListener('message', this.onDecision)
   }
 
+  updateData = () => {
+    const {
+      store
+    } = window
+    const {
+      fileTransfers
+    } = store
+    if (fileTransfers.length > 0) {
+      fileTransfers[0].r = Math.random()
+    }
+  }
+
   setCanTransfer = (fromFile, tr) => {
     this.clear()
     const {
@@ -164,20 +169,20 @@ export default class TransferConflictStore extends PureComponent {
     } = window
     const {
       fileTransfers
-    } = this.props
-    const index = findIndex(fileTransfers, t => {
+    } = store
+    const index = fileTransfers.findIndex(t => {
       return t.id === tr.id
     })
-    if (index >= 0) {
-      const up = {
-        action: 'transfer',
-        fromFile
-      }
-      Object.assign(fileTransfers[index], up)
-    } else if (fileTransfers[0]) {
-      fileTransfers[0].r = Math.random()
+    if (index < 0) {
+      setTimeout(this.updateData, 0)
+      return
     }
-    store.setFileTransfers(fileTransfers)
+    const up = {
+      action: 'transfer',
+      fromFile
+    }
+    assign(fileTransfers[index], up)
+    // may have issue
   }
 
   clear = () => {
@@ -188,25 +193,24 @@ export default class TransferConflictStore extends PureComponent {
     const { store } = window
     const {
       fileTransfers
-    } = this.props
-    if (!fileTransfers.length && this.currentId) {
+    } = store
+    if (!fileTransfers.length) {
       return this.clear()
     }
     const tr = fileTransfers
-      .filter(t => {
+      .find(t => {
         return (
           !t.action ||
           !t.fromFile ||
           t.fromFile.isDirectory
         )
-      })[0]
+      })
     if (!tr) {
       this.onConfirm = false
       return this.clear()
     }
     if (this.currentId) {
-      // fileTransfers[0].r = Math.random()
-      return store.setFileTransfers(fileTransfers)
+      return
     }
     this.currentId = tr.id
     const {
@@ -225,7 +229,6 @@ export default class TransferConflictStore extends PureComponent {
       ? tr.fromFile
       : await this.checkExist(typeFrom, fromPath, sessionId)
     if (!fromFile) {
-      this.currentId = ''
       return this.tagTransferError(id, 'file not exist')
     }
     let toFile = false
@@ -249,33 +252,33 @@ export default class TransferConflictStore extends PureComponent {
       tr.skipExpand = true
     }
     if (fromPath === toPath && typeFrom === typeTo) {
+      assign(tr, {
+        operation: 'cp',
+        fromFile
+      })
       return this.updateTransferAction({
         id,
         action: 'rename',
-        transfer: {
-          ...tr,
-          operation: 'cp',
-          fromFile
-        }
+        transfer: tr
       })
     } else if (toFile && !action && !skipConfirm) {
       this.waitForSignal(id)
       if (!this.onConfirm) {
         this.onConfirm = true
-        return this.setConflict({
-          ...tr,
+        assign(tr, {
           fromFile,
           toFile
         })
+        return this.setConflict(tr)
       }
     } else if (toFile && !tr.fromFile && action) {
+      assign(tr, {
+        fromFile
+      })
       return this.updateTransferAction({
         id,
         action,
-        transfer: {
-          ...tr,
-          fromFile
-        }
+        transfer: tr
       })
     }
     this.setCanTransfer(fromFile, tr)

package/client/components/sftp/transport-action-store.jsx

@@ -1,11 +1,13 @@
 import { Component } from 'react'
 import copy from 'json-deep-copy'
-import { findIndex, isFunction } from 'lodash-es'
+import { isFunction } from 'lodash-es'
 import generate from '../../common/uid'
 import { typeMap, transferTypeMap, commonActions } from '../../common/constants'
 import fs from '../../common/fs'
 import format, { computeLeftTime, computePassedTime } from './transfer-speed-format'
-import { getFolderFromFilePath } from './file-read'
+import {
+  getFolderFromFilePath
+} from './file-read'
 import resolve from '../../common/resolve'
 import delay from '../../common/wait'
 import postMsg from '../../common/post-msg'
@@ -35,15 +37,9 @@ export default class TransportAction extends Component {
       this.initTransfer()
     }
     if (
-      this.props.cancel === true &&
-      prevProps.cancel !== true
+      this.props.pausing !== prevProps.pausing
     ) {
-      this.cancel()
-    }
-    if (
-      this.props.pause !== prevProps.pause
-    ) {
-      if (this.props.pause) {
+      if (this.props.pausing) {
         this.pause()
       } else {
         this.resume()
@@ -54,32 +50,24 @@ export default class TransportAction extends Component {
   componentWillUnmount () {
     this.transport && this.transport.destroy()
     this.transport = null
-    clearTimeout(this.timer)
-    this.timer = null
+    this.inst = null
   }
 
   update = (up) => {
-    const { fileTransfers, transfer } = this.props
+    const { transfer } = this.props
     const {
       store
     } = window
-    const index = findIndex(fileTransfers, t => t.id === transfer.id)
-    if (index < 0) {
-      return store.setFileTransfers(fileTransfers)
-    }
-    store.editTransfer(
-      fileTransfers[index].id,
+    store.updateTransfer(
+      transfer.id,
       up
     )
-    Object.assign(fileTransfers[index], up)
-    store.setFileTransfers(fileTransfers)
   }
 
   insert = (insts) => {
-    const { fileTransfers, transfer } = this.props
-    const index = findIndex(fileTransfers, t => t.id === transfer.id)
+    const { fileTransfers } = window.store
+    const { index } = this.props
     fileTransfers.splice(index, 1, ...insts)
-    window.store.setFileTransfers(fileTransfers)
   }
 
   remoteList = () => {
@@ -112,22 +100,26 @@ export default class TransportAction extends Component {
     } = transfer
     const cb = this[typeTo + 'List']
     const finishTime = Date.now()
+    if (next) {
+      setTimeout(() => {
+        window.store.fileTransfers.splice(
+          this.props.index, 0, copy(next)
+        )
+      }, 0)
+    }
     if (!config.disableTransferHistory) {
+      delete transfer.next
+      Object.assign(transfer, update, {
+        finishTime,
+        startTime: this.startTime,
+        size: transfer.fromFile.size,
+        next: null,
+        speed: format(transfer.fromFile.size, this?.startTime)
+      })
       window.store.addTransferHistory(
-        {
-          ...transfer,
-          ...update,
-          finishTime,
-          startTime: this.startTime,
-          size: transfer.fromFile.size,
-          next: null,
-          speed: format(transfer.fromFile.size, this?.startTime)
-        }
+        transfer
       )
     }
-    if (next) {
-      this.insert([copy(next)])
-    }
     this.cancel(cb)
   }
 
@@ -160,21 +152,11 @@ export default class TransportAction extends Component {
       return
     }
     this.onCancel = true
-    const {
-      transfer
-    } = this.props
-    let {
-      fileTransfers
-    } = this.props
-    const { id } = transfer
     this.transport && this.transport.destroy()
     this.transport = null
-    fileTransfers = fileTransfers.filter(t => {
-      return t.id !== id
-    })
-    this.timer = setTimeout(() => {
-      window.store.setFileTransfers(fileTransfers)
-    }, 100)
+    window.store.fileTransfers.splice(
+      this.props.index, 1
+    )
     if (isFunction(callback)) {
       callback()
     }
@@ -247,9 +229,9 @@ export default class TransportAction extends Component {
       originalId: transfer.id,
       id: generate()
     }
-    delete newTrans1.fromFile
     delete newTrans1.inited
     delete newTrans1.zip
+    delete newTrans1.fromFile
     const newTrans2 = copy(newTrans1)
     newTrans2.unzip = true
     newTrans2.id = generate()

package/client/components/sftp/transports-action-store.jsx

@@ -14,7 +14,7 @@ export default class TransportsActionStore extends Component {
 
   componentDidUpdate (prevProps) {
     if (
-      prevProps._fileTransfers !== this.props._fileTransfers
+      prevProps.fileTransferChanged !== this.props.fileTransferChanged
     ) {
       this.control()
     }
@@ -22,11 +22,11 @@ export default class TransportsActionStore extends Component {
 
   control = async () => {
     const { store } = window
-    let {
+    const {
       fileTransfers
-    } = this.props
+    } = store
 
-    fileTransfers = fileTransfers.map(t => {
+    fileTransfers.forEach(t => {
       const {
         typeTo,
         typeFrom,
@@ -37,7 +37,6 @@ export default class TransportsActionStore extends Component {
       if (typeTo === typeFrom && ready && !inited) {
         t.inited = true
       }
-      return t
     })
     // if (pauseAllTransfer) {
     //   return store.setFileTransfers(fileTransfers)
@@ -46,15 +45,16 @@ export default class TransportsActionStore extends Component {
       const {
         typeTo,
         typeFrom,
-        inited
+        inited,
+        pausing
       } = t
-      return typeTo !== typeFrom && inited
+      return typeTo !== typeFrom && inited && pausing !== true
     }).length
     if (count >= maxTransport) {
-      return store.setFileTransfers(fileTransfers)
+      return
     }
     const len = fileTransfers.length
-    const ids = []
+    // const ids = []
     for (let i = 0; i < len; i++) {
       const tr = fileTransfers[i]
       const {
@@ -62,13 +62,11 @@ export default class TransportsActionStore extends Component {
         typeFrom,
         inited,
         fromFile,
-        error,
-        id,
         action
       } = tr
-      if (!error) {
-        ids.push(id)
-      }
+      // if (!error) {
+      //   ids.push(id)
+      // }
       const isTransfer = typeTo !== typeFrom
       const ready = (
         action && fromFile
@@ -90,8 +88,10 @@ export default class TransportsActionStore extends Component {
         count++
         tr.inited = true
       }
+      if (count >= maxTransport) {
+        break
+      }
     }
-    store.setFileTransfers(fileTransfers)
   }
 
   render () {

package/client/components/sftp/transports-ui-store.jsx

@@ -11,13 +11,17 @@ export default function TransportsUI (props) {
   }
   return fileTransfers.map((t, i) => {
     const { id } = t
+    const trProps = {
+      transfer: t,
+      index: i,
+      inited: t.inited,
+      cancel: t.cancel,
+      pausing: t.pausing,
+      config: props.config
+    }
     return (
       <Transport
-        {...props}
-        transfer={t}
-        inited={t.inited}
-        cancel={t.cancel}
-        pause={t.pausing}
+        {...trProps}
         key={id + ':tr:' + i}
       />
     )

package/client/components/sidebar/bookmark-select.jsx

@@ -1,5 +1,5 @@
 /**
- * history select
+ * bookmark select
  */
 
 import { auto } from 'manate/react'

package/client/components/sidebar/bookmark.jsx

@@ -1,77 +1,18 @@
 /**
- * history select
+ * bookmark select
  */
 
-import { memo } from 'react'
 import BookmarkSelect from './bookmark-select'
-import { pick } from 'lodash-es'
-import { ArrowsAltOutlined, EditOutlined, PlusCircleOutlined, ShrinkOutlined, PushpinOutlined } from '@ant-design/icons'
-import { Tooltip } from 'antd'
 
-const e = window.translate
-
-export default memo(function BookmarkPanel (props) {
-  const { pinned } = props
-  const prps = {
-    className: 'font16 mg1x mg2l pointer iblock control-icon'
-  }
-  const prps1 = {
-    className: prps.className + (pinned ? ' pinned' : '')
-  }
+export default function BookmarkPanel (props) {
   const { store } = window
-  const pop1 = {
-    ...prps,
-    onClick: store.onNewSsh
-  }
-  const pop2 = {
-    ...prps,
-    onClick: store.expandBookmarks
-  }
-  const pop3 = {
-    ...prps,
-    onClick: store.collapseBookmarks
-  }
   return (
     <div
-      className='sidebar-panel bookmarks-panel animate-fast'
-      {...pick(props, ['onMouseEnter', 'onMouseLeave'])}
+      className='sidebar-panel-bookmarks'
     >
-      <div className='pd1y pd2t pd2x'>
-        <div className='fix'>
-          <div className='fleft'>{e('bookmarks')}</div>
-          <div className='fright'>
-            <Tooltip title={e('newBookmark')}>
-              <PlusCircleOutlined
-                {...pop1}
-              />
-            </Tooltip>
-            <Tooltip title={`${e('edit')} ${e('bookmarks')}`}>
-              <EditOutlined
-                {...pop1}
-              />
-            </Tooltip>
-            <Tooltip title={e('expandAll')}>
-              <ArrowsAltOutlined
-                {...pop2}
-              />
-            </Tooltip>
-            <Tooltip title={e('collapseAll')}>
-              <ShrinkOutlined
-                {...pop3}
-              />
-            </Tooltip>
-            <Tooltip title={e('pin')}>
-              <PushpinOutlined
-                {...prps1}
-                onClick={store.handlePin}
-              />
-            </Tooltip>
-          </div>
-        </div>
-      </div>
       <div className='pd2l sidebar-inner'>
         <BookmarkSelect store={store} from='sidebar' />
       </div>
     </div>
   )
-})
+}

package/client/components/sidebar/history-item.jsx

@@ -0,0 +1,34 @@
+import createTitle, { createTitleWithTag } from '../../common/create-title'
+import { DeleteOutlined } from '@ant-design/icons'
+
+export default function HistoryItem (props) {
+  const { store } = window
+  const {
+    item,
+    index
+  } = props
+  function handleClick () {
+    store.onSelectHistory(item.tab)
+  }
+  function handleDelete (e) {
+    e.stopPropagation()
+    store.history.splice(index, 1)
+  }
+  const title = createTitleWithTag(item.tab)
+  const tt = createTitle(item.tab)
+  return (
+    <div
+      className='item-list-unit'
+      title={tt}
+      onClick={handleClick}
+    >
+      <div className='elli pd1y pd2x'>
+        {title}
+      </div>
+      <DeleteOutlined
+        className='list-item-edit'
+        onClick={handleDelete}
+      />
+    </div>
+  )
+}