feat(seo): Phase 2 — route-level metadata service and JSON-LD structured data
CI Pipeline / backend-test (push) Successful in 5m16s
CI Pipeline / backend-test (pull_request) Successful in 5m5s
CI Pipeline / frontend-test (pull_request) Successful in 27s
CI Pipeline / frontend-build (pull_request) Failing after 29s
CI Pipeline / backend-lint (pull_request) Successful in 8s
CI Pipeline / quality-gate (push) Successful in 2s
CI Pipeline / frontend-test (push) Successful in 28s
CI Pipeline / frontend-build (push) Failing after 29s
CI Pipeline / backend-lint (push) Successful in 8s
CI Pipeline / quality-gate (pull_request) Successful in 2s

Add SeoService for dynamic metadata management:
- Per-route document titles (e.g., 'KMountain Flower Radio — About')
- Meta descriptions from station config per route
- Canonical URLs, Open Graph tags, Twitter Card tags
- Input sanitization (HTML stripping, URL validation, attribute escaping)
- noindex robots directives for /login and /admin routes
- Centralized router watcher (zero per-component boilerplate)

Add StructuredDataService + StructuredDataComponent for JSON-LD:
- Organization schema (NCBOrganization) site-wide with contact info
- WebSite schema with publisher info
- WebPage schema per-route with breadcrumbs
- Dynamic Event schema on /events page
- RadioSeason schema on /schedule page

Wire up SeoService.watchRouter() in app-root ngOnInit.
Wire up StructuredDataComponent in app-root template.
Wire up EventsComponent and ScheduleComponent to feed data to
StructuredDataService for dynamic schema injection.

Includes full test suite for SeoService (22 tests).
This commit is contained in:
robot committed 2026-08-05 10:12:55 +00:00
1 parent 2716765223
commit 58267e8f59
10 files changed
+1194 -8

No files matched your search

@@ -0,0 +1,56 @@
import { Component, effect, inject } from '@angular/core';
import { StructuredDataService } from '../services/structured-data.service';
/**
* Renders JSON-LD structured data as `<script type="application/ld+json">` tags
* in the document <head>.
*
* Reads from StructuredDataService.structuredData() and keeps the head tags
* in sync on every route change or config update.
*
* Tags are identified by the data attribute `data="structured-data"` so they
* can be cleaned up on destroy without affecting other <head> scripts.
*/
@Component({
selector: 'app-structured-data',
standalone: true,
template: '', // renders nothing in the body — writes to <head>
})
export class StructuredDataComponent {
private service = inject(StructuredDataService);
constructor() {
effect(() => {
const entries = this.service.structuredData();
this.renderEntries(entries);
});
}
ngOnDestroy(): void {
this.clearTags();
}
// ── Private ────────────────────────────────────────────────────
/** Write JSON-LD script tags to <head>, replacing any previous ones. */
private renderEntries(entries: unknown[]): void {
this.clearTags();
const head = document.head;
for (const entry of entries) {
const script = document.createElement('script');
script.type = 'application/ld+json';
script.setAttribute('data', 'structured-data');
script.textContent = JSON.stringify(entry);
head.appendChild(script);
}
}
/** Remove all previously injected structured-data script tags. */
private clearTags(): void {
const tags = document.querySelectorAll('script[data="structured-data"]');
for (const tag of tags) {
tag.remove();
}
}
}