From e20cf5c1183c563fd62be020c46768d616df9a4d Mon Sep 17 00:00:00 2001
From: Vinicius Fortuna <fortuna@users.noreply.github.com>
Date: Tue, 23 Mar 2021 23:12:22 -0400
Subject: [PATCH 1/6] Use Account ids

---
 src/server_manager/model/digitalocean.ts      |  2 ++
 src/server_manager/web_app/app.ts             | 25 +++++++++++--------
 src/server_manager/web_app/cloud_accounts.ts  |  2 +-
 .../web_app/digitalocean_account.ts           |  9 +++++--
 .../web_app/digitalocean_server.ts            |  5 ++--
 src/server_manager/web_app/manual_server.ts   |  7 +++---
 src/server_manager/web_app/testing/models.ts  |  4 +++
 .../web_app/ui_components/app-root.js         |  8 +++---
 8 files changed, 40 insertions(+), 22 deletions(-)

diff --git a/src/server_manager/model/digitalocean.ts b/src/server_manager/model/digitalocean.ts
index 79fc3cde4..650c12881 100644
--- a/src/server_manager/model/digitalocean.ts
+++ b/src/server_manager/model/digitalocean.ts
@@ -26,6 +26,8 @@ export enum Status {
 }
 
 export interface Account {
+  // Returns the Account's unique id.
+  getId(): string;
   // Returns a user-friendly name (email address) associated with the account.
   getName(): Promise<string>;
   // Returns the status of the account.
diff --git a/src/server_manager/web_app/app.ts b/src/server_manager/web_app/app.ts
index 781fdaa70..d2387ded1 100644
--- a/src/server_manager/web_app/app.ts
+++ b/src/server_manager/web_app/app.ts
@@ -347,7 +347,7 @@ export class App {
       }
       const servers = await this.digitalOceanAccount.listServers();
       for (const server of servers) {
-        this.addServer(server);
+        this.addServer(this.digitalOceanAccount.getId(), server);
       }
       return servers;
     } catch (error) {
@@ -360,15 +360,15 @@ export class App {
 
   private async loadManualServers() {
     for (const server of await this.manualServerRepository.listServers()) {
-      this.addServer(server);
+      this.addServer(null, server);
     }
   }
 
-  private makeServerListEntry(server: server.Server): ServerListEntry {
+  private makeServerListEntry(accountId: string, server: server.Server): ServerListEntry {
     return {
       id: server.getId(),
+      accountId,
       name: this.makeDisplayName(server),
-      isManaged: isManagedServer(server),
       isSynced: !!server.getName(),
     };
   }
@@ -384,10 +384,10 @@ export class App {
     return name;
   }
 
-  private addServer(server: server.Server): void {
+  private addServer(accountId: string, server: server.Server): void {
     console.log('Loading server', server);
     this.idServerMap.set(server.getId(), server);
-    const serverEntry = this.makeServerListEntry(server);
+    const serverEntry = this.makeServerListEntry(accountId, server);
     this.appRoot.serverList = this.appRoot.serverList.concat([serverEntry]);
 
     if (isManagedServer(server) && !server.isInstallCompleted()) {
@@ -428,7 +428,7 @@ export class App {
 
   private updateServerEntry(server: server.Server): void {
     this.appRoot.serverList = this.appRoot.serverList.map(
-        (ds) => ds.id === server.getId() ? this.makeServerListEntry(server) : ds);
+        (ds) => ds.id === server.getId() ? this.makeServerListEntry(ds.accountId, server) : ds);
   }
 
   private getServerById(serverId: string): server.Server {
@@ -607,10 +607,15 @@ export class App {
 
   // Clears the DigitalOcean credentials and returns to the intro screen.
   private disconnectDigitalOceanAccount(): void {
+    if (!this.digitalOceanAccount) {
+      // Not connected.
+      return;
+    }
+    const accountId = this.digitalOceanAccount.getId();
     this.cloudAccounts.disconnectDigitalOceanAccount();
     this.digitalOceanAccount = null;
     for (const serverEntry of this.appRoot.serverList) {
-      if (serverEntry.isManaged) {
+      if (serverEntry.accountId === accountId) {
         this.removeServer(serverEntry.id);
       }
     }
@@ -665,7 +670,7 @@ export class App {
       const server = await this.digitalOceanRetry(() => {
         return this.digitalOceanAccount.createServer(regionId, serverName);
       });
-      this.addServer(server);
+      this.addServer(this.digitalOceanAccount.getId(), server);
       this.showServer(server);
     } catch (error) {
       console.error('Error from createDigitalOceanServer', error);
@@ -1050,7 +1055,7 @@ export class App {
     }
     const manualServer = await this.manualServerRepository.addServer(serverConfig);
     if (await manualServer.isHealthy()) {
-      this.addServer(manualServer);
+      this.addServer(null, manualServer);
       this.showServer(manualServer);
     } else {
       // Remove inaccessible manual server from local storage if it was just created.
diff --git a/src/server_manager/web_app/cloud_accounts.ts b/src/server_manager/web_app/cloud_accounts.ts
index 6f3104914..1f1f85f4d 100644
--- a/src/server_manager/web_app/cloud_accounts.ts
+++ b/src/server_manager/web_app/cloud_accounts.ts
@@ -119,7 +119,7 @@ export class CloudAccounts implements accounts.CloudAccounts {
   }
 
   private createDigitalOceanAccount(accessToken: string): DigitalOceanAccount {
-    return new DigitalOceanAccount(accessToken, this.shadowboxSettings, this.isDebugMode);
+    return new DigitalOceanAccount('do', accessToken, this.shadowboxSettings, this.isDebugMode);
   }
 
   private createGcpAccount(refreshToken: string): GcpAccount {
diff --git a/src/server_manager/web_app/digitalocean_account.ts b/src/server_manager/web_app/digitalocean_account.ts
index a4624f16b..8670a2d22 100644
--- a/src/server_manager/web_app/digitalocean_account.ts
+++ b/src/server_manager/web_app/digitalocean_account.ts
@@ -36,11 +36,15 @@ export class DigitalOceanAccount implements digitalocean.Account {
   private servers: DigitalOceanServer[] = [];
 
   constructor(
-      private accessToken: string, private shadowboxSettings: ShadowboxSettings,
+      private id: string, private accessToken: string, private shadowboxSettings: ShadowboxSettings,
       private debugMode: boolean) {
     this.digitalOcean = new RestApiSession(accessToken);
   }
 
+  getId(): string {
+    return this.id;
+  }
+
   async getName(): Promise<string> {
     return (await this.digitalOcean.getAccount())?.email;
   }
@@ -121,7 +125,8 @@ export class DigitalOceanAccount implements digitalocean.Account {
 
   // Creates a DigitalOceanServer object and adds it to the in-memory server list.
   private createDigitalOceanServer(digitalOcean: DigitalOceanSession, dropletInfo: DropletInfo) {
-    const server = new DigitalOceanServer(digitalOcean, dropletInfo);
+    const server =
+        new DigitalOceanServer(`${this.id}:${dropletInfo.id}`, digitalOcean, dropletInfo);
     this.servers.push(server);
     return server;
   }
diff --git a/src/server_manager/web_app/digitalocean_server.ts b/src/server_manager/web_app/digitalocean_server.ts
index 856a9b606..e17088c43 100644
--- a/src/server_manager/web_app/digitalocean_server.ts
+++ b/src/server_manager/web_app/digitalocean_server.ts
@@ -60,10 +60,11 @@ export class DigitalOceanServer extends ShadowboxServer implements server.Manage
   private eventQueue = new EventEmitter();
   private installState: InstallState = InstallState.UNKNOWN;
 
-  constructor(private digitalOcean: DigitalOceanSession, private dropletInfo: DropletInfo) {
+  constructor(
+      id: string, private digitalOcean: DigitalOceanSession, private dropletInfo: DropletInfo) {
     // Consider passing a RestEndpoint object to the parent constructor,
     // to better encapsulate the management api address logic.
-    super(String(dropletInfo.id));
+    super(id);
     console.info('DigitalOceanServer created');
     this.eventQueue.once('server-active', () => console.timeEnd('activeServer'));
     this.pollInstallState();
diff --git a/src/server_manager/web_app/manual_server.ts b/src/server_manager/web_app/manual_server.ts
index dd6a02832..fe2cf5b51 100644
--- a/src/server_manager/web_app/manual_server.ts
+++ b/src/server_manager/web_app/manual_server.ts
@@ -19,8 +19,9 @@ import {ShadowboxServer} from './shadowbox_server';
 
 class ManualServer extends ShadowboxServer implements server.ManualServer {
   constructor(
-      private manualServerConfig: server.ManualServerConfig, private forgetCallback: Function) {
-    super(manualServerConfig.apiUrl);
+      id: string, private manualServerConfig: server.ManualServerConfig,
+      private forgetCallback: Function) {
+    super(id);
     this.setManagementApiUrl(manualServerConfig.apiUrl);
     // manualServerConfig.certSha256 is expected to be in hex format (install script).
     // Electron requires that this be decoded from hex (to unprintable binary),
@@ -92,7 +93,7 @@ export class ManualServerRepository implements server.ManualServerRepository {
   }
 
   private createServer(config: server.ManualServerConfig) {
-    const server = new ManualServer(config, () => {
+    const server = new ManualServer(`manual:${config.apiUrl}`, config, () => {
       this.forgetServer(server);
     });
     return server;
diff --git a/src/server_manager/web_app/testing/models.ts b/src/server_manager/web_app/testing/models.ts
index a2c040a2a..27678818d 100644
--- a/src/server_manager/web_app/testing/models.ts
+++ b/src/server_manager/web_app/testing/models.ts
@@ -22,6 +22,10 @@ export class FakeDigitalOceanAccount implements digitalocean.Account {
 
   constructor(private accessToken = 'fake-access-token') {}
 
+  getId(): string {
+    return 'account-id';
+  }
+
   async getName(): Promise<string> {
     return 'fake-digitalocean-account-name';
   }
diff --git a/src/server_manager/web_app/ui_components/app-root.js b/src/server_manager/web_app/ui_components/app-root.js
index 7375ea661..166acfa5c 100644
--- a/src/server_manager/web_app/ui_components/app-root.js
+++ b/src/server_manager/web_app/ui_components/app-root.js
@@ -55,8 +55,8 @@ const TOS_ACK_LOCAL_STORAGE_KEY = 'tos-ack';
  * An access key to be displayed
  * @typedef {Object} ServerListEntry
  * @prop {string} id
+ * @prop {string|null} accountId
  * @prop {string} name
- * @prop {boolean} isManaged
  * @prop {boolean} isSynced
  */
 
@@ -769,7 +769,7 @@ export class AppRoot extends mixinBehaviors
   }
 
   _computeHasManualServers(serverList) {
-    return this.serverList.filter(server => !server.isManaged).length > 0;
+    return this.serverList.filter(server => !server.accountId).length > 0;
   }
 
   _userAcceptedTosChanged(userAcceptedTos) {
@@ -905,11 +905,11 @@ export class AppRoot extends mixinBehaviors
   }
 
   _isServerManaged(server) {
-    return server.isManaged;
+    return !!server.accountId;
   }
 
   _isServerManual(server) {
-    return !server.isManaged;
+    return !server.accountId;
   }
 
   _sortServersByName(a, b) {

From 55be5a85998d94502c32203155ddc14b44d7b109 Mon Sep 17 00:00:00 2001
From: Vinicius Fortuna <fortuna@users.noreply.github.com>
Date: Wed, 24 Mar 2021 17:54:39 -0400
Subject: [PATCH 2/6] Remove unused getHostId()

---
 src/server_manager/model/server.ts                | 2 --
 src/server_manager/web_app/digitalocean_server.ts | 4 ----
 2 files changed, 6 deletions(-)

diff --git a/src/server_manager/model/server.ts b/src/server_manager/model/server.ts
index 7f3c81841..c183593b4 100644
--- a/src/server_manager/model/server.ts
+++ b/src/server_manager/model/server.ts
@@ -122,8 +122,6 @@ export interface ManagedServerHost {
   getRegionId(): RegionId;
   // Deletes the server - cannot be undone.
   delete(): Promise<void>;
-  // Returns the virtual host ID.
-  getHostId(): string;
 }
 
 export class DataAmount {
diff --git a/src/server_manager/web_app/digitalocean_server.ts b/src/server_manager/web_app/digitalocean_server.ts
index e17088c43..ba1eb6998 100644
--- a/src/server_manager/web_app/digitalocean_server.ts
+++ b/src/server_manager/web_app/digitalocean_server.ts
@@ -307,10 +307,6 @@ class DigitalOceanHost implements server.ManagedServerHost {
       this.deleteCallback();
     });
   }
-
-  getHostId(): string {
-    return `${this.dropletInfo.id}`;
-  }
 }
 
 function startsWithCaseInsensitive(text: string, prefix: string) {

From 7eea5ee560133bceffc2350ef1b6b441f8b21ea4 Mon Sep 17 00:00:00 2001
From: Vinicius Fortuna <fortuna@users.noreply.github.com>
Date: Wed, 24 Mar 2021 21:13:56 -0400
Subject: [PATCH 3/6] Add AccountListEntry

---
 src/server_manager/web_app/app.ts             |  7 +++-
 .../web_app/ui_components/app-root.js         | 40 ++++++++++++-------
 2 files changed, 31 insertions(+), 16 deletions(-)

diff --git a/src/server_manager/web_app/app.ts b/src/server_manager/web_app/app.ts
index bd1cac9f2..d18b755ad 100644
--- a/src/server_manager/web_app/app.ts
+++ b/src/server_manager/web_app/app.ts
@@ -340,7 +340,10 @@ export class App {
     }
     try {
       this.digitalOceanAccount = digitalOceanAccount;
-      this.appRoot.digitalOceanAccountName = await this.digitalOceanAccount.getName();
+      this.appRoot.digitalOceanAccount = {
+        id: this.digitalOceanAccount.getId(),
+        name: await this.digitalOceanAccount.getName()
+      };
       const status = await this.digitalOceanAccount.getStatus();
       if (status !== digitalocean.Status.ACTIVE) {
         return [];
@@ -619,7 +622,7 @@ export class App {
         this.removeServer(serverEntry.id);
       }
     }
-    this.appRoot.digitalOceanAccountName = '';
+    this.appRoot.digitalOceanAccount = null;
   }
 
   // Clears the GCP credentials and returns to the intro screen.
diff --git a/src/server_manager/web_app/ui_components/app-root.js b/src/server_manager/web_app/ui_components/app-root.js
index deca223eb..36e684c2b 100644
--- a/src/server_manager/web_app/ui_components/app-root.js
+++ b/src/server_manager/web_app/ui_components/app-root.js
@@ -51,6 +51,13 @@ import {ServerView} from './outline-server-view.js';
 
 const TOS_ACK_LOCAL_STORAGE_KEY = 'tos-ack';
 
+/**
+ * A cloud account to be displayed
+ * @typedef {Object} AccountListEntry
+ * @prop {string} id
+ * @prop {string} name
+ */
+
 /**
  * An access key to be displayed
  * @typedef {Object} ServerListEntry
@@ -381,14 +388,14 @@ export class AppRoot extends mixinBehaviors
         <app-header-layout>
           <div class="app-container">
             <iron-pages attr-for-selected="id" selected="{{ currentPage }}">
-              <outline-intro-step id="intro" digital-ocean-account-name="{{digitalOceanAccountName}}" gcp-account-name="{{gcpAccountName}}" localize="[[localize]]"></outline-intro-step>
+              <outline-intro-step id="intro" digital-ocean-account-name="{{digitalOceanAccount.name}}" gcp-account-name="{{gcpAccountName}}" localize="[[localize]]"></outline-intro-step>
               <outline-do-oauth-step id="digitalOceanOauth" localize="[[localize]]"></outline-do-oauth-step>
               <outline-gcp-oauth-step id="gcpOauth" localize="[[localize]]"></outline-gcp-oauth-step>
               <outline-manual-server-entry id="manualEntry" localize="[[localize]]"></outline-manual-server-entry>
               <outline-region-picker-step id="regionPicker" localize="[[localize]]"></outline-region-picker-step>
               <div id="serverView">
-                <template is="dom-repeat" items="{{serverList}}" as="server">
-                  <outline-server-view id="serverView-{{_base64Encode(server.id)}}" language="[[language]]" localize="[[localize]]" hidden\$="{{!_isServerSelected(selectedServerId, server)}}"></outline-server-view>
+                <template is="dom-repeat" items="[[serverList]]" as="server">
+                  <outline-server-view id="serverView-[[_base64Encode(server.id)]]" language="[[language]]" localize="[[localize]]" hidden\$="[[!_isServerSelected(selectedServerId, server)]]"></outline-server-view>
                 </template>
               </div>
             </iron-pages>
@@ -448,20 +455,20 @@ export class AppRoot extends mixinBehaviors
   static expandedServersTemplate() {
     return html`
       <!-- DigitalOcean servers -->
-      <div class="servers-section" hidden\$="[[!digitalOceanAccountName]]">
+      <div class="servers-section" hidden\$="[[!digitalOceanAccount]]">
         <div class="servers-header">
           <span>[[localize('servers-digitalocean')]]</span>
           <paper-menu-button horizontal-align="left" class="" close-on-activate="" no-animations="" dynamic-align="" no-overlap="">
             <paper-icon-button icon="more-vert" slot="dropdown-trigger"></paper-icon-button>
             <div class="do-overflow-menu" slot="dropdown-content">
               <h4>[[localize('digitalocean-disconnect-account')]]</h4>
-              <div class="account-info"><img src="images/digital_ocean_logo.svg">[[digitalOceanAccountName]]</div>
+              <div class="account-info"><img src="images/digital_ocean_logo.svg">[[digitalOceanAccount.name]]</div>
               <div class="sign-out-button" on-tap="signOutTapped">[[localize('digitalocean-disconnect')]]</div>
             </div>
           </paper-menu-button>
         </div>
         <div class="servers-container">
-          <template is="dom-repeat" items="[[serverList]]" as="server" filter="_isServerManaged" sort="_sortServersByName">
+          <template is="dom-repeat" items="[[serverList]]" as="server" filter="[[_accountServerFilter(digitalOceanAccount)]]" sort="_sortServersByName">
             <div class\$="server [[_computeServerClasses(selectedServerId, server)]]" data-server\$="[[server]]" on-tap="_showServer">
               <img class="server-icon" src\$="images/[[_computeServerImage(selectedServerId, server)]]">
               <span>[[server.name]]</span>
@@ -489,9 +496,9 @@ export class AppRoot extends mixinBehaviors
   static minimizedServersTemplate() {
     return html`
       <!-- DigitalOcean servers -->
-      <div class="side-bar-section servers-section" hidden\$="[[!digitalOceanAccountName]]">
+      <div class="side-bar-section servers-section" hidden\$="[[!digitalOceanAccount]]">
         <img class="provider-icon" src="images/do_white_logo.svg">
-        <template is="dom-repeat" items="[[serverList]]" as="server" filter="_isServerManaged" sort="_sortServersByName">
+        <template is="dom-repeat" items="[[serverList]]" as="server" filter="[[_accountServerFilter(digitalOceanAccount)]]" sort="_sortServersByName">
           <div class\$="server [[_computeServerClasses(selectedServerId, server)]]" data-server\$="[[server]]" on-tap="_showServer">
             <img class="server-icon" src\$="images/[[_computeServerImage(selectedServerId, server)]]">
           </div>
@@ -522,8 +529,8 @@ export class AppRoot extends mixinBehaviors
       useKeyIfMissing: {type: Boolean},
       serverList: {type: Array},
       selectedServerId: {type: String},
-      digitalOceanAccountName: String,
-      gcpAccountName: String,
+      digitalOceanAccount: Object,
+      gcpAccount: Object,
       outlineVersion: String,
       userAcceptedTos: {
         type: Boolean,
@@ -552,8 +559,10 @@ export class AppRoot extends mixinBehaviors
     this.useKeyIfMissing = true;
     /** @type {ServerListEntry[]} */
     this.serverList = [];
-    this.digitalOceanAccountName = '';
-    this.gcpAccountName = '';
+    /** @type {AccountListEntry} */
+    this.digitalOceanAccount = null;
+    /** @type {AccountListEntry} */
+    this.gcpAccount = null;
     this.outlineVersion = '';
     this.currentPage = 'intro';
     this.shouldShowSideBar = false;
@@ -904,8 +913,11 @@ export class AppRoot extends mixinBehaviors
     return shouldShowSideBar ? 'side-bar-margin' : '';
   }
 
-  _isServerManaged(server) {
-    return !!server.accountId;
+  /**
+   * @param {AccountListEntry} account
+   */
+  _accountServerFilter(account) {
+    return (server) => account && server.accountId === account.id;
   }
 
   _isServerManual(server) {

From 517647b214c72654cb79b6c8a4ab74a452149b2a Mon Sep 17 00:00:00 2001
From: Vinicius Fortuna <fortuna@users.noreply.github.com>
Date: Thu, 25 Mar 2021 12:57:10 -0400
Subject: [PATCH 4/6] Add TODO

---
 src/server_manager/web_app/ui_components/app-root.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/server_manager/web_app/ui_components/app-root.js b/src/server_manager/web_app/ui_components/app-root.js
index 54b81e8bb..0b0a3b6d4 100644
--- a/src/server_manager/web_app/ui_components/app-root.js
+++ b/src/server_manager/web_app/ui_components/app-root.js
@@ -474,6 +474,7 @@ export class AppRoot extends mixinBehaviors
           </template>
         </div>
       </div>
+      <!-- TODO(fortuna): Insert GCP servers here -->
       <!-- Manual servers -->
       <div class="servers-section" hidden\$="[[!_hasManualServers(serverList)]]">
         <div class="servers-header">
@@ -502,6 +503,7 @@ export class AppRoot extends mixinBehaviors
           </div>
         </template>
       </div>
+      <!-- TODO(fortuna): Insert GCP servers here -->
       <!-- Manual servers -->
       <div class="side-bar-section servers-section" hidden\$="[[!_hasManualServers(serverList)]]">
         <img class="provider-icon" src="images/cloud.svg">

From 216b8122d9b7020c7d5b76824b9bf88bc9f18054 Mon Sep 17 00:00:00 2001
From: Vinicius Fortuna <fortuna@users.noreply.github.com>
Date: Thu, 25 Mar 2021 13:43:11 -0400
Subject: [PATCH 5/6] Add comment

---
 src/server_manager/model/server.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/server_manager/model/server.ts b/src/server_manager/model/server.ts
index c183593b4..a860ccb57 100644
--- a/src/server_manager/model/server.ts
+++ b/src/server_manager/model/server.ts
@@ -13,7 +13,7 @@
 // limitations under the License.
 
 export interface Server {
-  // Gets the server ID.
+  // Gets a globally unique identifier for this Server.
   getId(): string;
 
   // Gets the server's name for display.

From 5a14fe6767f55ab43e0901c67baf3a649c1df631 Mon Sep 17 00:00:00 2001
From: Vinicius Fortuna <fortuna@users.noreply.github.com>
Date: Thu, 25 Mar 2021 13:48:21 -0400
Subject: [PATCH 6/6] Add ID comment on the Account

---
 src/server_manager/model/digitalocean.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/server_manager/model/digitalocean.ts b/src/server_manager/model/digitalocean.ts
index 650c12881..fb6758bce 100644
--- a/src/server_manager/model/digitalocean.ts
+++ b/src/server_manager/model/digitalocean.ts
@@ -26,7 +26,7 @@ export enum Status {
 }
 
 export interface Account {
-  // Returns the Account's unique id.
+  // Gets a globally unique identifier for this Account.
   getId(): string;
   // Returns a user-friendly name (email address) associated with the account.
   getName(): Promise<string>;