50 lines
1.7 KiB
TypeScript
50 lines
1.7 KiB
TypeScript
import type { RelayConfig } from '@/lib/configStorageTypes'
|
|
import { t } from '@/lib/i18n'
|
|
import { RelayCard } from './RelayCard'
|
|
|
|
interface RelayListProps {
|
|
relays: RelayConfig[]
|
|
editingId: string | null
|
|
draggedId: string | null
|
|
dragOverId: string | null
|
|
onStartEditing: (id: string) => void
|
|
onStopEditing: () => void
|
|
onUpdateUrl: (id: string, url: string) => void
|
|
onToggleEnabled: (id: string, enabled: boolean) => void
|
|
onRemoveRelay: (id: string) => void
|
|
onDragStart: (e: React.DragEvent<HTMLDivElement>, id: string) => void
|
|
onDragOver: (e: React.DragEvent<HTMLDivElement>, id: string) => void
|
|
onDragLeave: () => void
|
|
onDrop: (e: React.DragEvent<HTMLDivElement>, targetId: string) => void
|
|
onDragEnd: () => void
|
|
}
|
|
|
|
export function RelayList(params: RelayListProps): React.ReactElement {
|
|
if (params.relays.length === 0) {
|
|
return <div className="text-center py-8 text-cyber-accent">{t('settings.relay.empty')}</div>
|
|
}
|
|
return (
|
|
<div className="space-y-4">
|
|
{params.relays.map((relay) => (
|
|
<RelayCard
|
|
key={relay.id}
|
|
relay={relay}
|
|
isEditing={params.editingId === relay.id}
|
|
draggedId={params.draggedId}
|
|
dragOverId={params.dragOverId}
|
|
onStartEditing={params.onStartEditing}
|
|
onStopEditing={params.onStopEditing}
|
|
onUpdateUrl={params.onUpdateUrl}
|
|
onToggleEnabled={params.onToggleEnabled}
|
|
onRemoveRelay={params.onRemoveRelay}
|
|
onDragStart={params.onDragStart}
|
|
onDragOver={params.onDragOver}
|
|
onDragLeave={params.onDragLeave}
|
|
onDrop={params.onDrop}
|
|
onDragEnd={params.onDragEnd}
|
|
/>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|