@electerm/electerm-react 2.1.8 → 2.1.16

package/client/common/constants.js

@@ -107,6 +107,12 @@ export const settingMap = buildConst([
   'profiles'
 ])
 
+export const staticNewItemTabs = new Set([
+  'terminalThemes',
+  'quickCommands',
+  'profiles'
+])
+
 export const infoTabs = buildConst([
   'info',
   'deps',

package/client/common/init-setting-item.js

@@ -24,7 +24,7 @@ export default (arr, tab) => {
   } else if (tab === settingMap.quickCommands) {
     return {
       id: '',
-      name: encodeURIComponent(newQuickCommand)
+      name: e(newQuickCommand)
     }
   } else if (tab === settingMap.profiles) {
     return {

package/client/components/quick-commands/quick-commands-form-elem.jsx

@@ -138,13 +138,6 @@ export default function QuickCommandForm (props) {
   const wiki = 'https://github.com/electerm/electerm/wiki/quick-command-templates'
   return (
     <>
-      <p>
-        <b className='mg1r'>{e('templates')}:</b>
-        <span className='mg1r'>{templatesStr}</span>
-        <HelpIcon
-          link={wiki}
-        />
-      </p>
       <Form
         form={form}
         onFinish={handleSubmit}
@@ -210,6 +203,13 @@ export default function QuickCommandForm (props) {
             </Button>
           </p>
         </FormItem>
+        <p>
+          <b className='mg1r'>{e('templates')}:</b>
+          <span className='mg1r'>{templatesStr}</span>
+          <HelpIcon
+            link={wiki}
+          />
+        </p>
       </Form>
     </>
   )

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

@@ -9,7 +9,8 @@ import createName, { createTitleTag } from '../../common/create-title'
 import classnames from 'classnames'
 import { noop } from 'lodash-es'
 import highlight from '../common/highlight'
-import { settingSyncId, settingCommonId } from '../../common/constants'
+import { settingSyncId, settingCommonId, staticNewItemTabs } from '../../common/constants'
+import getInitItem from '../../common/init-setting-item'
 import './list.styl'
 
 const e = window.translate
@@ -95,6 +96,17 @@ export default class ItemList extends React.PureComponent {
     return icon
   }
 
+  renderNewItem () {
+    const { type } = this.props
+
+    if (!staticNewItemTabs.has(type)) {
+      return null
+    }
+
+    const newItem = getInitItem([], type)
+    return this.renderItem(newItem, -1)
+  }
+
   renderItem = (item, i) => {
     const { onClickItem, type, activeItemId } = this.props
     const { id } = item
@@ -175,6 +187,7 @@ export default class ItemList extends React.PureComponent {
         {this.renderLabels ? this.renderLabels() : null}
         {this.renderSearch()}
         <div className='item-list-wrap' style={listStyle}>
+          {this.renderNewItem()}
           {
             list.map(this.renderItem)
           }

package/client/components/sftp/paged-list.jsx

@@ -38,7 +38,7 @@ export default class ScrollFiles extends Component {
       pageSize: this.state.pageSize,
       total: this.props.list.length,
       showSizeChanger: false,
-      size: 'small',
+      simple: true,
       onChange: this.onChange
     }
     return (

package/client/components/shortcuts/shortcut-control.jsx

@@ -144,6 +144,14 @@ class ShortcutControl extends React.PureComponent {
     window.store.cloneToNextLayout()
   }, 500)
 
+  duplicateTabShortcut = throttle((e) => {
+    e.stopPropagation()
+    const { activeTabId } = window.store
+    if (activeTabId) {
+      window.store.duplicateTab(activeTabId)
+    }
+  }, 500)
+
   prevTabShortcut = throttle((e) => {
     e.stopPropagation()
     window.store.clickPrevTab()

package/client/components/shortcuts/shortcuts-defaults.js

@@ -21,6 +21,11 @@ export default () => {
       shortcut: 'ctrl+/',
       shortcutMac: 'meta+/'
     },
+    {
+      name: 'app_duplicateTab',
+      shortcut: 'alt+c',
+      shortcutMac: 'alt+c'
+    },
     {
       name: 'app_newBookmark',
       shortcut: 'ctrl+n',

package/client/components/tabs/tab.jsx

@@ -268,6 +268,7 @@ class Tab extends Component {
     const reloadShortcut = this.getShortcut('app_reloadCurrentTab')
     const closeShortcut = this.getShortcut('app_closeCurrentTab')
     const cloneToNextShortcut = this.getShortcut('app_cloneToNextLayout')
+    const duplicateShortcut = this.getShortcut('app_duplicateTab')
 
     const x = [
       {
@@ -294,7 +295,8 @@ class Tab extends Component {
       {
         key: 'handleDup',
         icon: <iconsMap.CopyOutlined />,
-        label: e('duplicate')
+        label: e('duplicate'),
+        extra: duplicateShortcut
       },
       {
         key: 'cloneToNextLayout',

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

@@ -7,7 +7,8 @@ import { LoadingOutlined, CheckCircleOutlined } from '@ant-design/icons'
 import { pick } from 'lodash-es'
 import { Pagination } from 'antd'
 import ThemeListItem from './theme-list-item'
-import { defaultTheme } from '../../common/constants'
+import { defaultTheme, settingMap } from '../../common/constants'
+import getInitItem from '../../common/init-setting-item'
 import './terminal-theme-list.styl'
 
 const e = window.translate
@@ -58,13 +59,33 @@ export default class ThemeList extends List {
     )
   }
 
+  renderNewItem () {
+    const newThemeItem = getInitItem([], settingMap.terminalThemes)
+    const itemProps = {
+      item: newThemeItem,
+      renderDelBtn: this.renderDelBtn,
+      activeItemId: this.props.activeItemId,
+      ...pick(
+        this.props,
+        [
+          'onClickItem',
+          'theme',
+          'keyword'
+        ]
+      )
+    }
+    return (
+      <ThemeListItem key='new-theme' {...itemProps} />
+    )
+  }
+
   filter = list => {
-    const { keyword, ready } = this.state
+    const { keyword } = this.state
     return keyword
-      ? list.slice(0, ready ? list.length : 2).filter(item => {
+      ? list.filter(item => {
         return item.name.toLowerCase().includes(keyword.toLowerCase())
       })
-      : list.slice(0, ready ? list.length : 2)
+      : list
   }
 
   paged = list => {
@@ -77,6 +98,13 @@ export default class ThemeList extends List {
 
   render () {
     const { ready, page, pageSize } = this.state
+    if (!ready) {
+      return (
+        <div className='pd3 aligncenter'>
+          <LoadingOutlined />
+        </div>
+      )
+    }
     let {
       list = [],
       type,
@@ -92,6 +120,7 @@ export default class ThemeList extends List {
         {this.renderSearch()}
         {this.renderCurrentTheme()}
         <div className='item-list-wrap' style={listStyle}>
+          {this.renderNewItem()}
           {
             list.map(this.renderItem)
           }
@@ -101,17 +130,10 @@ export default class ThemeList extends List {
           total={all}
           current={page}
           pageSize={pageSize}
+          showLessItems
+          simple
           onShowSizeChange={this.handlePageSizeChange}
         />
-        {
-          ready
-            ? null
-            : (
-              <div className='pd3 aligncenter'>
-                <LoadingOutlined />
-              </div>
-              )
-        }
       </div>
     )
   }

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

@@ -309,6 +309,10 @@ export default class ItemListTree extends Component {
       store.storeAssign({
         currentBookmarkGroupId: id
       })
+      const func = this.props.expandedKeys.includes(id)
+        ? this.onUnExpandKey
+        : this.onExpandKey
+      func({ id })
     } else {
       store.storeAssign({
         currentBookmarkGroupId: findBookmarkGroupId(store.bookmarkGroups, id)

package/client/store/store.js

@@ -32,7 +32,8 @@ import getBrand from '../components/ai/get-brand'
 import {
   settingMap,
   terminalSshConfigType,
-  paneMap
+  paneMap,
+  staticNewItemTabs
 } from '../common/constants'
 import getInitItem from '../common/init-setting-item'
 import createTitle from '../common/create-title'
@@ -149,10 +150,12 @@ class Store {
     const initItem = getInitItem(arr, settingTab)
     return settingTab === settingMap.history
       ? arr
-      : [
-          deepCopy(initItem),
-          ...arr
-        ]
+      : staticNewItemTabs.has(settingTab)
+        ? arr // Don't add initItem for these tabs, they will be handled separately
+        : [
+            deepCopy(initItem),
+            ...arr
+          ]
   }
 
   get terminalCommandSuggestions () {

package/package.json

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