From 7a0c0070aa36855a7dab6825784eb44ad6f1e2af Mon Sep 17 00:00:00 2001
From: udaykumarburgula2k
 <130174397+udaykumarburgula2k@users.noreply.github.com>
Date: Sun, 19 May 2024 19:33:10 +0530
Subject: [PATCH 1/3] File naming best practice

---
 src/app/app-routing.module.ts                  |  8 ++++----
 src/app/app.module.ts                          | 18 +++++++++---------
 ...count-menu.ts => account-menu.component.ts} |  2 +-
 .../components/{app.ts => app.component.ts}    |  0
 .../{courses.ts => catalog.component.ts}       |  8 ++++----
 ...spinner.ts => loading-spinner.component.ts} |  0
 .../{nav-bar.ts => nav-bar.component.ts}       |  4 ++--
 .../{sign-in.ts => sign-in.component.ts}       |  6 +++---
 ...epository.ts => data-repository.service.ts} |  4 ++--
 ...unt-menu.css => account-menu.component.css} |  0
 .../{catalog.css => catalog.component.css}     |  0
 .../{nav-bar.css => nav-bar.component.css}     |  0
 .../{register.css => register.component.css}   |  0
 .../{catalog.html => catalog.component.html}   |  0
 .../{register.html => register.component.html} |  0
 15 files changed, 25 insertions(+), 25 deletions(-)
 rename src/app/components/{account-menu.ts => account-menu.component.ts} (93%)
 rename src/app/components/{app.ts => app.component.ts} (100%)
 rename src/app/components/{courses.ts => catalog.component.ts} (91%)
 rename src/app/components/{loading-spinner.ts => loading-spinner.component.ts} (100%)
 rename src/app/components/{nav-bar.ts => nav-bar.component.ts} (91%)
 rename src/app/components/{sign-in.ts => sign-in.component.ts} (97%)
 rename src/app/services/{data-repository.ts => data-repository.service.ts} (98%)
 rename src/app/styles/{account-menu.css => account-menu.component.css} (100%)
 rename src/app/styles/{catalog.css => catalog.component.css} (100%)
 rename src/app/styles/{nav-bar.css => nav-bar.component.css} (100%)
 rename src/app/styles/{register.css => register.component.css} (100%)
 rename src/app/templates/{catalog.html => catalog.component.html} (100%)
 rename src/app/templates/{register.html => register.component.html} (100%)

diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index 7b45cfa..0dce350 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -1,11 +1,11 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
-import { CoursesComponent } from './components/courses';
-import { RegisterComponent } from './components/sign-in';
-import { SignInComponent } from './components/sign-in';
+import { catalogComponent } from './components/catalog.component';
+import { RegisterComponent } from './components/sign-in.component';
+import { SignInComponent } from './components/sign-in.component';
 
 const routes: Routes = [
-  { path: 'catalog', component: CoursesComponent, },
+  { path: 'catalog', component: catalogComponent, },
   { path: 'users/register', component: RegisterComponent, },
   { path: 'users/sign-in', component: SignInComponent, },
   { path: '', redirectTo: '/catalog', pathMatch: 'full' },
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 1b8df5a..b3a8499 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -3,20 +3,20 @@ import { BrowserModule } from '@angular/platform-browser';
 import { ReactiveFormsModule, FormsModule } from '@angular/forms'
 
 import { AppRoutingModule } from './app-routing.module';
-import { AppComponent } from './components/app';
-import { NavBarComponent } from './components/nav-bar';
-import { CoursesComponent } from "./components/courses";
-import { RegisterComponent } from "./components/sign-in";
-import { SignInComponent } from "./components/sign-in";
-import { LoadingComponent } from "./components/loading-spinner";
-import { DataRepositoryService } from "./services/data-repository"
-import { AccountMenuComponent } from "./components/account-menu";
+import { AppComponent } from './components/app.component';
+import { NavBarComponent } from './components/nav-bar.component';
+import { catalogComponent } from "./components/catalog.component";
+import { RegisterComponent } from "./components/sign-in.component";
+import { SignInComponent } from "./components/sign-in.component";
+import { LoadingComponent } from "./components/loading-spinner.component";
+import { DataRepositoryService } from "./services/data-repository.service"
+import { AccountMenuComponent } from "./components/account-menu.component";
 
 @NgModule({
   declarations: [
     AppComponent,
     NavBarComponent,
-    CoursesComponent,
+    catalogComponent,
     RegisterComponent,
     SignInComponent,
     LoadingComponent,
diff --git a/src/app/components/account-menu.ts b/src/app/components/account-menu.component.ts
similarity index 93%
rename from src/app/components/account-menu.ts
rename to src/app/components/account-menu.component.ts
index 544b8e0..724c70d 100644
--- a/src/app/components/account-menu.ts
+++ b/src/app/components/account-menu.component.ts
@@ -2,7 +2,7 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
 
 @Component({
   selector: 'account-menu',
-  styleUrls: ['../styles/account-menu.css'],
+  styleUrls: ['../styles/account-menu.component.css'],
   template: `
     <div class="account">
       <span class="welcome" *ngIf="user">
diff --git a/src/app/components/app.ts b/src/app/components/app.component.ts
similarity index 100%
rename from src/app/components/app.ts
rename to src/app/components/app.component.ts
diff --git a/src/app/components/courses.ts b/src/app/components/catalog.component.ts
similarity index 91%
rename from src/app/components/courses.ts
rename to src/app/components/catalog.component.ts
index 330c923..e2e6ba6 100644
--- a/src/app/components/courses.ts
+++ b/src/app/components/catalog.component.ts
@@ -1,13 +1,13 @@
 import { Component } from '@angular/core';
 
-import { DataRepositoryService } from "../services/data-repository"
+import { DataRepositoryService } from "../services/data-repository.service"
 import { IClass } from '../services/class.model';
 
 @Component({
-  styleUrls: ['../styles/catalog.css'],
-  templateUrl: '../templates/catalog.html'
+  styleUrls: ['../styles/catalog.component.css'],
+  templateUrl: '../templates/catalog.component.html'
 })
-export class CoursesComponent {
+export class catalogComponent {
   classes: IClass[] = [];
   visibleClasses: IClass[] = [];
 
diff --git a/src/app/components/loading-spinner.ts b/src/app/components/loading-spinner.component.ts
similarity index 100%
rename from src/app/components/loading-spinner.ts
rename to src/app/components/loading-spinner.component.ts
diff --git a/src/app/components/nav-bar.ts b/src/app/components/nav-bar.component.ts
similarity index 91%
rename from src/app/components/nav-bar.ts
rename to src/app/components/nav-bar.component.ts
index 3d146a8..35a1e38 100644
--- a/src/app/components/nav-bar.ts
+++ b/src/app/components/nav-bar.component.ts
@@ -1,10 +1,10 @@
 import { Component } from '@angular/core';
 
-import { DataRepositoryService } from "../services/data-repository";
+import { DataRepositoryService } from "../services/data-repository.service";
 
 @Component({
   selector: 'nav-bar',
-  styleUrls: [`../styles/nav-bar.css`],
+  styleUrls: [`../styles/nav-bar.component.css`],
   template: `
     <div class="nav-bar">
       <img class="logo" src="/assets/images/whitebeard-logo.png" alt="Whitebeard Logo" />
diff --git a/src/app/components/sign-in.ts b/src/app/components/sign-in.component.ts
similarity index 97%
rename from src/app/components/sign-in.ts
rename to src/app/components/sign-in.component.ts
index 262197e..b652322 100644
--- a/src/app/components/sign-in.ts
+++ b/src/app/components/sign-in.component.ts
@@ -2,7 +2,7 @@ import { Component } from '@angular/core';
 import { FormControl, FormGroup, Validators } from '@angular/forms';
 import { Router } from '@angular/router'
 
-import { DataRepositoryService } from '../services/data-repository'
+import { DataRepositoryService } from '../services/data-repository.service'
 import { IUser } from '../services/user.model';
 
 @Component({
@@ -94,8 +94,8 @@ export class SignInComponent {
 }
 
 @Component({
-  styleUrls: ['../styles/register.css'],
-  templateUrl: '../templates/register.html'
+  styleUrls: ['../styles/register.component.css'],
+  templateUrl: '../templates/register.component.html'
 })
 
 export class RegisterComponent {
diff --git a/src/app/services/data-repository.ts b/src/app/services/data-repository.service.ts
similarity index 98%
rename from src/app/services/data-repository.ts
rename to src/app/services/data-repository.service.ts
index c586294..25abe61 100644
--- a/src/app/services/data-repository.ts
+++ b/src/app/services/data-repository.service.ts
@@ -2,8 +2,8 @@ import { Injectable } from '@angular/core';
 import { Observable, Subject, EMPTY, throwError, timer } from 'rxjs';
 
 
-import { IUser } from '../services/user.model';
-import { IClass, ICourse } from '../services/class.model';
+import { IUser } from './user.model';
+import { IClass, ICourse } from './class.model';
 
 @Injectable()
 export class DataRepositoryService {
diff --git a/src/app/styles/account-menu.css b/src/app/styles/account-menu.component.css
similarity index 100%
rename from src/app/styles/account-menu.css
rename to src/app/styles/account-menu.component.css
diff --git a/src/app/styles/catalog.css b/src/app/styles/catalog.component.css
similarity index 100%
rename from src/app/styles/catalog.css
rename to src/app/styles/catalog.component.css
diff --git a/src/app/styles/nav-bar.css b/src/app/styles/nav-bar.component.css
similarity index 100%
rename from src/app/styles/nav-bar.css
rename to src/app/styles/nav-bar.component.css
diff --git a/src/app/styles/register.css b/src/app/styles/register.component.css
similarity index 100%
rename from src/app/styles/register.css
rename to src/app/styles/register.component.css
diff --git a/src/app/templates/catalog.html b/src/app/templates/catalog.component.html
similarity index 100%
rename from src/app/templates/catalog.html
rename to src/app/templates/catalog.component.html
diff --git a/src/app/templates/register.html b/src/app/templates/register.component.html
similarity index 100%
rename from src/app/templates/register.html
rename to src/app/templates/register.component.html

From e7620f36ded3ebacc42f6edab31f6bac33a6f875 Mon Sep 17 00:00:00 2001
From: udaykumarburgula2k
 <130174397+udaykumarburgula2k@users.noreply.github.com>
Date: Sun, 19 May 2024 19:44:33 +0530
Subject: [PATCH 2/3] commit file name best practice

---
 src/app/templates/catalog.component.html | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/app/templates/catalog.component.html b/src/app/templates/catalog.component.html
index 2853828..2a15c23 100644
--- a/src/app/templates/catalog.component.html
+++ b/src/app/templates/catalog.component.html
@@ -1,3 +1,6 @@
+<!--
+  1. filename best practice.
+-->
 <div class="departments">
   <button (click)="applyFilter('CH')">Charms</button>
   <button (click)="applyFilter('PO')">Potions</button>
@@ -35,4 +38,4 @@
       </tr>
     </tbody>
   </table>
-</div>
\ No newline at end of file
+</div>

From 42fdc6c7b2c6be845fcc80c899be5aa3313069cc Mon Sep 17 00:00:00 2001
From: udaykumarburgula2k
 <130174397+udaykumarburgula2k@users.noreply.github.com>
Date: Sun, 19 May 2024 21:37:58 +0530
Subject: [PATCH 3/3] folder file best angular practices

---
 .../{styles => }/account-menu.component.css   |  0
 .../account-menu.component.ts                 |  2 +-
 src/app/app-routing.module.ts                 |  6 +--
 src/app/{components => }/app.component.ts     |  0
 src/app/app.module.ts                         | 12 ++---
 .../{styles => catalog}/catalog.component.css |  0
 .../catalog.component.html                    |  1 +
 .../catalog.component.ts                      |  6 +--
 src/app/{services => catalog}/class.model.ts  |  0
 src/app/{styles => }/nav-bar.component.css    |  0
 src/app/{components => }/nav-bar.component.ts |  4 +-
 src/app/services/data-repository.service.ts   |  4 +-
 .../{styles => users}/register.component.css  |  0
 .../register.component.html                   |  0
 src/app/users/register.component.ts           | 50 +++++++++++++++++++
 .../sign-in.component.ts                      | 45 +----------------
 src/app/{services => users}/user.model.ts     |  0
 17 files changed, 69 insertions(+), 61 deletions(-)
 rename src/app/{styles => }/account-menu.component.css (100%)
 rename src/app/{components => }/account-menu.component.ts (93%)
 rename src/app/{components => }/app.component.ts (100%)
 rename src/app/{styles => catalog}/catalog.component.css (100%)
 rename src/app/{templates => catalog}/catalog.component.html (98%)
 rename src/app/{components => catalog}/catalog.component.ts (91%)
 rename src/app/{services => catalog}/class.model.ts (100%)
 rename src/app/{styles => }/nav-bar.component.css (100%)
 rename src/app/{components => }/nav-bar.component.ts (83%)
 rename src/app/{styles => users}/register.component.css (100%)
 rename src/app/{templates => users}/register.component.html (100%)
 create mode 100644 src/app/users/register.component.ts
 rename src/app/{components => users}/sign-in.component.ts (69%)
 rename src/app/{services => users}/user.model.ts (100%)

diff --git a/src/app/styles/account-menu.component.css b/src/app/account-menu.component.css
similarity index 100%
rename from src/app/styles/account-menu.component.css
rename to src/app/account-menu.component.css
diff --git a/src/app/components/account-menu.component.ts b/src/app/account-menu.component.ts
similarity index 93%
rename from src/app/components/account-menu.component.ts
rename to src/app/account-menu.component.ts
index 724c70d..647fa26 100644
--- a/src/app/components/account-menu.component.ts
+++ b/src/app/account-menu.component.ts
@@ -2,7 +2,7 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
 
 @Component({
   selector: 'account-menu',
-  styleUrls: ['../styles/account-menu.component.css'],
+  styleUrls: ['./account-menu.component.css'],
   template: `
     <div class="account">
       <span class="welcome" *ngIf="user">
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index 0dce350..0c37394 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -1,8 +1,8 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
-import { catalogComponent } from './components/catalog.component';
-import { RegisterComponent } from './components/sign-in.component';
-import { SignInComponent } from './components/sign-in.component';
+import { catalogComponent } from './catalog/catalog.component';
+import { RegisterComponent } from './users/register.component';
+import { SignInComponent } from './users/sign-in.component';
 
 const routes: Routes = [
   { path: 'catalog', component: catalogComponent, },
diff --git a/src/app/components/app.component.ts b/src/app/app.component.ts
similarity index 100%
rename from src/app/components/app.component.ts
rename to src/app/app.component.ts
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index b3a8499..223f99e 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -3,14 +3,14 @@ import { BrowserModule } from '@angular/platform-browser';
 import { ReactiveFormsModule, FormsModule } from '@angular/forms'
 
 import { AppRoutingModule } from './app-routing.module';
-import { AppComponent } from './components/app.component';
-import { NavBarComponent } from './components/nav-bar.component';
-import { catalogComponent } from "./components/catalog.component";
-import { RegisterComponent } from "./components/sign-in.component";
-import { SignInComponent } from "./components/sign-in.component";
+import { AppComponent } from './app.component';
+import { NavBarComponent } from './nav-bar.component';
+import { catalogComponent } from "./catalog/catalog.component";
+import { RegisterComponent } from "./users/register.component";
+import { SignInComponent } from "./users/sign-in.component";
 import { LoadingComponent } from "./components/loading-spinner.component";
 import { DataRepositoryService } from "./services/data-repository.service"
-import { AccountMenuComponent } from "./components/account-menu.component";
+import { AccountMenuComponent } from "./account-menu.component";
 
 @NgModule({
   declarations: [
diff --git a/src/app/styles/catalog.component.css b/src/app/catalog/catalog.component.css
similarity index 100%
rename from src/app/styles/catalog.component.css
rename to src/app/catalog/catalog.component.css
diff --git a/src/app/templates/catalog.component.html b/src/app/catalog/catalog.component.html
similarity index 98%
rename from src/app/templates/catalog.component.html
rename to src/app/catalog/catalog.component.html
index 2a15c23..360b3f1 100644
--- a/src/app/templates/catalog.component.html
+++ b/src/app/catalog/catalog.component.html
@@ -1,5 +1,6 @@
 <!--
   1. filename best practice.
+  2. folder best practice
 -->
 <div class="departments">
   <button (click)="applyFilter('CH')">Charms</button>
diff --git a/src/app/components/catalog.component.ts b/src/app/catalog/catalog.component.ts
similarity index 91%
rename from src/app/components/catalog.component.ts
rename to src/app/catalog/catalog.component.ts
index e2e6ba6..4d29b6c 100644
--- a/src/app/components/catalog.component.ts
+++ b/src/app/catalog/catalog.component.ts
@@ -1,11 +1,11 @@
 import { Component } from '@angular/core';
 
 import { DataRepositoryService } from "../services/data-repository.service"
-import { IClass } from '../services/class.model';
+import { IClass } from './class.model';
 
 @Component({
-  styleUrls: ['../styles/catalog.component.css'],
-  templateUrl: '../templates/catalog.component.html'
+  styleUrls: ['./catalog.component.css'],
+  templateUrl: './catalog.component.html'
 })
 export class catalogComponent {
   classes: IClass[] = [];
diff --git a/src/app/services/class.model.ts b/src/app/catalog/class.model.ts
similarity index 100%
rename from src/app/services/class.model.ts
rename to src/app/catalog/class.model.ts
diff --git a/src/app/styles/nav-bar.component.css b/src/app/nav-bar.component.css
similarity index 100%
rename from src/app/styles/nav-bar.component.css
rename to src/app/nav-bar.component.css
diff --git a/src/app/components/nav-bar.component.ts b/src/app/nav-bar.component.ts
similarity index 83%
rename from src/app/components/nav-bar.component.ts
rename to src/app/nav-bar.component.ts
index 35a1e38..aa81a89 100644
--- a/src/app/components/nav-bar.component.ts
+++ b/src/app/nav-bar.component.ts
@@ -1,10 +1,10 @@
 import { Component } from '@angular/core';
 
-import { DataRepositoryService } from "../services/data-repository.service";
+import { DataRepositoryService } from "../app/services/data-repository.service";
 
 @Component({
   selector: 'nav-bar',
-  styleUrls: [`../styles/nav-bar.component.css`],
+  styleUrls: [`./nav-bar.component.css`],
   template: `
     <div class="nav-bar">
       <img class="logo" src="/assets/images/whitebeard-logo.png" alt="Whitebeard Logo" />
diff --git a/src/app/services/data-repository.service.ts b/src/app/services/data-repository.service.ts
index 25abe61..d2607a2 100644
--- a/src/app/services/data-repository.service.ts
+++ b/src/app/services/data-repository.service.ts
@@ -2,8 +2,8 @@ import { Injectable } from '@angular/core';
 import { Observable, Subject, EMPTY, throwError, timer } from 'rxjs';
 
 
-import { IUser } from './user.model';
-import { IClass, ICourse } from './class.model';
+import { IUser } from '../users/user.model';
+import { IClass, ICourse } from '../catalog/class.model';
 
 @Injectable()
 export class DataRepositoryService {
diff --git a/src/app/styles/register.component.css b/src/app/users/register.component.css
similarity index 100%
rename from src/app/styles/register.component.css
rename to src/app/users/register.component.css
diff --git a/src/app/templates/register.component.html b/src/app/users/register.component.html
similarity index 100%
rename from src/app/templates/register.component.html
rename to src/app/users/register.component.html
diff --git a/src/app/users/register.component.ts b/src/app/users/register.component.ts
new file mode 100644
index 0000000..c1dd537
--- /dev/null
+++ b/src/app/users/register.component.ts
@@ -0,0 +1,50 @@
+import { Component } from '@angular/core';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { Router } from '@angular/router'
+
+import { DataRepositoryService } from '../services/data-repository.service'
+import { IUser } from './user.model';
+
+
+
+@Component({
+  styleUrls: ['./register.component.css'],
+  templateUrl: './register.component.html'
+})
+
+export class RegisterComponent {
+  registerForm: FormGroup;
+  firstName: FormControl;
+  lastName: FormControl;
+  email: FormControl;
+  password: FormControl;
+  saving: boolean = false;
+
+  constructor(private router: Router, private dataRepository: DataRepositoryService) {
+    this.firstName = new FormControl('', Validators.required);
+    this.lastName = new FormControl('', Validators.required);
+    this.email = new FormControl('', Validators.required);
+    this.password = new FormControl('', Validators.required);
+
+    this.registerForm = new FormGroup({
+      firstName: this.firstName,
+      lastName: this.lastName,
+      email: this.email,
+      password: this.password
+    });
+  }
+
+
+  registerUser(user: IUser) {
+    this.saving = true;
+    this.dataRepository.saveUser(user)
+      .subscribe({
+        error: () => this.saving = false,
+        complete: () => this.router.navigate(['/catalog'])
+      });
+  }
+
+  cancel() {
+    this.router.navigate(['/']);
+  }
+}
diff --git a/src/app/components/sign-in.component.ts b/src/app/users/sign-in.component.ts
similarity index 69%
rename from src/app/components/sign-in.component.ts
rename to src/app/users/sign-in.component.ts
index b652322..58364cd 100644
--- a/src/app/components/sign-in.component.ts
+++ b/src/app/users/sign-in.component.ts
@@ -1,9 +1,7 @@
 import { Component } from '@angular/core';
-import { FormControl, FormGroup, Validators } from '@angular/forms';
 import { Router } from '@angular/router'
-
 import { DataRepositoryService } from '../services/data-repository.service'
-import { IUser } from '../services/user.model';
+
 
 @Component({
   styles: [`
@@ -93,44 +91,3 @@ export class SignInComponent {
   }
 }
 
-@Component({
-  styleUrls: ['../styles/register.component.css'],
-  templateUrl: '../templates/register.component.html'
-})
-
-export class RegisterComponent {
-  registerForm: FormGroup;
-  firstName: FormControl;
-  lastName: FormControl;
-  email: FormControl;
-  password: FormControl;
-  saving: boolean = false;
-
-  constructor(private router: Router, private dataRepository: DataRepositoryService) {
-    this.firstName = new FormControl('', Validators.required);
-    this.lastName = new FormControl('', Validators.required);
-    this.email = new FormControl('', Validators.required);
-    this.password = new FormControl('', Validators.required);
-
-    this.registerForm = new FormGroup({
-      firstName: this.firstName,
-      lastName: this.lastName,
-      email: this.email,
-      password: this.password
-    });
-  }
-
-
-  registerUser(user: IUser) {
-    this.saving = true;
-    this.dataRepository.saveUser(user)
-      .subscribe({
-        error: () => this.saving = false,
-        complete: () => this.router.navigate(['/catalog'])
-      });
-  }
-
-  cancel() {
-    this.router.navigate(['/']);
-  }
-}
diff --git a/src/app/services/user.model.ts b/src/app/users/user.model.ts
similarity index 100%
rename from src/app/services/user.model.ts
rename to src/app/users/user.model.ts