feat: add cloudflared custom path config to dashboard settings UI #47

Author: suhaibbinyounis

package.json

@@ -299,6 +299,11 @@
           "type": "boolean",
           "default": true,
           "description": "Enable or disable MCP support globally."
+        },
+        "githubCopilotApi.tunnel.cloudflaredPath": {
+          "type": "string",
+          "default": "",
+          "description": "Optional custom path to the cloudflared executable. If empty, the extension will attempt to use cloudflared from your system PATH, or download it automatically."
         }
       }
     }

src/CopilotApiGateway.ts

@@ -73,6 +73,7 @@ export interface ApiServerConfig {
 	maxPayloadSizeMb: number
 	maxConnectionsPerIp: number
 	mcpEnabled: boolean
+	cloudflaredPath: string
 }
 
 // Request history entry
@@ -951,6 +952,10 @@ export class CopilotApiGateway implements vscode.Disposable {
 		await this.updateServerConfig({ maxConnectionsPerIp: normalized });
 	}
 
+	public async setCloudflaredPath(path: string): Promise<void> {
+		await this.updateServerConfig({ cloudflaredPath: path });
+	}
+
 	public async setMaxConcurrency(limit: number): Promise<void> {
 		const normalized = Number.isFinite(limit) ? Math.max(1, Math.floor(limit)) : 4;
 		await this.updateServerConfig({ maxConcurrentRequests: normalized });
@@ -1005,25 +1010,52 @@ export class CopilotApiGateway implements vscode.Disposable {
 				fs.mkdirSync(globalStoragePath, { recursive: true });
 			}
 
-			const cloudflaredBin = path.join(
-				globalStoragePath,
-				process.platform === 'win32' ? 'cloudflared.exe' : 'cloudflared'
-			);
+			let cloudflaredBin = '';
+			const customPath = this.config.cloudflaredPath;
 
-			// Download the binary if it doesn't exist
-			if (!fs.existsSync(cloudflaredBin)) {
-				this.logInfo('Cloudflared binary not found, downloading...');
+			// 1. Check custom configured path
+			if (customPath && fs.existsSync(customPath)) {
+				this.logInfo(`Using custom cloudflared path from configuration: ${customPath}`);
+				cloudflaredBin = customPath;
+			}
+			// 2. Check system PATH
+			else {
+				const { execSync } = await import('child_process');
 				try {
-					await install(cloudflaredBin);
-					this.logInfo('Cloudflared binary downloaded successfully');
-				} catch (downloadError) {
-					const errMsg = downloadError instanceof Error ? downloadError.message : String(downloadError);
-					this.logError('Failed to download cloudflared binary', downloadError);
-					return { success: false, error: `Failed to download cloudflared: ${errMsg}. Check your internet connection.` };
+					const sysPath = execSync(process.platform === 'win32' ? 'where cloudflared' : 'which cloudflared').toString().split('\n')[0].trim();
+					if (sysPath && fs.existsSync(sysPath)) {
+						this.logInfo(`Found cloudflared in system PATH: ${sysPath}`);
+						cloudflaredBin = sysPath;
+					}
+				} catch (e) {
+					// cloudflared not in PATH
+				}
+			}
+
+			// 3. Fallback to downloading or using cached binary
+			if (!cloudflaredBin) {
+				cloudflaredBin = path.join(
+					globalStoragePath,
+					process.platform === 'win32' ? 'cloudflared.exe' : 'cloudflared'
+				);
+
+				if (!fs.existsSync(cloudflaredBin)) {
+					this.logInfo('Cloudflared binary not found locally or in PATH, downloading...');
+					try {
+						await install(cloudflaredBin);
+						this.logInfo('Cloudflared binary downloaded successfully');
+					} catch (downloadError) {
+						const errMsg = downloadError instanceof Error ? downloadError.message : String(downloadError);
+						this.logError('Failed to download cloudflared binary', downloadError);
+						return { success: false, error: `Failed to download cloudflared: ${errMsg}. Check your internet connection.` };
+					}
+				} else {
+					this.logInfo(`Using cached cloudflared binary: ${cloudflaredBin}`);
 				}
+			} else {
+				this.logInfo(`Using chosen cloudflared binary: ${cloudflaredBin}`);
 			}
 
-			this.logInfo(`Using cloudflared binary: ${cloudflaredBin}`);
 			use(cloudflaredBin);
 
 			const localUrl = `http://${this.config.host === '0.0.0.0' ? '127.0.0.1' : this.config.host}:${this.config.port}`;
@@ -5404,6 +5436,9 @@ export class CopilotApiGateway implements vscode.Disposable {
 		if (patch.maxConnectionsPerIp !== undefined) {
 			updates.push(Promise.resolve(config.update('server.maxConnectionsPerIp', patch.maxConnectionsPerIp, vscode.ConfigurationTarget.Global)));
 		}
+		if (patch.cloudflaredPath !== undefined) {
+			updates.push(Promise.resolve(config.update('tunnel.cloudflaredPath', patch.cloudflaredPath, vscode.ConfigurationTarget.Global)));
+		}
 		if (patch.redactionPatterns !== undefined) {
 			updates.push(Promise.resolve(config.update('server.redactionPatterns', patch.redactionPatterns, vscode.ConfigurationTarget.Global)));
 		}
@@ -5633,12 +5668,13 @@ function getServerConfig(): ApiServerConfig {
 	const maxPayloadSizeMb = configuration.get<number>('server.maxPayloadSizeMb', 1);
 	const maxConnectionsPerIp = configuration.get<number>('server.maxConnectionsPerIp', 10);
 	const mcpEnabled = vscode.workspace.getConfiguration('githubCopilotApi.mcp').get<boolean>('enabled', true);
+	const cloudflaredPath = vscode.workspace.getConfiguration('githubCopilotApi.tunnel').get<string>('cloudflaredPath', '').trim();
 
 	return {
 		enabled, enableHttp, enableWebSocket, enableHttps, tlsCertPath, tlsKeyPath, host, port, maxConcurrentRequests,
 		defaultModel, apiKey, enableLogging, rateLimitPerMinute, defaultSystemPrompt,
 		redactionPatterns, ipAllowlist, requestTimeoutSeconds, maxPayloadSizeMb, maxConnectionsPerIp,
-		mcpEnabled
+		mcpEnabled, cloudflaredPath
 	};
 }
 

src/CopilotPanel.ts

@@ -718,6 +718,15 @@ for await (const chunk of stream) {
                     });
                 }
                 break;
+            case 'setCloudflaredPath':
+                if (typeof data.value === 'string') {
+                    void gateway.setCloudflaredPath(data.value).then(async () => {
+                        if (CopilotPanel.currentPanel) {
+                            CopilotPanel.currentPanel.webview.html = await CopilotPanel.getPanelHtml(CopilotPanel.currentPanel.webview, gateway);
+                        }
+                    });
+                }
+                break;
             case 'setMaxConcurrency':
                 if (typeof data.value === 'number') {
                     void gateway.setMaxConcurrency(data.value).then(async () => {
@@ -2103,6 +2112,14 @@ print(response.choices[0].message.content)\`;
                 </ul>
             </div>
 
+            <div style="margin-bottom: 16px; border-top: 1px solid var(--vscode-widget-border); padding-top: 16px;">
+                <div style="font-size: 11px; font-weight: 600; margin-bottom: 8px; opacity: 0.8;">CLOUDFLARED BINARY PATH (OPTIONAL)</div>
+                <div style="display: flex; gap: 8px; align-items: center; flex-wrap: wrap;">
+                    <input type="text" id="cloudflared-path-input" value="${config.cloudflaredPath || ''}" placeholder="Leave empty for auto-download or PATH" style="flex: 1; min-width: 200px;">
+                    <button class="secondary" id="btn-set-cloudflared-path" style="width: auto; padding: 4px 12px; font-size: 11px;">Save Path</button>
+                </div>
+            </div>
+
             <div id="tunnel-status-area" style="margin-bottom: 16px;">
                 ${status.tunnel?.running ? (status.tunnel?.url ? `
                     <div style="background: color-mix(in srgb, var(--vscode-testing-iconPassed) 15%, transparent); border: 1px solid var(--vscode-testing-iconPassed); border-radius: 8px; padding: 16px;">
@@ -2755,6 +2772,14 @@ print(response.choices[0].message.content)\`;
                 vscode.postMessage({ type: 'setMaxConnectionsPerIp', value: Number(val) });
             };
         }
+
+        const btnSetCloudflaredPath = document.getElementById('btn-set-cloudflared-path');
+        if (btnSetCloudflaredPath) {
+            btnSetCloudflaredPath.onclick = function() {
+                var val = document.getElementById('cloudflared-path-input').value;
+                vscode.postMessage({ type: 'setCloudflaredPath', value: String(val).trim() });
+            };
+        }
         document.getElementById('btn-set-concurrency').onclick = function() {
             var val = document.getElementById('concurrency-input').value;
             vscode.postMessage({ type: 'setMaxConcurrency', value: Number(val) });