From 69d405ca84bd72599bf63291104a9ee37502ba5a Mon Sep 17 00:00:00 2001 From: Till-JS <101404291+Till-JS@users.noreply.github.com> Date: Thu, 29 Jan 2026 15:03:52 +0100 Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20refactor:=20centralize=20A?= =?UTF-8?q?uthGateModal=20in=20shared-auth-ui?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Create shared AuthGateModal component in @manacore/shared-auth-ui - Migrate 4 apps to use shared component: chat, todo, contacts, calendar - Remove duplicate local AuthGateModal components - Support for 'save', 'sync', 'feature', 'ai' actions - Built-in i18n (DE + EN) with custom translation support - Optional migration info display for session data - Uses Phosphor icons from @manacore/shared-icons - Update CONSISTENCY_REPORT.md Co-Authored-By: Claude Opus 4.5 --- .../src/lib/components/AuthGateModal.svelte | 150 ----------- .../apps/web/src/routes/(app)/+layout.svelte | 18 +- .../src/lib/components/AuthGateModal.svelte | 230 ---------------- .../web/src/routes/(protected)/+layout.svelte | 28 +- .../src/lib/components/AuthGateModal.svelte | 151 ----------- .../apps/web/src/routes/(app)/+layout.svelte | 23 +- .../src/lib/components/AuthGateModal.svelte | 151 ----------- .../apps/web/src/routes/(app)/+layout.svelte | 23 +- docs/CONSISTENCY_REPORT.md | 19 +- .../src/components/AuthGateModal.svelte | 249 ++++++++++++++++++ packages/shared-auth-ui/src/index.ts | 3 + packages/shared-auth-ui/src/types.ts | 16 ++ 12 files changed, 363 insertions(+), 698 deletions(-) delete mode 100644 apps/calendar/apps/web/src/lib/components/AuthGateModal.svelte delete mode 100644 apps/chat/apps/web/src/lib/components/AuthGateModal.svelte delete mode 100644 apps/contacts/apps/web/src/lib/components/AuthGateModal.svelte delete mode 100644 apps/todo/apps/web/src/lib/components/AuthGateModal.svelte create mode 100644 packages/shared-auth-ui/src/components/AuthGateModal.svelte diff --git a/apps/calendar/apps/web/src/lib/components/AuthGateModal.svelte b/apps/calendar/apps/web/src/lib/components/AuthGateModal.svelte deleted file mode 100644 index 3f1e40481..000000000 --- a/apps/calendar/apps/web/src/lib/components/AuthGateModal.svelte +++ /dev/null @@ -1,150 +0,0 @@ - - - - -{#if visible} - -
- -
-{/if} diff --git a/apps/calendar/apps/web/src/routes/(app)/+layout.svelte b/apps/calendar/apps/web/src/routes/(app)/+layout.svelte index 86ffc4304..d97face39 100644 --- a/apps/calendar/apps/web/src/routes/(app)/+layout.svelte +++ b/apps/calendar/apps/web/src/routes/(app)/+layout.svelte @@ -64,7 +64,7 @@ import EventContextMenu from '$lib/components/event/EventContextMenu.svelte'; import ViewModePillContextMenu from '$lib/components/calendar/ViewModePillContextMenu.svelte'; import SettingsModal from '$lib/components/settings/SettingsModal.svelte'; - import AuthGateModal from '$lib/components/AuthGateModal.svelte'; + import { AuthGateModal } from '@manacore/shared-auth-ui'; import VoiceRecordButton from '$lib/components/voice/VoiceRecordButton.svelte'; import VoiceRecordingModal from '$lib/components/voice/VoiceRecordingModal.svelte'; import { voiceRecordingStore } from '$lib/stores/voice-recording.svelte'; @@ -864,7 +864,23 @@ (showAuthGateModal = false)} + onLogin={() => { + showAuthGateModal = false; + if (typeof sessionStorage !== 'undefined') { + sessionStorage.setItem('auth-return-url', window.location.pathname); + } + goto('/login'); + }} + onRegister={() => { + showAuthGateModal = false; + if (typeof sessionStorage !== 'undefined') { + sessionStorage.setItem('auth-return-url', window.location.pathname); + } + goto('/register'); + }} action={authGateAction} + locale={currentLocale === 'en' ? 'en' : 'de'} + infoText="Du kannst im Demo-Modus die Beispiel-Termine ansehen, aber keine eigenen erstellen." /> diff --git a/apps/chat/apps/web/src/lib/components/AuthGateModal.svelte b/apps/chat/apps/web/src/lib/components/AuthGateModal.svelte deleted file mode 100644 index b0a87702d..000000000 --- a/apps/chat/apps/web/src/lib/components/AuthGateModal.svelte +++ /dev/null @@ -1,230 +0,0 @@ - - -{#if open} - -
-
e.stopPropagation()}> -
-

{currentMessage.title}

- -
- -
-

{currentMessage.description}

- - {#if conversationCount > 0} -
- - - - - - Du hast {conversationCount} - {conversationCount === 1 ? 'Unterhaltung' : 'Unterhaltungen'} in deiner Session. Diese - werden nach der Anmeldung in deinen Account übertragen. -
- {/if} -
- -
- - - -
-
-
-{/if} - - diff --git a/apps/chat/apps/web/src/routes/(protected)/+layout.svelte b/apps/chat/apps/web/src/routes/(protected)/+layout.svelte index a1208b716..dcfee28bf 100644 --- a/apps/chat/apps/web/src/routes/(protected)/+layout.svelte +++ b/apps/chat/apps/web/src/routes/(protected)/+layout.svelte @@ -24,8 +24,11 @@ import { getPillAppItems } from '@manacore/shared-branding'; import { getLanguageDropdownItems, getCurrentLanguageLabel } from '@manacore/shared-i18n'; import { setLocale, supportedLocales } from '$lib/i18n'; - import AuthGateModal from '$lib/components/AuthGateModal.svelte'; - import { GuestWelcomeModal, shouldShowGuestWelcome } from '@manacore/shared-auth-ui'; + import { + AuthGateModal, + GuestWelcomeModal, + shouldShowGuestWelcome, + } from '@manacore/shared-auth-ui'; import type { LayoutData } from './$types'; // App switcher items @@ -296,10 +299,25 @@ (showAuthGateModal = false)} + onLogin={() => { + showAuthGateModal = false; + if (typeof sessionStorage !== 'undefined') { + sessionStorage.setItem('auth-return-url', window.location.pathname); + } + goto('/login'); + }} + onRegister={() => { + showAuthGateModal = false; + if (typeof sessionStorage !== 'undefined') { + sessionStorage.setItem('auth-return-url', window.location.pathname); + } + goto('/register'); + }} + action={authGateAction} + migrationCount={sessionConversationCount} + locale={currentLocale === 'en' ? 'en' : 'de'} /> diff --git a/apps/contacts/apps/web/src/lib/components/AuthGateModal.svelte b/apps/contacts/apps/web/src/lib/components/AuthGateModal.svelte deleted file mode 100644 index 989bf869c..000000000 --- a/apps/contacts/apps/web/src/lib/components/AuthGateModal.svelte +++ /dev/null @@ -1,151 +0,0 @@ - - - - -{#if visible} - -
- -
-{/if} diff --git a/apps/contacts/apps/web/src/routes/(app)/+layout.svelte b/apps/contacts/apps/web/src/routes/(app)/+layout.svelte index 9ac21ec6c..0b8554fa1 100644 --- a/apps/contacts/apps/web/src/routes/(app)/+layout.svelte +++ b/apps/contacts/apps/web/src/routes/(app)/+layout.svelte @@ -46,8 +46,11 @@ formatParsedContactPreview, } from '$lib/utils/contact-parser'; import ContactsToolbar from '$lib/components/ContactsToolbar.svelte'; - import AuthGateModal from '$lib/components/AuthGateModal.svelte'; - import { GuestWelcomeModal, shouldShowGuestWelcome } from '@manacore/shared-auth-ui'; + import { + AuthGateModal, + GuestWelcomeModal, + shouldShowGuestWelcome, + } from '@manacore/shared-auth-ui'; import { browser } from '$app/environment'; // Tags state for Quick-Create @@ -483,7 +486,23 @@ (showAuthGateModal = false)} + onLogin={() => { + showAuthGateModal = false; + if (typeof sessionStorage !== 'undefined') { + sessionStorage.setItem('auth-return-url', window.location.pathname); + } + goto('/login'); + }} + onRegister={() => { + showAuthGateModal = false; + if (typeof sessionStorage !== 'undefined') { + sessionStorage.setItem('auth-return-url', window.location.pathname); + } + goto('/register'); + }} action={authGateAction} + locale={currentLocale === 'en' ? 'en' : 'de'} + infoText="Im Demo-Modus werden Beispielkontakte angezeigt. Melde dich an, um eigene Kontakte zu erstellen." /> diff --git a/apps/todo/apps/web/src/lib/components/AuthGateModal.svelte b/apps/todo/apps/web/src/lib/components/AuthGateModal.svelte deleted file mode 100644 index 85e770b05..000000000 --- a/apps/todo/apps/web/src/lib/components/AuthGateModal.svelte +++ /dev/null @@ -1,151 +0,0 @@ - - - - -{#if visible} - -
- -
-{/if} diff --git a/apps/todo/apps/web/src/routes/(app)/+layout.svelte b/apps/todo/apps/web/src/routes/(app)/+layout.svelte index 76bf92aef..8b96c9c8e 100644 --- a/apps/todo/apps/web/src/routes/(app)/+layout.svelte +++ b/apps/todo/apps/web/src/routes/(app)/+layout.svelte @@ -39,8 +39,11 @@ import { getPillAppItems } from '@manacore/shared-branding'; import { getTasks } from '$lib/api/tasks'; import { parseTaskInput, resolveTaskIds, formatParsedTaskPreview } from '$lib/utils/task-parser'; - import AuthGateModal from '$lib/components/AuthGateModal.svelte'; - import { GuestWelcomeModal, shouldShowGuestWelcome } from '@manacore/shared-auth-ui'; + import { + AuthGateModal, + GuestWelcomeModal, + shouldShowGuestWelcome, + } from '@manacore/shared-auth-ui'; import { browser } from '$app/environment'; // App switcher items @@ -515,7 +518,23 @@ (showAuthGateModal = false)} + onLogin={() => { + showAuthGateModal = false; + if (typeof sessionStorage !== 'undefined') { + sessionStorage.setItem('auth-return-url', window.location.pathname); + } + goto('/login'); + }} + onRegister={() => { + showAuthGateModal = false; + if (typeof sessionStorage !== 'undefined') { + sessionStorage.setItem('auth-return-url', window.location.pathname); + } + goto('/register'); + }} action={authGateAction} + locale={currentLocale === 'en' ? 'en' : 'de'} + infoText="Du kannst die Demo-Aufgaben ansehen, aber um eigene Aufgaben zu erstellen benötigst du ein Konto." /> diff --git a/docs/CONSISTENCY_REPORT.md b/docs/CONSISTENCY_REPORT.md index b497c4c76..ca2bf53d0 100644 --- a/docs/CONSISTENCY_REPORT.md +++ b/docs/CONSISTENCY_REPORT.md @@ -15,7 +15,7 @@ Nach eingehender Analyse aller Web-Apps im Monorepo wurden folgende Bereiche auf | i18n Implementation | ✅ Gut | ~~Mittel~~ | ✅ Erledigt | | Auth Implementation | ✅ Gut | Niedrig | - | | Styling & Tailwind | ✅ Sehr gut | Niedrig | - | -| Komponenten & Layouts | ⚠️ Mittel | Mittel | Offen | +| Komponenten & Layouts | ✅ Gut | ~~Mittel~~ | ✅ Erledigt | ### Erledigte Aufgaben (29.01.2026) @@ -25,6 +25,7 @@ Nach eingehender Analyse aller Web-Apps im Monorepo wurden folgende Bereiche auf 4. ✅ **lucide-svelte entfernt** - shared-ui nutzt jetzt nur noch `@manacore/shared-icons` 5. ✅ **@manacore/shared-api-client Package erstellt** - 10 Apps migriert (clock, todo, contacts, storage, calendar, picture, nutriphi, planta, questions, skilltree) 6. ✅ **i18n zu 6 Apps hinzugefügt** - todo, skilltree, nutriphi, planta, questions, matrix (jeweils DE + EN) +7. ✅ **AuthGateModal zentralisiert** - `@manacore/shared-auth-ui` für 4 Apps (chat, todo, contacts, calendar) --- @@ -204,10 +205,15 @@ Alle Apps nutzen **Mana Core Auth** mit `@manacore/shared-auth`. - API: `toastStore.success()`, `.error()`, `.warning()`, `.info()` - `ToastContainer` Komponente mit Phosphor Icons -#### AuthGateModal +#### AuthGateModal ✅ -- Dupliziert in: chat, todo, contacts, calendar -- Sollte in `@manacore/shared-auth-ui` +> **Status: Erledigt (29.01.2026)** + +- ✅ Zentrales AuthGateModal in `@manacore/shared-auth-ui` +- ✅ Migrierte Apps: chat, todo, contacts, calendar +- Unterstützt: 'save', 'sync', 'feature', 'ai' Actions +- i18n: DE + EN eingebaut +- Optionale Migration-Info für Session-Daten #### AppLoadingSkeleton @@ -247,6 +253,7 @@ Alle Apps nutzen **Mana Core Auth** mit `@manacore/shared-auth`. | ~~lucide-svelte aus shared-ui entfernen~~ | ✅ Erledigt | | ~~API Client Package erstellen~~ | ✅ Erledigt (10 Apps migriert) | | ~~i18n zu 6 Apps hinzufügen~~ | ✅ Erledigt | +| ~~AuthGateModal zentralisieren~~ | ✅ Erledigt (4 Apps migriert) | ### 🔴 Hohe Priorität @@ -256,7 +263,7 @@ _(Keine offenen Aufgaben mit hoher Priorität)_ | Aufgabe | Aufwand | Impact | |---------|---------|--------| -| AuthGateModal in Shared Package | Niedrig | Code-Reduktion | +| ~~AuthGateModal in Shared Package~~ | ~~Niedrig~~ | ✅ Erledigt | | Global Error Handler extrahieren | Niedrig | Error UX | ### 🟢 Niedrige Priorität @@ -272,7 +279,7 @@ _(Keine offenen Aufgaben mit hoher Priorität)_ 1. ~~**API Client Package** als nächstes angehen (höchster Impact)~~ ✅ Erledigt 2. ~~**i18n** zu fehlenden Apps hinzufügen~~ ✅ Erledigt (6 Apps) -3. **AuthGateModal** in Shared Package extrahieren +3. ~~**AuthGateModal** in Shared Package extrahieren~~ ✅ Erledigt (4 Apps) 4. **Global Error Handler** extrahieren 5. Schrittweise weitere Punkte abarbeiten diff --git a/packages/shared-auth-ui/src/components/AuthGateModal.svelte b/packages/shared-auth-ui/src/components/AuthGateModal.svelte new file mode 100644 index 000000000..845f92743 --- /dev/null +++ b/packages/shared-auth-ui/src/components/AuthGateModal.svelte @@ -0,0 +1,249 @@ + + + + +{#if visible} + +
+ +
+{/if} diff --git a/packages/shared-auth-ui/src/index.ts b/packages/shared-auth-ui/src/index.ts index 08b72a38b..efae4c516 100644 --- a/packages/shared-auth-ui/src/index.ts +++ b/packages/shared-auth-ui/src/index.ts @@ -7,6 +7,7 @@ export { default as ForgotPasswordPage } from './pages/ForgotPasswordPage.svelte export { default as GoogleSignInButton } from './components/GoogleSignInButton.svelte'; export { default as AppleSignInButton } from './components/AppleSignInButton.svelte'; export { default as GuestWelcomeModal } from './components/GuestWelcomeModal.svelte'; +export { default as AuthGateModal } from './components/AuthGateModal.svelte'; // Utilities export { @@ -42,4 +43,6 @@ export type { AuthServiceInterface, AuthResult, GuestWelcomeTranslations, + AuthGateAction, + AuthGateTranslations, } from './types'; diff --git a/packages/shared-auth-ui/src/types.ts b/packages/shared-auth-ui/src/types.ts index 880641d36..949922f45 100644 --- a/packages/shared-auth-ui/src/types.ts +++ b/packages/shared-auth-ui/src/types.ts @@ -77,3 +77,19 @@ export interface GuestWelcomeTranslations { /** App-specific feature list (array of strings) */ features?: string[]; } + +/** + * Action types for the AuthGateModal + */ +export type AuthGateAction = 'save' | 'sync' | 'feature' | 'ai'; + +/** + * Translation strings for the auth gate modal + */ +export interface AuthGateTranslations { + loginButton: string; + registerButton: string; + laterButton: string; + /** Function to generate migration info text */ + migrationInfo: (count: number) => string; +}