mirror of
https://github.com/AutoMaker-Org/automaker.git
synced 2026-02-02 20:43:36 +00:00
fix: adress pr comments
This commit is contained in:
@@ -14,9 +14,9 @@ const Z_INDEX = {
|
|||||||
THEME_SUBMENU: 101,
|
THEME_SUBMENU: 101,
|
||||||
} as const;
|
} as const;
|
||||||
|
|
||||||
// Theme option type from sidebar constants
|
// Theme option type - using ThemeMode for type safety
|
||||||
interface ThemeOption {
|
interface ThemeOption {
|
||||||
value: string;
|
value: ThemeMode;
|
||||||
label: string;
|
label: string;
|
||||||
icon: LucideIcon;
|
icon: LucideIcon;
|
||||||
color: string;
|
color: string;
|
||||||
@@ -64,10 +64,10 @@ interface ThemeColumnProps {
|
|||||||
title: string;
|
title: string;
|
||||||
icon: LucideIcon;
|
icon: LucideIcon;
|
||||||
themes: ThemeOption[];
|
themes: ThemeOption[];
|
||||||
selectedTheme: string | null;
|
selectedTheme: ThemeMode | null;
|
||||||
onPreviewEnter: (value: string) => void;
|
onPreviewEnter: (value: ThemeMode) => void;
|
||||||
onPreviewLeave: (e: React.PointerEvent) => void;
|
onPreviewLeave: (e: React.PointerEvent) => void;
|
||||||
onSelect: (value: string) => void;
|
onSelect: (value: ThemeMode) => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
const ThemeColumn = memo(function ThemeColumn({
|
const ThemeColumn = memo(function ThemeColumn({
|
||||||
@@ -160,14 +160,14 @@ export function ProjectContextMenu({
|
|||||||
setShowRemoveDialog(true);
|
setShowRemoveDialog(true);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleThemeSelect = (value: string) => {
|
const handleThemeSelect = (value: ThemeMode | '') => {
|
||||||
setPreviewTheme(null);
|
setPreviewTheme(null);
|
||||||
if (value !== '') {
|
if (value !== '') {
|
||||||
setTheme(value as ThemeMode);
|
setTheme(value);
|
||||||
} else {
|
} else {
|
||||||
setTheme(globalTheme);
|
setTheme(globalTheme);
|
||||||
}
|
}
|
||||||
setProjectTheme(project.id, value === '' ? null : (value as ThemeMode));
|
setProjectTheme(project.id, value === '' ? null : value);
|
||||||
setShowThemeSubmenu(false);
|
setShowThemeSubmenu(false);
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -209,9 +209,15 @@ export function ProjectContextMenu({
|
|||||||
</button>
|
</button>
|
||||||
|
|
||||||
{/* Theme Submenu Trigger */}
|
{/* Theme Submenu Trigger */}
|
||||||
<div className="relative">
|
<div
|
||||||
|
className="relative"
|
||||||
|
onMouseEnter={() => setShowThemeSubmenu(true)}
|
||||||
|
onMouseLeave={() => {
|
||||||
|
setShowThemeSubmenu(false);
|
||||||
|
setPreviewTheme(null);
|
||||||
|
}}
|
||||||
|
>
|
||||||
<button
|
<button
|
||||||
onMouseEnter={() => setShowThemeSubmenu(true)}
|
|
||||||
onClick={() => setShowThemeSubmenu(!showThemeSubmenu)}
|
onClick={() => setShowThemeSubmenu(!showThemeSubmenu)}
|
||||||
className={cn(
|
className={cn(
|
||||||
'w-full flex items-center gap-2 px-3 py-2 rounded-md',
|
'w-full flex items-center gap-2 px-3 py-2 rounded-md',
|
||||||
@@ -242,17 +248,13 @@ export function ProjectContextMenu({
|
|||||||
'animate-in fade-in zoom-in-95 duration-100'
|
'animate-in fade-in zoom-in-95 duration-100'
|
||||||
)}
|
)}
|
||||||
style={{ zIndex: Z_INDEX.THEME_SUBMENU }}
|
style={{ zIndex: Z_INDEX.THEME_SUBMENU }}
|
||||||
onMouseLeave={() => {
|
|
||||||
setShowThemeSubmenu(false);
|
|
||||||
setPreviewTheme(null);
|
|
||||||
}}
|
|
||||||
data-testid="project-theme-submenu"
|
data-testid="project-theme-submenu"
|
||||||
>
|
>
|
||||||
<div className="p-2">
|
<div className="p-2">
|
||||||
{/* Use Global Option */}
|
{/* Use Global Option */}
|
||||||
<button
|
<button
|
||||||
onPointerEnter={() => handlePreviewEnter(globalTheme)}
|
onPointerEnter={() => handlePreviewEnter(globalTheme)}
|
||||||
onPointerLeave={() => setPreviewTheme(null)}
|
onPointerLeave={handlePreviewLeave}
|
||||||
onClick={() => handleThemeSelect('')}
|
onClick={() => handleThemeSelect('')}
|
||||||
className={cn(
|
className={cn(
|
||||||
'w-full flex items-center gap-2 px-3 py-2 rounded-md',
|
'w-full flex items-center gap-2 px-3 py-2 rounded-md',
|
||||||
@@ -277,8 +279,8 @@ export function ProjectContextMenu({
|
|||||||
<ThemeColumn
|
<ThemeColumn
|
||||||
title="Dark"
|
title="Dark"
|
||||||
icon={Moon}
|
icon={Moon}
|
||||||
themes={PROJECT_DARK_THEMES}
|
themes={PROJECT_DARK_THEMES as ThemeOption[]}
|
||||||
selectedTheme={project.theme ?? null}
|
selectedTheme={project.theme as ThemeMode | null}
|
||||||
onPreviewEnter={handlePreviewEnter}
|
onPreviewEnter={handlePreviewEnter}
|
||||||
onPreviewLeave={handlePreviewLeave}
|
onPreviewLeave={handlePreviewLeave}
|
||||||
onSelect={handleThemeSelect}
|
onSelect={handleThemeSelect}
|
||||||
@@ -286,8 +288,8 @@ export function ProjectContextMenu({
|
|||||||
<ThemeColumn
|
<ThemeColumn
|
||||||
title="Light"
|
title="Light"
|
||||||
icon={Sun}
|
icon={Sun}
|
||||||
themes={PROJECT_LIGHT_THEMES}
|
themes={PROJECT_LIGHT_THEMES as ThemeOption[]}
|
||||||
selectedTheme={project.theme ?? null}
|
selectedTheme={project.theme as ThemeMode | null}
|
||||||
onPreviewEnter={handlePreviewEnter}
|
onPreviewEnter={handlePreviewEnter}
|
||||||
onPreviewLeave={handlePreviewLeave}
|
onPreviewLeave={handlePreviewLeave}
|
||||||
onSelect={handleThemeSelect}
|
onSelect={handleThemeSelect}
|
||||||
|
|||||||
Reference in New Issue
Block a user