diff --git a/src/server_manager/web_app/app.spec.ts b/src/server_manager/web_app/app.spec.ts
index 036ea01e..8fde8201 100644
--- a/src/server_manager/web_app/app.spec.ts
+++ b/src/server_manager/web_app/app.spec.ts
@@ -21,8 +21,8 @@ import {Surveys} from '../model/survey';
 
 import {App} from './app';
 import {TokenManager} from './digitalocean_oauth';
-import {DisplayServerRepository, makeDisplayServer} from './display_server';
-import {AppRoot, DisplayServer} from './ui_components/app-root.js';
+import {DisplayServer, DisplayServerRepository, makeDisplayServer} from './display_server';
+import {AppRoot} from './ui_components/app-root.js';
 import {ServerView} from './ui_components/outline-server-view.js';
 
 const TOKEN_WITH_NO_SERVERS = 'no-server-token';
diff --git a/src/server_manager/web_app/app.ts b/src/server_manager/web_app/app.ts
index e7714772..2d5816cc 100644
--- a/src/server_manager/web_app/app.ts
+++ b/src/server_manager/web_app/app.ts
@@ -24,11 +24,11 @@ import {Surveys} from '../model/survey';
 
 import {TokenManager} from './digitalocean_oauth';
 import * as digitalocean_server from './digitalocean_server';
-import {DisplayServerRepository, makeDisplayServer} from './display_server';
+import {DisplayServer, DisplayServerRepository, makeDisplayServer} from './display_server';
 import {parseManualServerConfig} from './management_urls';
 
-import {AppRoot, DisplayServer} from './ui_components/app-root.js';
-import {ServerView} from './ui_components/outline-server-view.js';
+import {AppRoot} from './ui_components/app-root.js';
+import {DisplayAccessKey, ServerView} from './ui_components/outline-server-view.js';
 
 // The Outline DigitalOcean team's referral code:
 //   https://www.digitalocean.com/help/referral-program/
@@ -41,15 +41,6 @@ const CHANGE_HOSTNAME_VERSION = '1.2.0';
 export const DATA_LIMITS_AVAILABILITY_DATE = new Date('2020-06-02');
 const MAX_ACCESS_KEY_DATA_LIMIT_BYTES = 50 * (10 ** 9);  // 50GB
 
-interface UiAccessKey {
-  id: string;
-  placeholderName: string;
-  name: string;
-  accessUrl: string;
-  transferredBytes: number;
-  relativeTraffic: number;
-}
-
 interface DisplayDataAmount {
   unit: 'MB'|'GB';
   value: number;
@@ -989,7 +980,7 @@ export class App {
 
   // Converts the access key from the remote service format to the
   // format used by outline-server-view.
-  private convertToUiAccessKey(remoteAccessKey: server.AccessKey): UiAccessKey {
+  private convertToUiAccessKey(remoteAccessKey: server.AccessKey): DisplayAccessKey {
     return {
       id: remoteAccessKey.id,
       placeholderName: `${this.appRoot.localize('key', 'keyId', remoteAccessKey.id)}`,
diff --git a/src/server_manager/web_app/display_server.ts b/src/server_manager/web_app/display_server.ts
index e3bbe15f..43258ca5 100644
--- a/src/server_manager/web_app/display_server.ts
+++ b/src/server_manager/web_app/display_server.ts
@@ -13,7 +13,13 @@
 // limitations under the License.
 
 import * as server from '../model/server';
-import {DisplayServer} from './ui_components/app-root.js';
+
+export interface DisplayServer {
+  id: string;
+  name: string;
+  isManaged: boolean;
+  isSynced?: boolean;
+}
 
 // Returns a `DisplayServer` corresponding to `server`.
 export async function makeDisplayServer(server: server.Server) {
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 4ad8712b..64d5d355 100644
--- a/src/server_manager/web_app/ui_components/app-root.js
+++ b/src/server_manager/web_app/ui_components/app-root.js
@@ -43,19 +43,12 @@ import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
 import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 import {PolymerElement} from '@polymer/polymer/polymer-element.js';
 
+import {DisplayServer} from '../display_server';
+
 import {ServerView} from './outline-server-view.js';
 
 const TOS_ACK_LOCAL_STORAGE_KEY = 'tos-ack';
 
-/**
- * A server to be displayed
- * @typedef {Object} DisplayServer
- * @property {string} id - The id of the server
- * @property {string} name - The display name of the server
- * @property {boolean} isManaged - Whether the server host is managed by the Outline Manager
- * @property {boolean=} isSynced - Whether the server information is updated
- */
-
 export class AppRoot extends mixinBehaviors
 ([AppLocalizeBehavior], PolymerElement) {
   static get template() {