Merge pull request #737 from IT-Academy-BCN/feature/43-toast-draft-saved

feat(challenge): add toast notification on draft save (IT Challanges #43)

Author: ivilarop

CHANGELOG.md

@@ -4,6 +4,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to
 [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+### [ita-challenges-frontend-3.27.0-RELEASE] - 2026-02-16
+### Added
+- Feedback to user when saving solution.
+
 ### [itachallenge-frontend-3.26.0-RELEASE] - 2026-02-16
 
 ### Changed

conf/.env.CI.dev

@@ -1,2 +1,2 @@
 MICROSERVICE_DEPLOY=ita-challenges-frontend
-MICROSERVICE_VERSION=3.26.0-RELEASE
+MICROSERVICE_VERSION=3.27.0-RELEASE

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ita-challenges-frontend",
-  "version": "3.26.0-RELEASE",
+  "version": "3.27.0-RELEASE",
    "scripts": {
     "ng": "ng",
     "start": "ng serve --proxy-config proxy.conf.dev.json",

src/app/modules/challenge/components/challenge-header/challenge-header.component.spec.ts

@@ -17,6 +17,7 @@ import { SolutionStatus } from 'src/app/models/user-solution-status.enum';
 import { CommonModalService } from 'src/app/services/common-modal.service';
 import { SolutionAction } from 'src/app/models/user-solution-action.enum';
 import { UserSolution } from 'src/app/models/user-solution.interface';
+import { ToastrService } from 'ngx-toastr';
 
 describe('ChallengeHeaderComponent', () => {
   let component: ChallengeHeaderComponent;
@@ -27,6 +28,7 @@ describe('ChallengeHeaderComponent', () => {
   let authService: jest.Mocked<AuthService>;
   let solutionService: jest.Mocked<SolutionService>;
   let mockCommonModalService: jest.Mocked<CommonModalService>;
+  let mockToastrService: any;
 
   beforeEach(async () => {
     const mockRouter = { navigate: jest.fn() } as any;
@@ -65,6 +67,13 @@ describe('ChallengeHeaderComponent', () => {
       completeChallenge: jest.fn(),
     } as any
 
+    mockToastrService = {
+      success: jest.fn(),
+      error: jest.fn(),
+      info: jest.fn(),
+      warning: jest.fn()
+    };
+
     await TestBed.configureTestingModule({
       declarations: [ChallengeHeaderComponent],
       imports: [I18nModule, DynamicTranslatePipe, CustomDatePipe],
@@ -80,6 +89,7 @@ describe('ChallengeHeaderComponent', () => {
         { provide: AuthService, useValue: authService },
         { provide: SolutionService, useValue: solutionService },
         { provide: CommonModalService, useValue: mockCommonModalService },
+        { provide: ToastrService, useValue: mockToastrService },
       ],
     }).compileComponents();
 
@@ -296,6 +306,7 @@ describe('ChallengeHeaderComponent', () => {
     component.userId = 'user1';
     component.saveChallenge();
     expect(spy).toHaveBeenCalledWith('challenge1', 'lang1', 'user1', SolutionAction.SAVE_DRAFT, 'solution');
+    expect(mockToastrService.success).toHaveBeenCalledWith('messages.success.draft_saved')
   });
 
   it('should not save challenge if data is missing', () => {

src/app/modules/challenge/components/challenge-header/challenge-header.component.ts

@@ -13,6 +13,7 @@ import { CommonModalService } from "src/app/services/common-modal.service";
 import { SolutionAction } from 'src/app/models/user-solution-action.enum'
 import { UserSolution } from 'src/app/models/user-solution.interface'
 import { ShowSolutionModalComponent } from 'src/app/modules/modals/show-solution-modal/show-solution-modal.component'
+import { ToastrService } from 'ngx-toastr'
 
 @Component({
   selector: 'app-challenge-header',
@@ -32,8 +33,8 @@ export class ChallengeHeaderComponent implements OnInit {
   private readonly challengeService = inject(ChallengeService)
   private readonly solutionService = inject(SolutionService)
   private readonly authService = inject(AuthService)
-  private readonly commonModalService = inject(CommonModalService)  
-
+  private readonly commonModalService = inject(CommonModalService)
+  private readonly toastr = inject(ToastrService)
 
   public userId: string | null = null;
   public userRole: string | null = null;
@@ -216,6 +217,7 @@ export class ChallengeHeaderComponent implements OnInit {
     ).subscribe({
       next: (response: UserSolution) => {
         this.solutionState = response.status;
+        this.toastr.success(this.translate.instant('messages.success.draft_saved'))
       },
       error: (err) => {
         console.error(' Error saving solution', err);

src/assets/i18n/ca.json

@@ -228,7 +228,8 @@
     },
     "success": {
         "welcome": "Benvingut! Redirigint...",
-        "logout": "Tancament de sessió correcte"
+        "logout": "Tancament de sessió correcte",
+        "draft_saved": "Esborrany desat. Pots continuar treballant en la solució més tard."
     }
 },
     "status": {

src/assets/i18n/en.json

@@ -228,7 +228,8 @@
     },
     "success": {
         "welcome": "Welcome! Redirecting...",
-        "logout": "Logout successful"
+        "logout": "Logout successful",
+        "draft_saved": "Draft saved. You can continue working on your solution later."
     }
 },
     "status": {

src/assets/i18n/es.json

@@ -229,7 +229,8 @@
     },
     "success": {
         "welcome": "¡Bienvenido! Redirigiendo...",
-        "logout": "Cierre de sesión exitoso"
+        "logout": "Cierre de sesión exitoso",
+        "draft_saved": "Borrador guardado. Puedes continuar trabajando en tu solución más tarde."
     }
 },
     "status": {