Item B
@@ -74,7 +74,7 @@ exports[`DraggableVirtualList > snapshot > should match snapshot with custom sty
>
Item C
diff --git a/src/renderer/src/pages/settings/ProviderSettings/index.tsx b/src/renderer/src/pages/settings/ProviderSettings/index.tsx
index 635e35a0c6..9cffffa944 100644
--- a/src/renderer/src/pages/settings/ProviderSettings/index.tsx
+++ b/src/renderer/src/pages/settings/ProviderSettings/index.tsx
@@ -15,7 +15,7 @@ import {
uuid
} from '@renderer/utils'
import { Avatar, Button, Card, Dropdown, Input, MenuProps, Tag } from 'antd'
-import { Eye, EyeOff, PlusIcon, Search, UserPen } from 'lucide-react'
+import { Eye, EyeOff, GripVertical, PlusIcon, Search, UserPen } from 'lucide-react'
import { FC, startTransition, useCallback, useEffect, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { useSearchParams } from 'react-router-dom'
@@ -479,6 +479,9 @@ const ProvidersList: FC = () => {
key={JSON.stringify(provider)}
className={provider.id === selectedProvider?.id ? 'active' : ''}
onClick={() => setSelectedProvider(provider)}>
+
+
+
{getProviderAvatar(provider)}
{getFancyProviderName(provider)}
{provider.enabled && (
@@ -531,6 +534,7 @@ const ProviderListItem = styled.div`
transition: all 0.2s ease-in-out;
border: 0.5px solid transparent;
user-select: none;
+ cursor: pointer;
&:hover {
background: var(--color-background-soft);
}
@@ -541,6 +545,26 @@ const ProviderListItem = styled.div`
}
`
+const DragHandle = styled.div`
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-left: -8px;
+ width: 12px;
+ color: var(--color-text-3);
+ opacity: 0;
+ transition: opacity 0.2s ease-in-out;
+ cursor: grab;
+
+ ${ProviderListItem}:hover & {
+ opacity: 1;
+ }
+
+ &:active {
+ cursor: grabbing;
+ }
+`
+
const ProviderLogo = styled(Avatar)`
border: 0.5px solid var(--color-border);
`