Merge pull request #1203 from wish-oss/fix/xterm

fix: terminal paste visibility

apps/dokploy/components/dashboard/settings/web-server/terminal.tsx

@@ -4,6 +4,7 @@ import { useEffect, useRef } from "react";
 import { FitAddon } from "xterm-addon-fit";
 import "@xterm/xterm/css/xterm.css";
 import { AttachAddon } from "@xterm/addon-attach";
+import { ClipboardAddon } from "@xterm/addon-clipboard";
 import { useTheme } from "next-themes";
 import { getLocalServerData } from "./local-server-config";
 
@@ -37,6 +38,7 @@ export const Terminal: React.FC<Props> = ({ id, serverId }) => {
 				foreground: "currentColor",
 			},
 		});
+
 		const addonFit = new FitAddon();
 
 		const protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
@@ -54,6 +56,8 @@ export const Terminal: React.FC<Props> = ({ id, serverId }) => {
 
 		const ws = new WebSocket(wsUrl);
 		const addonAttach = new AttachAddon(ws);
+		const clipboardAddon = new ClipboardAddon();
+		term.loadAddon(clipboardAddon);
 
 		// @ts-ignore
 		term.open(termRef.current);
@@ -68,7 +72,7 @@ export const Terminal: React.FC<Props> = ({ id, serverId }) => {
 
 	return (
 		<div className="flex flex-col gap-4">
-			<div className="w-full h-full bg-transparent border rounded-lg p-2 ">
+			<div className="w-full h-full bg-transparent border rounded-lg p-2">
 				<div id={id} ref={termRef} className="rounded-xl" />
 			</div>
 		</div>

apps/dokploy/package.json

@@ -75,6 +75,7 @@
 		"@uiw/react-codemirror": "^4.22.1",
 		"@xterm/addon-attach": "0.10.0",
 		"@xterm/xterm": "^5.4.0",
+		"@xterm/addon-clipboard": "0.1.0",
 		"adm-zip": "^0.5.14",
 		"bcrypt": "5.1.1",
 		"bullmq": "5.4.2",

apps/dokploy/styles/globals.css

@@ -4,6 +4,7 @@
 
 @layer base {
 	:root {
+		--terminal-paste: rgba(0, 0, 0, 0.2);
 		--background: 0 0% 100%;
 		--foreground: 240 10% 3.9%;
 
@@ -51,6 +52,7 @@
 	}
 
 	.dark {
+		--terminal-paste: rgba(255, 255, 255, 0.2);
 		--background: 0 0% 0%;
 		--foreground: 0 0% 98%;
 
@@ -235,3 +237,8 @@
 		background-color: hsl(var(--muted-foreground) / 0.5);
 	}
 }
+
+.xterm-bg-257.xterm-fg-257 {
+	background-color: var(--terminal-paste) !important;
+	color: currentColor !important;
+}

apps/dokploy/templates/spacedrive/index.ts

@@ -2,8 +2,8 @@ import {
 	type DomainSchema,
 	type Schema,
 	type Template,
-    generateRandomDomain,
 	generatePassword,
+	generateRandomDomain,
 } from "../utils";
 
 export function generate(schema: Schema): Template {
@@ -19,10 +19,7 @@ export function generate(schema: Schema): Template {
 		},
 	];
 
-    const envs = [
+	const envs = [`SD_USERNAME=${randomUsername}`, `SD_PASSWORD=${secretKey}`];
-        `SD_USERNAME=${randomUsername}`,
-        `SD_PASSWORD=${secretKey}`,
-    ];
 
 	return {
 		envs,

apps/dokploy/templates/templates.ts

@@ -538,7 +538,7 @@ export const templates: TemplateData[] = [
 			website: "https://filebrowser.org/",
 			docs: "https://filebrowser.org/",
 		},
-		tags: ["file-manager","storage"],
+		tags: ["file-manager", "storage"],
 		load: () => import("./filebrowser/index").then((m) => m.generate),
 	},
 	{
@@ -1369,6 +1369,7 @@ export const templates: TemplateData[] = [
 		},
 		logo: "spacedrive.png",
 		tags: ["file-manager", "vdfs", "storage"],
+		load: () => import("./spacedrive/index").then((m) => m.generate),
 	},
 	{
 		id: "alist",

pnpm-lock.yaml

@@ -217,6 +217,9 @@ importers:
       '@xterm/addon-attach':
         specifier: 0.10.0
         version: 0.10.0(@xterm/xterm@5.5.0)
+      '@xterm/addon-clipboard':
+        specifier: 0.1.0
+        version: 0.1.0(@xterm/xterm@5.5.0)
       '@xterm/xterm':
         specifier: ^5.4.0
         version: 5.5.0
@@ -3503,6 +3506,11 @@ packages:
     peerDependencies:
       '@xterm/xterm': ^5.0.0
 
+  '@xterm/addon-clipboard@0.1.0':
+    resolution: {integrity: sha512-zdoM7p53T5sv/HbRTyp4hY0kKmEQ3MZvAvEtiXqNIHc/JdpqwByCtsTaQF5DX2n4hYdXRPO4P/eOS0QEhX1nPw==}
+    peerDependencies:
+      '@xterm/xterm': ^5.4.0
+
   '@xterm/xterm@5.5.0':
     resolution: {integrity: sha512-hqJHYaQb5OptNunnyAnkHyM8aCjZ1MEIDTQu1iIbbTD/xops91NB5yq1ZK/dC2JDbVWtF23zUtl9JE2NqwT87A==}
 
@@ -5011,6 +5019,9 @@ packages:
     resolution: {integrity: sha512-34wB/Y7MW7bzjKRjUKTa46I2Z7eV62Rkhva+KkopW7Qvv/OSWBqvkSY7vusOPrNuZcUG3tApvdVgNB8POj3SPw==}
     engines: {node: '>=10'}
 
+  js-base64@3.7.7:
+    resolution: {integrity: sha512-7rCnleh0z2CkXhH67J8K1Ytz0b2Y+yxTPL+/KOJoa20hfnVQ/3/T6W/KflYI4bRHRagNeXeU2bkNGI3v1oS/lw==}
+
   js-beautify@1.15.1:
     resolution: {integrity: sha512-ESjNzSlt/sWE8sciZH8kBF8BPlwXPwhR6pWKAw8bw4Bwj+iZcnKW6ONWUutJ7eObuBZQpiIb8S7OYspWrKt7rA==}
     engines: {node: '>=14'}
@@ -9894,6 +9905,11 @@ snapshots:
     dependencies:
       '@xterm/xterm': 5.5.0
 
+  '@xterm/addon-clipboard@0.1.0(@xterm/xterm@5.5.0)':
+    dependencies:
+      '@xterm/xterm': 5.5.0
+      js-base64: 3.7.7
+
   '@xterm/xterm@5.5.0': {}
 
   '@xtuc/ieee754@1.2.0': {}
@@ -11410,6 +11426,8 @@ snapshots:
 
   joycon@3.1.1: {}
 
+  js-base64@3.7.7: {}
+
   js-beautify@1.15.1:
     dependencies:
       config-chain: 1.1.13