refactor(share): unify session share adapters in connectors-core

Use one SessionShareAdapter for Koko and Lion, drop the unused Koko share drawer, and copy Chen grid cells through the shared clipboard helper.

Author: ZhaoJiSen

packages/connectors-core/package.json

@@ -9,6 +9,7 @@
     "./types/fileTransfer": "./src/types/fileTransfer.ts",
     "./types/message": "./src/types/message.ts",
     "./types/session": "./src/types/session.ts",
+    "./types/sessionShare": "./src/types/sessionShare.ts",
     "./fileTransferRegistry": "./src/fileTransferRegistry.ts",
     "./useConnectorEndpoint": "./src/useConnectorEndpoint.ts",
     "./useHostBridge": "./src/useHostBridge.ts",

packages/connectors-core/src/index.ts

@@ -4,6 +4,7 @@ export * from "./types/component";
 export * from "./types/fileTransfer";
 export * from "./types/message";
 export * from "./types/session";
+export * from "./types/sessionShare";
 export * from "./useConnectorEndpoint";
 export * from "./useHostBridge";
 export * from "./utils/formatMessage";

packages/connectors-core/src/types/sessionShare.ts

@@ -0,0 +1,41 @@
+import type { Ref } from "vue";
+
+export interface SessionShareUser {
+  id: string;
+  name: string;
+  username: string;
+}
+
+export interface SessionShareOnlineUser {
+  user_id: string;
+  user: string;
+  primary: boolean;
+  writable: boolean;
+  remote_addr?: string;
+}
+
+export interface SessionShareInfo {
+  shareId: string;
+  shareCode: string;
+  sessionId: string;
+  enableShare: boolean;
+  shareURL: string;
+}
+
+export interface SessionShareLinkRequest {
+  expiredTime: number;
+  actionPerm: "writable" | "readonly";
+  users: SessionShareUser[];
+}
+
+export interface SessionShareAdapter {
+  onlineUsers: Readonly<Ref<SessionShareOnlineUser[]>>;
+  shareInfo: Readonly<Ref<SessionShareInfo>>;
+  userOptions: Readonly<Ref<SessionShareUser[]>>;
+  hasMoreUsers: Readonly<Ref<boolean>>;
+  searchUsers: (query: string, loadMore?: boolean) => void | Promise<void>;
+  createShareLink: (request: SessionShareLinkRequest) => void | Promise<void>;
+  copyShareURL: () => void | Promise<void>;
+  removeShareUser: (user: SessionShareOnlineUser) => void | Promise<void>;
+  resetShareState: () => void;
+}

ui/chen/components/DataGrid.client.vue

@@ -24,7 +24,6 @@ import type {
 import { AllCommunityModule, isColumn, ModuleRegistry } from "ag-grid-community";
 import { AgGridVue } from "ag-grid-vue3";
 import { formatChenGridValue, useChenGridPreferences } from "~/chen/composables/useChenGridPreferences";
-import { writeChenClipboardText } from "~/chen/runtime/clipboard";
 import {
   canUseChenCopy,
   createChenInsertSql,
@@ -50,6 +49,7 @@ import {
   isChenInsertRow,
   normalizeChenDataViewValue
 } from "~/chen/utils/dataViewEditing";
+import { writeClipboardText } from "~/utils/clipboard";
 
 import "ag-grid-community/styles/ag-grid.css";
 import "ag-grid-community/styles/ag-theme-balham.css";
@@ -285,7 +285,7 @@ function selectedData() {
 async function copyText(text: string, successTitle: string) {
   if (!canUseChenCopy(props.canCopy)) return;
   try {
-    await writeChenClipboardText(text);
+    await writeClipboardText(text);
     toast.add({ title: successTitle, color: "success" });
   } catch {
     addErrorToast({ title: t("Common.CopyFailed"), description: t("Chen.CopyOperationFailedDescription") });

ui/chen/runtime/clipboard.ts

@@ -111,7 +111,7 @@ function formatUptime(seconds: number) {
 
 const showShareSection = computed(() => {
   if (!isConnectedSession.value) return false;
-  if (lionSession.value) return Boolean(lionSession.value.share.sessionId.value);
+  if (lionSession.value) return Boolean(lionSession.value.share.shareInfo.value.sessionId);
   return Boolean(sessionDetails.value?.shareAllowed);
 });
 
@@ -133,7 +133,7 @@ const sessionRows = computed(() => {
       label: t("RightPanel.SessionId"),
       value:
         details?.sessionId ||
-        lionSession.value?.share.sessionId.value ||
+        lionSession.value?.share.shareInfo.value.sessionId ||
         (!lionSession.value ? kokoPane.value.sessionId : "") ||
         tokenId ||
         "-"
@@ -153,7 +153,8 @@ const statusLabel = computed(() => {
 const canShare = computed(() => {
   if (!showShareSection.value) return false;
   if (lionSession.value) {
-    return Boolean(lionSession.value.share.enableShare.value && lionSession.value.share.sessionId.value);
+    const shareInfo = lionSession.value.share.shareInfo.value;
+    return Boolean(shareInfo.enableShare && shareInfo.sessionId);
   }
   return Boolean(kokoPane.value.enableShare && kokoPane.value.sessionId);
 });

ui/components/RightPanel/sessionPanel.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { SuggestionUser } from "@/lion/api";
+import type { SessionShareAdapter, SessionShareUser } from "@jumpserver/connectors-core";
 import { useKokoSessionAdapter } from "#koko";
 import { getLionWorkspaceSession } from "@/lion/workspaces/useLionWorkspaceSessionRegistry";
 
@@ -14,22 +14,21 @@ const activeSessionId = computed(() => {
   return tab?.panes.find((pane) => pane.id === activePaneId.value)?.id || tab?.id || "";
 });
 const kokoAdapter = useKokoSessionAdapter(activeSessionId);
-const lionAdapter = computed(() => getLionWorkspaceSession(activeSessionId.value)?.share || null);
-const onlineUsers = computed(() => lionAdapter.value?.onlineUsers.value || kokoAdapter.onlineUsers.value);
-const shareInfo = computed(() => lionAdapter.value?.shareInfo.value || kokoAdapter.shareInfo.value);
-const userOptions = computed<SuggestionUser[]>(
-  () => (lionAdapter.value?.userOptions.value || kokoAdapter.userOptions.value) as SuggestionUser[]
+const adapter = computed<SessionShareAdapter>(
+  () => getLionWorkspaceSession(activeSessionId.value)?.share || kokoAdapter
 );
-const hasMoreUsers = computed(() => Boolean(lionAdapter.value?.hasMoreUsers.value));
-const adapterKey = computed(() => `${lionAdapter.value ? "lion" : "koko"}:${activeSessionId.value}`);
+const onlineUsers = computed(() => adapter.value.onlineUsers.value);
+const shareInfo = computed(() => adapter.value.shareInfo.value);
+const userOptions = computed(() => adapter.value.userOptions.value);
+const hasMoreUsers = computed(() => adapter.value.hasMoreUsers.value);
 
 const shareModalOpen = ref(false);
 const shareUserMenuOpen = ref(false);
 const searchLoading = ref(false);
 const showLinkResult = ref(false);
 const searchQuery = ref("");
 const selectedUserIds = ref<string[]>([]);
-const selectedUsers = ref<Record<string, SuggestionUser>>({});
+const selectedUsers = ref<Record<string, SessionShareUser>>({});
 
 const shareLinkRequest = reactive({
   expiredTime: 10,
@@ -100,7 +99,7 @@ watch(
   }
 );
 
-watch(adapterKey, () => {
+watch([activeSessionId, adapter], () => {
   shareModalOpen.value = false;
   shareUserMenuOpen.value = false;
   showLinkResult.value = Boolean(shareInfo.value.shareCode);
@@ -129,12 +128,7 @@ watch(selectedUserIds, (ids) => cacheSelectedUsers(ids));
 
 async function runSearch(query: string, loadMore = false) {
   searchLoading.value = true;
-  const lion = lionAdapter.value;
-  if (!lion) {
-    kokoAdapter.searchUsers(query);
-    return;
-  }
-  await lion.searchUsers(query, loadMore);
+  await adapter.value.searchUsers(query, loadMore);
   searchLoading.value = false;
 }
 
@@ -145,10 +139,10 @@ watch(searchQuery, (query) => {
   debouncedSearch(query);
 });
 
-const selectedShareUsers = computed<SuggestionUser[]>(() =>
+const selectedShareUsers = computed<SessionShareUser[]>(() =>
   selectedUserIds.value
     .map((id) => selectedUsers.value[id] || userOptions.value.find((item) => item.id === id))
-    .filter((item): item is SuggestionUser => Boolean(item))
+    .filter((item): item is SessionShareUser => Boolean(item))
 );
 
 function openShareModal() {
@@ -167,29 +161,25 @@ function handleCreateLink() {
     actionPerm: shareLinkRequest.actionPerm,
     users: selectedShareUsers.value
   };
-  if (lionAdapter.value) void lionAdapter.value.createShareLink(request);
-  else kokoAdapter.createShareLink(request);
+  void adapter.value.createShareLink(request);
 }
 
 function handleRemoveShareUser(userId: string) {
   const user = onlineUsers.value.find((item) => item.user_id === userId && !item.primary);
   if (!user) return;
-  if (lionAdapter.value) void lionAdapter.value.removeShareUser(user);
-  else kokoAdapter.removeShareUser(user as any);
+  void adapter.value.removeShareUser(user);
 }
 
 function handleBack() {
-  if (lionAdapter.value) lionAdapter.value.resetShareState();
-  else kokoAdapter.resetShareState();
+  adapter.value.resetShareState();
   showLinkResult.value = false;
   selectedUserIds.value = [];
   selectedUsers.value = {};
   searchQuery.value = "";
 }
 
 function handleCopyShareURL() {
-  if (lionAdapter.value) void lionAdapter.value.copyShareURL();
-  else kokoAdapter.copyShareURL();
+  void adapter.value.copyShareURL();
 }
 </script>
 

ui/components/RightPanel/sessionShareSection.vue

@@ -1,5 +1,6 @@
-import type { OnlineUser, ShareUserOptions } from "#koko/types/session";
+import type { SessionShareAdapter, SessionShareLinkRequest, SessionShareOnlineUser } from "@jumpserver/connectors-core";
 import type { MaybeRefOrGetter } from "vue";
+import type { ShareUserOptions } from "#koko/types/session";
 import { FORMATTER_MESSAGE_TYPE } from "@jumpserver/connectors-core";
 
 import { writeText } from "clipboard-polyfill";
@@ -12,7 +13,7 @@ import { useShareLink } from "~/composables/useShareLink";
  * right panel and the in-terminal drawer always act on the terminal they show,
  * never on the most recently connected one.
  */
-export function useKokoSessionAdapter(paneId: MaybeRefOrGetter<string>) {
+export function useKokoSessionAdapter(paneId: MaybeRefOrGetter<string>): SessionShareAdapter {
   const { t } = useI18n();
   const toast = useToast();
   const { addErrorToast } = useErrorToast();
@@ -22,6 +23,7 @@ export function useKokoSessionAdapter(paneId: MaybeRefOrGetter<string>) {
   const pane = computed(() => connectionStore.pane(toValue(paneId)));
 
   const onlineUsers = computed(() => pane.value.onlineUsers);
+  const hasMoreUsers = computed(() => false);
 
   const shareInfo = computed(() => {
     const { shareId, shareCode, sessionId, enableShare } = pane.value;
@@ -44,11 +46,7 @@ export function useKokoSessionAdapter(paneId: MaybeRefOrGetter<string>) {
     return true;
   };
 
-  const createShareLink = (shareLinkRequest: {
-    expiredTime: number;
-    actionPerm: string;
-    users: ShareUserOptions[];
-  }) => {
+  const createShareLink = (shareLinkRequest: SessionShareLinkRequest) => {
     const sessionId = pane.value.sessionId;
     const sent =
       Boolean(sessionId) &&
@@ -67,7 +65,7 @@ export function useKokoSessionAdapter(paneId: MaybeRefOrGetter<string>) {
     sendToPane(FORMATTER_MESSAGE_TYPE.TERMINAL_GET_SHARE_USER, { query });
   };
 
-  const removeShareUser = (user: OnlineUser) => {
+  const removeShareUser = (user: SessionShareOnlineUser) => {
     const sessionId = pane.value.sessionId;
     if (!sessionId) return;
 
@@ -91,6 +89,7 @@ export function useKokoSessionAdapter(paneId: MaybeRefOrGetter<string>) {
     shareInfo,
     onlineUsers,
     userOptions,
+    hasMoreUsers,
     searchUsers,
     copyShareURL,
     createShareLink,

ui/koko/components/Drawer/SessionShare/index.vue

@@ -2,7 +2,6 @@ import { describe, expect, it } from "vitest";
 import localShellSurface from "../../../workspaces/LocalShellSessionSurface.vue?raw";
 import drawerGeneral from "../../components/Drawer/General/index.vue?raw";
 import drawerComponent from "../../components/Drawer/index.vue?raw";
-import sessionShare from "../../components/Drawer/SessionShare/index.vue?raw";
 import searchInput from "../../components/SearchInput/index.vue?raw";
 import terminalComponent from "../../components/Terminal/index.vue?raw";
 import terminalProvider from "../../components/TerminalProvider/index.vue?raw";
@@ -75,12 +74,6 @@ describe("terminal UI composition", () => {
     expect(drawerGeneral).toContain("writeDataToTerminal");
   });
 
-  it("copies a share URL only when sharing is enabled", () => {
-    expect(sessionShare).toContain("copyShareURL");
-    expect(sessionShare).toContain(':disabled="!shareInfo.enableShare || !shareInfo.shareId"');
-    expect(sessionShare).toContain("onlineUsers");
-  });
-
   it("keeps SearchInput clicks void-typed and bound to the xterm search addon", () => {
     expect(searchInput).toContain("void props.searchAddon.findPrevious");
     expect(searchInput).toContain("void props.searchAddon.findNext");
@@ -91,6 +84,5 @@ describe("terminal UI composition", () => {
   it("voids the workspace shell retry emit for UButton", () => {
     expect(baseWorkspaceShell).toContain("@click=\"void $emit('retry')\"");
     expect(baseWorkspaceShell).toContain("i-lucide-circle-alert");
-    expect(baseWorkspaceShell).toContain("i-lucide-loader-circle");
   });
 });