Улучшение системы оспариваний и исправления

- Оспаривания теперь требуют решения админа после 24ч голосования
  - Можно повторно оспаривать после разрешённых споров
  - Исправлены бонусные очки при перепрохождении после оспаривания
  - Сброс серии при невалидном пруфе
  - Колесо показывает только доступные игры
  - Rate limiting только через backend (RATE_LIMIT_ENABLED)
This commit is contained in:
2025-12-29 22:23:34 +03:00
parent 1cedfeb3ee
commit 89dbe2c018
42 changed files with 5426 additions and 313 deletions

View File

@@ -1,7 +1,7 @@
import { useState, useEffect, useRef } from 'react'
import { useParams, useNavigate, Link } from 'react-router-dom'
import { marathonsApi, eventsApi, challengesApi } from '@/api'
import type { Marathon, ActiveEvent, Challenge } from '@/types'
import type { Marathon, ActiveEvent, Challenge, MarathonDispute } from '@/types'
import { NeonButton, GlassCard, StatsCard } from '@/components/ui'
import { useAuthStore } from '@/store/auth'
import { useToast } from '@/store/toast'
@@ -13,7 +13,8 @@ import { MarathonSettingsModal } from '@/components/MarathonSettingsModal'
import {
Users, Calendar, Trophy, Play, Settings, Copy, Check, Loader2, Trash2,
Globe, Lock, CalendarCheck, UserPlus, Gamepad2, ArrowLeft, Zap, Flag,
Star, Target, TrendingDown, ChevronDown, ChevronUp, Link2, Sparkles
Star, Target, TrendingDown, ChevronDown, ChevronUp, Link2, Sparkles,
AlertTriangle, Clock, CheckCircle, XCircle, ThumbsUp, ThumbsDown, ExternalLink, User
} from 'lucide-react'
import { format } from 'date-fns'
import { ru } from 'date-fns/locale'
@@ -39,10 +40,23 @@ export function MarathonPage() {
const [showSettings, setShowSettings] = useState(false)
const activityFeedRef = useRef<ActivityFeedRef>(null)
// Disputes for organizers
const [showDisputes, setShowDisputes] = useState(false)
const [disputes, setDisputes] = useState<MarathonDispute[]>([])
const [loadingDisputes, setLoadingDisputes] = useState(false)
const [disputeFilter, setDisputeFilter] = useState<'open' | 'all'>('open')
const [resolvingDisputeId, setResolvingDisputeId] = useState<number | null>(null)
useEffect(() => {
loadMarathon()
}, [id])
useEffect(() => {
if (showDisputes) {
loadDisputes()
}
}, [showDisputes, disputeFilter])
const loadMarathon = async () => {
if (!id) return
try {
@@ -80,6 +94,57 @@ export function MarathonPage() {
}
}
const loadDisputes = async () => {
if (!id) return
setLoadingDisputes(true)
try {
const data = await marathonsApi.listDisputes(parseInt(id), disputeFilter)
setDisputes(data)
} catch (error) {
console.error('Failed to load disputes:', error)
toast.error('Не удалось загрузить оспаривания')
} finally {
setLoadingDisputes(false)
}
}
const handleResolveDispute = async (disputeId: number, isValid: boolean) => {
if (!id) return
setResolvingDisputeId(disputeId)
try {
await marathonsApi.resolveDispute(parseInt(id), disputeId, isValid)
toast.success(isValid ? 'Пруф подтверждён' : 'Пруф отклонён')
await loadDisputes()
} catch (error) {
console.error('Failed to resolve dispute:', error)
toast.error('Не удалось разрешить диспут')
} finally {
setResolvingDisputeId(null)
}
}
const formatDisputeDate = (dateString: string) => {
return new Date(dateString).toLocaleString('ru-RU', {
day: 'numeric',
month: 'short',
hour: '2-digit',
minute: '2-digit',
})
}
const getDisputeTimeRemaining = (expiresAt: string) => {
const now = new Date()
const expires = new Date(expiresAt)
const diff = expires.getTime() - now.getTime()
if (diff <= 0) return 'Истекло'
const hours = Math.floor(diff / (1000 * 60 * 60))
const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60))
return `${hours}ч ${minutes}м`
}
const getInviteLink = () => {
if (!marathon) return ''
return `${window.location.origin}/invite/${marathon.invite_code}`
@@ -385,6 +450,196 @@ export function MarathonPage() {
</GlassCard>
)}
{/* Disputes management for organizers */}
{marathon.status === 'active' && isOrganizer && (
<GlassCard>
<button
onClick={() => setShowDisputes(!showDisputes)}
className="w-full flex items-center justify-between"
>
<div className="flex items-center gap-3">
<div className="w-10 h-10 rounded-xl bg-orange-500/20 flex items-center justify-center">
<AlertTriangle className="w-5 h-5 text-orange-400" />
</div>
<div className="text-left">
<h3 className="font-semibold text-white">Оспаривания</h3>
<p className="text-sm text-gray-400">Проверьте спорные выполнения</p>
</div>
</div>
<div className="flex items-center gap-3">
{disputes.filter(d => d.status === 'open').length > 0 && (
<span className="px-2 py-1 bg-orange-500/20 text-orange-400 rounded text-xs font-medium">
{disputes.filter(d => d.status === 'open').length} открыто
</span>
)}
{showDisputes ? (
<ChevronUp className="w-5 h-5 text-gray-400" />
) : (
<ChevronDown className="w-5 h-5 text-gray-400" />
)}
</div>
</button>
{showDisputes && (
<div className="mt-6 pt-6 border-t border-dark-600">
{/* Filters */}
<div className="flex gap-2 mb-4">
<button
className={`px-3 py-1.5 rounded-lg text-sm font-medium transition-all ${
disputeFilter === 'open'
? 'bg-orange-500/20 text-orange-400 border border-orange-500/30'
: 'bg-dark-700 text-gray-400 border border-dark-600 hover:border-dark-500'
}`}
onClick={() => setDisputeFilter('open')}
>
Открытые
</button>
<button
className={`px-3 py-1.5 rounded-lg text-sm font-medium transition-all ${
disputeFilter === 'all'
? 'bg-accent-500/20 text-accent-400 border border-accent-500/30'
: 'bg-dark-700 text-gray-400 border border-dark-600 hover:border-dark-500'
}`}
onClick={() => setDisputeFilter('all')}
>
Все
</button>
</div>
{/* Loading */}
{loadingDisputes ? (
<div className="flex items-center justify-center py-8">
<Loader2 className="w-6 h-6 animate-spin text-accent-500" />
</div>
) : disputes.length === 0 ? (
<div className="text-center py-8">
<div className="w-12 h-12 mx-auto mb-3 rounded-xl bg-green-500/10 border border-green-500/30 flex items-center justify-center">
<CheckCircle className="w-6 h-6 text-green-400" />
</div>
<p className="text-gray-400 text-sm">
{disputeFilter === 'open' ? 'Нет открытых оспариваний' : 'Нет оспариваний'}
</p>
</div>
) : (
<div className="space-y-3">
{disputes.map((dispute) => (
<div
key={dispute.id}
className={`p-4 bg-dark-700/50 rounded-xl border ${
dispute.status === 'open' ? 'border-orange-500/30' : 'border-dark-600'
}`}
>
<div className="flex items-start justify-between gap-3">
<div className="flex-1 min-w-0">
{/* Challenge title */}
<h4 className="text-white font-medium truncate mb-1">
{dispute.challenge_title}
</h4>
{/* Participants */}
<div className="flex flex-wrap gap-3 text-xs text-gray-400 mb-2">
<span className="flex items-center gap-1">
<User className="w-3 h-3" />
Автор: <span className="text-white">{dispute.participant_nickname}</span>
</span>
<span className="flex items-center gap-1">
<AlertTriangle className="w-3 h-3" />
Оспорил: <span className="text-white">{dispute.raised_by_nickname}</span>
</span>
</div>
{/* Reason */}
<p className="text-sm text-gray-300 mb-2 line-clamp-2">
{dispute.reason}
</p>
{/* Votes & Time */}
<div className="flex items-center gap-3 text-xs">
<div className="flex items-center gap-1.5">
<div className="flex items-center gap-0.5 text-green-400">
<ThumbsUp className="w-3 h-3" />
<span>{dispute.votes_valid}</span>
</div>
<span className="text-gray-600">/</span>
<div className="flex items-center gap-0.5 text-red-400">
<ThumbsDown className="w-3 h-3" />
<span>{dispute.votes_invalid}</span>
</div>
</div>
<span className="text-gray-500">{formatDisputeDate(dispute.created_at)}</span>
{dispute.status === 'open' && (
<span className="text-orange-400 flex items-center gap-1">
<Clock className="w-3 h-3" />
{getDisputeTimeRemaining(dispute.expires_at)}
</span>
)}
</div>
</div>
{/* Right side - Status & Actions */}
<div className="flex flex-col items-end gap-2 shrink-0">
{dispute.status === 'open' ? (
<span className="px-2 py-1 bg-yellow-500/20 text-yellow-400 rounded text-xs font-medium flex items-center gap-1">
<Clock className="w-3 h-3" />
Открыт
</span>
) : dispute.status === 'valid' ? (
<span className="px-2 py-1 bg-green-500/20 text-green-400 rounded text-xs font-medium flex items-center gap-1">
<CheckCircle className="w-3 h-3" />
Валидно
</span>
) : (
<span className="px-2 py-1 bg-red-500/20 text-red-400 rounded text-xs font-medium flex items-center gap-1">
<XCircle className="w-3 h-3" />
Невалидно
</span>
)}
{/* Link to assignment */}
{dispute.assignment_id && (
<Link
to={`/assignments/${dispute.assignment_id}`}
className="text-xs text-accent-400 hover:text-accent-300 flex items-center gap-1"
>
<ExternalLink className="w-3 h-3" />
Открыть
</Link>
)}
{/* Resolution buttons */}
{dispute.status === 'open' && (
<div className="flex gap-1.5 mt-1">
<NeonButton
size="sm"
variant="outline"
className="border-green-500/50 text-green-400 hover:bg-green-500/10 !px-2 !py-1 text-xs"
onClick={() => handleResolveDispute(dispute.id, true)}
isLoading={resolvingDisputeId === dispute.id}
disabled={resolvingDisputeId !== null}
icon={<CheckCircle className="w-3 h-3" />}
>
Валидно
</NeonButton>
<NeonButton
size="sm"
variant="outline"
className="border-red-500/50 text-red-400 hover:bg-red-500/10 !px-2 !py-1 text-xs"
onClick={() => handleResolveDispute(dispute.id, false)}
isLoading={resolvingDisputeId === dispute.id}
disabled={resolvingDisputeId !== null}
icon={<XCircle className="w-3 h-3" />}
>
Невалидно
</NeonButton>
</div>
)}
</div>
</div>
</div>
))}
</div>
)}
</div>
)}
</GlassCard>
)}
{/* Invite link */}
{marathon.status !== 'finished' && (
<GlassCard>