Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(manager): removes special case for manager connection key #1138

Merged
merged 4 commits into from
Aug 16, 2022
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 0 additions & 15 deletions src/server_manager/images/manager-key-avatar.svg

This file was deleted.

1 change: 0 additions & 1 deletion src/server_manager/messages/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -201,7 +201,6 @@
"server-access-key-new": "Add new key",
"server-access-key-rename": "Rename",
"server-access-keys": "Access keys",
"server-connect-devices": "Connect your devices",
"server-connections": "Connections",
"server-data-transfer": "Data transferred / last 30 days",
"server-data-used": "Allowance used / last 30 days",
Expand Down
4 changes: 0 additions & 4 deletions src/server_manager/messages/master_messages.json
Original file line number Diff line number Diff line change
Expand Up @@ -962,10 +962,6 @@
"message": "Access keys",
"description": "This string appears within the server view as a header of a table column that displays server access keys."
},
"server_connect_devices": {
"message": "Connect your devices",
"description": "This string appears within the server view as a sub-header for the default server access key. This key is meant to be used by the server administrator."
},
"server_connections": {
"message": "Connections",
"description": "This string appears within the server view as a header of the section that displays server information and access keys."
Expand Down
4 changes: 0 additions & 4 deletions src/server_manager/web_app/app.ts
Original file line number Diff line number Diff line change
Expand Up @@ -94,10 +94,6 @@ async function showHelpBubblesOnce(serverView: ServerView) {
await serverView.showAddAccessKeyHelpBubble();
window.localStorage.setItem('addAccessKeyHelpBubble-dismissed', 'true');
}
if (!window.localStorage.getItem('getConnectedHelpBubble-dismissed')) {
await serverView.showGetConnectedHelpBubble();
window.localStorage.setItem('getConnectedHelpBubble-dismissed', 'true');
}
if (
!window.localStorage.getItem('dataLimitsHelpBubble-dismissed') &&
serverView.supportsDefaultDataLimit
Expand Down
126 changes: 8 additions & 118 deletions src/server_manager/web_app/ui_components/outline-server-view.ts
Original file line number Diff line number Diff line change
Expand Up @@ -292,15 +292,6 @@ export class ServerView extends DirMixin(PolymerElement) {
parent, which defines the dataset elements needed for displaying the icon. */
pointer-events: none;
}
#manager-access-key-description {
font-size: 12px;
font-weight: 400;
margin-top: 4px;
color: var(--medium-gray);
}
.manager-access-key-icon.access-key-icon {
height: 48px;
}
.access-key-icon {
width: 42px;
height: 42px;
Expand Down Expand Up @@ -582,67 +573,11 @@ export class ServerView extends DirMixin(PolymerElement) {
</outline-sort-span>
<span class="flex-1 header-row-spacer"></span>
</div>
<!-- admin row -->
<div class="access-key-row" id="managerRow">
<span class="access-key-container">
<img
class="manager-access-key-icon access-key-icon"
src="images/manager-key-avatar.svg"
/>
<div class="access-key-name">
<div>[[localize('server-my-access-key')]]</div>
<div id="manager-access-key-description">
[[localize('server-connect-devices')]]
</div>
</div>
</span>
<span class="measurement-container">
<span class="measurement">
<bdi
>[[_formatBytesTransferred(myConnection.transferredBytes, language,
"...")]]</bdi
>
/
<bdi>[[_formatDataLimitForKey(myConnection, language, localize)]]</bdi>
</span>
<paper-progress
max="[[_getRelevantTransferAmountForKey(myConnection)]]"
value="[[myConnection.transferredBytes]]"
class$="[[_computePaperProgressClass(myConnection)]]"
style$="[[_computeProgressWidthStyling(myConnection, baselineDataTransfer)]]"
></paper-progress>
<paper-tooltip
animation-delay="0"
offset="0"
position="top"
hidden$="[[!_activeDataLimitForKey(myConnection)]]"
>
[[_getDataLimitsUsageString(myConnection, language, localize)]]
</paper-tooltip>
</span>
<span class="actions">
<span class="flex-1">
<paper-icon-button
icon="outline-iconset:devices"
class="connect-button"
on-tap="_handleConnectPressed"
></paper-icon-button>
</span>
<span class="flex-1">
<paper-icon-button
icon="icons:perm-data-setting"
hidden$="[[!hasPerKeyDataLimitDialog]]"
on-tap="_handleShowPerKeyDataLimitDialogPressed"
></paper-icon-button>
</span>
</span>
</div>
<div id="accessKeysContainer">
<!-- rows for each access key -->
<template
is="dom-repeat"
items="{{accessKeyRows}}"
filter="isRegularConnection"
sort="{{_sortAccessKeys(accessKeySortBy, accessKeySortDirection)}}"
observe="name transferredBytes"
>
Expand Down Expand Up @@ -794,7 +729,6 @@ export class ServerView extends DirMixin(PolymerElement) {
installProgress: Number,
isServerReachable: Boolean,
retryDisplayingServer: Function,
myConnection: Object,
totalInboundBytes: Number,
baselineDataTransfer: Number,
accessKeyRows: Array,
Expand All @@ -812,10 +746,7 @@ export class ServerView extends DirMixin(PolymerElement) {
}

static get observers() {
return [
'_accessKeysAddedOrRemoved(accessKeyRows.splices)',
'_myConnectionChanged(myConnection)',
];
return ['_accessKeysAddedOrRemoved(accessKeyRows.splices)'];
}

serverId = '';
Expand All @@ -842,16 +773,6 @@ export class ServerView extends DirMixin(PolymerElement) {
isServerReachable = false;
/** Callback for retrying to display an unreachable server. */
retryDisplayingServer: () => void = null;
/**
* myConnection has the same fields as each item in accessKeyRows. It may
* be unset in some old versions of Outline that allowed deleting this row
*
* TODO(JonathanDCohen) Refactor out special casing for myConnection. It exists as a separate
* item in the view even though it's also in accessKeyRows. We can have the special casing
* be in display only, so we can just use accessKeyRows[0] and not have extra logic when it's
* not needed.
*/
myConnection: DisplayAccessKey = null;
totalInboundBytes = 0;
/** The number to which access key transfer amounts are compared for progress bar display */
baselineDataTransfer = Number.POSITIVE_INFINITY;
Expand Down Expand Up @@ -895,10 +816,6 @@ export class ServerView extends DirMixin(PolymerElement) {

updateAccessKeyRow(accessKeyId: string, fields: object) {
let newAccessKeyRow;
if (accessKeyId === MY_CONNECTION_USER_ID) {
newAccessKeyRow = Object.assign({}, this.get('myConnection'), fields);
this.set('myConnection', newAccessKeyRow);
}
for (const accessKeyRowIndex in this.accessKeyRows) {
if (this.accessKeyRows[accessKeyRowIndex].id === accessKeyId) {
newAccessKeyRow = Object.assign({}, this.get(['accessKeyRows', accessKeyRowIndex]), fields);
Expand All @@ -908,14 +825,6 @@ export class ServerView extends DirMixin(PolymerElement) {
}
}

// Help bubbles should be shown after this outline-server-view
// is on the screen (e.g. selected in iron-pages). If help bubbles
// are initialized before this point, setPosition will not work and
// they will appear in the top left of the view.
showGetConnectedHelpBubble() {
fortuna marked this conversation as resolved.
Show resolved Hide resolved
return this._showHelpBubble('getConnectedHelpBubble', 'managerRow');
}

showAddAccessKeyHelpBubble() {
return this._showHelpBubble('addAccessKeyHelpBubble', 'addAccessKeyRow', 'down', 'left');
}
Expand All @@ -926,9 +835,7 @@ export class ServerView extends DirMixin(PolymerElement) {

/** Returns the UI access key with the given ID. */
findUiKey(id: AccessKeyId): DisplayAccessKey {
return id === MY_CONNECTION_USER_ID
? this.myConnection
: this.accessKeyRows.find((key) => key.id === id);
return this.accessKeyRows.find((key) => key.id === id);
}

_closeAddAccessKeyHelpBubble() {
Expand Down Expand Up @@ -992,13 +899,10 @@ export class ServerView extends DirMixin(PolymerElement) {
}

_handleShowPerKeyDataLimitDialogPressed(event: KeyRowEvent) {
const accessKey = event.model?.item || this.myConnection;
const accessKey = event.model?.item;
const keyId = accessKey.id;
const keyDataLimitBytes = accessKey.dataLimitBytes;
const keyName =
accessKey === this.myConnection
? this.localize('server-my-access-key')
: accessKey.name || accessKey.placeholderName;
const keyName = accessKey.name || accessKey.placeholderName;
const defaultDataLimitBytes = this.isDefaultDataLimitEnabled
? this.defaultDataLimitBytes
: undefined;
Expand All @@ -1024,13 +928,6 @@ export class ServerView extends DirMixin(PolymerElement) {
}, 0);
}

_handleConnectPressed() {
(this.$.getConnectedHelpBubble as OutlineHelpBubble).hide();
this.dispatchEvent(
makePublicEvent('OpenGetConnectedDialogRequested', {accessKey: this.myConnection.accessUrl})
);
}

_handleShareCodePressed(event: KeyRowEvent) {
const accessKey = event.model.item;
this.dispatchEvent(
Expand Down Expand Up @@ -1103,24 +1000,17 @@ export class ServerView extends DirMixin(PolymerElement) {
}

_accessKeysAddedOrRemoved(_changeRecord: unknown) {
// Check for myConnection and regular access keys.
let hasNonAdminAccessKeys = false;
// Check for user key and regular access keys.
let hasNonAdminAccessKeys = true;
for (const ui in this.accessKeyRows) {
if (this.accessKeyRows[ui].id === MY_CONNECTION_USER_ID) {
this.myConnection = this.accessKeyRows[ui];
} else {
hasNonAdminAccessKeys = true;
hasNonAdminAccessKeys = false;
break;
}
}
this.hasNonAdminAccessKeys = hasNonAdminAccessKeys;
}

_myConnectionChanged(myConnection: DisplayAccessKey) {
if (!myConnection) {
(this.$.getConnectedHelpBubble as OutlineHelpBubble).hide();
}
}

_selectedTabChanged() {
if (this.selectedTab === 'settings') {
this._closeAddAccessKeyHelpBubble();
Expand Down