From 0806600bc0aed3a5fca00de4adb86f379a7f7dff Mon Sep 17 00:00:00 2001 From: Till JS Date: Sun, 29 Mar 2026 14:54:31 +0200 Subject: [PATCH] feat(mana-games): add auth, settings, themes, help, submit, and onboarding pages Adds login/register/forgot-password auth routes using shared-auth-ui, settings page with theme/language/account controls, themes browser, help page, community submit form, profile, and app onboarding modal. Co-Authored-By: Claude Opus 4.6 (1M context) --- .../src/lib/stores/app-onboarding.svelte.ts | 41 ++++ .../apps/web/src/routes/(app)/+layout.svelte | 6 + .../web/src/routes/(app)/help/+page.svelte | 47 ++++ .../web/src/routes/(app)/mana/+page.svelte | 9 + .../web/src/routes/(app)/profile/+page.svelte | 18 ++ .../src/routes/(app)/settings/+page.svelte | 165 ++++++++++++++ .../web/src/routes/(app)/submit/+page.svelte | 202 ++++++++++++++++++ .../web/src/routes/(app)/tags/+page.svelte | 9 + .../web/src/routes/(app)/themes/+page.svelte | 36 ++++ .../(auth)/forgot-password/+page.svelte | 11 + .../web/src/routes/(auth)/login/+page.svelte | 18 ++ .../src/routes/(auth)/register/+page.svelte | 11 + .../routes/(auth)/reset-password/+page.svelte | 15 ++ .../apps/web/src/routes/health/+server.ts | 14 ++ 14 files changed, 602 insertions(+) create mode 100644 games/mana-games/apps/web/src/lib/stores/app-onboarding.svelte.ts create mode 100644 games/mana-games/apps/web/src/routes/(app)/help/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/(app)/mana/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/(app)/profile/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/(app)/settings/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/(app)/submit/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/(app)/tags/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/(app)/themes/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/(auth)/forgot-password/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/(auth)/login/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/(auth)/register/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/(auth)/reset-password/+page.svelte create mode 100644 games/mana-games/apps/web/src/routes/health/+server.ts diff --git a/games/mana-games/apps/web/src/lib/stores/app-onboarding.svelte.ts b/games/mana-games/apps/web/src/lib/stores/app-onboarding.svelte.ts new file mode 100644 index 000000000..b3be6e663 --- /dev/null +++ b/games/mana-games/apps/web/src/lib/stores/app-onboarding.svelte.ts @@ -0,0 +1,41 @@ +import { createAppOnboardingStore, type AppOnboardingStep } from '@manacore/shared-app-onboarding'; +import { userSettings } from './user-settings.svelte'; + +const onboardingSteps: AppOnboardingStep[] = [ + { + id: 'features', + type: 'info', + question: 'Willkommen bei Mana Games!', + description: 'Das erwartet dich:', + emoji: '🎮', + gradient: { from: 'green-500', to: 'green-700' }, + bullets: [ + '22+ Browser-Spiele direkt spielbar', + 'KI-Spielgenerator: Erstelle eigene Games', + 'Statistiken: Highscores & Spielzeit', + 'Community: Reiche eigene Spiele ein', + ], + }, + { + id: 'welcome', + type: 'info', + question: "Los geht's!", + description: 'Tipps:', + emoji: '🕹️', + gradient: { from: 'primary', to: 'primary/70' }, + bullets: [ + 'Cmd/Ctrl+K für Schnellsuche', + 'Spiele laufen komplett im Browser', + 'Stats werden lokal gespeichert', + 'Anmelden synchronisiert deine Daten', + ], + }, +]; + +export const gamesOnboarding = createAppOnboardingStore({ + appId: 'mana-games', + steps: onboardingSteps, + userSettings, + onComplete: async () => {}, + onSkip: async () => {}, +}); diff --git a/games/mana-games/apps/web/src/routes/(app)/+layout.svelte b/games/mana-games/apps/web/src/routes/(app)/+layout.svelte index 31f297173..63c9c76e0 100644 --- a/games/mana-games/apps/web/src/routes/(app)/+layout.svelte +++ b/games/mana-games/apps/web/src/routes/(app)/+layout.svelte @@ -26,6 +26,8 @@ import { setLocale, supportedLocales } from '$lib/i18n'; import { SessionExpiredBanner, AuthGate, GuestWelcomeModal } from '@manacore/shared-auth-ui'; import { shouldShowGuestWelcome } from '@manacore/shared-auth-ui'; + import { gamesOnboarding } from '$lib/stores/app-onboarding.svelte'; + import { MiniOnboardingModal } from '@manacore/shared-app-onboarding'; import { gamesStore } from '$lib/data/local-store'; import { tagLocalStore, @@ -241,6 +243,10 @@ /> + {#if gamesOnboarding.shouldShow} + + {/if} + + Hilfe - Mana Games + + +
+

Hilfe

+ +
+
+

Wie spiele ich?

+

+ Wähle ein Spiel auf der Startseite aus und klicke darauf. Das Spiel läuft direkt im Browser. + Die Steuerung wird auf der Spielseite angezeigt. +

+
+ +
+

KI-Spielgenerator

+

+ Unter "Erstellen" kannst du eigene Spiele beschreiben und von verschiedenen KI-Modellen + generieren lassen. Generierte Spiele werden lokal in deinem Browser gespeichert. +

+
+ +
+

Statistiken

+

+ Deine Highscores, Spielzeiten und Fortschritte werden automatisch gespeichert. Melde dich + an, um sie geräteübergreifend zu synchronisieren. +

+
+ +
+

Tastaturkürzel

+
+ {#each [['Cmd/Ctrl+K', 'Schnellsuche'], ['Esc', 'Suche schließen']] as [key, desc]} +
+ {key} + {desc} +
+ {/each} +
+
+
+
diff --git a/games/mana-games/apps/web/src/routes/(app)/mana/+page.svelte b/games/mana-games/apps/web/src/routes/(app)/mana/+page.svelte new file mode 100644 index 000000000..b2afc7260 --- /dev/null +++ b/games/mana-games/apps/web/src/routes/(app)/mana/+page.svelte @@ -0,0 +1,9 @@ + + Mana - Mana Games + + +
+

💎

+

Mana

+

Demnächst verfügbar.

+
diff --git a/games/mana-games/apps/web/src/routes/(app)/profile/+page.svelte b/games/mana-games/apps/web/src/routes/(app)/profile/+page.svelte new file mode 100644 index 000000000..1da19382f --- /dev/null +++ b/games/mana-games/apps/web/src/routes/(app)/profile/+page.svelte @@ -0,0 +1,18 @@ + + + + Profil - Mana Games + + +{#if authStore.isAuthenticated} + +{:else} +
+

Bitte melde dich an.

+ Anmelden +
+{/if} diff --git a/games/mana-games/apps/web/src/routes/(app)/settings/+page.svelte b/games/mana-games/apps/web/src/routes/(app)/settings/+page.svelte new file mode 100644 index 000000000..166fc8d3b --- /dev/null +++ b/games/mana-games/apps/web/src/routes/(app)/settings/+page.svelte @@ -0,0 +1,165 @@ + + + + {$_('nav.settings')} - Mana Games + + +
+
+

{$_('nav.settings')}

+

Passe Mana Games an deine Bedürfnisse an

+
+ + +
+

Darstellung

+ +
+
+
Farbmodus
+
Hell, Dunkel oder System
+
+
+ {#each ['light', 'dark', 'system'] as mode} + + {/each} +
+
+
+ + +
+

Sprache

+ +
+
+
App-Sprache
+
Sprache der Benutzeroberfläche
+
+ +
+
+ + +
+

Konto

+ + {#if authStore.isAuthenticated} +
+
+
Eingeloggt als
+
{authStore.user?.email}
+
+ +
+ {:else} +
+
+
Gast-Modus
+
Melde dich an, um Stats zu synchronisieren
+
+ + Anmelden + +
+ {/if} +
+ + +
+

Daten

+ +
+
+
Spielstatistiken löschen
+
Alle Highscores und Spielzeiten zurücksetzen
+
+ +
+
+
+ + diff --git a/games/mana-games/apps/web/src/routes/(app)/submit/+page.svelte b/games/mana-games/apps/web/src/routes/(app)/submit/+page.svelte new file mode 100644 index 000000000..c307d808e --- /dev/null +++ b/games/mana-games/apps/web/src/routes/(app)/submit/+page.svelte @@ -0,0 +1,202 @@ + + + + Spiel einreichen - Mana Games + + +
+
+

Spiel einreichen

+

Reiche dein eigenes HTML5-Spiel bei der Community ein.

+
+ + {#if !authStore.isAuthenticated} +
+

Bitte melde dich an, um ein Spiel einzureichen.

+ + Anmelden + +
+ {:else} +
{ + e.preventDefault(); + handleSubmit(); + }} + class="space-y-4" + > +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+
+ + +
+
+ + +
+
+ +
+ + +
+ +
+ + +
+ + {#if submitResult} +
+ {submitResult.message} +
+ {/if} + + +
+ {/if} +
diff --git a/games/mana-games/apps/web/src/routes/(app)/tags/+page.svelte b/games/mana-games/apps/web/src/routes/(app)/tags/+page.svelte new file mode 100644 index 000000000..98382883f --- /dev/null +++ b/games/mana-games/apps/web/src/routes/(app)/tags/+page.svelte @@ -0,0 +1,9 @@ + + Tags - Mana Games + + +
+

🏷️

+

Tags

+

Demnächst verfügbar.

+
diff --git a/games/mana-games/apps/web/src/routes/(app)/themes/+page.svelte b/games/mana-games/apps/web/src/routes/(app)/themes/+page.svelte new file mode 100644 index 000000000..78e0d6d02 --- /dev/null +++ b/games/mana-games/apps/web/src/routes/(app)/themes/+page.svelte @@ -0,0 +1,36 @@ + + + + Themes - Mana Games + + +
+
+

Themes

+

Wähle ein Theme für Mana Games

+
+ +
+ {#each allThemes as variant} + {@const def = THEME_DEFINITIONS[variant]} + {#if def} + + {/if} + {/each} +
+
diff --git a/games/mana-games/apps/web/src/routes/(auth)/forgot-password/+page.svelte b/games/mana-games/apps/web/src/routes/(auth)/forgot-password/+page.svelte new file mode 100644 index 000000000..0aed983cd --- /dev/null +++ b/games/mana-games/apps/web/src/routes/(auth)/forgot-password/+page.svelte @@ -0,0 +1,11 @@ + + + + Mana Games - Passwort vergessen + + + diff --git a/games/mana-games/apps/web/src/routes/(auth)/login/+page.svelte b/games/mana-games/apps/web/src/routes/(auth)/login/+page.svelte new file mode 100644 index 000000000..f5744f4a3 --- /dev/null +++ b/games/mana-games/apps/web/src/routes/(auth)/login/+page.svelte @@ -0,0 +1,18 @@ + + + + Mana Games - Login + + + diff --git a/games/mana-games/apps/web/src/routes/(auth)/register/+page.svelte b/games/mana-games/apps/web/src/routes/(auth)/register/+page.svelte new file mode 100644 index 000000000..33b537c09 --- /dev/null +++ b/games/mana-games/apps/web/src/routes/(auth)/register/+page.svelte @@ -0,0 +1,11 @@ + + + + Mana Games - Registrieren + + + diff --git a/games/mana-games/apps/web/src/routes/(auth)/reset-password/+page.svelte b/games/mana-games/apps/web/src/routes/(auth)/reset-password/+page.svelte new file mode 100644 index 000000000..872b27d7e --- /dev/null +++ b/games/mana-games/apps/web/src/routes/(auth)/reset-password/+page.svelte @@ -0,0 +1,15 @@ + + + + Mana Games - Passwort zurücksetzen + + +
+
+

Passwort zurücksetzen

+

Funktion wird eingerichtet.

+ Zurück zum Login +
+
diff --git a/games/mana-games/apps/web/src/routes/health/+server.ts b/games/mana-games/apps/web/src/routes/health/+server.ts new file mode 100644 index 000000000..f05ec6d47 --- /dev/null +++ b/games/mana-games/apps/web/src/routes/health/+server.ts @@ -0,0 +1,14 @@ +import type { RequestHandler } from './$types'; + +export const GET: RequestHandler = async () => { + return new Response( + JSON.stringify({ + status: 'ok', + service: 'mana-games-web', + timestamp: new Date().toISOString(), + }), + { + headers: { 'Content-Type': 'application/json' }, + } + ); +};