diff --git a/apps/typescript/47-enums-vs-union-types/src/app/app.component.ts b/apps/typescript/47-enums-vs-union-types/src/app/app.component.ts
index 72b8ba5fa..abf647921 100644
--- a/apps/typescript/47-enums-vs-union-types/src/app/app.component.ts
+++ b/apps/typescript/47-enums-vs-union-types/src/app/app.component.ts
@@ -1,14 +1,12 @@
 import { Component, computed, signal } from '@angular/core';
 
-enum Difficulty {
-  EASY = 'easy',
-  NORMAL = 'normal',
-}
+const Difficulty = {
+  EASY: 'easy',
+  NORMAL: 'normal',
+} as const;
+type Difficulty = (typeof Difficulty)[keyof typeof Difficulty];
 
-enum Direction {
-  LEFT = 'left',
-  RIGHT = 'right',
-}
+type Direction = { [K in 'left' | 'right']: string };
 
 @Component({
   imports: [],
@@ -16,10 +14,10 @@ enum Direction {
   template: `
     <section>
       <div>
-        <button mat-stroked-button (click)="difficulty.set(Difficulty.EASY)">
+        <button mat-stroked-button (click)="difficulty.set('easy')">
           Easy
         </button>
-        <button mat-stroked-button (click)="difficulty.set(Difficulty.NORMAL)">
+        <button mat-stroked-button (click)="difficulty.set('normal')">
           Normal
         </button>
       </div>
@@ -28,10 +26,8 @@ enum Direction {
 
     <section>
       <div>
-        <button mat-stroked-button (click)="direction.set(Direction.LEFT)">
-          Left
-        </button>
-        <button mat-stroked-button (click)="direction.set(Direction.RIGHT)">
+        <button mat-stroked-button (click)="direction.set('left')">Left</button>
+        <button mat-stroked-button (click)="direction.set('right')">
           Right
         </button>
       </div>
@@ -55,11 +51,8 @@ enum Direction {
   `,
 })
 export class AppComponent {
-  readonly Difficulty = Difficulty;
   readonly difficulty = signal<Difficulty>(Difficulty.EASY);
-
-  readonly Direction = Direction;
-  readonly direction = signal<Direction | undefined>(undefined);
+  readonly direction = signal<keyof Direction | undefined>(undefined);
 
   readonly difficultyLabel = computed<string>(() => {
     switch (this.difficulty()) {
@@ -71,14 +64,7 @@ export class AppComponent {
   });
 
   readonly directionLabel = computed<string>(() => {
-    const prefix = 'You chose to go';
-    switch (this.direction()) {
-      case Direction.LEFT:
-        return `${prefix} ${Direction.LEFT}`;
-      case Direction.RIGHT:
-        return `${prefix} ${Direction.RIGHT}`;
-      default:
-        return 'Choose a direction!';
-    }
+    if (!this.direction()) return 'Choose a direction!';
+    return `You chose to go ${this.direction()}`;
   });
 }