diff --git a/frontend/src/app/app.component.ts b/frontend/src/app/app.component.ts
index a9ce6d0..4e55f7e 100644
--- a/frontend/src/app/app.component.ts
+++ b/frontend/src/app/app.component.ts
@@ -18,6 +18,7 @@ import { SoundInitializerService } from './shared/services/sound-initializer.ser
     LoginComponent,
     RegisterComponent,
     RecoverPasswordComponent,
+    PlaySoundDirective,
   ],
   templateUrl: './app.component.html',
   hostDirectives: [PlaySoundDirective],
diff --git a/frontend/src/app/shared/services/audio.service.ts b/frontend/src/app/shared/services/audio.service.ts
index 720658e..db44378 100644
--- a/frontend/src/app/shared/services/audio.service.ts
+++ b/frontend/src/app/shared/services/audio.service.ts
@@ -11,7 +11,7 @@ export class AudioService {
       return this.audioCache.get(soundName)!;
     }
 
-    const audio = new Audio(`/sounds/${soundName}`);
+    const audio = new Audio(`/sounds/${soundName}.mp3`);
     this.audioCache.set(soundName, audio);
     return audio;
   }