feat: add edit mode toggle to show/hide drag handles

- Add edit mode button next to settings in header
- Edit button turns blue when active
- Drag handles fade in/out with edit mode toggle
- Add smooth 200ms transition animation
- Add i18n support for edit mode (en/zh)
- Maintain consistent spacing between header elements
This commit is contained in:
Jason
2025-10-19 22:12:12 +08:00
parent 43ed1c7533
commit 491bbff11d
5 changed files with 40 additions and 6 deletions

View File

@@ -16,6 +16,7 @@ interface ProviderListProps {
providers: Record<string, Provider>;
currentProviderId: string;
appType: AppType;
isEditMode?: boolean;
onSwitch: (provider: Provider) => void;
onEdit: (provider: Provider) => void;
onDelete: (provider: Provider) => void;
@@ -29,6 +30,7 @@ export function ProviderList({
providers,
currentProviderId,
appType,
isEditMode = false,
onSwitch,
onEdit,
onDelete,
@@ -76,6 +78,7 @@ export function ProviderList({
provider={provider}
isCurrent={provider.id === currentProviderId}
appType={appType}
isEditMode={isEditMode}
onSwitch={onSwitch}
onEdit={onEdit}
onDelete={onDelete}
@@ -93,6 +96,7 @@ interface SortableProviderCardProps {
provider: Provider;
isCurrent: boolean;
appType: AppType;
isEditMode: boolean;
onSwitch: (provider: Provider) => void;
onEdit: (provider: Provider) => void;
onDelete: (provider: Provider) => void;
@@ -104,6 +108,7 @@ function SortableProviderCard({
provider,
isCurrent,
appType,
isEditMode,
onSwitch,
onEdit,
onDelete,
@@ -130,6 +135,7 @@ function SortableProviderCard({
provider={provider}
isCurrent={isCurrent}
appType={appType}
isEditMode={isEditMode}
onSwitch={onSwitch}
onEdit={onEdit}
onDelete={onDelete}