Add User Settings page with sidebar pattern and API key section

This commit is contained in:
CREDO23 2026-01-12 17:06:05 +02:00
parent 0d4d227c26
commit 34c9d24970
7 changed files with 390 additions and 2 deletions

View file

@ -41,6 +41,7 @@ interface LayoutShellProps {
onSettings?: () => void;
onManageMembers?: () => void;
onSeeAllSearchSpaces?: () => void;
onUserSettings?: () => void;
onLogout?: () => void;
pageUsage?: PageUsage;
breadcrumb?: React.ReactNode;
@ -77,6 +78,7 @@ export function LayoutShell({
onSettings,
onManageMembers,
onSeeAllSearchSpaces,
onUserSettings,
onLogout,
pageUsage,
breadcrumb,
@ -131,6 +133,7 @@ export function LayoutShell({
onSettings={onSettings}
onManageMembers={onManageMembers}
onSeeAllSearchSpaces={onSeeAllSearchSpaces}
onUserSettings={onUserSettings}
onLogout={onLogout}
pageUsage={pageUsage}
/>
@ -179,6 +182,7 @@ export function LayoutShell({
onSettings={onSettings}
onManageMembers={onManageMembers}
onSeeAllSearchSpaces={onSeeAllSearchSpaces}
onUserSettings={onUserSettings}
onLogout={onLogout}
pageUsage={pageUsage}
className="hidden md:flex border-r shrink-0"

View file

@ -45,6 +45,7 @@ interface SidebarProps {
onSettings?: () => void;
onManageMembers?: () => void;
onSeeAllSearchSpaces?: () => void;
onUserSettings?: () => void;
onLogout?: () => void;
pageUsage?: PageUsage;
className?: string;
@ -72,6 +73,7 @@ export function Sidebar({
onSettings,
onManageMembers,
onSeeAllSearchSpaces,
onUserSettings,
onLogout,
pageUsage,
className,
@ -287,7 +289,7 @@ export function Sidebar({
<PageUsageDisplay pagesUsed={pageUsage.pagesUsed} pagesLimit={pageUsage.pagesLimit} />
)}
<SidebarUserProfile user={user} onLogout={onLogout} isCollapsed={isCollapsed} />
<SidebarUserProfile user={user} onUserSettings={onUserSettings} onLogout={onLogout} isCollapsed={isCollapsed} />
</div>
</div>
);

View file

@ -1,6 +1,6 @@
"use client";
import { ChevronUp, LogOut } from "lucide-react";
import { ChevronUp, LogOut, Settings } from "lucide-react";
import { useTranslations } from "next-intl";
import {
DropdownMenu,
@ -16,6 +16,7 @@ import type { User } from "../../types/layout.types";
interface SidebarUserProfileProps {
user: User;
onUserSettings?: () => void;
onLogout?: () => void;
isCollapsed?: boolean;
}
@ -62,6 +63,7 @@ function getInitials(email: string): string {
export function SidebarUserProfile({
user,
onUserSettings,
onLogout,
isCollapsed = false,
}: SidebarUserProfileProps) {
@ -117,6 +119,13 @@ export function SidebarUserProfile({
<DropdownMenuSeparator />
<DropdownMenuItem onClick={onUserSettings}>
<Settings className="mr-2 h-4 w-4" />
{t("user_settings")}
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem onClick={onLogout}>
<LogOut className="mr-2 h-4 w-4" />
{t("logout")}
@ -177,6 +186,13 @@ export function SidebarUserProfile({
<DropdownMenuSeparator />
<DropdownMenuItem onClick={onUserSettings}>
<Settings className="mr-2 h-4 w-4" />
{t("user_settings")}
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem onClick={onLogout}>
<LogOut className="mr-2 h-4 w-4" />
{t("logout")}