From 8b3def57284c187d92f7fcfbdc4b4fd8f7756961 Mon Sep 17 00:00:00 2001
From: "Z. Charles Dziura" <zachary@dziura.email>
Date: Mon, 30 Jun 2025 21:27:18 -0400
Subject: [PATCH] Add starting point component to view

---
 src/app/app.html                                 |  7 +++++--
 src/app/app.ts                                   |  6 ++++--
 src/app/state/state.reducer.ts                   |  2 +-
 src/app/views/starting-point/starting-point.html |  1 +
 src/app/views/starting-point/starting-point.scss |  0
 src/app/views/starting-point/starting-point.ts   | 10 ++++++++++
 6 files changed, 21 insertions(+), 5 deletions(-)
 create mode 100644 src/app/views/starting-point/starting-point.html
 create mode 100644 src/app/views/starting-point/starting-point.scss
 create mode 100644 src/app/views/starting-point/starting-point.ts

diff --git a/src/app/app.html b/src/app/app.html
index 15d93c0..64edeaa 100644
--- a/src/app/app.html
+++ b/src/app/app.html
@@ -1,4 +1,7 @@
 <main>
-	<h1>Hello, world!</h1>
-	<p>Current View: {{ currentView$ | async }}</p>
+	@switch (currentView$ | async) {
+		@default {
+			<app-starting-point></app-starting-point>
+		}
+	}
 </main>
diff --git a/src/app/app.ts b/src/app/app.ts
index c30b0ed..09dfbfb 100644
--- a/src/app/app.ts
+++ b/src/app/app.ts
@@ -1,13 +1,15 @@
 import { AsyncPipe } from '@angular/common';
-import { Component, inject, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component, inject, OnInit } from '@angular/core';
 import { select, Store } from '@ngrx/store';
 import { selectCurrentView } from './state/state.selectors';
+import { StartingPoint } from './views/starting-point/starting-point';
 
 @Component({
 	selector: 'app-root',
 	templateUrl: './app.html',
 	styleUrl: './app.scss',
-	imports: [AsyncPipe],
+	changeDetection: ChangeDetectionStrategy.OnPush,
+	imports: [AsyncPipe, StartingPoint],
 })
 export class App implements OnInit {
 	private readonly store$ = inject(Store);
diff --git a/src/app/state/state.reducer.ts b/src/app/state/state.reducer.ts
index 21c6052..a530355 100644
--- a/src/app/state/state.reducer.ts
+++ b/src/app/state/state.reducer.ts
@@ -5,7 +5,7 @@ export interface AppState {
 }
 
 export enum CurrentView {
-	StartingPoint = 0,
+	StartingPoint = 'startingPoint',
 }
 
 export const initialState: AppState = {
diff --git a/src/app/views/starting-point/starting-point.html b/src/app/views/starting-point/starting-point.html
new file mode 100644
index 0000000..6ba3f52
--- /dev/null
+++ b/src/app/views/starting-point/starting-point.html
@@ -0,0 +1 @@
+<p>starting-point works!</p>
diff --git a/src/app/views/starting-point/starting-point.scss b/src/app/views/starting-point/starting-point.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/views/starting-point/starting-point.ts b/src/app/views/starting-point/starting-point.ts
new file mode 100644
index 0000000..2c259d5
--- /dev/null
+++ b/src/app/views/starting-point/starting-point.ts
@@ -0,0 +1,10 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+	selector: 'app-starting-point',
+	imports: [],
+	templateUrl: './starting-point.html',
+	styleUrl: './starting-point.scss',
+	changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class StartingPoint {}