refactor: enum for keyboards

src/app/app.component.html

@@ -2,27 +2,27 @@
   <!-- Layout Switcher -->
   <div class="layout-controls">
     <button (click)="switchLayout()" class="layout-button">
-      Switch Layout: {{ currentLayout.toUpperCase() }}
+      Switch Layout: {{ currentLayout.toString() }}
     </button>
   </div>
 
   <!-- Conditional Rendering basierend auf currentLayout -->
   <app-qwerty-keyboard 
-    *ngIf="currentLayout === 'qwerty'"
+    *ngIf="currentLayout === Keyboards.QWERTY"
     [shiftActive]="shiftActive"
     (keyPressed)="handleKeyPress($event)"
     (shiftToggled)="toggleShift()">
   </app-qwerty-keyboard>
 
   <app-dvorak-keyboard 
-    *ngIf="currentLayout === 'dvorak'"
+    *ngIf="currentLayout === Keyboards.DVORAK"
     [shiftActive]="shiftActive"
     (keyPressed)="handleKeyPress($event)"
     (shiftToggled)="toggleShift()">
   </app-dvorak-keyboard>
 
   <app-circle-keyboard 
-    *ngIf="currentLayout === 'circle'"
+    *ngIf="currentLayout === Keyboards.CIRCLE"
     [shiftActive]="shiftActive"
     (keyPressed)="handleKeyPress($event)"
     (shiftToggled)="toggleShift()">

src/app/app.component.ts

@@ -21,13 +21,13 @@ import { CircleKeyboardComponent } from './keyboards/circle-keyboard.component';
   styleUrl: './app.component.css',
 })
 export class AppComponent implements OnInit {
-  async ngOnInit() {
-    const matches = await getMatches();
-    console.log(matches);
-  }
-  greetingMessage = "";
-  currentLayout: 'qwerty' | 'dvorak' | 'circle' = 'qwerty';
+  Keyboards = Keyboards;
+  currentLayout: Keyboards = Keyboards.QWERTY;
   shiftActive = false;
+  async ngOnInit() {
+
+    const cli = await getMatches();
+  }
 
   @ViewChild('greetInput') inputElement!: ElementRef;
 
@@ -36,12 +36,12 @@ export class AppComponent implements OnInit {
   }
   
   switchLayout(): void {
-    if (this.currentLayout == 'qwerty'){
-      this.currentLayout = 'dvorak';
-    } else if (this.currentLayout == 'dvorak'){
-      this.currentLayout = 'circle';
-    } else if (this.currentLayout == 'circle'){
-      this.currentLayout = 'qwerty';
+    if (this.currentLayout === Keyboards.QWERTY){
+      this.currentLayout = Keyboards.DVORAK;
+    } else if (this.currentLayout === Keyboards.DVORAK){
+      this.currentLayout = Keyboards.CIRCLE;
+    } else if (this.currentLayout === Keyboards.CIRCLE){
+      this.currentLayout = Keyboards.QWERTY;
     }
   }
 
@@ -59,3 +59,8 @@ export class AppComponent implements OnInit {
     }
   }
 }
+enum Keyboards{
+  QWERTY,
+  DVORAK,
+  CIRCLE
+}