refactor(ping-feature): integrate DI refactor, enhance web build, and update feature workflow

Refactored the `ping-feature` module to adopt centralized `HttpClient` through Koin DI, replacing legacy implementations. Added secure API calls with improved error handling and updated Webpack build scripts to resolve worker path issues. Enhanced `PingScreen` with extended functionality, UI updates, and aligned test cases for the new architecture. Consolidated feature workflows and finalized documentation with a comprehensive feature implementation guide.
This commit is contained in:
2026-01-17 12:05:34 +01:00
parent cc4eade957
commit 59568a42d8
14 changed files with 305 additions and 82 deletions
@@ -0,0 +1,79 @@
---
type: Guide
status: ACTIVE
owner: Frontend Expert
last_update: 2026-01-17
---
# Feature-Implementierungs-Guide
Dieser Guide beschreibt das Standard-Vorgehen zur Implementierung eines neuen Features im Meldestelle-Frontend, basierend auf der Referenz-Implementierung des `ping-feature`.
## Architektur-Muster
Jedes Feature folgt einer strikten Trennung und nutzt Dependency Injection (Koin).
### 1. API Client (Network Layer)
Anstatt einen eigenen `HttpClient` zu instanziieren, nutzen wir den zentralen, authentifizierten Client aus dem Core.
**Muster:**
* Erstelle ein Interface für die API (z.B. `PingApi` im Contract-Modul).
* Implementiere den Client im Feature-Modul und lasse dir den `HttpClient` injizieren.
```kotlin
// Feature-Modul: src/commonMain/.../MyFeatureApiClient.kt
class MyFeatureApiClient(private val client: HttpClient) : MyFeatureApi {
override suspend fun getData(): MyData {
// Der 'client' ist bereits mit BaseURL und Auth-Token konfiguriert
return client.get("/api/my-feature/data").body()
}
}
```
### 2. Dependency Injection (Koin)
Jedes Feature definiert sein eigenes Koin-Modul.
**Muster:**
* Nutze `named("apiClient")` um den authentifizierten Client zu erhalten.
* Registriere den API-Client und das ViewModel.
```kotlin
// Feature-Modul: src/commonMain/.../di/MyFeatureModule.kt
val myFeatureModule = module {
// API Client mit Shared HttpClient
single<MyFeatureApi> { MyFeatureApiClient(get(named("apiClient"))) }
// ViewModel
factory { MyFeatureViewModel(get()) }
}
```
### 3. ViewModel
Das ViewModel erhält die API (oder das Repository) via Konstruktor-Injektion.
```kotlin
class MyFeatureViewModel(private val api: MyFeatureApi) : ViewModel() {
// ...
}
```
### 4. Integration (Shell)
Das Feature-Modul muss in der Shell (z.B. `meldestelle-portal`) registriert werden.
1. **Gradle:** `implementation(projects.frontend.features.myFeature)` in `build.gradle.kts` der Shell.
2. **Koin Init:** Füge das Modul zur `initKoin`-Liste in `main.kt` (Desktop & Web) hinzu.
## Web-Spezifika (Worker)
Falls das Feature Web-Worker benötigt (z.B. für SQLDelight), muss sichergestellt werden, dass diese korrekt kopiert werden.
* **Build-Script:** In der Shell `build.gradle.kts` muss der Copy-Task angepasst werden, falls neue Worker hinzukommen.
* **Pfad:** `rootProject.layout.buildDirectory.dir("js/packages/${rootProject.name}-frontend-shells-meldestelle-portal/kotlin")`
## Referenz
Siehe `frontend/features/ping-feature` für die vollständige Implementierung inkl. Tests.
@@ -0,0 +1,52 @@
---
type: Report
status: FINAL
owner: Frontend Expert
date: 2026-01-17
tags: [frontend, kmp, auth, ping, architecture]
---
# 🚩 Statusbericht: Frontend (17. Jänner 2026)
**Status:****Erfolgreich abgeschlossen**
Wir haben heute die technische Basis des Frontends massiv stabilisiert und das "Ping-Feature" als vollständige Referenz-Implementierung für gesicherte API-Kommunikation fertiggestellt.
### 🚀 Erreichte Meilensteine
1. **Central Authenticated Client:**
* Das `Ping-Feature` nutzt nun nicht mehr einen eigenen HttpClient, sondern den zentralen, via Koin bereitgestellten `apiClient`.
* Dieser Client injiziert automatisch den Bearer-Token aus dem `AuthTokenManager`.
* **Ergebnis:** Der "Secure Ping" funktioniert und validiert die gesamte Auth-Kette (Keycloak -> Token -> Request).
2. **Dependency Injection (Koin) Refactoring:**
* Saubere Trennung: `PingApiKoinClient` (neu) vs. `PingApiClient` (Legacy/Deprecated).
* Das `PingViewModel` erhält Abhängigkeiten nun strikt via Constructor Injection.
* Die Module (`pingFeatureModule`, `pingSyncFeatureModule`) werden in der Shell (`MainApp`/`main.kt`) korrekt geladen.
3. **Build-Pipeline & Web-Support (Critical Fix):**
* **Webpack Worker Fix:** Das Problem, dass `sqlite.worker.js` im Web-Build nicht gefunden wurde, ist behoben. Der Copy-Task in `build.gradle.kts` kopiert den Worker nun exakt in das von Kotlin/JS generierte Package-Verzeichnis.
* **Deprecations:** Veraltete Gradle-Konstrukte und Code-Deprecations wurden bereinigt.
4. **Qualitätssicherung:**
* Unit-Tests für den API-Client wurden auf `MockEngine` umgestellt und testen nun die neue Architektur.
---
# 📚 Curator Report (Documentation)
Als **Documentation & Knowledge Curator** habe ich die Erkenntnisse der heutigen Session gesichert:
1. **Neues Dokument:** [`docs/06_Frontend/feature-implementation-guide.md`](../06_Frontend/feature-implementation-guide.md)
* Dient als "Blaupause" für alle zukünftigen Features.
* Beschreibt exakt, wie man den `AuthenticatedHttpClient` einbindet und die Koin-Module strukturiert.
* Dokumentiert den Web-Worker-Copy-Prozess für SQLDelight.
2. **Code-Dokumentation:**
* Veraltete Klassen wurden bereinigt oder dokumentiert.
* Die `build.gradle.kts` Files enthalten nun Kommentare zur Lösung des Webpack-Pfad-Problems.
---
**Nächste Schritte:**
Die technische "Vorlage" (Ping-Feature) ist nun sauber, performant und getestet. Die Infrastruktur (Auth, Sync, DB, Web-Build) steht. Wir sind bereit für die Implementierung der echten Fachdomänen (Veranstaltungen, Personen, Pferde).