feat: archive view done

This commit is contained in:
2025-07-15 18:54:29 -07:00
parent d718ca3718
commit ec1d468a5f
3 changed files with 44 additions and 8 deletions

View File

@ -9,7 +9,7 @@
hopeful that you come to love the story we tell.
</p>
<p>
We publish a new comic every Monday, and offer an RSS feed so you can use your
We publish a new comic every Monday, and (will soon!) offer an RSS feed so you can use your
favourite application to stay updated.
</p>
<p>

View File

@ -1 +1,11 @@
<p>archive works!</p>
<h1>Archive</h1>
<p>Start browsing our comics from the very beginning, or find a comic from a specific day!</p>
<div *ngIf="error">
<p>Error loading comics: {{ error }}</p>
</div>
<div *ngIf="comics.length !== 0">
<div *ngFor="let comic of comics">
<h2><a [routerLink]="['/comic', comic.number]"> {{ comic.title }}</a></h2>
<p>Published on: {{ comic.date }}</p>
</div>

View File

@ -1,11 +1,37 @@
import { Component } from '@angular/core';
/**
* @copyright nhcarrigan
* @license Naomi's Public License
* @author Naomi Carrigan
*/
import { CommonModule } from "@angular/common";
import { Component } from "@angular/core";
import { RouterModule } from "@angular/router";
import { ComicService } from "../comic-service.js";
@Component({
selector: 'app-archive',
imports: [],
templateUrl: './archive.html',
styleUrl: './archive.css'
imports: [ CommonModule, RouterModule ],
selector: "app-archive",
styleUrl: "./archive.css",
templateUrl: "./archive.html",
})
export class Archive {
public comics: Array<{ number: number; title: string; date: string }> = [];
public error: string | undefined;
public constructor(private readonly comicService: ComicService) {
this.comicService.
loadComics().
then(() => {
this.comics = this.comicService.getComics();
this.error = undefined;
}).
catch((error: unknown) => {
this.error = `Failed to load comics: ${
error instanceof Error
? error.message
: "Please check the browser console for more details."
}`;
console.error("Error loading comics:", error);
});
}
}