@electerm/electerm-react 1.60.29 → 1.60.36

package/client/common/constants.js

@@ -265,6 +265,7 @@ export const proxyHelpLink = 'https://github.com/electerm/electerm/wiki/proxy-fo
 export const regexHelpLink = 'https://github.com/electerm/electerm/wiki/Terminal-keywords-highlight-regular-expression-exmaples'
 export const connectionHoppingWikiLink = 'https://github.com/electerm/electerm/wiki/Connection-Hopping-Behavior-Change-in-electerm-since-v1.50.65'
 export const aiConfigWikiLink = 'https://github.com/electerm/electerm/wiki/AI-model-config-guide'
+export const rdpWikiLink = 'https://github.com/electerm/electerm/wiki/RDP-session-known-issues'
 export const modals = {
   hide: 0,
   setting: 1,

package/client/components/bookmark-form/rdp-form-ui.jsx

@@ -7,12 +7,14 @@ import {
   Input,
   Form,
   InputNumber,
-  TreeSelect
+  TreeSelect,
+  Alert
 } from 'antd'
 import { formItemLayout } from '../../common/form-layout'
 import {
   newBookmarkIdPrefix,
-  terminalRdpType
+  terminalRdpType,
+  rdpWikiLink
 } from '../../common/constants'
 import useSubmit from './use-submit'
 import copy from 'json-deep-copy'
@@ -22,6 +24,7 @@ import { getRandomDefaultColor } from '../../common/rand-hex-color.js'
 import formatBookmarkGroups from './bookmark-group-tree-format'
 import findBookmarkGroupId from '../../common/find-bookmark-group-id'
 import ProfileItem from './profile-form-item'
+import Link from '../common/external-link'
 
 const FormItem = Form.Item
 const e = window.translate
@@ -63,8 +66,18 @@ export default function RdpFormUi (props) {
       bookmarkGroups = []
     } = props
     const tree = formatBookmarkGroups(bookmarkGroups)
+    const alertProps = {
+      message: (
+        <Link to={rdpWikiLink}>WIKI: {rdpWikiLink}</Link>
+      ),
+      type: 'warning',
+      className: 'mg2y'
+    }
     return (
       <div className='pd1x'>
+        <Alert
+          {...alertProps}
+        />
         <FormItem
           {...formItemLayout}
           label={e('title')}

package/client/components/bookmark-form/tree-delete.jsx

@@ -5,7 +5,6 @@ import {
 } from 'antd'
 import { defaultBookmarkGroupId, settingMap } from '../../common/constants'
 import deepCopy from 'json-deep-copy'
-import { action } from 'manate'
 
 const e = window.translate
 
@@ -24,10 +23,8 @@ export default class BookmarkTreeDelete extends StartSessionSelect {
       checkedKeys
     } = this.props
     const arr = checkedKeys.filter(d => d !== defaultBookmarkGroupId)
-    action(() => {
-      store.delItems(arr, settingMap.bookmarks)
-      store.delItems(arr, settingMap.bookmarkGroups)
-    })
+    store.delItems(arr, settingMap.bookmarks)
+    store.delItems(arr, settingMap.bookmarkGroups)
     store.checkedKeys = []
   }
 

package/client/components/common/component.jsx

@@ -0,0 +1,42 @@
+import React from 'react'
+import writeEmitter from 'manate/events/write-emitter'
+import { run } from 'manate/utils'
+
+export class Component extends React.Component {
+  constructor (props) {
+    super(props)
+    this.isTrigger = null
+    this.originalRender = this.render
+    this.render = this.autoRender
+
+    const originalDidMount = this.componentDidMount
+    this.componentDidMount = () => {
+      writeEmitter.on(this.handleWrite)
+      if (originalDidMount) {
+        originalDidMount.call(this)
+      }
+    }
+
+    const originalWillUnmount = this.componentWillUnmount
+    this.componentWillUnmount = () => {
+      writeEmitter.off(this.handleWrite)
+      if (originalWillUnmount) {
+        originalWillUnmount.call(this)
+      }
+    }
+  }
+
+  handleWrite = (writeLog) => {
+    if (this.isTrigger && this.isTrigger(writeLog)) {
+      this.forceUpdate()
+    }
+  }
+
+  autoRender = () => {
+    const [element, isTrigger] = run(() => {
+      return this.originalRender()
+    })
+    this.isTrigger = isTrigger
+    return element
+  }
+}

package/client/components/common/input-auto-focus.jsx

@@ -11,7 +11,7 @@ export default function InputAutoFocus (props) {
     if (inputRef.current) {
       const { value } = props
       if (value && selectall) {
-        inputRef.current.setSelectionRange(0, value.length)
+        inputRef.current.focus()
       } else {
         inputRef.current.focus()
       }

package/client/components/layout/layout.jsx

@@ -13,7 +13,6 @@ import Footer from '../footer/footer-entry'
 import SessionsWrap from '../session/sessions'
 import QuickCommandsFooterBox from '../quick-commands/quick-commands-box'
 import pixed from './pixed'
-import copy from 'json-deep-copy'
 import { pick } from 'lodash-es'
 import './layout.styl'
 
@@ -181,7 +180,7 @@ export default auto(function Layout (props) {
       'openedSideBar',
       'config'
     ]),
-    tabs: copy(store.tabs)
+    tabs: store.tabs
   }
   return [
     <Layouts {...layoutProps} key='layouts'>

package/client/components/layout/layouts.jsx

@@ -1,11 +1,10 @@
-import { memo } from 'react'
 import {
   splitConfig
 } from '../../common/constants'
 import LayoutItem from './layout-item'
 import pixed from './pixed'
 
-export default memo(function LayoutWrap (props) {
+export default function LayoutWrap (props) {
   const {
     children,
     layout,
@@ -61,4 +60,4 @@ export default memo(function LayoutWrap (props) {
       }
     </div>
   )
-})
+}

package/client/components/main/main.jsx

@@ -165,7 +165,7 @@ export default auto(function Index (props) {
       'commandLineHelp'
     ]),
     installSrc,
-    upgradeInfo
+    upgradeInfo: store.upgradeInfo
   }
   const conflictStoreProps = {
     fileTransferChanged: JSON.stringify(copiedTransfer),

package/client/components/session/session.jsx

@@ -1,7 +1,8 @@
 /**
  * terminal/sftp wrapper
  */
-import { Component, createRef } from 'react'
+import { createRef } from 'react'
+import { Component } from '../common/component'
 import Term from '../terminal/terminal.jsx'
 import Sftp from '../sftp/sftp-entry'
 import RdpSession from '../rdp/rdp-session'

package/client/components/session/sessions.jsx

@@ -1,4 +1,4 @@
-import { Component } from 'react'
+import { Component } from '../common/component'
 import Session from './session.jsx'
 
 import { pick } from 'lodash-es'

package/client/components/setting-panel/setting-modal.jsx

@@ -15,7 +15,6 @@ import TabQuickCommands from './tab-quick-commands'
 import TabSettings from './tab-settings'
 import TabThemes from './tab-themes'
 import TabProfiles from './tab-profiles'
-import deepCopy from 'json-deep-copy'
 
 const e = window.translate
 
@@ -39,8 +38,7 @@ export default auto(function SettingModalWrap (props) {
       shouldConfirmDel: tabsShouldConfirmDel.includes(settingTab),
       list: settingSidebarList
     }
-    const bookmarks = deepCopy(store.bookmarks)
-    const bookmarkGroups = deepCopy(store.bookmarkGroups)
+    const { bookmarks, bookmarkGroups } = store
     const formProps = {
       store,
       formData: settingItem,

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

@@ -11,7 +11,8 @@ export default auto(function BookmarkSelect (props) {
     listStyle,
     openedSideBar,
     leftSidebarWidth,
-    expandedKeys
+    expandedKeys,
+    bookmarks
   } = store
   if (from === 'sidebar' && openedSideBar !== 'bookmarks') {
     return null
@@ -23,7 +24,7 @@ export default auto(function BookmarkSelect (props) {
     store.onSelectBookmark(item.id)
   }
   const base = {
-    bookmarks: store.bookmarks || [],
+    bookmarks: bookmarks || [],
     type: 'bookmarks',
     onClickItem,
     listStyle,

package/client/components/sidebar/info-modal.jsx

@@ -1,4 +1,3 @@
-import { memo } from 'react'
 import {
   GithubOutlined,
   GlobalOutlined,
@@ -16,6 +15,7 @@ import { Modal, Tabs, Button } from 'antd'
 import Link from '../common/external-link'
 import LogoElem from '../common/logo-elem'
 import RunningTime from './app-running-time'
+import { auto } from 'manate/react'
 
 import {
   packInfo,
@@ -26,7 +26,7 @@ import './info.styl'
 
 const e = window.translate
 
-export default memo(function InfoModal (props) {
+export default auto(function InfoModal (props) {
   const handleChangeTab = key => {
     window.store.infoModalTab = key
   }

package/client/components/tabs/index.jsx

@@ -2,6 +2,7 @@
  * session tabs component
  */
 
+import { Component } from '../common/component'
 import React from 'react'
 import runIdle from '../../common/run-idle'
 import { throttle } from 'lodash-es'
@@ -43,7 +44,7 @@ import classNames from 'classnames'
 
 const e = window.translate
 
-export default class Tabs extends React.Component {
+export default class Tabs extends Component {
   constructor (props) {
     super(props)
     this.tabsRef = React.createRef()

package/client/components/tabs/tab.jsx

@@ -2,7 +2,8 @@
  * file section
  */
 
-import { Component, createRef } from 'react'
+import { createRef } from 'react'
+import { Component } from '../common/component'
 import { refs } from '../common/ref'
 import {
   CloseOutlined,

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

@@ -2,9 +2,8 @@ import {
   CaretDownOutlined,
   CaretRightOutlined
 } from '@ant-design/icons'
-import { memo } from 'react'
 
-export default memo(function TreeExpander (props) {
+export default function TreeExpander (props) {
   function onExpand () {
     props.onExpand(group)
   }
@@ -33,4 +32,4 @@ export default memo(function TreeExpander (props) {
       <Icon />
     </div>
   )
-})
+}

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

@@ -21,12 +21,11 @@ import {
 } from '../../common/constants'
 import highlight from '../common/highlight'
 import uid from '../../common/uid'
-import { memo } from 'react'
 import './tree-list.styl'
 
 const e = window.translate
 
-export default memo(function TreeListItem (props) {
+export default function TreeListItem (props) {
   const handleDel = (e) => {
     props.del(props.item, e)
   }
@@ -254,4 +253,4 @@ export default memo(function TreeListItem (props) {
       {renderEditBtn()}
     </div>
   )
-})
+}

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

@@ -2,7 +2,7 @@
  * tree list for bookmarks
  */
 
-import { Component } from 'react'
+import { Component } from '../common/component'
 import {
   CheckOutlined,
   CloseOutlined,
@@ -22,6 +22,7 @@ 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'
@@ -223,34 +224,37 @@ export default class ItemListTree extends Component {
       return
     }
     this.onSubmit = true
-    const id = this.state.parentId
+    this.parentId = this.state.parentId
     this.setState({
       showNewBookmarkGroupForm: false,
       parentId: ''
-    }, () => {
-      this.onSubmit = false
-      const { bookmarkGroups } = window.store
-      const newCat = {
-        id: uid(),
-        title: this.state.bookmarkGroupTitle,
-        level: 2,
-        bookmarkIds: []
-      }
-      bookmarkGroups.unshift(newCat)
-      const cat = find(
-        bookmarkGroups,
-        d => d.id === id
-      )
-      if (!cat) {
-        return
-      }
-      cat.bookmarkGroupIds = [
-        ...(cat.bookmarkGroupIds || []),
-        newCat.id
-      ]
-    })
+    }, this.afterSubmitSub)
   }
 
+  afterSubmitSub = action(() => {
+    const id = this.parentId
+    this.onSubmit = false
+    const { bookmarkGroups } = window.store
+    const newCat = {
+      id: uid(),
+      title: this.state.bookmarkGroupTitle,
+      level: 2,
+      bookmarkIds: []
+    }
+    bookmarkGroups.unshift(newCat)
+    const cat = find(
+      bookmarkGroups,
+      d => d.id === id
+    )
+    if (!cat) {
+      return
+    }
+    cat.bookmarkGroupIds = [
+      ...(cat.bookmarkGroupIds || []),
+      newCat.id
+    ]
+  })
+
   handleNewBookmarkGroup = () => {
     this.setState({
       showNewBookmarkGroupForm: true,
@@ -391,7 +395,7 @@ export default class ItemListTree extends Component {
     target.classList.add('item-dragover')
   }
 
-  onDrop = e => {
+  onDrop = action(e => {
     e.preventDefault()
     const elems = document.querySelectorAll('.tree-item.item-dragover')
     elems.forEach(elem => {
@@ -533,7 +537,7 @@ export default class ItemListTree extends Component {
         item.level = 2
       }
     }
-  }
+  })
 
   editCategory = () => {
     const {

package/client/store/bookmark-group.js

@@ -47,44 +47,63 @@ export default Store => {
 
   Store.prototype.delBookmarkGroup = action(function ({ id }) {
     const { store } = window
+
+    // Cannot delete default group
     if (id === defaultBookmarkGroupId) {
       return
     }
-    let { bookmarkGroups } = store
-    const tobeDel = find(bookmarkGroups, bg => bg.id === id)
-    if (!tobeDel) {
+
+    const { bookmarkGroups } = store
+    const index = bookmarkGroups.findIndex(bg => bg.id === id)
+
+    // If group not found, return
+    if (index === -1) {
       return
     }
-    const groups = [tobeDel]
-    if (
-      tobeDel.level !== 2 &&
-      tobeDel.bookmarkGroupIds &&
-      tobeDel.bookmarkGroupIds.length > 0
-    ) {
-      const childs = bookmarkGroups.filter(
-        bg => tobeDel.bookmarkGroupIds.includes(bg.id)
+
+    const tobeDel = bookmarkGroups[index]
+
+    // Find parent group
+    let parentGroup = null
+    if (tobeDel.level === 2) {
+      parentGroup = bookmarkGroups.find(bg =>
+        (bg.bookmarkGroupIds || []).includes(tobeDel.id)
       )
-      groups.push(...childs)
     }
-    const groupIds = groups.map(g => g.id)
-    const defaultCatIndex = tobeDel.level !== 2
-      ? bookmarkGroups.findIndex(
-        g => g.id === defaultBookmarkGroupId
-      )
-      : bookmarkGroups.findIndex(
-        g => (g.bookmarkGroupIds || []).includes(tobeDel.id)
-      )
-    for (const g of groups) {
-      if (g.bookmarkIds.length) {
-        const def = bookmarkGroups[defaultCatIndex]
-        def.bookmarkIds.push(...g.bookmarkIds)
-      }
+
+    // If no parent found, use default group
+    if (!parentGroup) {
+      parentGroup = bookmarkGroups.find(bg => bg.id === defaultBookmarkGroupId)
+    }
+
+    // Ensure parent group has bookmarkIds and bookmarkGroupIds arrays
+    if (!parentGroup.bookmarkIds) {
+      parentGroup.bookmarkIds = []
+    }
+    if (!parentGroup.bookmarkGroupIds) {
+      parentGroup.bookmarkGroupIds = []
+    }
+
+    // Transfer bookmarkIds to parent
+    if (tobeDel.bookmarkIds && tobeDel.bookmarkIds.length) {
+      parentGroup.bookmarkIds = [
+        ...new Set([...parentGroup.bookmarkIds, ...tobeDel.bookmarkIds])
+      ]
     }
-    bookmarkGroups = bookmarkGroups.filter(t => {
-      return !groupIds.includes(t.id)
-    })
+
+    // Transfer child groups to parent
+    if (tobeDel.bookmarkGroupIds && tobeDel.bookmarkGroupIds.length) {
+      parentGroup.bookmarkGroupIds = [
+        ...new Set([...parentGroup.bookmarkGroupIds, ...tobeDel.bookmarkGroupIds])
+      ]
+    }
+
+    // Remove the group from bookmarkGroups
+    bookmarkGroups.splice(index, 1)
+
+    // Reset current group if it was deleted
     if (id === store.currentBookmarkGroupId) {
-      store.currentBookmarkGroupId = ''
+      store.currentBookmarkGroupId = parentGroup.id
     }
   })
 

package/client/store/common.js

@@ -15,6 +15,7 @@ import {
 import * as ls from '../common/safe-local-storage'
 import { refs, refsStatic } from '../components/common/ref'
 import { action } from 'manate'
+import deepCopy from 'json-deep-copy'
 
 const e = window.translate
 const { assign } = Object
@@ -192,10 +193,11 @@ export default Store => {
     if (!profile || authType !== 'profiles') {
       return tab
     }
-    const p = window.store.profiles.find(x => x.id === profile)
+    let p = window.store.profiles.find(x => x.id === profile)
     if (!p) {
       return tab
     }
+    p = deepCopy(p)
     // delete tab.password
     // delete tab.privateKey
     // delete tab.passphrase
@@ -279,4 +281,26 @@ export default Store => {
   Store.prototype.getLangNames = function () {
     return window.et.langs.map(d => d.name)
   }
+
+  Store.prototype.fixProfiles = function () {
+    const { profiles } = window.store
+    const len = profiles.length
+    let i = len - 1
+    for (;i >= 0; i--) {
+      const f = profiles[i]
+      if (f.name) {
+        continue
+      }
+      let count = 0
+      let id = 'PROFILE' + i
+      while (profiles.find(d => d.id === id)) {
+        count = count + 1
+        id = 'PROFILE' + count
+      }
+      const np = deepCopy(f)
+      np.id = id
+      np.name = id
+      profiles[i] = np
+    }
+  }
 }

package/client/store/load-data.js

@@ -194,6 +194,7 @@ export default (Store) => {
     ext.lastDataUpdateTime = await getData('lastDataUpdateTime') || 0
     Object.assign(store, ext)
     await store.fixBookmarkGroups()
+    await store.fixProfiles()
 
     store.checkDefaultTheme()
     store.loadFontList()

package/package.json

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