url shortener, quotas, small improvements

src/app/pages/jitsi/jitsi.component.ts

@@ -4,11 +4,13 @@ import {Sort} from '@angular/material/sort';
 import {FormBuilder, FormGroup, Validators, NgForm} from '@angular/forms';
 import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
 import {DatePipe} from '@angular/common';
+import {PageEvent} from '@angular/material/paginator';
 
 import {QuotaService} from '../../services/quota.service';
 import {JitsiService} from '../../services/jitsi.service';
 import {ConfirmDialog} from '../../ui/confirm/confirm.component';
 import {I18nService} from './../../services/i18n.service';
+import {ThrowStmt} from '@angular/compiler';
 
 @Component({
   selector: 'app-account-jitsi',
@@ -20,11 +22,13 @@ export class JitsiComponent implements OnInit {
   form: FormGroup;
   @ViewChild('formDirective') private formDirective: NgForm;
   jitsiRoomsQuota: number = 0;
-  jitsiRooms: any[] = [];
+  jitsiRooms: any;
   jitsiRoom: any = {};
   success: boolean;
   working: boolean;
   datetimeformat: String;
+  page: any = {page: 0, size: 10, sort: "id", desc: false};
+  pageSizeOptions: number[] = [5, 10, 25, 50];
 
   jitsiRoomsColumns = ["share", "room", "starts", "moderationStarts", "expires", "moderationUrl", "delete"];
 
@@ -85,11 +89,33 @@ export class JitsiComponent implements OnInit {
       }
     })
 
-    this.jitsiService.get().subscribe((data: any) => {
+    this.jitsiService.get(this.page.page, this.page.size, this.page.sort, this.page.desc).subscribe((data: any) => {
       this.jitsiRooms = data;
     })
   }
 
+  updatePages(event: PageEvent) {
+    this.page.page = event.pageIndex;
+    this.page.size = event.pageSize;
+    this.jitsiService.get(this.page.page, this.page.size, this.page.sort, this.page.desc).subscribe((data: any) => {
+      this.jitsiRooms = data;
+    }, (error) => {})
+  }
+
+  updateSort(sort: Sort) {
+    if(sort.direction == "") {
+      this.page.sort = "id";
+      this.page.desc = false;
+    } else {
+      this.page.sort = sort.active;
+      this.page.desc = sort.direction == "desc";
+    }
+    this.jitsiService.get(this.page.page, this.page.size, this.page.sort, this.page.desc).subscribe((data: any) => {
+      this.jitsiRooms = data;
+    }, (error) => {})
+  }
+
+
   confirmDelete(jitsiRoom) {
     const dialogRef = this.dialog.open(ConfirmDialog, {
       data: {
@@ -107,28 +133,9 @@ export class JitsiComponent implements OnInit {
     });
   }
 
-  sortData(sort: Sort) {
-    const data = this.jitsiRooms.slice();
-    if(!sort.active || sort.direction === '') {
-      this.jitsiRooms = data;
-      return;
-    }
 
-    this.jitsiRooms = data.sort((a, b) => {
-      const isAsc = sort.direction === 'asc';
-      switch(sort.active) {
-        case 'room': return this.compare(a.room, b.room, isAsc);
-        case 'starts': return this.compare(a.room, b.room, isAsc);
-        case 'moderationStarts': return this.compare(a.room, b.room, isAsc);
-        case 'expires': return this.compare(a.room, b.room, isAsc);
-        default: return 0;
-      }
-    });
-  }
 
-  compare(a: number | string | String, b: number | string | String, isAsc: boolean) {
-    return (a < b ? -1 : 1) * (isAsc ? 1 : -1);
-  }
+
 
   share(jitsiRoom) {
     const dialogRef = this.dialog.open(JitsiShareDialog, {