Fix selector names.

src/app/app.config.ts

@@ -3,7 +3,7 @@ import { provideRouter } from '@angular/router';
 
 import { routes } from './app.routes';
 import { provideHttpClient, withInterceptors } from '@angular/common/http';
-import { authInterceptor } from './interceptor/auth.interceptor';
+import { authInterceptor } from './shared/interceptors/auth.interceptor';
 import { provideTanStackQuery, QueryClient } from '@tanstack/angular-query-experimental';
 import { withDevtools } from '@tanstack/angular-query-experimental/devtools';
 

src/app/app.routes.ts

@@ -1,8 +1,8 @@
 import { Routes } from '@angular/router';
-import { RecipePage } from './recipe-page/recipe-page';
-import { RecipesPage } from './recipes-page/recipes-page';
-import { RecipesSearchPage } from './recipes-search-page/recipes-search-page';
-import { RecipeUpload } from './recipe-upload/recipe-upload';
+import { RecipePage } from './pages/recipe-page/recipe-page';
+import { RecipesPage } from './pages/recipes-page/recipes-page';
+import { RecipesSearchPage } from './pages/recipes-search-page/recipes-search-page';
+import { RecipeUploadPage } from './pages/recipe-upload-page/recipe-upload-page';
 
 export const routes: Routes = [
     {
@@ -15,7 +15,7 @@ export const routes: Routes = [
     },
     {
         path: 'recipes-upload',
-        component: RecipeUpload,
+        component: RecipeUploadPage,
     },
     {
         path: 'recipes/:username/:slug',

src/app/app.ts

@@ -1,9 +1,9 @@
 import { Component, signal } from '@angular/core';
 import { RouterOutlet } from '@angular/router';
-import { Header } from './header/header';
-import { Nav } from './nav/nav';
+import { Header } from './shared/components/header/header';
+import { Nav } from './shared/components/nav/nav';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
-import { Footer } from './footer/footer';
+import { Footer } from './shared/components/footer/footer';
 
 @Component({
     selector: 'app-root',

src/app/pages/recipe-page/recipe-page-content/recipe-page-content.html

@@ -38,5 +38,5 @@
         />
     }
     <div [innerHTML]="recipe.text"></div>
-    <app-comments-list [recipeUsername]="recipe.owner.username" [recipeSlug]="recipe.slug" />
+    <app-recipe-comments-list [recipeUsername]="recipe.owner.username" [recipeSlug]="recipe.slug" />
 </article>

src/app/pages/recipe-page/recipe-page-content/recipe-page-content.ts

@@ -1,12 +1,12 @@
 import { Component, computed, inject, input } from '@angular/core';
-import { RecipeView } from '../../model/Recipe.model';
+import { RecipeView } from '../../../shared/models/Recipe.model';
 import { injectMutation, injectQuery } from '@tanstack/angular-query-experimental';
-import { ImageService } from '../../service/image.service';
+import { ImageService } from '../../../shared/services/ImageService';
 import { faGlobe, faLock, faStar, faUser } from '@fortawesome/free-solid-svg-icons';
 import { FaIconComponent } from '@fortawesome/angular-fontawesome';
-import { RecipeService } from '../../service/recipe.service';
-import { AuthService } from '../../service/auth.service';
-import { RecipeCommentsList } from '../../recipe-comments-list/recipe-comments-list.component';
+import { RecipeService } from '../../../shared/services/RecipeService';
+import { AuthService } from '../../../shared/services/AuthService';
+import { RecipeCommentsList } from '../../../shared/components/recipe-comments-list/recipe-comments-list';
 
 @Component({
     selector: 'app-recipe-page-content',

src/app/pages/recipe-page/recipe-page.ts

@@ -1,6 +1,6 @@
 import { Component, inject } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { RecipeService } from '../service/recipe.service';
+import { RecipeService } from '../../shared/services/RecipeService';
 import { RecipePageContent } from './recipe-page-content/recipe-page-content';
 import { injectQuery } from '@tanstack/angular-query-experimental';
 

src/app/pages/recipe-upload-page/recipe-upload-page.spec.ts

@@ -1,17 +1,17 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { RecipeUpload } from './recipe-upload';
+import { RecipeUploadPage } from './recipe-upload-page';
 
 describe('RecipeUpload', () => {
-    let component: RecipeUpload;
-    let fixture: ComponentFixture<RecipeUpload>;
+    let component: RecipeUploadPage;
+    let fixture: ComponentFixture<RecipeUploadPage>;
 
     beforeEach(async () => {
         await TestBed.configureTestingModule({
-            imports: [RecipeUpload],
+            imports: [RecipeUploadPage],
         }).compileComponents();
 
-        fixture = TestBed.createComponent(RecipeUpload);
+        fixture = TestBed.createComponent(RecipeUploadPage);
         component = fixture.componentInstance;
         await fixture.whenStable();
     });

src/app/pages/recipe-upload-page/recipe-upload-page.ts

@@ -7,15 +7,15 @@ import {
     Validators,
 } from '@angular/forms';
 import { SseClient } from 'ngx-sse-client';
-import { Spinner } from '../spinner/spinner';
+import { Spinner } from '../../shared/components/spinner/spinner';
 
 @Component({
-    selector: 'app-recipe-upload',
+    selector: 'app-recipe-upload-page',
     imports: [ReactiveFormsModule, Spinner],
-    templateUrl: './recipe-upload.html',
-    styleUrl: './recipe-upload.css',
+    templateUrl: './recipe-upload-page.html',
+    styleUrl: './recipe-upload-page.css',
 })
-export class RecipeUpload {
+export class RecipeUploadPage {
     private readonly sseClient = inject(SseClient);
     private readonly formBuilder = inject(FormBuilder);
 

src/app/pages/recipes-page/recipes-page.ts

@@ -1,7 +1,7 @@
 import { Component, inject } from '@angular/core';
-import { RecipeService } from '../service/recipe.service';
+import { RecipeService } from '../../shared/services/RecipeService';
 import { injectQuery } from '@tanstack/angular-query-experimental';
-import { RecipeCardGrid } from '../recipe-card-grid/recipe-card-grid';
+import { RecipeCardGrid } from '../../shared/components/recipe-card-grid/recipe-card-grid';
 
 @Component({
     selector: 'app-recipes-page',

src/app/pages/recipes-search-page/recipes-search-page.ts

@@ -1,8 +1,8 @@
 import { Component, inject, signal } from '@angular/core';
 import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
 import { injectQuery } from '@tanstack/angular-query-experimental';
-import { RecipeService } from '../service/recipe.service';
-import { RecipeCardGrid } from '../recipe-card-grid/recipe-card-grid';
+import { RecipeService } from '../../shared/services/RecipeService';
+import { RecipeCardGrid } from '../../shared/components/recipe-card-grid/recipe-card-grid';
 import { ActivatedRoute, Router } from '@angular/router';
 
 @Component({

src/app/shared/components/header/header.ts

@@ -1,5 +1,5 @@
 import { Component, computed, inject } from '@angular/core';
-import { AuthService } from '../service/auth.service';
+import { AuthService } from '../../services/AuthService';
 
 @Component({
     selector: 'app-header',

src/app/shared/components/recipe-card-grid/recipe-card-grid.ts

@@ -1,6 +1,6 @@
 import { Component, input } from '@angular/core';
 import { RecipeCard } from './recipe-card/recipe-card';
-import { Recipe } from '../model/Recipe.model';
+import { Recipe } from '../../models/Recipe.model';
 
 @Component({
     selector: 'app-recipe-card-grid',

src/app/shared/components/recipe-card-grid/recipe-card/recipe-card.ts

@@ -1,8 +1,8 @@
 import { Component, computed, inject, input } from '@angular/core';
-import { Recipe } from '../../model/Recipe.model';
+import { Recipe } from '../../../models/Recipe.model';
 import { RouterLink } from '@angular/router';
 import { injectQuery } from '@tanstack/angular-query-experimental';
-import { ImageService } from '../../service/image.service';
+import { ImageService } from '../../../services/ImageService';
 import { faGlobe, faLock, faStar, faUser } from '@fortawesome/free-solid-svg-icons';
 import { FaIconComponent } from '@fortawesome/angular-fontawesome';
 

src/app/shared/components/recipe-comments-list/recipe-comments-list.spec.ts

@@ -1,6 +1,6 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { RecipeCommentsList } from './recipe-comments-list.component';
+import { RecipeCommentsList } from './recipe-comments-list';
 
 describe('CommentsList', () => {
     let component: RecipeCommentsList;

src/app/shared/components/recipe-comments-list/recipe-comments-list.ts

@@ -1,16 +1,16 @@
 import { Component, computed, inject, input } from '@angular/core';
 import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
-import { RecipeService } from '../service/recipe.service';
+import { RecipeService } from '../../services/RecipeService';
 import { injectInfiniteQuery, injectMutation } from '@tanstack/angular-query-experimental';
-import { AuthService } from '../service/auth.service';
-import { RecipeComments } from '../model/RecipeComment.model';
-import { DateTimeFormatPipe } from '../pipe/dateTimeFormat.pipe';
+import { AuthService } from '../../services/AuthService';
+import { RecipeComments } from '../../models/RecipeComment.model';
+import { DateTimeFormatPipe } from '../../pipes/dateTimeFormat.pipe';
 
 @Component({
-    selector: 'app-comments-list',
+    selector: 'app-recipe-comments-list',
     imports: [ReactiveFormsModule, DateTimeFormatPipe],
-    templateUrl: './recipe-comments-list.component.html',
-    styleUrl: './recipe-comments-list.component.css',
+    templateUrl: './recipe-comments-list.html',
+    styleUrl: './recipe-comments-list.css',
 })
 export class RecipeCommentsList {
     public readonly recipeUsername = input.required<string>();

src/app/shared/interceptors/auth.interceptor.ts

@@ -1,6 +1,6 @@
 import { HttpErrorResponse, HttpInterceptorFn } from '@angular/common/http';
 import { inject } from '@angular/core';
-import { AuthService } from '../service/auth.service';
+import { AuthService } from '../services/AuthService';
 import { catchError, from, switchMap, throwError } from 'rxjs';
 import { Router } from '@angular/router';
 

src/app/shared/pipes/dateTimeFormat.pipe.ts

@@ -1,5 +1,5 @@
 import { inject, Pipe, PipeTransform } from '@angular/core';
-import { DateService } from '../service/date.service';
+import { DateService } from '../services/DateService';
 
 @Pipe({
     name: 'dateTimeFormat',

src/app/shared/services/AuthService.spec.ts

@@ -1,8 +1,8 @@
 import { TestBed } from '@angular/core/testing';
 
-import { AuthService } from './auth.service';
+import { AuthService } from './AuthService';
 
-describe('LoginService', () => {
+describe('AuthService', () => {
     let service: AuthService;
 
     beforeEach(() => {

src/app/shared/services/AuthService.ts

@@ -1,6 +1,6 @@
 import { inject, Injectable, Signal, signal } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import { LoginView } from '../model/LoginView.model';
+import { LoginView } from '../models/LoginView.model';
 import { firstValueFrom, Observable, tap } from 'rxjs';
 import { QueryClient } from '@tanstack/angular-query-experimental';
 import { Router } from '@angular/router';

src/app/shared/services/EndpointService.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
-import { Endpoints } from '../endpoints';
-import { QueryParams } from '../model/Query.model';
+import { Endpoints } from '../../endpoints';
+import { QueryParams } from '../models/Query.model';
 
 @Injectable({
     providedIn: 'root',

src/app/shared/services/RecipeService.spec.ts

@@ -1,8 +1,8 @@
 import { TestBed } from '@angular/core/testing';
 
-import { RecipeService } from './recipe.service';
+import { RecipeService } from './RecipeService';
 
-describe('Recipe', () => {
+describe('RecipeService', () => {
     let service: RecipeService;
 
     beforeEach(() => {

src/app/shared/services/RecipeService.ts

@@ -1,12 +1,12 @@
 import { inject, Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { firstValueFrom, lastValueFrom, map } from 'rxjs';
-import { Recipe, RecipeInfoViews, RecipeView } from '../model/Recipe.model';
-import { AuthService } from './auth.service';
+import { Recipe, RecipeInfoViews, RecipeView } from '../models/Recipe.model';
+import { AuthService } from './AuthService';
 import { QueryClient } from '@tanstack/angular-query-experimental';
-import { RecipeComment, RecipeComments } from '../model/RecipeComment.model';
-import { QueryParams } from '../model/Query.model';
-import { EndpointService } from './endpoint.service';
+import { RecipeComment, RecipeComments } from '../models/RecipeComment.model';
+import { QueryParams } from '../models/Query.model';
+import { EndpointService } from './EndpointService';
 
 @Injectable({
     providedIn: 'root',