From 2dc289c59556e51c5f6cf08cfae1c6377de70174 Mon Sep 17 00:00:00 2001 From: Till-JS <101404291+Till-JS@users.noreply.github.com> Date: Sat, 29 Nov 2025 21:40:47 +0100 Subject: [PATCH] feat(chat): add shared profile UI package and integrate into navigation MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Create @manacore/shared-profile-ui package with ProfilePage component - Add glassmorphism-styled profile page with user info and actions - Move profile link into user dropdown menu as first item - Move layout toggle control to end of navigation - Fix pill navigation styling in sidebar mode (full-width pills, proper spacing) - Fix segmented control button hover states with proper border-radius - Fix theme mode selector blur styling in dropdown 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- apps/chat/apps/web/package.json | 3 + .../web/src/routes/(protected)/+layout.svelte | 2 + .../routes/(protected)/profile/+page.svelte | 232 +++------ packages/shared-profile-ui/package.json | 28 + .../shared-profile-ui/src/ProfilePage.svelte | 484 ++++++++++++++++++ packages/shared-profile-ui/src/index.ts | 12 + packages/shared-profile-ui/src/types.ts | 37 ++ packages/shared-profile-ui/tsconfig.json | 12 + .../src/navigation/PillDropdown.svelte | 7 + .../src/navigation/PillNavigation.svelte | 147 +++--- pnpm-lock.yaml | 193 +++---- 11 files changed, 792 insertions(+), 365 deletions(-) create mode 100644 packages/shared-profile-ui/package.json create mode 100644 packages/shared-profile-ui/src/ProfilePage.svelte create mode 100644 packages/shared-profile-ui/src/index.ts create mode 100644 packages/shared-profile-ui/src/types.ts create mode 100644 packages/shared-profile-ui/tsconfig.json diff --git a/apps/chat/apps/web/package.json b/apps/chat/apps/web/package.json index 53b98ff2d..f02d0eec0 100644 --- a/apps/chat/apps/web/package.json +++ b/apps/chat/apps/web/package.json @@ -31,12 +31,15 @@ "@manacore/shared-auth": "workspace:*", "@manacore/shared-auth-ui": "workspace:*", "@manacore/shared-branding": "workspace:*", + "@manacore/shared-feedback-service": "workspace:*", + "@manacore/shared-feedback-ui": "workspace:*", "@manacore/shared-i18n": "workspace:*", "@manacore/shared-icons": "workspace:*", "@manacore/shared-tailwind": "workspace:*", "@manacore/shared-theme": "workspace:*", "@manacore/shared-theme-ui": "workspace:*", "@manacore/shared-subscription-ui": "workspace:*", + "@manacore/shared-profile-ui": "workspace:*", "@manacore/shared-ui": "workspace:*", "@manacore/shared-utils": "workspace:*", "marked": "^17.0.0" diff --git a/apps/chat/apps/web/src/routes/(protected)/+layout.svelte b/apps/chat/apps/web/src/routes/(protected)/+layout.svelte index 2a6ce0a97..fe5b63795 100644 --- a/apps/chat/apps/web/src/routes/(protected)/+layout.svelte +++ b/apps/chat/apps/web/src/routes/(protected)/+layout.svelte @@ -56,6 +56,7 @@ { href: '/spaces', label: 'Spaces', icon: 'building' }, { href: '/documents', label: 'Dokumente', icon: 'archive' }, { href: '/archive', label: 'Archiv', icon: 'list' }, + { href: '/feedback', label: 'Feedback', icon: 'chat' }, ]; // User email for user dropdown @@ -188,6 +189,7 @@ {userEmail} settingsHref="/settings" manaHref="/mana" + profileHref="/profile" /> diff --git a/apps/chat/apps/web/src/routes/(protected)/profile/+page.svelte b/apps/chat/apps/web/src/routes/(protected)/profile/+page.svelte index 0c3df0d08..187bd83ec 100644 --- a/apps/chat/apps/web/src/routes/(protected)/profile/+page.svelte +++ b/apps/chat/apps/web/src/routes/(protected)/profile/+page.svelte @@ -1,184 +1,76 @@ - Profil | ManaChat + Profil - ManaChat -
-
- -
-

Profil

-

- Verwalte dein Konto und deine Einstellungen. -

-
- - -
-
-
-
- - - -
-
-

- {authStore.user?.email || 'Benutzer'} -

-

- Mitglied seit {formatDate(authStore.user?.created_at)} -

-
-
- -
-
-
-

E-Mail

-

{authStore.user?.email || '-'}

-
-
-
-
-

Benutzer-ID

-

{authStore.user?.id || '-'}

-
-
-
-
-
- - -
-
-

Schnellzugriff

- -
- - -
- - - - -
-

Einstellungen

-

Erscheinungsbild, Benachrichtigungen & mehr

-
-
- - - - - - -
-
- - - -
-

Dunkler Modus

-

Schnell umschalten

-
-
- -
-
-
-
- - -
-
- -
-
-
+
+ {#if profileUser()} + + {:else} +
Laden...
+ {/if}
+ + diff --git a/packages/shared-profile-ui/package.json b/packages/shared-profile-ui/package.json new file mode 100644 index 000000000..851aa42e2 --- /dev/null +++ b/packages/shared-profile-ui/package.json @@ -0,0 +1,28 @@ +{ + "name": "@manacore/shared-profile-ui", + "version": "1.0.0", + "private": true, + "type": "module", + "svelte": "./src/index.ts", + "main": "./src/index.ts", + "types": "./src/index.ts", + "exports": { + ".": { + "svelte": "./src/index.ts", + "types": "./src/index.ts", + "default": "./src/index.ts" + } + }, + "scripts": { + "check": "svelte-check --tsconfig ./tsconfig.json" + }, + "dependencies": {}, + "devDependencies": { + "svelte": "^5.0.0", + "svelte-check": "^4.0.0", + "typescript": "^5.7.3" + }, + "peerDependencies": { + "svelte": "^5.0.0" + } +} diff --git a/packages/shared-profile-ui/src/ProfilePage.svelte b/packages/shared-profile-ui/src/ProfilePage.svelte new file mode 100644 index 000000000..0ea56bc28 --- /dev/null +++ b/packages/shared-profile-ui/src/ProfilePage.svelte @@ -0,0 +1,484 @@ + + + + {pageTitle} - {appName} + + +
+
+
+ +
+ +
+ {#if user.avatarUrl} + Avatar + {:else} + {initials()} + {/if} +
+ +

{displayName() || user.email}

+ {#if displayName()} +

{user.email}

+ {/if} +
+ + +
+

{accountInfoTitle}

+ +
+
+ +
+
+ + + +
+
+ {emailLabel} + {user.email} +
+
+ + + {#if displayName()} +
+
+ + + +
+
+ {nameLabel} + {displayName()} +
+
+ {/if} + + + {#if user.role} +
+
+ + + +
+
+ {roleLabel} + {formatRole(user.role)} +
+
+ {/if} + + + {#if user.createdAt} +
+
+ + + +
+
+ {memberSinceLabel} + {formatDate(user.createdAt)} +
+
+ {/if} + + + {#if user.lastLoginAt} +
+
+ + + +
+
+ {lastLoginLabel} + {formatDate(user.lastLoginAt)} +
+
+ {/if} +
+
+
+ + + {#if actions} +
+

{actionsTitle}

+ +
+ {#if actions.onEditProfile} + + {/if} + + {#if actions.onChangePassword} + + {/if} + + {#if actions.onLogout} + + {/if} + + {#if actions.onDeleteAccount} + +

{deleteAccountWarning}

+ {/if} +
+
+ {/if} +
+
+
+ + diff --git a/packages/shared-profile-ui/src/index.ts b/packages/shared-profile-ui/src/index.ts new file mode 100644 index 000000000..7bd9abda1 --- /dev/null +++ b/packages/shared-profile-ui/src/index.ts @@ -0,0 +1,12 @@ +/** + * Shared profile UI components for Manacore monorepo + * + * This package contains Svelte 5 components for displaying + * user profile information. + */ + +// Pages +export { default as ProfilePage } from './ProfilePage.svelte'; + +// Types +export type { UserProfile, ProfileActions } from './types'; diff --git a/packages/shared-profile-ui/src/types.ts b/packages/shared-profile-ui/src/types.ts new file mode 100644 index 000000000..71a61ff18 --- /dev/null +++ b/packages/shared-profile-ui/src/types.ts @@ -0,0 +1,37 @@ +/** + * User profile data for display in ProfilePage + */ +export interface UserProfile { + /** User ID */ + id: string; + /** User email */ + email: string; + /** Display name (optional) */ + displayName?: string; + /** First name (optional) */ + firstName?: string; + /** Last name (optional) */ + lastName?: string; + /** Avatar URL (optional) */ + avatarUrl?: string; + /** Account creation date */ + createdAt?: string; + /** Last login date */ + lastLoginAt?: string; + /** User role */ + role?: string; +} + +/** + * Profile action handlers + */ +export interface ProfileActions { + /** Called when user wants to edit profile */ + onEditProfile?: () => void; + /** Called when user wants to change password */ + onChangePassword?: () => void; + /** Called when user wants to delete account */ + onDeleteAccount?: () => void; + /** Called when user wants to logout */ + onLogout?: () => void; +} diff --git a/packages/shared-profile-ui/tsconfig.json b/packages/shared-profile-ui/tsconfig.json new file mode 100644 index 000000000..c08ae7cb9 --- /dev/null +++ b/packages/shared-profile-ui/tsconfig.json @@ -0,0 +1,12 @@ +{ + "extends": "../../tsconfig.base.json", + "compilerOptions": { + "rootDir": "src", + "outDir": "dist", + "declaration": true, + "declarationDir": "dist", + "types": ["svelte"] + }, + "include": ["src/**/*"], + "exclude": ["node_modules", "dist"] +} diff --git a/packages/shared-ui/src/navigation/PillDropdown.svelte b/packages/shared-ui/src/navigation/PillDropdown.svelte index 12900a308..54d191bd8 100644 --- a/packages/shared-ui/src/navigation/PillDropdown.svelte +++ b/packages/shared-ui/src/navigation/PillDropdown.svelte @@ -178,6 +178,11 @@