#328656 Implement the concept of join requests.

app/groups/group-details/group-details.component.css

@@ -65,3 +65,7 @@
   font-size: 12;
   font-weight: bold;
 }
+
+.application-sent-msg {
+  color: grey;
+}

app/groups/group-details/group-details.component.ts

@@ -4,7 +4,7 @@ import { RouterExtensions } from 'nativescript-angular/router';
 import { Page } from 'ui/page';
 
 import { GroupsService, AlertService, EverliveProvider, UsersService, PlatformService } from '../../services';
-import { Group, User } from '../../shared/models';
+import { Group, User, GroupJoinRequest } from '../../shared/models';
 import { utilities } from '../../shared';
 
 @Component({
@@ -18,6 +18,7 @@ export class GroupDetailsComponent implements OnInit {
     members: User[] = [];
     isAndroid: boolean = false;
     iosPopupOpen: boolean = false;
+    userApplication: GroupJoinRequest = null;
     private _currentUser: User;
     private _disableJoinBtn: boolean = false;
 
@@ -51,13 +52,15 @@ export class GroupDetailsComponent implements OnInit {
             Promise.all<any>([userPrm, groupPrm])
                 .then(() => this._groupsService.getGroupMembers(this.group.Id))
                 .then(members => {
-                    this.hasJoined = members.some(m => m.Id === this._currentUser.Id);
                     this.members = members;
                 })
-                .then(() => {
+                .then(() => this._groupsService.getApplication(this.group.Id, this._currentUser.Id))
+                .then((application) => {
+                    this.userApplication = application;
+                    this.hasJoined = this.members.some(m => m.Id === this._currentUser.Id);
                     let promise = Promise.resolve(false);
 
-                    if (!this.hasJoined && p['joinRedirect']) { // join if its a join redirect
+                    if (!this.userApplication && !this.hasJoined && p['joinRedirect']) { // join if its a join redirect
                         this._disableJoinBtn = true;
                         promise = this._groupsService.joinGroup(this.group.Id, this._currentUser.Id);
                     }
@@ -142,6 +145,7 @@ export class GroupDetailsComponent implements OnInit {
             .then((resp) => {
                 if (this.group.RequiresApproval) {
                     this._alertsService.showSuccess(`Request to join "${this.group.Name}" sent`);
+                    this.userApplication = { Approved: false } as any;
                 } else {
                     this._addCurrentUserAsRegistered();
                 }
@@ -174,6 +178,20 @@ export class GroupDetailsComponent implements OnInit {
         this._routerExtensions.navigateByUrl(`/groups`);
     }
 
+    getApplicationStatusText() {
+        let text = '';
+        if (this.userApplication.Resolved) {
+            text = `Your request to join ${this.group.Name} has been denied`;
+        } else {
+            text = `Your request to join ${this.group.Name} has not been resolved yet`;
+        }
+        return text;
+    }
+
+    showJoinBtn() {
+        return this.hasJoined === false && this.userApplication == null;
+    }
+
     private _addCurrentUserAsRegistered() {
         this.hasJoined = true;
         let clone = this.members.slice(0);

app/groups/group-details/group-details.template.html

@@ -21,7 +21,8 @@
 
             <photo-picker [url]="group.ImageUrl" [type]="'group'" [noImageIcon]="'&#x77;'" [noImageText]="'No image available'"></photo-picker>
 
-            <Label class="btn btn-primary join-group" *ngIf="hasJoined === false" [text]="getJoinBtnText()" (tap)="onJoin()"></Label>
+            <Label class="btn btn-primary join-group" *ngIf="showJoinBtn()" [text]="getJoinBtnText()" (tap)="onJoin()"></Label>
+            <Label class="application-sent-msg" *ngIf="!!userApplication" [text]="getApplicationStatusText()" textWrap="true"></Label>
 
             <GridLayout *ngIf="hasJoined === true" class="action-bar" [ngClass]="{ 'admin': !canEdit() }" [attr.columns]="(canEdit() && group.RequiresApproval) ? '*, *, *' : '*, *'">
                 <StackLayout *ngIf="group.RequiresApproval && canEdit()" class="btn" (tap)="onViewRequests()" col="0">

app/services/groups.service.ts

@@ -2,13 +2,14 @@ import { Injectable } from '@angular/core';
 import { Data } from '../../node_modules/everlive-sdk/dist/declarations/everlive/types/Data';
 
 import { EverliveProvider } from './';
-import { Group, GroupMembership, User } from '../shared/models';
+import { Group, GroupMembership, User, GroupJoinRequest } from '../shared/models';
 import { utilities } from '../shared';
 
 @Injectable()
 export class GroupsService {
     private _membershipsData: Data<GroupMembership>;
     private _groupsData: Data<Group>;
+    private _groupJoinRequests: Data<GroupJoinRequest>;
     private readonly _imageExpandExp = {
         Image: {
             TargetTypeName: 'Files',
@@ -36,6 +37,7 @@ export class GroupsService {
     ) {
         this._membershipsData = this._elProvider.getData<GroupMembership>('GroupMembers');
         this._groupsData = this._elProvider.getData<Group>('Groups');
+        this._groupJoinRequests = this._elProvider.getData<GroupJoinRequest>('GroupJoinRequests');
     }
 
     create(group: Group) {
@@ -137,9 +139,7 @@ export class GroupsService {
         }
 
         return this._membershipsData.get({ UserId: userId, GroupId: groupId })
-            .then(resp => {
-                return resp.count > 0;
-            });
+            .then(resp => resp.count > 0);
     }
 
     update(group: Group) {
@@ -151,6 +151,14 @@ export class GroupsService {
         return this._groupsData.destroySingle(id).then(r => r.result);
     }
 
+    getApplication(groupId: string, userId: string) {
+        let query = this._elProvider.getNewQuery();
+        query.where({ GroupId: groupId, ApplicantId: userId });
+        query.expand({ ApplicantId: { ReturnAs: 'Applicant' } });
+        return this._groupJoinRequests.get(query)
+            .then(resp => resp.result[0]);
+    }
+
     validateGroupEntry(group: Group) {
         let errMsg: string = null;
 

app/shared/models/group-join-request.model.ts

@@ -0,0 +1,8 @@
+import { ItemModel } from './item.model';
+
+export class GroupJoinRequest extends ItemModel {
+    ApplicantId: string;
+    GroupId: string;
+    Approved: boolean;
+    Resolved: boolean;
+}

app/shared/models/index.ts

@@ -3,4 +3,5 @@ export * from './user.model';
 export * from './item.model';
 export * from './event-registration.model';
 export * from './group-membership.model';
+export * from './group-join-request.model';
 export * from './group.model';