diff --git a/frontend/ng-karaoqueue/package-lock.json b/frontend/ng-karaoqueue/package-lock.json
index e88fee3..e8c702c 100644
--- a/frontend/ng-karaoqueue/package-lock.json
+++ b/frontend/ng-karaoqueue/package-lock.json
@@ -9,12 +9,12 @@
       "version": "0.0.0",
       "dependencies": {
         "@angular/animations": "~12.2.16",
-        "@angular/cdk": "~11.2.13",
+        "@angular/cdk": "~12.2.13",
         "@angular/common": "~12.2.16",
         "@angular/compiler": "~12.2.16",
         "@angular/core": "~12.2.16",
         "@angular/forms": "~12.2.16",
-        "@angular/material": "^11.2.13",
+        "@angular/material": "^12.2.13",
         "@angular/platform-browser": "~12.2.16",
         "@angular/platform-browser-dynamic": "~12.2.16",
         "@angular/router": "~12.2.16",
@@ -186,18 +186,19 @@
       }
     },
     "node_modules/@angular/cdk": {
-      "version": "11.2.13",
-      "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-11.2.13.tgz",
-      "integrity": "sha512-FkE4iCwoLbQxLDUOjV1I7M/6hmpyb7erAjEdWgch7nGRNxF1hqX5Bqf1lvLFKPNCbx5NRI5K7YVAdIUQUR8vug==",
+      "version": "12.2.13",
+      "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-12.2.13.tgz",
+      "integrity": "sha512-zSKRhECyFqhingIeyRInIyTvYErt4gWo+x5DQr0b7YLUbU8DZSwWnG4w76Ke2s4U8T7ry1jpJBHoX/e8YBpGMg==",
       "dependencies": {
-        "tslib": "^2.0.0"
+        "tslib": "^2.2.0"
       },
       "optionalDependencies": {
         "parse5": "^5.0.0"
       },
       "peerDependencies": {
-        "@angular/common": "^11.0.0 || ^12.0.0-0",
-        "@angular/core": "^11.0.0 || ^12.0.0-0"
+        "@angular/common": "^12.0.0 || ^13.0.0-0",
+        "@angular/core": "^12.0.0 || ^13.0.0-0",
+        "rxjs": "^6.5.3 || ^7.0.0"
       }
     },
     "node_modules/@angular/cdk/node_modules/parse5": {
@@ -403,18 +404,19 @@
       }
     },
     "node_modules/@angular/material": {
-      "version": "11.2.13",
-      "resolved": "https://registry.npmjs.org/@angular/material/-/material-11.2.13.tgz",
-      "integrity": "sha512-FqFdGSkOtqsmeLyTSousodDGUy2NqbtxCIKv2rwbsIRwHNKB0KpR/UQhA2gMRuGa5hxhMJ0DW0Tf9neMRuLCTg==",
+      "version": "12.2.13",
+      "resolved": "https://registry.npmjs.org/@angular/material/-/material-12.2.13.tgz",
+      "integrity": "sha512-6g2GyN4qp2D+DqY2AwrQuPB3cd9gybvQVXvNRbTPXEulHr+LgGei00ySdFHFp6RvdGSMZ4i3LM1Fq3VkFxhCfQ==",
       "dependencies": {
-        "tslib": "^2.0.0"
+        "tslib": "^2.2.0"
       },
       "peerDependencies": {
-        "@angular/animations": "^11.0.0 || ^12.0.0-0",
-        "@angular/cdk": "11.2.13",
-        "@angular/common": "^11.0.0 || ^12.0.0-0",
-        "@angular/core": "^11.0.0 || ^12.0.0-0",
-        "@angular/forms": "^11.0.0 || ^12.0.0-0"
+        "@angular/animations": "^12.0.0 || ^13.0.0-0",
+        "@angular/cdk": "12.2.13",
+        "@angular/common": "^12.0.0 || ^13.0.0-0",
+        "@angular/core": "^12.0.0 || ^13.0.0-0",
+        "@angular/forms": "^12.0.0 || ^13.0.0-0",
+        "rxjs": "^6.5.3 || ^7.0.0"
       }
     },
     "node_modules/@angular/platform-browser": {
@@ -6607,12 +6609,12 @@
       }
     },
     "@angular/cdk": {
-      "version": "11.2.13",
-      "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-11.2.13.tgz",
-      "integrity": "sha512-FkE4iCwoLbQxLDUOjV1I7M/6hmpyb7erAjEdWgch7nGRNxF1hqX5Bqf1lvLFKPNCbx5NRI5K7YVAdIUQUR8vug==",
+      "version": "12.2.13",
+      "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-12.2.13.tgz",
+      "integrity": "sha512-zSKRhECyFqhingIeyRInIyTvYErt4gWo+x5DQr0b7YLUbU8DZSwWnG4w76Ke2s4U8T7ry1jpJBHoX/e8YBpGMg==",
       "requires": {
         "parse5": "^5.0.0",
-        "tslib": "^2.0.0"
+        "tslib": "^2.2.0"
       },
       "dependencies": {
         "parse5": {
@@ -6758,11 +6760,11 @@
       "dev": true
     },
     "@angular/material": {
-      "version": "11.2.13",
-      "resolved": "https://registry.npmjs.org/@angular/material/-/material-11.2.13.tgz",
-      "integrity": "sha512-FqFdGSkOtqsmeLyTSousodDGUy2NqbtxCIKv2rwbsIRwHNKB0KpR/UQhA2gMRuGa5hxhMJ0DW0Tf9neMRuLCTg==",
+      "version": "12.2.13",
+      "resolved": "https://registry.npmjs.org/@angular/material/-/material-12.2.13.tgz",
+      "integrity": "sha512-6g2GyN4qp2D+DqY2AwrQuPB3cd9gybvQVXvNRbTPXEulHr+LgGei00ySdFHFp6RvdGSMZ4i3LM1Fq3VkFxhCfQ==",
       "requires": {
-        "tslib": "^2.0.0"
+        "tslib": "^2.2.0"
       }
     },
     "@angular/platform-browser": {
diff --git a/frontend/ng-karaoqueue/package.json b/frontend/ng-karaoqueue/package.json
index 377c9be..2443d40 100644
--- a/frontend/ng-karaoqueue/package.json
+++ b/frontend/ng-karaoqueue/package.json
@@ -13,12 +13,12 @@
   "private": true,
   "dependencies": {
     "@angular/animations": "~12.2.16",
-    "@angular/cdk": "~11.2.13",
+    "@angular/cdk": "~12.2.13",
     "@angular/common": "~12.2.16",
     "@angular/compiler": "~12.2.16",
     "@angular/core": "~12.2.16",
     "@angular/forms": "~12.2.16",
-    "@angular/material": "^11.2.13",
+    "@angular/material": "^12.2.13",
     "@angular/platform-browser": "~12.2.16",
     "@angular/platform-browser-dynamic": "~12.2.16",
     "@angular/router": "~12.2.16",