Implement remote SSH feature

.github/workflows/native-dependencies.yml

@@ -0,0 +1,49 @@
+name: Package Native Dependencies
+
+on: workflow_dispatch
+
+jobs:
+  build:
+    runs-on: ${{ matrix.os }}
+    strategy:
+      matrix:
+        os: ['ubuntu-latest', 'windows-latest', 'macos-latest']
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Use Node.js 16.14.0
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16.14.0'
+          registry-url: 'https://registry.npmjs.org'
+
+      - name: Use Python 3.x
+        uses: actions/setup-python@v4
+        with:
+          python-version: '3.x'
+
+      - name: Install and Build
+        shell: bash
+        run: |
+          yarn --skip-integrity-check --network-timeout 100000
+        env:
+          NODE_OPTIONS: --max_old_space_size=4096
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} # https://github.com/microsoft/vscode-ripgrep/issues/9
+
+      - name: Build Browser App
+        shell: bash
+        run: |
+          yarn browser build
+        env:
+          NODE_OPTIONS: --max_old_space_size=4096
+
+      - name: Zip Native Dependencies
+        shell: bash
+        run: yarn zip:native:dependencies
+
+      - name: Upload Artifacts
+        uses: actions/upload-artifact@v3 
+        with: 
+          name: native-dependencies
+          path: ./scripts/native-dependencies-*.zip

.gitignore

@@ -36,3 +36,4 @@ dependency-check-summary.txt*
 .tours
 /performance-result.json
 *.vsix
+/scripts/native-dependencies-*

examples/browser/package.json

@@ -44,6 +44,7 @@
     "@theia/preview": "1.38.0",
     "@theia/process": "1.38.0",
     "@theia/property-view": "1.38.0",
+    "@theia/remote": "1.38.0",
     "@theia/scm": "1.38.0",
     "@theia/scm-extra": "1.38.0",
     "@theia/search-in-workspace": "1.38.0",

examples/browser/tsconfig.json

@@ -95,6 +95,9 @@
     {
       "path": "../../packages/property-view"
     },
+    {
+      "path": "../../packages/remote"
+    },
     {
       "path": "../../packages/scm"
     },

examples/electron/package.json

@@ -45,6 +45,7 @@
     "@theia/preview": "1.38.0",
     "@theia/process": "1.38.0",
     "@theia/property-view": "1.38.0",
+    "@theia/remote": "1.38.0",
     "@theia/scm": "1.38.0",
     "@theia/scm-extra": "1.38.0",
     "@theia/search-in-workspace": "1.38.0",

examples/electron/tsconfig.json

@@ -98,6 +98,9 @@
     {
       "path": "../../packages/property-view"
     },
+    {
+      "path": "../../packages/remote"
+    },
     {
       "path": "../../packages/scm"
     },

package.json

@@ -22,6 +22,7 @@
     "@typescript-eslint/eslint-plugin-tslint": "^4.8.1",
     "@typescript-eslint/parser": "^4.8.1",
     "@vscode/vsce": "^2.15.0",
+    "archiver": "^5.3.1",
     "chai": "4.3.4",
     "chai-spies": "1.0.0",
     "chai-string": "^1.4.0",
@@ -90,7 +91,8 @@
     "watch:compile": "concurrently --kill-others -n cleanup,tsc -c magenta,red \"ts-clean dev-packages/* packages/* -w\" \"tsc -b -w --preserveWatchOutput\"",
     "performance:startup": "yarn -s performance:startup:browser && yarn -s performance:startup:electron",
     "performance:startup:browser": "concurrently --success first -k -r \"cd scripts/performance && node browser-performance.js --name 'Browser Frontend Startup' --folder browser --runs 10\" \"yarn -s --cwd examples/browser start\"",
-    "performance:startup:electron": "yarn -s electron rebuild && cd scripts/performance && node electron-performance.js --name 'Electron Frontend Startup' --folder electron --runs 10"
+    "performance:startup:electron": "yarn -s electron rebuild && cd scripts/performance && node electron-performance.js --name 'Electron Frontend Startup' --folder electron --runs 10",
+    "zip:native:dependencies": "node ./scripts/zip-native-dependencies.js"
   },
   "workspaces": [
     "dev-packages/*",

packages/core/package.json

@@ -23,6 +23,7 @@
     "@types/dompurify": "^2.2.2",
     "@types/express": "^4.16.0",
     "@types/fs-extra": "^4.0.2",
+    "@types/glob": "^8.1.0",
     "@types/lodash.debounce": "4.0.3",
     "@types/lodash.throttle": "^4.1.3",
     "@types/markdown-it": "^12.2.3",
@@ -46,6 +47,7 @@
     "font-awesome": "^4.7.0",
     "fs-extra": "^4.0.2",
     "fuzzy": "^0.1.3",
+    "glob": "^8.1.0",
     "http-proxy-agent": "^5.0.0",
     "https-proxy-agent": "^5.0.0",
     "iconv-lite": "^0.6.0",
@@ -165,6 +167,9 @@
     {
       "backend": "lib/node/request/backend-request-module",
       "backendElectron": "lib/electron-node/request/electron-backend-request-module"
+    },
+    {
+      "backend": "lib/node/remote/backend-remote-module"
     }
   ],
   "keywords": [

packages/core/src/browser/common-frontend-contribution.ts

@@ -2202,6 +2202,24 @@ export class CommonFrontendContribution implements FrontendApplicationContributi
                     hcLight: Color.lighten('statusBar.offlineBackground', 0.6)
                 }, description: 'Background of active statusbar item in case the theia server is offline.'
             },
+            {
+                id: 'statusBarItem.remoteBackground',
+                defaults: {
+                    dark: 'activityBarBadge.background',
+                    light: 'activityBarBadge.background',
+                    hcDark: 'activityBarBadge.background',
+                    hcLight: 'activityBarBadge.background'
+                }, description: 'Background color for the remote indicator on the status bar.'
+            },
+            {
+                id: 'statusBarItem.remoteForeground',
+                defaults: {
+                    dark: 'activityBarBadge.foreground',
+                    light: 'activityBarBadge.foreground',
+                    hcDark: 'activityBarBadge.foreground',
+                    hcLight: 'activityBarBadge.foreground'
+                }, description: 'Foreground color for the remote indicator on the status bar.'
+            },
             // Buttons
             {
                 id: 'secondaryButton.foreground',

packages/core/src/browser/cookies.ts

@@ -0,0 +1,30 @@
+// *****************************************************************************
+// Copyright (C) 2023 TypeFox and others.
+//
+// This program and the accompanying materials are made available under the
+// terms of the Eclipse Public License v. 2.0 which is available at
+// http://www.eclipse.org/legal/epl-2.0.
+//
+// This Source Code may also be made available under the following Secondary
+// Licenses when the conditions for such availability set forth in the Eclipse
+// Public License v. 2.0 are satisfied: GNU General Public License, version 2
+// with the GNU Classpath Exception which is available at
+// https://www.gnu.org/software/classpath/license.html.
+//
+// SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
+// *****************************************************************************
+
+import { injectable } from 'inversify';
+
+@injectable()
+export class CookieService {
+
+    set(name: string, value: string): void {
+        document.cookie = `${name}=${value}`;
+    }
+
+    remove(name: string): void {
+        document.cookie = `${name}=;expires=Thu, 01 Jan 1970 00:00:01 GMT`;
+    }
+
+}

packages/core/src/browser/frontend-application-module.ts

@@ -136,6 +136,8 @@ import { MarkdownRenderer, MarkdownRendererFactory, MarkdownRendererImpl } from
 import { StylingParticipant, StylingService } from './styling-service';
 import { bindCommonStylingParticipants } from './common-styling-participants';
 import { HoverService } from './hover-service';
+import { CookieService } from './cookies';
+import { NullRemoteService, RemoteService } from './remote-service';
 
 export { bindResourceProvider, bindMessageService, bindPreferenceService };
 
@@ -441,5 +443,10 @@ export const frontendApplicationModule = new ContainerModule((bind, _unbind, _is
     bindContributionProvider(bind, StylingParticipant);
     bind(FrontendApplicationContribution).toService(StylingService);
 
+    bind(CookieService).toSelf().inSingletonScope();
+
+    bind(NullRemoteService).toSelf().inSingletonScope();
+    bind(RemoteService).toService(NullRemoteService);
+
     bind(SecondaryWindowHandler).toSelf().inSingletonScope();
 });

packages/core/src/browser/index.ts

@@ -44,3 +44,5 @@ export * from './tooltip-service';
 export * from './decoration-style';
 export * from './styling-service';
 export * from './hover-service';
+export * from './cookies';
+export * from './remote-service';

packages/core/src/browser/messaging/ws-connection-provider.ts

@@ -14,7 +14,7 @@
 // SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
 // *****************************************************************************
 
-import { injectable, interfaces, decorate, unmanaged } from 'inversify';
+import { injectable, interfaces, decorate, unmanaged, postConstruct } from 'inversify';
 import { JsonRpcProxyFactory, JsonRpcProxy, Emitter, Event, Channel } from '../../common';
 import { Endpoint } from '../endpoint';
 import { AbstractConnectionProvider } from '../../common/messaging/abstract-connection-provider';
@@ -48,23 +48,15 @@ export class WebSocketConnectionProvider extends AbstractConnectionProvider<WebS
         return container.get(WebSocketConnectionProvider).createProxy<T>(path, arg);
     }
 
-    protected readonly socket: Socket;
+    protected socket: Socket;
 
     constructor() {
         super();
-        const url = this.createWebSocketUrl(WebSocketChannel.wsPath);
-        this.socket = this.createWebSocket(url);
-        this.socket.on('connect', () => {
-            this.initializeMultiplexer();
-            if (this.reconnectChannelOpeners.length > 0) {
-                this.reconnectChannelOpeners.forEach(opener => opener());
-                this.reconnectChannelOpeners = [];
-            }
-            this.socket.on('disconnect', () => this.fireSocketDidClose());
-            this.socket.on('message', () => this.onIncomingMessageActivityEmitter.fire(undefined));
-            this.fireSocketDidOpen();
-        });
-        this.socket.connect();
+    }
+
+    @postConstruct()
+    protected init(): void {
+        this.connect();
     }
 
     protected createMainChannel(): Channel {
@@ -111,6 +103,22 @@ export class WebSocketConnectionProvider extends AbstractConnectionProvider<WebS
         return new Endpoint({ path }).getRestUrl().toString();
     }
 
+    protected connect(path: string = WebSocketChannel.wsPath): void {
+        const url = this.createWebSocketUrl(path);
+        this.socket = this.createWebSocket(url);
+        this.socket.on('connect', () => {
+            this.initializeMultiplexer();
+            if (this.reconnectChannelOpeners.length > 0) {
+                this.reconnectChannelOpeners.forEach(opener => opener());
+                this.reconnectChannelOpeners = [];
+            }
+            this.socket.on('disconnect', () => this.fireSocketDidClose());
+            this.socket.on('message', () => this.onIncomingMessageActivityEmitter.fire(undefined));
+            this.fireSocketDidOpen();
+        });
+        this.socket.connect();
+    }
+
     /**
      * Creates a web socket for the given url
      */

packages/core/src/browser/preloader.ts

@@ -70,6 +70,6 @@ export async function preload(): Promise<void> {
     await Promise.allSettled([
         loadTranslations(),
         loadBackendOS(),
-        initBackground(),
+        initBackground()
     ]);
 }

packages/core/src/browser/remote-service.ts

@@ -0,0 +1,30 @@
+// *****************************************************************************
+// Copyright (C) 2023 TypeFox and others.
+//
+// This program and the accompanying materials are made available under the
+// terms of the Eclipse Public License v. 2.0 which is available at
+// http://www.eclipse.org/legal/epl-2.0.
+//
+// This Source Code may also be made available under the following Secondary
+// Licenses when the conditions for such availability set forth in the Eclipse
+// Public License v. 2.0 are satisfied: GNU General Public License, version 2
+// with the GNU Classpath Exception which is available at
+// https://www.gnu.org/software/classpath/license.html.
+//
+// SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
+// *****************************************************************************
+
+import { injectable } from 'inversify';
+
+export const RemoteService = Symbol('RemoteService');
+
+export interface RemoteService {
+    isConnected(): boolean;
+}
+
+@injectable()
+export class NullRemoteService implements RemoteService {
+    isConnected(): boolean {
+        return false;
+    }
+}

packages/core/src/browser/status-bar/status-bar.tsx

@@ -151,6 +151,9 @@ export class StatusBarImpl extends ReactWidget implements StatusBar {
         } else {
             attrs['aria-label'] = [entry.text, entry.tooltip].join(', ');
         }
+        if (entry.backgroundColor) {
+            attrs.className += ' has-background';
+        }
 
         attrs.style = {
             color: entry.color || this.color,
@@ -178,8 +181,9 @@ export class StatusBarImpl extends ReactWidget implements StatusBar {
                 children.push(<span key={key}>{val}</span>);
             }
         });
-        const elementInnerDiv = <React.Fragment>{children}</React.Fragment>;
-        return React.createElement('div', { key: entry.id, ...this.createAttributes(entry) }, elementInnerDiv);
+        return <div key={entry.id} {...this.createAttributes(entry)}>
+            {children}
+        </div>;
     }
 
 }

packages/core/src/browser/style/status-bar.css

@@ -30,7 +30,7 @@ body.theia-no-open-workspace #theia-statusBar {
   background: var(--theia-statusBar-noFolderBackground);
   color: var(--theia-statusBar-noFolderForeground);
   border-top: var(--theia-border-width) solid
-    var(--theia-statusBar-noFolderBorder);
+  var(--theia-statusBar-noFolderBorder);
 }
 
 #theia-statusBar .area {
@@ -41,7 +41,6 @@ body.theia-no-open-workspace #theia-statusBar {
 
 #theia-statusBar .area.left {
   justify-content: flex-start;
-  padding-left: calc(var(--theia-ui-padding) * 2);
 }
 
 #theia-statusBar .area.right {
@@ -56,8 +55,14 @@ body.theia-no-open-workspace #theia-statusBar {
   font-size: var(--theia-statusBar-font-size);
 }
 
-#theia-statusBar .area .element > * {
-  margin-left: calc(var(--theia-ui-padding) / 2);
+#theia-statusBar .area.left .element.has-background {
+  margin-left: 0px;
+  margin-right: 3px;
+  padding-left: 7px;
+  padding-right: 7px;
+}
+#theia-statusBar .area .element>* {
+  margin-left: calc(var(--theia-ui-padding)/2);
 }
 
 #theia-statusBar .area .element .codicon {
@@ -77,6 +82,9 @@ body.theia-no-open-workspace #theia-statusBar {
   color: var(--theia-statusBar-offlineForeground) !important;
 }
 
+#theia-statusBar .area.left .element:first-child:not(.has-background) {
+    margin-left: calc(var(--theia-ui-padding) * 3);
+}
 #theia-statusBar .area.left .element {
   margin-right: var(--theia-ui-padding);
 }

packages/core/src/common/index.ts

@@ -47,3 +47,4 @@ export * from './telemetry';
 export * from './types';
 export { default as URI } from './uri';
 export * from './view-column';
+export * from './version';

packages/core/src/common/quick-pick-service.ts

@@ -271,6 +271,7 @@ export interface QuickPickOptions<T extends QuickPickItemOrSeparator> {
     onDidTriggerItemButton?: (ItemButtonEvent: QuickPickItemButtonContext<T>) => void
 }
 
+export const quickInputServicePath = '/services/quickInput';
 export const QuickInputService = Symbol('QuickInputService');
 export interface QuickInputService {
     readonly backButton: QuickInputButton;