Add upload to show functionality in MediaPanel: introduce file selection for uploading media files directly to a show, enhancing the upload store to support show associations. Update translations for new upload options and UI elements.

frontend/src/features/admin/media/MediaPanel.tsx

@@ -1,7 +1,7 @@
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
 import { useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Upload } from 'lucide-react'
+import { ListPlus, Upload } from 'lucide-react'
 import { HttpError } from '@/shared/api/client'
 import type { MediaAssetDto, MediaAssetStatus } from '@/shared/api/types'
 import { Badge, type BadgeProps } from '@/shared/ui/badge'
@@ -9,6 +9,7 @@ import { Button } from '@/shared/ui/button'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/shared/ui/select'
 import { toast } from '@/shared/ui/toast-store'
 import { deleteMedia, listMedia } from './api'
+import { UploadToShowDialog } from './UploadToShowDialog'
 import { useUploadStore } from './upload-store'
 
 const PAGE_SIZE = 20
@@ -43,7 +44,9 @@ export function MediaPanel() {
   const { t } = useTranslation()
   const queryClient = useQueryClient()
   const fileInput = useRef<HTMLInputElement>(null)
+  const fileInputShow = useRef<HTMLInputElement>(null)
   const [filter, setFilter] = useState<MediaFilter>('active')
+  const [filesForShow, setFilesForShow] = useState<File[] | null>(null)
   const enqueue = useUploadStore((s) => s.enqueue)
 
   const { data, isLoading } = useQuery({
@@ -92,6 +95,22 @@ export function MediaPanel() {
               e.target.value = ''
             }}
           />
+          <input
+            ref={fileInputShow}
+            type="file"
+            accept="video/*,.mkv,.avi,.ts"
+            multiple
+            className="hidden"
+            onChange={(e) => {
+              const files = e.target.files
+              if (files && files.length > 0) setFilesForShow(Array.from(files))
+              e.target.value = ''
+            }}
+          />
+          <Button size="sm" variant="outline" onClick={() => fileInputShow.current?.click()}>
+            <ListPlus className="h-4 w-4" />
+            {t('admin.media.uploadToShow')}
+          </Button>
           <Button size="sm" onClick={() => fileInput.current?.click()}>
             <Upload className="h-4 w-4" />
             {t('admin.media.upload')}
@@ -99,6 +118,10 @@ export function MediaPanel() {
         </div>
       </div>
 
+      {filesForShow && (
+        <UploadToShowDialog files={filesForShow} onClose={() => setFilesForShow(null)} />
+      )}
+
       <div className="crt-panel overflow-x-auto rounded-md">
         <table className="w-full text-sm">
           <thead className="border-b border-border text-left text-muted-foreground">