diff --git a/src/app/app.html b/src/app/app.html
index 00d2c4a..ee83cf2 100644
--- a/src/app/app.html
+++ b/src/app/app.html
@@ -2,3 +2,4 @@
 <app-tsteele-my-component></app-tsteele-my-component>
 <app-bfunmaker-my-component></app-bfunmaker-my-component>
 <app-akoroliova-my-component></app-akoroliova-my-component>
+<app-tsteele-my-component-02></app-tsteele-my-component-02>
diff --git a/src/app/app.ts b/src/app/app.ts
index f1e308c..c6bdcd1 100644
--- a/src/app/app.ts
+++ b/src/app/app.ts
@@ -3,13 +3,20 @@ import { SwPlanetFilms } from './sw-planet-films/sw-planet-films';
 import { BfunmakerMyComponent } from './bfunmaker-my-component/bfunmaker-my-component';
 import { TsteeleMyComponent } from './tsteele-my-component/tsteele-my-component';
 import { AkoroliovaMyComponent } from './akoroliova-my-component/akoroliova-my-component';
+import { TsteeleMyComponent02 } from './tsteele-my-component-02/tsteele-my-component-02';
 
 @Component({
 	selector: 'app-root',
-	imports: [SwPlanetFilms, AkoroliovaMyComponent, TsteeleMyComponent, BfunmakerMyComponent],
+	imports: [
+		SwPlanetFilms,
+		TsteeleMyComponent02,
+		TsteeleMyComponent,
+		TsteeleMyComponent02,
+		BfunmakerMyComponent,
+		AkoroliovaMyComponent,
+	],
 	templateUrl: './app.html',
 	styleUrl: './app.css',
-
 })
 export class App {
 	protected readonly title = signal('angular-components');
diff --git a/src/app/tsteele-my-component-02/tsteele-my-component-02.css b/src/app/tsteele-my-component-02/tsteele-my-component-02.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/tsteele-my-component-02/tsteele-my-component-02.html b/src/app/tsteele-my-component-02/tsteele-my-component-02.html
new file mode 100644
index 0000000..b5d168f
--- /dev/null
+++ b/src/app/tsteele-my-component-02/tsteele-my-component-02.html
@@ -0,0 +1,12 @@
+<h1>Choose two planets, add their film count...</h1>
+<select>
+	<option>Tatooine (5)</option>
+	<option>Alderan (2)</option>
+</select>
+<br />
+<br />
+<select>
+	<option>Tatooine (5)</option>
+	<option>Alderan (2)</option>
+</select>
+<h3>Sum of film count: 7</h3>
diff --git a/src/app/tsteele-my-component-02/tsteele-my-component-02.ts b/src/app/tsteele-my-component-02/tsteele-my-component-02.ts
new file mode 100644
index 0000000..6b9f6ae
--- /dev/null
+++ b/src/app/tsteele-my-component-02/tsteele-my-component-02.ts
@@ -0,0 +1,9 @@
+import { Component } from '@angular/core';
+
+@Component({
+	selector: 'app-tsteele-my-component-02',
+	imports: [],
+	templateUrl: './tsteele-my-component-02.html',
+	styleUrl: './tsteele-my-component-02.css',
+})
+export class TsteeleMyComponent02 {}