Merge pull request #185 from mansurskTarento/events

fixing preview issue and owl carosual issue

project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.scss

@@ -12,8 +12,8 @@
 
 .competency-passbook-theme {
     width: 100%;
-    max-width: 344px;
-    min-width: 320px;
+    max-width: 294px;
+    min-width: 294px;
     height: 92px;
     border-top-right-radius: 8px;
     border-bottom-right-radius: 12px;
@@ -23,14 +23,14 @@
 
 .ellipsis {
     white-space: nowrap;
-    width: 280px;
+    width: 269px;
     overflow: hidden;
     text-overflow: ellipsis;
 }
 
 .detail {
     width: 100%;
-    max-width: 344px;
+    max-width: 292px;
     background-color: rgb(255, 255, 255);
     border-radius: 8px;
     position: relative;

project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.spec.ts

@@ -1,21 +1,51 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { CardCompetencyComponent } from './card-competency.component'
 
-import { CardCompetencyComponent } from './card-competency.component';
+// Mock animations (since we don't need them for the unit test)
+jest.mock('@angular/animations', () => ({
+  trigger: jest.fn(),
+  state: jest.fn(),
+  style: jest.fn(),
+  animate: jest.fn(),
+  transition: jest.fn(),
+}))
 
 describe('CardCompetencyComponent', () => {
-  let component: CardCompetencyComponent;
-  let fixture: ComponentFixture<CardCompetencyComponent>;
+  let component: CardCompetencyComponent
 
   beforeEach(() => {
-    TestBed.configureTestingModule({
-      declarations: [CardCompetencyComponent]
-    });
-    fixture = TestBed.createComponent(CardCompetencyComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
+    component = new CardCompetencyComponent()
+  })
+
+  it('should create the component', () => {
+    expect(component).toBeTruthy()
+  })
+
+  it('should initialize with default values', () => {
+    expect(component.isExpanded).toBe(false)
+    expect(component.theme).toEqual([])
+    expect(component.competencyArea).toBe('')
+  })
+
+  it('should toggle isExpanded state when handleToggleSize is called', () => {
+    expect(component.isExpanded).toBe(false) // Initial state
+
+    component.handleToggleSize('viewMore')
+    expect(component.isExpanded).toBe(true) // After first toggle
+
+    component.handleToggleSize('viewMore')
+    expect(component.isExpanded).toBe(false) // After second toggle
+  })
+
+  it('should set the correct theme input', () => {
+    const mockTheme = ['dark', 'blue']
+    component.theme = mockTheme
+    expect(component.theme).toEqual(mockTheme)
+  })
+
+  it('should set the correct competencyArea input', () => {
+    const mockCompetencyArea = 'Software Development'
+    component.competencyArea = mockCompetencyArea
+    expect(component.competencyArea).toBe(mockCompetencyArea)
+  })
+
+})

project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.spec.ts

@@ -1,21 +1,202 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { CreateEventComponent } from './create-event.component'
+import { FormBuilder } from '@angular/forms'
+import { EventsService } from '../../services/events.service'
+import { ActivatedRoute, Router, ActivatedRouteSnapshot, ParamMap, Params, Data } from '@angular/router'
+import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
+import { DatePipe } from '@angular/common'
+import { of, throwError } from 'rxjs'
 
-import { CreateEventComponent } from './create-event.component';
+jest.mock('@angular/router', () => ({
+  ...jest.requireActual('@angular/router'),
+  ActivatedRoute: jest.fn(),
+  Router: jest.fn()
+}))
 
 describe('CreateEventComponent', () => {
-  let component: CreateEventComponent;
-  let fixture: ComponentFixture<CreateEventComponent>;
+  let component: CreateEventComponent
+  let mockEventsService: jest.Mocked<EventsService>
+  let mockRouter: jest.Mocked<Router>
+  let mockActivatedRoute: Partial<ActivatedRoute>
+  let mockSnackBar: jest.Mocked<MatSnackBar>
+  let mockDatePipe: jest.Mocked<DatePipe>
 
   beforeEach(() => {
-    TestBed.configureTestingModule({
-      declarations: [CreateEventComponent]
-    });
-    fixture = TestBed.createComponent(CreateEventComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
+    const mockParamMap: ParamMap = {
+      has: jest.fn(),
+      get: jest.fn(),
+      getAll: jest.fn(),
+      keys: []
+    }
+
+    const mockSnapshot = {
+      paramMap: mockParamMap,
+      queryParamMap: mockParamMap,
+      data: {
+        configService: {
+          userProfile: { name: 'Test User' }
+        },
+        eventDetails: {
+          data: {
+            identifier: '123',
+            name: 'Test Event',
+            description: 'Test Description',
+            status: 'Draft'
+          }
+        }
+      } as Data,
+      params: {} as Params,
+      queryParams: {} as Params,
+      url: [],
+      pathFromRoot: []
+    } as unknown as ActivatedRouteSnapshot
+
+    mockEventsService = {
+      updateEvent: jest.fn()
+    } as any
+
+    mockRouter = {
+      navigate: jest.fn()
+    } as any
+
+    mockActivatedRoute = {
+      snapshot: mockSnapshot,
+      queryParams: of({ mode: 'edit', pathUrl: 'test-path' })
+    } as any
+
+    mockSnackBar = {
+      open: jest.fn()
+    } as any
+
+    mockDatePipe = {
+      transform: jest.fn((date: any) => {
+        if (date instanceof Date) {
+          return '2025-02-17'
+        }
+        return date
+      })
+    } as any
+
+    component = new CreateEventComponent(
+      mockEventsService,
+      mockActivatedRoute as ActivatedRoute,
+      new FormBuilder(),
+      mockRouter,
+      mockSnackBar,
+      mockDatePipe
+    )
+  })
 
   it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
+    expect(component).toBeTruthy()
+  })
+
+  describe('ngOnInit', () => {
+    it('should initialize form and get event details', () => {
+      component.ngOnInit()
+      expect(component.eventDetailsForm).toBeDefined()
+      expect(component.eventId).toBe('123')
+    })
+
+    it('should disable form in view mode', () => {
+      mockActivatedRoute.queryParams = of({ mode: 'view', pathUrl: 'test-path' })
+      component.ngOnInit()
+      expect(component.eventDetailsForm.disabled).toBeTruthy()
+    })
+  })
+
+  describe('navigateBack', () => {
+    it('should navigate to correct path', () => {
+      component.pathUrl = 'test-path'
+      component.navigateBack()
+      expect(mockRouter.navigate).toHaveBeenCalledWith(['/app/home/events/test-path'])
+    })
+  })
+
+  describe('moveToNextForm', () => {
+    beforeEach(() => {
+      component.ngOnInit()
+    })
+
+    it('should not move to next step if form is invalid', () => {
+      component.currentStepperIndex = 0
+      component.moveToNextForm()
+      expect(component.currentStepperIndex).toBe(0)
+      expect(mockSnackBar.open).toHaveBeenCalledWith('Please fill mandatory fields')
+    })
+
+    it('should move to next step if in view mode', () => {
+      component.openMode = 'view'
+      component.currentStepperIndex = 0
+      component.moveToNextForm()
+      expect(component.currentStepperIndex).toBe(1)
+    })
+  })
+
+  describe('saveAndExit', () => {
+    beforeEach(() => {
+      component.ngOnInit()
+      component.eventId = '123'
+      mockDatePipe.transform.mockReturnValue('2025-02-17')
+    })
+
+    it('should save event successfully', () => {
+      mockEventsService.updateEvent.mockReturnValue(of({ success: true }))
+      component.saveAndExit()
+      expect(mockSnackBar.open).toHaveBeenCalledWith('Event details saved successfully')
+      expect(mockRouter.navigate).toHaveBeenCalled()
+    })
+
+    it('should handle error when saving event', () => {
+      const error = {
+        error: {
+          message: 'Something went wrong while updating event, please try again'
+        }
+      }
+      mockEventsService.updateEvent.mockReturnValue(throwError(() => error))
+      component.saveAndExit()
+      expect(mockSnackBar.open).toHaveBeenCalledWith('Something went wrong while updating event, please try again')
+    })
+  })
+
+  describe('getFormatedTime', () => {
+    it('should format AM time correctly', () => {
+      const result = component.getFormatedTime('10:30 AM')
+      expect(result).toBe('10:30:00+05:30')
+    })
+
+    it('should format PM time correctly', () => {
+      const result = component.getFormatedTime('02:30 PM')
+      expect(result).toBe('14:30:00+05:30')
+    })
+
+    it('should handle 12 AM correctly', () => {
+      const result = component.getFormatedTime('12:00 AM')
+      expect(result).toBe('00:00:00+05:30')
+    })
+
+    it('should handle 12 PM correctly', () => {
+      const result = component.getFormatedTime('12:00 PM')
+      expect(result).toBe('12:00:00+05:30')
+    })
+  })
+
+  describe('preview', () => {
+    it('should set showPreview to true and update currentStepperIndex', (done) => {
+      component.preview()
+      expect(component.showPreview).toBeTruthy()
+
+      setTimeout(() => {
+        expect(component.currentStepperIndex).toBe(4)
+        done()
+      }, 100)
+    })
+  })
+
+  describe('addCompetencies', () => {
+    it('should update competencies array', () => {
+      const testCompetencies = ['comp1', 'comp2']
+      component.addCompetencies(testCompetencies)
+      expect(component.competencies).toEqual(testCompetencies)
+    })
+  })
+})

project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts

@@ -3,7 +3,7 @@ import { EventsService } from '../../services/events.service'
 import { ActivatedRoute, Router } from '@angular/router'
 import * as _ from 'lodash'
 import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms'
-import { material, speaker } from '../../models/events.model'
+import { URL_PATRON, material, speaker } from '../../models/events.model'
 import { StepperSelectionEvent } from '@angular/cdk/stepper'
 import { MatStepper } from '@angular/material/stepper'
 import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'
@@ -59,7 +59,7 @@ export class CreateEventComponent implements OnInit, AfterViewInit {
       startDate: new FormControl('', [Validators.required]),
       startTime: new FormControl('', [Validators.required]),
       endTime: new FormControl('', [Validators.required]),
-      registrationLink: new FormControl('', [Validators.required]),
+      registrationLink: new FormControl('', [Validators.required, Validators.pattern(URL_PATRON)]),
       recordedLinks: new FormControl(''),
       appIcon: new FormControl('', [Validators.required]),
     })
@@ -179,7 +179,7 @@ export class CreateEventComponent implements OnInit, AfterViewInit {
   }
 
   get canPublish(): boolean {
-    if (this.currentStepperIndex === 3) {
+    if (this.currentStepperIndex >= 3) {
       if (this.eventDetailsForm.invalid) {
         this.openSnackBar('Please fill mandatory fields in basic details')
         return false