From b5425c62deb60e369bb01253734df35b607bd5a9 Mon Sep 17 00:00:00 2001 From: Thomas Peetz Date: Thu, 18 Sep 2025 23:40:09 +0200 Subject: [PATCH] add links for artists --- .../artist-detail.component.html | 5 ---- .../artist-detail/artist-detail.component.ts | 14 ----------- .../comic-artist/comic-artist.component.css} | 0 .../comic-artist/comic-artist.component.html | 5 ++++ .../comic-artist.component.spec.ts} | 12 +++++----- .../comic-artist/comic-artist.component.ts | 13 +++++++++++ .../comic-artists-list.component.css} | 0 .../comic-artists-list.component.html} | 2 +- .../comic-artists-list.component.spec.ts | 23 +++++++++++++++++++ .../comic-artists-list.component.ts} | 21 +++++++++-------- .../comic/comic-artists}/artist.model.ts | 0 .../comic/comic-artists}/artist.service.ts | 4 ++-- .../comic-artists/comic-artists.component.css | 0 .../comic-artists.component.html | 7 ++++++ .../comic-artists.component.spec.ts} | 12 +++++----- .../comic-artists/comic-artists.component.ts | 12 ++++++++++ .../comic-section/comic-section.routes.ts | 16 +++++++++++-- 17 files changed, 100 insertions(+), 46 deletions(-) delete mode 100644 kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.html delete mode 100644 kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.ts rename kontor-angular/src/app/{comic/artist/artist-detail/artist-detail.component.css => kontor/comic/comic-artist/comic-artist.component.css} (100%) create mode 100644 kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.html rename kontor-angular/src/app/{comic/artist/artist-list/artist-list.component.spec.ts => kontor/comic/comic-artist/comic-artist.component.spec.ts} (52%) create mode 100644 kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.ts rename kontor-angular/src/app/{comic/artist/artist-list/artist-list.component.css => kontor/comic/comic-artists-list/comic-artists-list.component.css} (100%) rename kontor-angular/src/app/{comic/artist/artist-list/artist-list.component.html => kontor/comic/comic-artists-list/comic-artists-list.component.html} (64%) create mode 100644 kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.spec.ts rename kontor-angular/src/app/{comic/artist/artist-list/artist-list.component.ts => kontor/comic/comic-artists-list/comic-artists-list.component.ts} (55%) rename kontor-angular/src/app/{comic/artist => kontor/comic/comic-artists}/artist.model.ts (100%) rename kontor-angular/src/app/{comic/artist => kontor/comic/comic-artists}/artist.service.ts (93%) create mode 100644 kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.css create mode 100644 kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.html rename kontor-angular/src/app/{comic/artist/artist-detail/artist-detail.component.spec.ts => kontor/comic/comic-artists/comic-artists.component.spec.ts} (52%) create mode 100644 kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.ts diff --git a/kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.html b/kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.html deleted file mode 100644 index 8c949f3..0000000 --- a/kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.html +++ /dev/null @@ -1,5 +0,0 @@ -
- - {{ artist().name }} - -
diff --git a/kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.ts b/kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.ts deleted file mode 100644 index 5bf9f95..0000000 --- a/kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.ts +++ /dev/null @@ -1,14 +0,0 @@ -import { Component, input, signal } from '@angular/core'; -import { Artist } from '../artist.model'; -import { RouterLink, RouterLinkActive } from '@angular/router'; - -@Component({ - selector: 'app-artist-detail', - imports: [RouterLink, RouterLinkActive], - templateUrl: './artist-detail.component.html', - styleUrl: './artist-detail.component.css' -}) -export class ArtistDetailComponent { - artist = input.required(); - -} diff --git a/kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.css b/kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.css similarity index 100% rename from kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.css rename to kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.css diff --git a/kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.html b/kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.html new file mode 100644 index 0000000..b702b13 --- /dev/null +++ b/kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.html @@ -0,0 +1,5 @@ +
+ + {{ artist().name }} + +
diff --git a/kontor-angular/src/app/comic/artist/artist-list/artist-list.component.spec.ts b/kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.spec.ts similarity index 52% rename from kontor-angular/src/app/comic/artist/artist-list/artist-list.component.spec.ts rename to kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.spec.ts index 4a58cbb..19737d5 100644 --- a/kontor-angular/src/app/comic/artist/artist-list/artist-list.component.spec.ts +++ b/kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.spec.ts @@ -1,18 +1,18 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { ArtistListComponent } from './artist-list.component'; +import { ComicArtistComponent } from './comic-artist.component'; -describe('ArtistListComponent', () => { - let component: ArtistListComponent; - let fixture: ComponentFixture; +describe('ComicArtistComponent', () => { + let component: ComicArtistComponent; + let fixture: ComponentFixture; beforeEach(async () => { await TestBed.configureTestingModule({ - imports: [ArtistListComponent] + imports: [ComicArtistComponent] }) .compileComponents(); - fixture = TestBed.createComponent(ArtistListComponent); + fixture = TestBed.createComponent(ComicArtistComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.ts b/kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.ts new file mode 100644 index 0000000..b24e6de --- /dev/null +++ b/kontor-angular/src/app/kontor/comic/comic-artist/comic-artist.component.ts @@ -0,0 +1,13 @@ +import { Component, input } from '@angular/core'; +import { Artist } from '../comic-artists/artist.model'; +import { RouterLink, RouterLinkActive } from '@angular/router'; + +@Component({ + selector: 'app-comic-artist', + imports: [RouterLink, RouterLinkActive], + templateUrl: './comic-artist.component.html', + styleUrl: './comic-artist.component.css' +}) +export class ComicArtistComponent { + artist = input.required(); +} diff --git a/kontor-angular/src/app/comic/artist/artist-list/artist-list.component.css b/kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.css similarity index 100% rename from kontor-angular/src/app/comic/artist/artist-list/artist-list.component.css rename to kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.css diff --git a/kontor-angular/src/app/comic/artist/artist-list/artist-list.component.html b/kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.html similarity index 64% rename from kontor-angular/src/app/comic/artist/artist-list/artist-list.component.html rename to kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.html index 984357c..1bbc4f3 100644 --- a/kontor-angular/src/app/comic/artist/artist-list/artist-list.component.html +++ b/kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.html @@ -1,7 +1,7 @@
    @for (artist of artists(); track artist.id) {
  • - +
    • }
diff --git a/kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.spec.ts b/kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.spec.ts new file mode 100644 index 0000000..dd0c4d3 --- /dev/null +++ b/kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ComicArtistsListComponent } from './comic-artists-list.component'; + +describe('ComicArtistsListComponent', () => { + let component: ComicArtistsListComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [ComicArtistsListComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(ComicArtistsListComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/kontor-angular/src/app/comic/artist/artist-list/artist-list.component.ts b/kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.ts similarity index 55% rename from kontor-angular/src/app/comic/artist/artist-list/artist-list.component.ts rename to kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.ts index 441b24a..f1972da 100644 --- a/kontor-angular/src/app/comic/artist/artist-list/artist-list.component.ts +++ b/kontor-angular/src/app/kontor/comic/comic-artists-list/comic-artists-list.component.ts @@ -1,16 +1,18 @@ import { Component, DestroyRef, inject, OnInit, signal } from '@angular/core'; -import { Artist } from '../artist.model'; -import { ArtistService } from '../artist.service'; -import { ArtistDetailComponent } from "../artist-detail/artist-detail.component"; +import { RouterLink, RouterLinkActive } from '@angular/router'; +import { Artist } from '../comic-artists/artist.model'; +import { ComicArtistComponent } from '../comic-artist/comic-artist.component'; +import { ArtistService } from '../comic-artists/artist.service'; @Component({ - selector: 'app-artist-list', - imports: [ArtistDetailComponent], - templateUrl: './artist-list.component.html', - styleUrl: './artist-list.component.css' + selector: 'app-comic-artists-list', + imports: [ComicArtistComponent], + templateUrl: './comic-artists-list.component.html', + styleUrl: './comic-artists-list.component.css' }) -export class ArtistListComponent implements OnInit { - artists = signal(undefined); +export class ComicArtistsListComponent implements OnInit { + + artists = signal([]); isFetching = signal(false); error = signal(''); private artistService = inject(ArtistService); @@ -34,5 +36,4 @@ export class ArtistListComponent implements OnInit { subscription.unsubscribe(); }); } - } diff --git a/kontor-angular/src/app/comic/artist/artist.model.ts b/kontor-angular/src/app/kontor/comic/comic-artists/artist.model.ts similarity index 100% rename from kontor-angular/src/app/comic/artist/artist.model.ts rename to kontor-angular/src/app/kontor/comic/comic-artists/artist.model.ts diff --git a/kontor-angular/src/app/comic/artist/artist.service.ts b/kontor-angular/src/app/kontor/comic/comic-artists/artist.service.ts similarity index 93% rename from kontor-angular/src/app/comic/artist/artist.service.ts rename to kontor-angular/src/app/kontor/comic/comic-artists/artist.service.ts index 6852eba..7b29420 100644 --- a/kontor-angular/src/app/comic/artist/artist.service.ts +++ b/kontor-angular/src/app/kontor/comic/comic-artists/artist.service.ts @@ -1,8 +1,8 @@ import { inject, Injectable, signal } from "@angular/core"; -import { ErrorService } from "../../shared/error.service"; import { HttpClient } from "@angular/common/http"; -import { Artist } from "./artist.model"; import { catchError, map, throwError } from "rxjs"; +import { ErrorService } from "../../../shared/error.service"; +import { Artist } from "./artist.model"; @Injectable({ providedIn: 'root', diff --git a/kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.css b/kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.css new file mode 100644 index 0000000..e69de29 diff --git a/kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.html b/kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.html new file mode 100644 index 0000000..a083862 --- /dev/null +++ b/kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.html @@ -0,0 +1,7 @@ +

artists works!

+
+ +
+
+

Artist Details

+
diff --git a/kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.spec.ts b/kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.spec.ts similarity index 52% rename from kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.spec.ts rename to kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.spec.ts index cf1fa88..99f3089 100644 --- a/kontor-angular/src/app/comic/artist/artist-detail/artist-detail.component.spec.ts +++ b/kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.spec.ts @@ -1,18 +1,18 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { ArtistDetailComponent } from './artist-detail.component'; +import { ComicArtistsComponent } from './comic-artists.component'; -describe('ArtistDetailComponent', () => { - let component: ArtistDetailComponent; - let fixture: ComponentFixture; +describe('ComicArtistsComponent', () => { + let component: ComicArtistsComponent; + let fixture: ComponentFixture; beforeEach(async () => { await TestBed.configureTestingModule({ - imports: [ArtistDetailComponent] + imports: [ComicArtistsComponent] }) .compileComponents(); - fixture = TestBed.createComponent(ArtistDetailComponent); + fixture = TestBed.createComponent(ComicArtistsComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.ts b/kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.ts new file mode 100644 index 0000000..d5e70a2 --- /dev/null +++ b/kontor-angular/src/app/kontor/comic/comic-artists/comic-artists.component.ts @@ -0,0 +1,12 @@ +import { Component } from '@angular/core'; +import { ComicArtistsListComponent } from '../comic-artists-list/comic-artists-list.component'; + +@Component({ + selector: 'app-comic-artists', + imports: [ComicArtistsListComponent], + templateUrl: './comic-artists.component.html', + styleUrl: './comic-artists.component.css' +}) +export class ComicArtistsComponent { + +} diff --git a/kontor-angular/src/app/kontor/comic/comic-section/comic-section.routes.ts b/kontor-angular/src/app/kontor/comic/comic-section/comic-section.routes.ts index 940a22b..c8e8867 100644 --- a/kontor-angular/src/app/kontor/comic/comic-section/comic-section.routes.ts +++ b/kontor-angular/src/app/kontor/comic/comic-section/comic-section.routes.ts @@ -1,19 +1,31 @@ import { Routes } from "@angular/router"; import { ComicListComponent } from "../../../comic/comic/comic-list/comic-list.component"; import { PublisherListComponent } from "../../../comic/publisher/publisher-list/publisher-list.component"; -import { ArtistListComponent } from "../../../comic/artist/artist-list/artist-list.component"; +import { ComicArtistsComponent } from "../comic-artists/comic-artists.component"; export const comicRoutes: Routes = [ { path: 'comics', component: ComicListComponent }, + // { + // path: 'comics/:comicId', + // component: ComicDetailsComponent, + // }, { path: 'publisher', component: PublisherListComponent }, + // { + // path: 'publishers/:publisherId', + // component: PublishersComponent, + // }, { path: 'artist', - component: ArtistListComponent + component: ComicArtistsComponent }, + { + path: 'artist/:artistId', + component: ComicArtistsComponent, + }, ];