Use (base64-encrypted) email instead of account id to navigate to org member
This commit is contained in:
parent
dc4b022ea2
commit
b3661e47de
|
@ -15,13 +15,14 @@ import "./list";
|
|||
import "./toggle";
|
||||
import { customElement, property, query, state } from "lit/decorators.js";
|
||||
import { css, html, LitElement } from "lit";
|
||||
import { base64ToString } from "@padloc/core/src/encoding";
|
||||
|
||||
@customElement("pl-member-view")
|
||||
export class MemberView extends Routing(StateMixin(LitElement)) {
|
||||
readonly routePattern = /^orgs\/([^\/]+)\/members(?:\/([^\/]+))?/;
|
||||
|
||||
@property()
|
||||
memberId: string;
|
||||
email: string;
|
||||
|
||||
@property()
|
||||
orgId: string;
|
||||
|
@ -31,7 +32,7 @@ export class MemberView extends Routing(StateMixin(LitElement)) {
|
|||
}
|
||||
|
||||
private get _member() {
|
||||
return this._org && this._org.getMember({ accountId: this.memberId });
|
||||
return this._org && this._org.getMember({ email: this.email });
|
||||
}
|
||||
|
||||
@query("#saveButton")
|
||||
|
@ -78,9 +79,9 @@ export class MemberView extends Routing(StateMixin(LitElement)) {
|
|||
return (this._org && this._org.vaults.filter((vault) => !this._vaults.some((v) => v.id === vault.id))) || [];
|
||||
}
|
||||
|
||||
async handleRoute([orgId, memberId]: [string, string]) {
|
||||
async handleRoute([orgId, email]: [string, string]) {
|
||||
this.orgId = orgId;
|
||||
this.memberId = memberId;
|
||||
this.email = email && base64ToString(email);
|
||||
await this.updateComplete;
|
||||
this.clearChanges();
|
||||
}
|
||||
|
|
|
@ -19,6 +19,7 @@ import { css, html, LitElement } from "lit";
|
|||
import { ProvisioningStatus } from "@padloc/core/src/provisioning";
|
||||
import "./rich-content";
|
||||
import "./button";
|
||||
import { stringToBase64 } from "@padloc/core/src/encoding";
|
||||
|
||||
@customElement("pl-org-dashboard")
|
||||
export class OrgDashboard extends Routing(StateMixin(LitElement)) {
|
||||
|
@ -223,7 +224,8 @@ export class OrgDashboard extends Routing(StateMixin(LitElement)) {
|
|||
(member) => html`
|
||||
<div
|
||||
class="padded list-item hover click"
|
||||
@click=${() => this.go(`orgs/${this.orgId}/members/${member.id}`)}
|
||||
@click=${() =>
|
||||
this.go(`orgs/${this.orgId}/members/${stringToBase64(member.email)}`)}
|
||||
>
|
||||
<pl-member-item .member=${member} .org=${this._org!}></pl-member-item>
|
||||
</div>
|
||||
|
|
|
@ -16,6 +16,7 @@ import { customElement, property, query, state } from "lit/decorators.js";
|
|||
import { html, LitElement } from "lit";
|
||||
import "./scroller";
|
||||
import "./button";
|
||||
import { base64ToString, stringToBase64 } from "@padloc/core/src/encoding";
|
||||
|
||||
@customElement("pl-org-members")
|
||||
export class OrgMembersView extends Routing(StateMixin(LitElement)) {
|
||||
|
@ -25,7 +26,7 @@ export class OrgMembersView extends Routing(StateMixin(LitElement)) {
|
|||
orgId: string = "";
|
||||
|
||||
@property()
|
||||
memberId?: string;
|
||||
selectedEmail?: string;
|
||||
|
||||
@query("#filterInput")
|
||||
private _filterInput: Input;
|
||||
|
@ -43,9 +44,9 @@ export class OrgMembersView extends Routing(StateMixin(LitElement)) {
|
|||
@state()
|
||||
private _filterActive: boolean = false;
|
||||
|
||||
handleRoute([orgId, memberId]: [string, string]) {
|
||||
handleRoute([orgId, email]: [string, string]) {
|
||||
this.orgId = orgId;
|
||||
this.memberId = memberId;
|
||||
this.selectedEmail = email && base64ToString(email);
|
||||
}
|
||||
|
||||
private async _createInvite() {
|
||||
|
@ -64,10 +65,10 @@ export class OrgMembersView extends Routing(StateMixin(LitElement)) {
|
|||
}
|
||||
|
||||
private async _toggleMember(member: OrgMember) {
|
||||
if (this.memberId === member.id) {
|
||||
if (this.selectedEmail === member.email) {
|
||||
this.go(`orgs/${this.orgId}/members/`);
|
||||
} else {
|
||||
this.go(`orgs/${this.orgId}/members/${member.id}`);
|
||||
this.go(`orgs/${this.orgId}/members/${stringToBase64(member.email)}`);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -99,7 +100,7 @@ export class OrgMembersView extends Routing(StateMixin(LitElement)) {
|
|||
: org.members;
|
||||
|
||||
return html`
|
||||
<div class="fullbleed pane layout background ${this.memberId ? "open" : ""}">
|
||||
<div class="fullbleed pane layout background ${this.selectedEmail ? "open" : ""}">
|
||||
<div class="vertical layout">
|
||||
<header class="padded center-aligning horizontal layout" ?hidden=${this._filterActive}>
|
||||
<pl-org-nav></pl-org-nav>
|
||||
|
@ -135,7 +136,7 @@ export class OrgMembersView extends Routing(StateMixin(LitElement)) {
|
|||
(member) => html`
|
||||
<div
|
||||
class="double-padded list-item hover click"
|
||||
aria-selected=${member.id === this.memberId}
|
||||
aria-selected=${member.id === this.selectedEmail}
|
||||
@click=${() => this._toggleMember(member)}
|
||||
>
|
||||
<pl-member-item .member=${member} .org=${this._org}></pl-member-item>
|
||||
|
|
Loading…
Reference in New Issue