Moved to S3

frontend/src/pages/AssignmentDetailPage.tsx

@@ -10,8 +10,6 @@ import {
   Send, Flag
 } from 'lucide-react'
 
-const API_URL = import.meta.env.VITE_API_URL || 'http://localhost:8000'
-
 export function AssignmentDetailPage() {
   const { id } = useParams<{ id: string }>()
   const navigate = useNavigate()
@@ -20,6 +18,7 @@ export function AssignmentDetailPage() {
   const [assignment, setAssignment] = useState<AssignmentDetail | null>(null)
   const [isLoading, setIsLoading] = useState(true)
   const [error, setError] = useState<string | null>(null)
+  const [proofImageBlobUrl, setProofImageBlobUrl] = useState<string | null>(null)
 
   // Dispute creation
   const [showDisputeForm, setShowDisputeForm] = useState(false)
@@ -35,6 +34,12 @@ export function AssignmentDetailPage() {
 
   useEffect(() => {
     loadAssignment()
+    return () => {
+      // Cleanup blob URL on unmount
+      if (proofImageBlobUrl) {
+        URL.revokeObjectURL(proofImageBlobUrl)
+      }
+    }
   }, [id])
 
   const loadAssignment = async () => {
@@ -44,6 +49,16 @@ export function AssignmentDetailPage() {
     try {
       const data = await assignmentsApi.getDetail(parseInt(id))
       setAssignment(data)
+
+      // Load proof image if exists
+      if (data.proof_image_url) {
+        try {
+          const blobUrl = await assignmentsApi.getProofImageUrl(parseInt(id))
+          setProofImageBlobUrl(blobUrl)
+        } catch {
+          // Ignore error, image just won't show
+        }
+      }
     } catch (err: unknown) {
       const error = err as { response?: { data?: { detail?: string } } }
       setError(error.response?.data?.detail || 'Не удалось загрузить данные')
@@ -237,11 +252,17 @@ export function AssignmentDetailPage() {
           {/* Proof image */}
           {assignment.proof_image_url && (
             <div className="mb-4">
-              <img
-                src={`${API_URL}${assignment.proof_image_url}`}
-                alt="Proof"
-                className="w-full rounded-lg max-h-96 object-contain bg-gray-900"
-              />
+              {proofImageBlobUrl ? (
+                <img
+                  src={proofImageBlobUrl}
+                  alt="Proof"
+                  className="w-full rounded-lg max-h-96 object-contain bg-gray-900"
+                />
+              ) : (
+                <div className="w-full h-48 bg-gray-900 rounded-lg flex items-center justify-center">
+                  <Loader2 className="w-8 h-8 animate-spin text-gray-500" />
+                </div>
+              )}
             </div>
           )}