connect front to back

src/app/pages/author/author.html

@@ -3,8 +3,6 @@
 </app-modal>
 
 <section class="author-grid">
-    @for (author of authors; track $index) {
-        <app-author-card [authorInfo]="author"></app-author-card>
-    }
+    <app-author-card></app-author-card>
 </section>
 

src/app/pages/author/author.ts

@@ -1,7 +1,6 @@
-import {Component, input} from '@angular/core';
+import {Component} from '@angular/core';
 import {CreateAuthor} from "../../components/create-author/create-author";
 import {Modal} from "../../components/modal/modal";
-import {AuthorInfo} from "../../interfaces/author.interfaces";
 import {AuthorCard} from "../../components/author-card/author-card";
 
 @Component({
@@ -14,16 +13,6 @@ import {AuthorCard} from "../../components/author-card/author-card";
     templateUrl: './author.html',
     styleUrl: './author.css',
 })
-export class Author {
-    authorInfo = input.required<AuthorInfo>();
-
-    authors: AuthorInfo[] = [
-        { name: 'Victor', firstName: 'Hugo' },
-        { name: 'J.K.', firstName: 'Rowling' },
-        { name: 'J.R.R.', firstName: 'Tolkien' },
-        { name: 'Frank', firstName: 'Herbert' },
-        { name: 'Ray', firstName: 'Bradbury' },
-        { name: 'George ', firstName: 'Orwell' }
-    ];
+export class Author{
 
 }

src/app/pages/book/book.html

@@ -3,8 +3,6 @@
 </app-modal>
 
 <section class="book-grid">
-    @for (book of books; track $index) {
-        <app-book-card [bookInfo]="book"></app-book-card>
-    }
+    <app-book-card></app-book-card>
 </section>
 

src/app/pages/book/book.ts

@@ -1,5 +1,4 @@
-import { Component } from '@angular/core';
-import {BookInfo} from "../../interfaces/book.interfaces";
+import {Component, inject, OnInit, signal} from '@angular/core';
 import {BookCard} from "../../components/book-card/book-card";
 import {Modal} from "../../components/modal/modal";
 import {CreateBook} from "../../components/create-book/create-book";
@@ -14,14 +13,5 @@ import {CreateBook} from "../../components/create-book/create-book";
   templateUrl: './book.html',
   styleUrls: ['./book.css'],
 })
-export class Book {
-    books: BookInfo[] = [
-        { title: '1984', isbn: '978-0451524935', author: 'George Orwell', releaseYear: 1949 },
-        { title: 'Le Seigneur des Anneaux', isbn: '978-0544003415', author: 'J.R.R. Tolkien', releaseYear: 1954 },
-        { title: 'Dune', isbn: '978-0441013593', author: 'Frank Herbert', releaseYear: 1965 },
-        { title: 'Fahrenheit 451', isbn: '978-1451673319', author: 'Ray Bradbury', releaseYear: 1953 },
-        { title: 'Les Misérables', isbn: '978-2070409185', author: 'Victor Hugo', releaseYear: 1862 },
-        { title: 'Harry Potter à l’école des sorciers', isbn: '978-2070643028', author: 'J.K. Rowling', releaseYear: 1997 },
-    ];
-
+export class Book{
 }

src/app/pages/loan/loan.ts

@@ -1,14 +1,14 @@
 import { Component } from '@angular/core';
-import {LoanTable} from "../../components/loan-table/loan-table";
 import {Modal} from "../../components/modal/modal";
 import {CreateLoan} from "../../components/create-loan/create-loan";
+import {LoanTable} from "../../components/loan-table/loan-table";
 
 @Component({
   selector: 'app-loan',
     imports: [
-        LoanTable,
         Modal,
-        CreateLoan
+        CreateLoan,
+        LoanTable
     ],
   templateUrl: './loan.html',
   styleUrl: './loan.css',