AZEN-SGG/Kavita
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Account Email Support (#1000)

Browse source 
* Moved the Server Settings out into a button on nav header

* Refactored Mange Users page to the new design (skeleton). Implemented skeleton code for Invite User.

* Hashed out more of the code, but need to move all the email code to a Kavita controlled API server due to password credentials.

* Cleaned up some warnings

* When no user exists for an api key in Plugin controller, throw 401.

* Hooked in the ability to check if the Kavita instance can be accessed externally so we can determine if the user can invite or not.

* Hooked up some logic if the user's server isn't accessible, then default to old flow

* Basic flow is working for confirm email. Needs validation, error handling, etc.

* Refactored Password validation to account service

* Cleaned up the code in confirm-email to work much better.

* Refactored the login page to have a container functionality, so we can reuse the styles on multiple pages (registration pages). Hooked up the code for confirm email.

* Messy code, but making progress. Refactored Register to be used only for first time user registration. Added a new register component to handle first time flow only.

* Invite works much better, still needs a bit of work for non-accessible server setup. Started work on underlying manage users page to meet new design.

* Changed (you) to a star to indicate who you're logged in as.

* Inviting a user is now working and tested fully.

* Removed the register member component as we now have invite and confirm components.

* Editing a user is now working. Username change and Role/Library access from within one screen. Email changing is on hold.

* Cleaned up code for edit user and disabled email field for now.

* Cleaned up the code to indicate changing a user's email is not possible.

* Implemented a migration for existing accounts so they can validate their emails and still login.

* Change url for email server

* Implemented the ability to resend an email confirmation code (or regenerate for non accessible servers). Fixed an overflow on the confirm dialog.

* Took care of some code cleanup

* Removed 3 db calls from cover refresh and some misc cleanup

* Fixed a broken test
This commit is contained in:
Joseph Milazzo 2022-01-30 14:45:57 -08:00 • committed by GitHub
parent 6e6b72a5b5
commit efb527035d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
109 changed files with 2041 additions and 407 deletions
Download patch file Download diff file Expand all files Collapse all files

51
UI/Web/src/app/admin/manage-users/manage-users.component.html
View file

@ -1,19 +1,53 @@
<div class="container-fluid">
<div class="row mb-2">
<div class="col-8"><h3>Users</h3></div>
<div class="col-4"><button class="btn btn-primary float-right" (click)="createMember()"><i class="fa fa-plus" aria-hidden="true"></i><span class="phone-hidden">&nbsp;Add User</span></button></div>
</div>
<ul class="list-group" *ngIf="!createMemberToggle; else createUser">
<ng-container>
<div class="row mb-2">
<div class="col-8"><h3>Pending Invites</h3></div>
<div class="col-4"><button class="btn btn-primary float-right" (click)="inviteUser()"><i class="fa fa-plus" aria-hidden="true"></i><span class="phone-hidden">&nbsp;Invite</span></button></div>
</div>
<ul class="list-group">
<li class="list-group-item" *ngFor="let invite of pendingInvites; let idx = index;">
<div>
<h4>
<span id="member-name--{{idx}}">{{invite.username | titlecase}} </span>
<div class="float-right">
<button class="btn btn-danger mr-2" (click)="deleteUser(invite)">Cancel</button>
<button class="btn btn-secondary mr-2" (click)="resendEmail(invite)">Resend</button>
</div>
</h4>
<div>Invited: {{invite.created | date: 'short'}}</div>
</div>
</li>
<li *ngIf="loadingMembers" class="list-group-item">
<div class="spinner-border text-secondary" role="status">
<span class="invisible">Loading...</span>
</div>
</li>
<li class="list-group-item" *ngIf="pendingInvites.length === 0 && !loadingMembers">
There are no invited Users
</li>
</ul>
</ng-container>
<h3 class="mt-3">Active Users</h3>
<ul class="list-group">
<li *ngFor="let member of members; let idx = index;" class="list-group-item">
<div>
<h4>
<i class="presence fa fa-circle" title="Active" aria-hidden="true" *ngIf="false && (messageHub.onlineUsers$ | async)?.includes(member.username)"></i><span id="member-name--{{idx}}">{{member.username | titlecase}} </span><span *ngIf="member.username === loggedInUsername">(You)</span>
<i class="presence fa fa-circle" title="Active" aria-hidden="true" *ngIf="false && (messageHub.onlineUsers$ | async)?.includes(member.username)"></i>
<span id="member-name--{{idx}}">{{member.username | titlecase}} </span>
<span *ngIf="member.username === loggedInUsername">
<i class="fas fa-star" aria-hidden="true"></i>
<span class="sr-only">(You)</span>
</span>
<div class="float-right" *ngIf="canEditMember(member)">
<button class="btn btn-danger mr-2" (click)="deleteUser(member)" placement="top" ngbTooltip="Delete User" attr.aria-label="Delete User {{member.username | titlecase}}"><i class="fa fa-trash" aria-hidden="true"></i></button>
<button class="btn btn-secondary mr-2" (click)="updatePassword(member)" placement="top" ngbTooltip="Change Password" attr.aria-label="Change Password for {{member.username | titlecase}}"><i class="fa fa-key" aria-hidden="true"></i></button>
<button class="btn btn-primary" (click)="openEditLibraryAccess(member)" placement="top" ngbTooltip="Edit" attr.aria-label="Edit {{member.username | titlecase}}"><i class="fa fa-pen" aria-hidden="true"></i></button>
<button class="btn btn-primary" (click)="openEditUser(member)" placement="top" ngbTooltip="Edit" attr.aria-label="Edit {{member.username | titlecase}}"><i class="fa fa-pen" aria-hidden="true"></i></button>
</div>
</h4>
<div>Last Active:
@ -44,7 +78,4 @@
There are no other users.
</li>
</ul>
<ng-template #createUser>
<app-register-member (created)="onMemberCreated($event)"></app-register-member>
</ng-template>
</div>

72
UI/Web/src/app/admin/manage-users/manage-users.component.ts
View file

@ -5,13 +5,15 @@ import { MemberService } from 'src/app/_services/member.service';
import { Member } from 'src/app/_models/member';
import { User } from 'src/app/_models/user';
import { AccountService } from 'src/app/_services/account.service';
import { LibraryAccessModalComponent } from '../_modals/library-access-modal/library-access-modal.component';
import { ToastrService } from 'ngx-toastr';
import { ResetPasswordModalComponent } from '../_modals/reset-password-modal/reset-password-modal.component';
import { ConfirmService } from 'src/app/shared/confirm.service';
import { EditRbsModalComponent } from '../_modals/edit-rbs-modal/edit-rbs-modal.component';
import { Subject } from 'rxjs';
import { MessageHubService } from 'src/app/_services/message-hub.service';
import { InviteUserComponent } from '../invite-user/invite-user.component';
import { EditUserComponent } from '../edit-user/edit-user.component';
import { ServerService } from 'src/app/_services/server.service';
@Component({
selector: 'app-manage-users',
@ -21,10 +23,8 @@ import { MessageHubService } from 'src/app/_services/message-hub.service';
export class ManageUsersComponent implements OnInit, OnDestroy {
members: Member[] = [];
pendingInvites: Member[] = [];
loggedInUsername = '';
// Create User functionality
createMemberToggle = false;
loadingMembers = false;
private onDestroy = new Subject<void>();
@ -34,7 +34,8 @@ export class ManageUsersComponent implements OnInit, OnDestroy {
private modalService: NgbModal,
private toastr: ToastrService,
private confirmService: ConfirmService,
public messageHub: MessageHubService) {
public messageHub: MessageHubService,
private serverService: ServerService) {
this.accountService.currentUser$.pipe(take(1)).subscribe((user: User) => {
this.loggedInUsername = user.username;
});
@ -43,6 +44,8 @@ export class ManageUsersComponent implements OnInit, OnDestroy {
ngOnInit(): void {
this.loadMembers();
this.loadPendingInvites();
}
ngOnDestroy() {
@ -69,31 +72,41 @@ export class ManageUsersComponent implements OnInit, OnDestroy {
});
}
loadPendingInvites() {
this.memberService.getPendingInvites().subscribe(members => {
this.pendingInvites = members;
// Show logged in user at the top of the list
this.pendingInvites.sort((a: Member, b: Member) => {
if (a.username === this.loggedInUsername) return 1;
if (b.username === this.loggedInUsername) return 1;
const nameA = a.username.toUpperCase();
const nameB = b.username.toUpperCase();
if (nameA < nameB) return -1;
if (nameA > nameB) return 1;
return 0;
})
});
}
canEditMember(member: Member): boolean {
return this.loggedInUsername !== member.username;
}
createMember() {
this.createMemberToggle = true;
}
onMemberCreated(createdUser: User | null) {
this.createMemberToggle = false;
this.loadMembers();
}
openEditLibraryAccess(member: Member) {
const modalRef = this.modalService.open(LibraryAccessModalComponent);
openEditUser(member: Member) {
const modalRef = this.modalService.open(EditUserComponent, {size: 'lg'});
modalRef.componentInstance.member = member;
modalRef.closed.subscribe(() => {
this.loadMembers();
});
}
async deleteUser(member: Member) {
if (await this.confirmService.confirm('Are you sure you want to delete this user?')) {
this.memberService.deleteMember(member.username).subscribe(() => {
this.loadMembers();
this.loadPendingInvites();
this.toastr.success(member.username + ' has been deleted.');
});
}
@ -106,7 +119,32 @@ export class ManageUsersComponent implements OnInit, OnDestroy {
if (updatedMember !== undefined) {
member = updatedMember;
}
})
});
}
inviteUser() {
const modalRef = this.modalService.open(InviteUserComponent, {size: 'lg'});
modalRef.closed.subscribe((successful: boolean) => {
if (successful) {
this.loadPendingInvites();
}
});
}
resendEmail(member: Member) {
this.serverService.isServerAccessible().subscribe(canAccess => {
this.accountService.resendConfirmationEmail(member.id).subscribe(async (email) => {
if (canAccess) {
this.toastr.info('Email sent to ' + member.username);
return;
}
await this.confirmService.alert(
'Please click this link to confirm your email. You must confirm to be able to login. You may need to log out of the current account before clicking. <br/> <a href="' + email + '" target="_blank">' + email + '</a>');
});
});
}
updatePassword(member: Member) {