Merge pull request #167 from theImmortalCoders/dev

Release 1.8

src/app/app.routes.ts

@@ -8,9 +8,11 @@ import { Error500PageComponent } from './shared/components/error-pages/error500.
 import { RegisterConfirmComponent } from './user-workflow/register/components/register-confirm.component';
 import { ResetPasswordComponent } from './user-workflow/login/components/reset-password.component';
 import { DashboardPageComponent } from './dashboard/dashboard.page.component';
-import { authGuard } from '@utils/helpers/auth.guard';
-import { guestGuard } from '@utils/helpers/guest.guard';
+import { authGuard } from '@utils/guards/auth.guard';
+import { guestGuard } from '@utils/guards/guest.guard';
 import { GameListPageComponent } from './game-list/game-list.page.component';
+import { UserDetailsComponent } from './dashboard/user-details/user-details.component';
+import { userIdGuard } from '@utils/guards/user-id.gurad';
 
 export const routes: Routes = [
   {
@@ -29,6 +31,12 @@ export const routes: Routes = [
     title: 'Dashboard Page',
     canActivate: [authGuard],
   },
+  {
+    path: 'dashboard/user/:id',
+    component: UserDetailsComponent,
+    title: 'User Details',
+    canActivate: [userIdGuard],
+  },
   {
     path: 'game/:gameName',
     component: GamePageComponent,

src/app/dashboard/components/sections/admin-settings/admin-settings.component.spec.ts

@@ -1,21 +1,16 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { AdminSettingsComponent } from './admin-settings.component';
 import { AdministrationEndpointsService } from '@endpoints/administration-endpoints.service';
-import { StatsEndpointsService } from '@endpoints/stats-endpoints.service';
 import { NotificationService } from 'app/shared/services/notification.service';
 import { of, throwError } from 'rxjs';
-import {
-  IUserResponse,
-  IUserStatsResponse,
-} from 'app/shared/models/user.models';
+import { IUserResponse } from 'app/shared/models/user.models';
 import { TRole } from 'app/shared/models/role.enum';
 import { HttpClientTestingModule } from '@angular/common/http/testing';
 
 describe('AdminSettingsComponent', () => {
   let component: AdminSettingsComponent;
   let fixture: ComponentFixture<AdminSettingsComponent>;
   let adminServiceSpy: jasmine.SpyObj<AdministrationEndpointsService>;
-  let statsServiceSpy: jasmine.SpyObj<StatsEndpointsService>;
 
   const mockUser: IUserResponse = {
     id: 1,
@@ -26,14 +21,8 @@ describe('AdminSettingsComponent', () => {
     studyCycleYearB: 2,
     banned: false,
     lastPlayed: '',
-  };
-
-  const mockUserStats: IUserStatsResponse = {
-    games: 5,
-    plays: 20,
-    totalStorageMb: 512,
-    firstPlayed: '',
-    lastPlayed: '',
+    course: { id: 1, name: '' },
+    group: 'l1',
   };
 
   beforeEach(async () => {
@@ -42,9 +31,6 @@ describe('AdminSettingsComponent', () => {
       'banStatus',
       'changeRole',
     ]);
-    const statsSpy = jasmine.createSpyObj('StatsEndpointsService', [
-      'getUserStats',
-    ]);
     const notificationSpy = jasmine.createSpyObj('NotificationService', [
       'addNotification',
     ]);
@@ -53,7 +39,6 @@ describe('AdminSettingsComponent', () => {
       imports: [AdminSettingsComponent, HttpClientTestingModule],
       providers: [
         { provide: AdministrationEndpointsService, useValue: adminSpy },
-        { provide: StatsEndpointsService, useValue: statsSpy },
         { provide: NotificationService, useValue: notificationSpy },
       ],
     }).compileComponents();
@@ -64,9 +49,6 @@ describe('AdminSettingsComponent', () => {
     adminServiceSpy = TestBed.inject(
       AdministrationEndpointsService
     ) as jasmine.SpyObj<AdministrationEndpointsService>;
-    statsServiceSpy = TestBed.inject(
-      StatsEndpointsService
-    ) as jasmine.SpyObj<StatsEndpointsService>;
 
     fixture.detectChanges();
   });
@@ -85,17 +67,6 @@ describe('AdminSettingsComponent', () => {
     expect(component.usersList).toEqual([mockUser]);
   });
 
-  it('should set user stats when getUserDetailsModal is called and user is selected', () => {
-    adminServiceSpy.getUsers.and.returnValue(of([mockUser]));
-    statsServiceSpy.getUserStats.and.returnValue(of(mockUserStats));
-
-    component.getUserDetailsModal();
-    expect(adminServiceSpy.getUsers).toHaveBeenCalled();
-    component.setSelectedUser({ target: { value: '1' } } as unknown as Event);
-    expect(statsServiceSpy.getUserStats).toHaveBeenCalledWith(mockUser.id);
-    expect(component.selectedUserStats).toEqual(mockUserStats);
-  });
-
   it('should update ban status and show notification', () => {
     component.selectedUserData = mockUser;
     component.isBanned = true;

src/app/dashboard/components/sections/admin-settings/admin-settings.component.ts

@@ -4,25 +4,16 @@ import { ModalComponent } from '../../shared/modal.component';
 import { AdministrationEndpointsService } from '@endpoints/administration-endpoints.service';
 import { NotificationService } from 'app/shared/services/notification.service';
 import { Subscription } from 'rxjs';
-import {
-  IUserResponse,
-  IUserStatsResponse,
-} from 'app/shared/models/user.models';
+import { IUserResponse } from 'app/shared/models/user.models';
 import { TRole } from 'app/shared/models/role.enum';
 import { CommonModule } from '@angular/common';
-import { StatsEndpointsService } from '@endpoints/stats-endpoints.service';
-import { SelectedUserInfoComponent } from './selected-user-info.component';
 import { AllowedRolesDirective } from '@utils/directives/allowed-roles.directive';
+import { RouterLink } from '@angular/router';
 
 @Component({
   selector: 'app-admin-settings',
   standalone: true,
-  imports: [
-    ModalComponent,
-    CommonModule,
-    SelectedUserInfoComponent,
-    AllowedRolesDirective,
-  ],
+  imports: [ModalComponent, CommonModule, AllowedRolesDirective, RouterLink],
   template: `
     <h1
       class="text-xl xs:text-2xl sm:text-4xl font-bold text-mainOrange text-center 2xs:text-start">
@@ -124,14 +115,13 @@ import { AllowedRolesDirective } from '@utils/directives/allowed-roles.directive
               </select>
             </div>
           } @else if (
-            modalVisibility === 'getUserDetails' &&
-            selectedUserData !== null &&
-            selectedUserStats !== null
+            modalVisibility === 'getUserDetails' && selectedUserData !== null
           ) {
-            <app-selected-user-info
-              [selectedUserData]="selectedUserData"
-              [selectedUserStats]="selectedUserStats"
-              class="flex flex-col pt-2 xs:pt-4 items-start text-sm 2xs:text-base sm:text-lg" />
+            <a
+              [routerLink]="['/dashboard/user', selectedUserData.id]"
+              class="flex flex-row w-full items-center justify-center group space-x-2 rounded-lg mt-1 xs:mt-2 px-2 xs:px-3 py-1 xs:py-2 bg-mainGray text-mainOrange border-2 border-mainOrange transition-all ease-in-out hover:bg-mainOrange hover:text-mainGray text-base">
+              Check user details
+            </a>
           }
           @if (modalButtonText !== null) {
             <button
@@ -157,7 +147,6 @@ import { AllowedRolesDirective } from '@utils/directives/allowed-roles.directive
 })
 export class AdminSettingsComponent implements OnDestroy {
   private _adminEndpointsService = inject(AdministrationEndpointsService);
-  private _statsEndpointsService = inject(StatsEndpointsService);
   private _notificationService = inject(NotificationService);
 
   private _getUsersSubscription = new Subscription();
@@ -167,7 +156,6 @@ export class AdminSettingsComponent implements OnDestroy {
 
   public usersList: IUserResponse[] | null = null;
   public selectedUserData: IUserResponse | null = null;
-  public selectedUserStats: IUserStatsResponse | null = null;
   public isBanned = false;
   public newUserRole: TRole = TRole.Student;
   public errorMessage: string | null = null;
@@ -182,7 +170,6 @@ export class AdminSettingsComponent implements OnDestroy {
   public modalButtonText: string | null = '';
   public modalButtonFunction!: () => void;
 
-  // eslint-disable-next-line complexity
   public setSelectedUser(event: Event): void {
     const target = event.target as HTMLSelectElement;
     const selectedId = parseInt(target?.value, 10);
@@ -196,24 +183,6 @@ export class AdminSettingsComponent implements OnDestroy {
     } else {
       this.selectedUserData = null;
     }
-    if (
-      this.modalVisibility === 'getUserDetails' &&
-      this.selectedUserData &&
-      selectedId !== 0
-    ) {
-      this._getUserStatsSubscription = this._statsEndpointsService
-        .getUserStats(this.selectedUserData.id)
-        .subscribe({
-          next: (response: IUserStatsResponse) => {
-            this.selectedUserStats = response;
-          },
-          error: () => {
-            this.selectedUserStats = null;
-          },
-        });
-    } else {
-      this.selectedUserStats = null;
-    }
     if (this.selectedUserData === null) {
       this.isBanned = false;
       this.selectedUserData = null;