From ae64714465265fca453e9286ddf2a336b268ff88 Mon Sep 17 00:00:00 2001 From: Stefan Mogeritsch Date: Thu, 26 Mar 2026 16:59:31 +0100 Subject: [PATCH] refactor(preview): replace `@Preview` with `@ComponentPreview` and update dependencies - Replaced all occurrences of `@Preview` with the standardized `@ComponentPreview` annotation for a consistent preview experience across modules. - Added `compose.uiTooling` dependency to `core/design-system` for enhanced preview functionality. Signed-off-by: Stefan Mogeritsch --- frontend/core/design-system/build.gradle.kts | 3 ++ .../at/mocode/wui/preview/Multipreview.kt | 23 ++++++++++ .../feature/presentation/PingScreenPreview.kt | 16 +++---- .../screens/layout/DesktopMainLayout.kt | 24 ++++++----- .../desktop/screens/preview/ScreenPreviews.kt | 42 ++++++++----------- 5 files changed, 62 insertions(+), 46 deletions(-) create mode 100644 frontend/core/design-system/src/jvmMain/kotlin/at/mocode/wui/preview/Multipreview.kt diff --git a/frontend/core/design-system/build.gradle.kts b/frontend/core/design-system/build.gradle.kts index b2ba23a0..428194c4 100644 --- a/frontend/core/design-system/build.gradle.kts +++ b/frontend/core/design-system/build.gradle.kts @@ -26,5 +26,8 @@ kotlin { implementation(compose.components.resources) implementation(libs.bundles.kmp.common) } + jvmMain.dependencies { + implementation(compose.uiTooling) + } } } diff --git a/frontend/core/design-system/src/jvmMain/kotlin/at/mocode/wui/preview/Multipreview.kt b/frontend/core/design-system/src/jvmMain/kotlin/at/mocode/wui/preview/Multipreview.kt new file mode 100644 index 00000000..bcc62d2b --- /dev/null +++ b/frontend/core/design-system/src/jvmMain/kotlin/at/mocode/wui/preview/Multipreview.kt @@ -0,0 +1,23 @@ +package at.mocode.wui.preview + +import androidx.compose.ui.tooling.preview.Preview + +/** + * A standardized preview annotation for UI components. + * + * This annotation provides a consistent size and background for component previews. + * It helps in maintaining a uniform look for previews across the project. + * + * Groups can be used to organize previews in the IDE. + * + * Usage: + * ``` + * @ComponentPreview + * @Composable + * fun MyButtonPreview() { + * MyButton() + * } + * ``` + */ +@Preview(showBackground = true, widthDp = 800, heightDp = 400) +annotation class ComponentPreview diff --git a/frontend/features/ping-feature/src/jvmMain/kotlin/at/mocode/ping/feature/presentation/PingScreenPreview.kt b/frontend/features/ping-feature/src/jvmMain/kotlin/at/mocode/ping/feature/presentation/PingScreenPreview.kt index 6dc753f6..1f85ff0c 100644 --- a/frontend/features/ping-feature/src/jvmMain/kotlin/at/mocode/ping/feature/presentation/PingScreenPreview.kt +++ b/frontend/features/ping-feature/src/jvmMain/kotlin/at/mocode/ping/feature/presentation/PingScreenPreview.kt @@ -2,13 +2,9 @@ package at.mocode.ping.feature.presentation import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable -import androidx.compose.ui.tooling.preview.Preview -import at.mocode.ping.api.EnhancedPingResponse -import at.mocode.ping.api.HealthResponse -import at.mocode.ping.api.PingApi -import at.mocode.ping.api.PingEvent -import at.mocode.ping.api.PingResponse +import at.mocode.ping.api.* import at.mocode.ping.feature.domain.PingSyncService +import at.mocode.wui.preview.ComponentPreview // ───────────────────────────────────────────────────────────────────────────── // Fake-Implementierungen für Preview (kein Koin, kein Netzwerk nötig) @@ -53,7 +49,7 @@ private class PreviewPingViewModel(state: PingUiState) : // Previews // ───────────────────────────────────────────────────────────────────────────── -@Preview +@ComponentPreview @Composable fun PreviewPingScreen_Empty() { MaterialTheme { @@ -64,7 +60,7 @@ fun PreviewPingScreen_Empty() { } } -@Preview +@ComponentPreview @Composable fun PreviewPingScreen_WithData() { MaterialTheme { @@ -84,7 +80,7 @@ fun PreviewPingScreen_WithData() { } } -@Preview +@ComponentPreview @Composable fun PreviewPingScreen_Loading() { MaterialTheme { @@ -95,7 +91,7 @@ fun PreviewPingScreen_Loading() { } } -@Preview +@ComponentPreview @Composable fun PreviewPingScreen_Error() { MaterialTheme { diff --git a/frontend/shells/meldestelle-desktop/src/jvmMain/kotlin/at/mocode/desktop/screens/layout/DesktopMainLayout.kt b/frontend/shells/meldestelle-desktop/src/jvmMain/kotlin/at/mocode/desktop/screens/layout/DesktopMainLayout.kt index 92fe88f5..558d273c 100644 --- a/frontend/shells/meldestelle-desktop/src/jvmMain/kotlin/at/mocode/desktop/screens/layout/DesktopMainLayout.kt +++ b/frontend/shells/meldestelle-desktop/src/jvmMain/kotlin/at/mocode/desktop/screens/layout/DesktopMainLayout.kt @@ -6,7 +6,9 @@ import androidx.compose.foundation.layout.* import androidx.compose.material.icons.Icons import androidx.compose.material.icons.automirrored.filled.ArrowBack import androidx.compose.material.icons.automirrored.filled.Logout -import androidx.compose.material3.* +import androidx.compose.material3.Icon +import androidx.compose.material3.IconButton +import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier @@ -15,19 +17,18 @@ import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import at.mocode.frontend.core.navigation.AppScreen -import at.mocode.veranstaltung.feature.presentation.AdminUebersichtScreen -import at.mocode.veranstalter.feature.presentation.VeranstalterAuswahlScreen -import at.mocode.veranstalter.feature.presentation.VeranstalterNeuScreen -import at.mocode.veranstalter.feature.presentation.VeranstalterDetailScreen -import at.mocode.veranstaltung.feature.presentation.VeranstaltungUebersichtScreen -import at.mocode.veranstaltung.feature.presentation.VeranstaltungDetailScreen -import at.mocode.veranstaltung.feature.presentation.VeranstaltungNeuScreen +import at.mocode.ping.feature.presentation.PingScreen +import at.mocode.ping.feature.presentation.PingViewModel import at.mocode.turnier.feature.presentation.TurnierDetailScreen import at.mocode.turnier.feature.presentation.TurnierNeuScreen -import at.mocode.zns.feature.presentation.StammdatenImportScreen -import at.mocode.ping.feature.presentation.PingScreen +import at.mocode.veranstalter.feature.presentation.VeranstalterAuswahlScreen +import at.mocode.veranstalter.feature.presentation.VeranstalterDetailScreen +import at.mocode.veranstalter.feature.presentation.VeranstalterNeuScreen +import at.mocode.veranstaltung.feature.presentation.AdminUebersichtScreen +import at.mocode.veranstaltung.feature.presentation.VeranstaltungDetailScreen +import at.mocode.veranstaltung.feature.presentation.VeranstaltungNeuScreen +import at.mocode.veranstaltung.feature.presentation.VeranstaltungUebersichtScreen import org.koin.compose.koinInject -import at.mocode.ping.feature.presentation.PingViewModel // Primärfarbe der TopBar (kann später ins Theme ausgelagert werden) private val TopBarColor = Color(0xFF1E3A8A) @@ -72,6 +73,7 @@ fun DesktopMainLayout( * - Veranstaltung: "🏠 Admin - Verwaltung / Veranstaltung #" * - Turnier: "🏠 Admin - Verwaltung / Veranstaltung # / Turnier " */ + @Composable private fun DesktopTopBar( currentScreen: AppScreen, diff --git a/frontend/shells/meldestelle-desktop/src/jvmMain/kotlin/at/mocode/desktop/screens/preview/ScreenPreviews.kt b/frontend/shells/meldestelle-desktop/src/jvmMain/kotlin/at/mocode/desktop/screens/preview/ScreenPreviews.kt index 0690eaf5..8379d6f0 100644 --- a/frontend/shells/meldestelle-desktop/src/jvmMain/kotlin/at/mocode/desktop/screens/preview/ScreenPreviews.kt +++ b/frontend/shells/meldestelle-desktop/src/jvmMain/kotlin/at/mocode/desktop/screens/preview/ScreenPreviews.kt @@ -1,21 +1,13 @@ package at.mocode.desktop.screens.preview -import androidx.compose.ui.tooling.preview.Preview import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable +import at.mocode.turnier.feature.presentation.* import at.mocode.veranstalter.feature.presentation.VeranstalterAuswahlScreen -import at.mocode.veranstalter.feature.presentation.VeranstalterNeuScreen import at.mocode.veranstalter.feature.presentation.VeranstalterDetailScreen +import at.mocode.veranstalter.feature.presentation.VeranstalterNeuScreen import at.mocode.veranstaltung.feature.presentation.VeranstaltungUebersichtScreen -import at.mocode.turnier.feature.presentation.TurnierDetailScreen -import at.mocode.turnier.feature.presentation.StammdatenTabContent -import at.mocode.turnier.feature.presentation.OrganisationTabContent -import at.mocode.turnier.feature.presentation.BewerbeTabContent -import at.mocode.turnier.feature.presentation.ArtikelTabContent -import at.mocode.turnier.feature.presentation.AbrechnungTabContent -import at.mocode.turnier.feature.presentation.NennungenTabContent -import at.mocode.turnier.feature.presentation.StartlistenTabContent -import at.mocode.turnier.feature.presentation.ErgebnislistenTabContent +import at.mocode.wui.preview.ComponentPreview // ───────────────────────────────────────────────────────────────────────────── // Compose Desktop Previews – alle wichtigen Screens auf einen Blick @@ -26,7 +18,7 @@ import at.mocode.turnier.feature.presentation.ErgebnislistenTabContent // ── Veranstalter-Auswahl ───────────────────────────────────────────────────── -@Preview +@ComponentPreview @Composable fun PreviewVeranstalterAuswahlScreen() { MaterialTheme { @@ -40,7 +32,7 @@ fun PreviewVeranstalterAuswahlScreen() { // ── Neuer Veranstalter ─────────────────────────────────────────────────────── -@Preview +@ComponentPreview @Composable fun PreviewVeranstalterNeuScreen() { MaterialTheme { @@ -53,7 +45,7 @@ fun PreviewVeranstalterNeuScreen() { // ── Veranstalter-Detail ────────────────────────────────────────────────────── -@Preview +@ComponentPreview @Composable fun PreviewVeranstalterDetailScreen() { MaterialTheme { @@ -68,7 +60,7 @@ fun PreviewVeranstalterDetailScreen() { // ── Veranstaltung-Übersicht ────────────────────────────────────────────────── -@Preview +@ComponentPreview @Composable fun PreviewVeranstaltungUebersichtScreen() { MaterialTheme { @@ -87,7 +79,7 @@ fun PreviewVeranstaltungUebersichtScreen() { // ── Turnier-Detail (alle Tabs) ─────────────────────────────────────────────── -@Preview +@ComponentPreview @Composable fun PreviewTurnierDetailScreen() { MaterialTheme { @@ -101,7 +93,7 @@ fun PreviewTurnierDetailScreen() { // ── Turnier-Tabs einzeln ───────────────────────────────────────────────────── -@Preview +@ComponentPreview @Composable fun PreviewTurnierStammdatenTab() { MaterialTheme { @@ -109,7 +101,7 @@ fun PreviewTurnierStammdatenTab() { } } -@Preview +@ComponentPreview @Composable fun PreviewTurnierOrganisationTab() { MaterialTheme { @@ -117,7 +109,7 @@ fun PreviewTurnierOrganisationTab() { } } -@Preview +@ComponentPreview @Composable fun PreviewTurnierBewerbeTab() { MaterialTheme { @@ -125,7 +117,7 @@ fun PreviewTurnierBewerbeTab() { } } -@Preview +@ComponentPreview @Composable fun PreviewTurnierArtikelTab() { MaterialTheme { @@ -133,7 +125,7 @@ fun PreviewTurnierArtikelTab() { } } -@Preview +@ComponentPreview @Composable fun PreviewTurnierAbrechnungTab() { MaterialTheme { @@ -141,7 +133,7 @@ fun PreviewTurnierAbrechnungTab() { } } -@Preview +@ComponentPreview @Composable fun PreviewTurnierNennungenTab() { MaterialTheme { @@ -149,7 +141,7 @@ fun PreviewTurnierNennungenTab() { } } -@Preview +@ComponentPreview @Composable fun PreviewTurnierStartlistenTab() { MaterialTheme { @@ -157,7 +149,7 @@ fun PreviewTurnierStartlistenTab() { } } -@Preview +@ComponentPreview @Composable fun PreviewTurnierErgebnislistenTab() { MaterialTheme { @@ -168,7 +160,7 @@ fun PreviewTurnierErgebnislistenTab() { // ── Stammdaten-Import ──────────────────────────────────────────────────────── // StammdatenImportScreen benötigt einen ZnsImportViewModel (Koin) – Preview nur als Hinweis. -// @Preview +// @ComponentPreview // @Composable // fun PreviewStammdatenImportScreen() { // MaterialTheme { StammdatenImportScreen() }