feat(manager): support rename fork alias

plugins/frontend/client/client/components/icons/index.ts

@@ -17,6 +17,7 @@ import Cog from './svg/cog.vue'
 import CommentsFull from './svg/comments-full.vue'
 import Database from './svg/database.vue'
 import Diagram from './svg/diagram.vue'
+import Edit from './svg/edit.vue'
 import ExclamationFull from './svg/exclamation-full.vue'
 import Expand from './svg/expand.vue'
 import External from './svg/external.vue'
@@ -77,6 +78,7 @@ register('cog', Cog)
 register('comments-full', CommentsFull)
 register('database', Database)
 register('diagram', Diagram)
+register('edit', Edit)
 register('exclamation-full', ExclamationFull)
 register('expand', Expand)
 register('external', External)

plugins/frontend/client/client/components/icons/svg/edit.vue

@@ -0,0 +1,5 @@
+<template>
+  <svg class="k-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+    <path fill="currentColor" d="M373.1 24.97C401.2-3.147 446.8-3.147 474.9 24.97L487 37.09C515.1 65.21 515.1 110.8 487 138.9L289.8 336.2C281.1 344.8 270.4 351.1 258.6 354.5L158.6 383.1C150.2 385.5 141.2 383.1 135 376.1C128.9 370.8 126.5 361.8 128.9 353.4L157.5 253.4C160.9 241.6 167.2 230.9 175.8 222.2L373.1 24.97zM440.1 58.91C431.6 49.54 416.4 49.54 407 58.91L377.9 88L424 134.1L453.1 104.1C462.5 95.6 462.5 80.4 453.1 71.03L440.1 58.91zM203.7 266.6L186.9 325.1L245.4 308.3C249.4 307.2 252.9 305.1 255.8 302.2L390.1 168L344 121.9L209.8 256.2C206.9 259.1 204.8 262.6 203.7 266.6zM200 64C213.3 64 224 74.75 224 88C224 101.3 213.3 112 200 112H88C65.91 112 48 129.9 48 152V424C48 446.1 65.91 464 88 464H360C382.1 464 400 446.1 400 424V312C400 298.7 410.7 288 424 288C437.3 288 448 298.7 448 312V424C448 472.6 408.6 512 360 512H88C39.4 512 0 472.6 0 424V152C0 103.4 39.4 64 88 64H200z"/>
+  </svg>
+</template>

plugins/frontend/manager/client/bots/index.vue

@@ -46,6 +46,7 @@ watch(() => store.bots, () => {
 section.page-bots {
   > aside {
     width: 20rem;
+    max-width: unset;
 
     .add {
       font-size: 1.15rem;

plugins/frontend/manager/client/settings/index.vue

@@ -3,13 +3,11 @@
     <template #aside>
       <tree-view v-model="path"></tree-view>
     </template>
-    <keep-alive>
-      <k-content class="plugin-view" :key="path">
-        <global-settings v-if="current.path === ':global'" :current="current"></global-settings>
-        <group-settings v-else-if="current.children" v-model="path" :current="current"></group-settings>
-        <plugin-settings v-else :current="current"></plugin-settings>
-      </k-content>
-    </keep-alive>
+    <k-content class="plugin-view" :key="path">
+      <global-settings v-if="current.path === ':global'" :current="current"></global-settings>
+      <group-settings v-else-if="current.children" v-model="path" :current="current"></group-settings>
+      <plugin-settings v-else :current="current"></plugin-settings>
+    </k-content>
   </k-card-aside>
 </template>
 

plugins/frontend/manager/client/settings/plugin.vue

@@ -11,8 +11,10 @@
       </el-select>
     </template>
     <template v-else>
-      {{ data.shortname }}
-      <span class="version">({{ data.workspace ? '工作区' : data.version }})</span>
+      <span class="label">{{ data.shortname }}</span>
+      <span class="alias">
+        @ <input v-model="alias" @blur="updateAlias">
+      </span>
     </template>
     <template v-if="!current.disabled">
       <k-button solid type="error" @click="execute('unload')">停用插件</k-button>
@@ -83,7 +85,7 @@
 import { send, store, clone, router } from '@koishijs/client'
 import { computed, ref, watch } from 'vue'
 import { getMixedMeta } from '../utils'
-import { envMap, Tree } from './utils'
+import { envMap, Tree, setPath } from './utils'
 import KDepLink from './dep-link.vue'
 
 const props = defineProps<{
@@ -96,6 +98,23 @@ watch(() => props.current.config, (value) => {
   config.value = clone(value)
 }, { immediate: true })
 
+const alias = ref()
+
+watch(() => props.current.alias, (value) => {
+  alias.value = value
+}, { immediate: true })
+
+function updateAlias() {
+  if (alias.value === props.current.alias) return
+  props.current.alias = alias.value
+  send('manager/alias', props.current.path, alias.value)
+  const oldPath = props.current.path
+  const segments = oldPath.split('/')
+  const oldKey = segments.pop()
+  segments.push(oldKey.split(':', 1)[0] + (alias.value ? ':' : '') + alias.value)
+  setPath(oldPath, segments.join('/'))
+}
+
 const name = computed(() => {
   const { label, target: temporary } = props.current
   const shortname = temporary || label
@@ -138,6 +157,20 @@ function execute(event: 'unload' | 'reload') {
       text-decoration: underline;
     }
   }
+
+  .config-header .alias {
+    font-size: 1.15rem;
+    color: var(--fg3);
+    user-select: none;
+
+    input {
+      font-size: inherit;
+      border: none;
+      outline: none;
+      color: var(--fg3);
+      padding: 0;
+    }
+  }
 }
 
 </style>

plugins/frontend/manager/client/settings/tree.vue

@@ -34,7 +34,7 @@
 
 import { ref, computed, onActivated, nextTick, watch } from 'vue'
 import { send } from '@koishijs/client'
-import { Tree, plugins } from './utils'
+import { Tree, plugins, setPath } from './utils'
 
 const props = defineProps<{
   modelValue: string
@@ -88,11 +88,7 @@ function handleDrop(source: Node, target: Node, position: 'before' | 'after' | '
   const segments1 = oldPath.split('/')
   const segments2 = ctxPath ? ctxPath.split('/') : []
   segments2.push(segments1.pop())
-  const newPath = source.data.path = segments2.join('/')
-  if (oldPath === newPath) return
-  plugins.value.paths[newPath] = plugins.value.paths[oldPath]
-  delete plugins.value.paths[oldPath]
-  emits('update:modelValue', newPath)
+  setPath(oldPath, segments2.join('/'))
 }
 
 function getClass(tree: Tree) {

plugins/frontend/manager/client/settings/utils.ts

@@ -2,7 +2,7 @@ import { Dict } from 'koishi'
 import { computed } from 'vue'
 import { PackageJson } from '@koishijs/market'
 import { MarketProvider } from '@koishijs/plugin-manager'
-import { store } from '@koishijs/client'
+import { router, store } from '@koishijs/client'
 import { getMixedMeta } from '../utils'
 import {} from '@koishijs/cli'
 
@@ -98,6 +98,7 @@ export const envMap = computed(() => {
 
 export interface Tree {
   id: string
+  alias?: string
   label: string
   path: string
   config?: any
@@ -121,7 +122,8 @@ function getTree(prefix: string, plugins: any): Tree[] {
       node.path = prefix + key
       node.children = getTree(node.path + '/', config)
     } else {
-      node.label = key.split(':')[0]
+      node.label = key.split(':', 1)[0]
+      node.alias = key.slice(node.label.length + 1)
       node.path = prefix + key
     }
     node.id = node.path
@@ -157,3 +159,12 @@ export const plugins = computed(() => {
   traverse(root)
   return { data: [root], paths, expanded }
 })
+
+export function setPath(oldPath: string, newPath: string) {
+  if (oldPath === newPath) return
+  const tree = plugins.value.paths[oldPath]
+  tree.path = newPath
+  plugins.value.paths[newPath] = tree
+  delete plugins.value.paths[oldPath]
+  router.replace('/plugins/' + newPath)
+}

plugins/frontend/manager/src/writer.ts

@@ -9,6 +9,7 @@ declare module '@koishijs/plugin-console' {
     'manager/reload'(path: string, config: any, key?: string): void
     'manager/unload'(path: string, config: any, key?: string): void
     'manager/group'(path: string): void
+    'manager/alias'(path: string, alias: string): void
     'manager/meta'(path: string, config: any): void
     'manager/bot-update'(id: string, adapter: string, config: any): void
     'manager/bot-remove'(id: string): void
@@ -55,7 +56,7 @@ class ConfigWriter extends DataService<App.Config> {
       this.reloadApp(config)
     }, { authority: 4 })
 
-    for (const key of ['teleport', 'reload', 'unload', 'group', 'meta'] as const) {
+    for (const key of ['teleport', 'reload', 'unload', 'group', 'meta', 'alias'] as const) {
       ctx.console.addListener(`manager/${key}`, this[key].bind(this), { authority: 4 })
     }
 
@@ -92,6 +93,22 @@ class ConfigWriter extends DataService<App.Config> {
     return [runtime, name] as const
   }
 
+  alias(path: string, alias: string) {
+    const [runtime, oldKey] = this.resolve(path)
+    const config = runtime.config[oldKey]
+    let newKey = oldKey.split(':', 1)[0] + (alias ? ':' : '') + alias
+    const record = runtime[Symbol.for('koishi.loader.record')]
+    const fork = record[oldKey]
+    if (fork) {
+      delete record[oldKey]
+      record[newKey] = fork
+    } else {
+      newKey = '~' + newKey
+    }
+    rename(runtime.config, oldKey, newKey, config)
+    this.loader.writeConfig()
+  }
+
   meta(path: string, config: any) {
     const [runtime, name] = this.resolve(path)
     const target = path ? runtime.config[name] : runtime.config
@@ -151,7 +168,7 @@ class ConfigWriter extends DataService<App.Config> {
     this.loader.writeConfig()
   }
 
-  locate(name: string, runtime: Plugin.Runtime) {
+  private locate(name: string, runtime: Plugin.Runtime) {
     for (const key in runtime.config) {
       const value = runtime.config[key]
       const fork = runtime[Symbol.for('koishi.loader.record')][key]