lots of changes

Author: ryanslatten

service/src/models/event.d.ts

@@ -53,7 +53,7 @@ export type FormFieldChoiceDocument = FormFieldChoice & mongoose.Document & {
 }
 
 export type TODO = any
-export type Callback<Result = unknown> = (err: Error | null, result?: Result) => void
+export type Callback<Result = unknown> = (err: Error | null, result?: Result, totalCount?: number) => void
 
 export declare function count(options: TODO, callback: Callback<number>): void
 export declare function getEvents(options: TODO, callback: Callback<MageEventDocument[]>): void

service/src/models/event.js

@@ -321,7 +321,7 @@ exports.count = function (options, callback) {
   });
 };
 
-exports.getEvents = function (options, callback) {
+exports.getEvents = async function (options, callback) {
   if (typeof options === 'function') {
     callback = options;
     options = {};
@@ -331,6 +331,14 @@ exports.getEvents = function (options, callback) {
   const filter = options.filter || {};
   if (filter.complete === true) query.complete = true;
   if (filter.complete === false) query.complete = { $ne: true };
+  if (filter.teamId) query.teamIds = filter.teamId;
+  if (filter.searchTerm) {
+    const searchRegex = new RegExp(filter.searchTerm, 'i');
+    query['$or'] = [
+      { name: searchRegex },
+      { description: searchRegex }
+    ];
+  }
 
   let projection = {};
   if (options.projection) {
@@ -341,6 +349,8 @@ exports.getEvents = function (options, callback) {
     projection.teamIds = true;
   }
 
+  const totalCount = await Event.count(query).exec();
+
   Event.find(query, projection, function (err, events) {
     if (err) return callback(err);
 
@@ -375,13 +385,16 @@ exports.getEvents = function (options, callback) {
 
       if (options.populate) {
         Event.populate(events, [{ path: 'teamIds' }, { path: 'layerIds' }], function (err, events) {
-          callback(err, events);
+          callback(err, events, totalCount);
         });
       } else {
-        callback(null, events);
+        callback(null, events, totalCount);
       }
     });
-  });
+  })
+    .sort({ name: 1, _id: 1 })
+    .limit(options.limit || 1000)
+    .skip(options.start * options.limit || 0);
 };
 
 exports.getById = function (id, options, callback) {

service/src/routes/events.ts

@@ -2,15 +2,21 @@ import { Injectable } from '@angular/core';
 import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable } from 'rxjs';
 import { User } from '@ngageoint/mage.web-core-lib/user';
+import { Event } from 'src/app/filter/filter.types';
 
 export interface SearchOptions {
-    populate?: boolean;
-    limit?: number;
-    sort?: { [key: string]: 1 | -1 };
-    omit_event_teams?: boolean;
     term?: string;
-    start?: string;
+    teamId?: string;
     id?: string;
+    page?: number;
+    page_size?: number;
+}
+
+interface EventsResponse {
+    pageSize?: number;
+    page?: number;
+    items: Event[];
+    totalCount?: number;
 }
 
 @Injectable({
@@ -20,53 +26,28 @@ export class EventsService {
 
     constructor(private http: HttpClient) { }
 
-    getEvents(options: SearchOptions): Observable<any> {
+    getEvents(options: SearchOptions): Observable<EventsResponse> {
         let params = new HttpParams();
 
-        if (options.populate !== undefined) {
-            params = params.set('populate', String(options.populate));
-        }
-        if (options.limit !== undefined) {
-            params = params.set('limit', String(options.limit));
-        }
-        if (options.sort !== undefined) {
-            params = params.set('sort', JSON.stringify(options.sort));
-        }
-        if (options.omit_event_teams !== undefined) {
-            params = params.set('omit_event_teams', String(options.omit_event_teams));
-        }
         if (options.term !== undefined) {
             params = params.set('term', options.term);
         }
-        if (options.start !== undefined) {
-            params = params.set('start', options.start);
-        }
-
-        return this.http.get('/api/events', { params });
-    }
-
-    getNonMembers(options: SearchOptions): Observable<User[]> {
-        let params = new HttpParams();
-
-        if (options.populate !== undefined) {
-            params = params.set('populate', String(options.populate));
-        }
-        if (options.limit !== undefined) {
-            params = params.set('limit', String(options.limit));
-        }
-        if (options.sort !== undefined) {
-            params = params.set('sort', JSON.stringify(options.sort));
-        }
-        if (options.omit_event_teams !== undefined) {
-            params = params.set('omit_event_teams', String(options.omit_event_teams));
+        if (options.page !== undefined) {
+            params = params.set('start', String(options.page));
         }
-        if (options.term !== undefined) {
-            params = params.set('term', options.term);
+        if (options.page_size !== undefined) {
+            params = params.set('limit', String(options.page_size));
         }
-        if (options.start !== undefined) {
-            params = params.set('start', options.start);
+        if (options.teamId !== undefined) {
+            params = params.set('teamId', options.teamId);
         }
 
-        return this.http.get<User[]>(`/api/events/${options.id}/nonMembers`, { params });
+        params = params.set('includePagination', 'true');
+
+        return this.http.get<EventsResponse>('/api/events', { params });
+    }
+
+    removeEvent(eventId: string): Observable<void> {
+        return this.http.delete<void>(`/api/events/${eventId}`);
     }
 }

web-app/admin/src/app/admin/admin-event/events.service.ts

@@ -8,6 +8,9 @@ import { MatDialogModule } from '@angular/material/dialog';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
 import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatIconModule } from '@angular/material/icon';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 
 import { TeamDashboardComponent } from './dashboard/team-dashboard.component';
 import { CreateTeamDialogComponent } from './create-team/create-team.component';
@@ -16,13 +19,15 @@ import { EventsService } from '../admin-event/events.service';
 import { TeamDetailsComponent } from './team-details/team-details.component';
 import { CoreModule } from '../../core/core.module';
 import { DeleteTeamComponent } from './delete-team/delete-team.component';
+import { SearchModalComponent } from './search-modal/search-modal.component';
 
 @NgModule({
     declarations: [
         TeamDashboardComponent,
         CreateTeamDialogComponent,
         TeamDetailsComponent,
-        DeleteTeamComponent
+        DeleteTeamComponent,
+        SearchModalComponent
     ],
     imports: [
         CommonModule,
@@ -35,15 +40,19 @@ import { DeleteTeamComponent } from './delete-team/delete-team.component';
         MatDialogModule,
         MatFormFieldModule,
         MatInputModule,
-        MatButtonModule
+        MatButtonModule,
+        MatCheckboxModule,
+        MatIconModule,
+        MatProgressSpinnerModule
     ],
     providers: [
         TeamsService,
         EventsService
     ],
     entryComponents: [
         CreateTeamDialogComponent,
-        DeleteTeamComponent
+        DeleteTeamComponent,
+        SearchModalComponent
     ]
 })
 export class AdminTeamsModule { }

web-app/admin/src/app/admin/admin-teams/admin-teams.module.ts

@@ -1,25 +1,37 @@
-<div class="admin-team-create">
-    <h1 mat-dialog-title>New Team</h1>
-    <div mat-dialog-content>
-        <div *ngIf="errorMessage" class="error-message" style="color: red; margin-bottom: 16px;">
-            {{ errorMessage }}
+<div class="modern-dialog">
+    <div class="dialog-header">
+        <h2 class="dialog-title">Create a New Team</h2>
+    </div>
+
+    <div class="dialog-content">
+        <div *ngIf="errorMessage" class="error-alert">
+            <i class="fa fa-exclamation-triangle"></i>
+            <span>{{ errorMessage }}</span>
         </div>
-        <form [formGroup]="teamForm">
-            <mat-form-field class="full-width">
-                <mat-label>Name</mat-label>
-                <input matInput formControlName="name" required>
-                <mat-error *ngIf="teamForm.get('name').hasError('required')">
+
+        <form [formGroup]="teamForm" class="team-form">
+            <div class="form-field">
+                <label class="field-label">Team Name</label>
+                <input type="text" class="form-input" formControlName="name" placeholder="Enter team name">
+                <div *ngIf="teamForm.get('name').hasError('required')" class="field-error">
+                    <i class="fa fa-exclamation-circle"></i>
                     Name is required
-                </mat-error>
-            </mat-form-field>
-            <mat-form-field class="full-width">
-                <mat-label>Description</mat-label>
-                <textarea matInput formControlName="description"></textarea>
-            </mat-form-field>
+                </div>
+            </div>
+
+            <div class="form-field">
+                <label class="field-label">Description</label>
+                <textarea class="form-input" formControlName="description" rows="3"
+                    placeholder="Enter team description (optional)"></textarea>
+            </div>
         </form>
     </div>
-    <div mat-dialog-actions>
-        <button mat-button (click)="cancel()">Cancel</button>
-        <button mat-button color="primary" (click)="save()" [disabled]="teamForm.invalid">Save</button>
+
+    <div class="dialog-actions">
+        <button class="action-button" (click)="cancel()">Cancel</button>
+        <button class="action-button btn-primary" (click)="save()" [disabled]="teamForm.invalid">
+            <i class="fa fa-save"></i>
+            Create Team
+        </button>
     </div>
 </div>