fix(downloads): media-library UI review fixes (E7)

Deep-review remediation on the frontend, all findings adversarially verified:

- LibraryPlayer picks audio vs video from the canonical media_kind (single source), not a
  hardcoded container whitelist, so an uploaded audio file with an uncommon/absent container
  renders in <audio> instead of a broken video box (legacy null media_kind keeps the heuristic).
- UploadDialog aborts the in-flight upload when the dialog is closed by X/ESC/backdrop/Back
  (not only the footer Cancel); drag highlight uses an enter/leave depth counter to stop the
  flicker; the progress bar gets a stable role=progressbar aria-label with the value on aria-valuenow.
- DownloadCenter's Shared tab renders honest loading/error states instead of a blank panel, and
  the library/shared row-action gating moves to a single tested helper (lib/downloadActions).

Tests: downloadActions gating matrix, the uploadReq XHR path (abort/401/422-localize/onerror),
and the media_kind-driven audio/video branch.

i18n: downloads.upload.uploadProgress (HU + EN).

frontend/src/components/DownloadCenter.tsx

@@ -35,6 +35,7 @@ import { useLiveQuery } from "../lib/useLiveQuery";
 import { useMe } from "../lib/useMe";
 import { api, type DownloadJob } from "../lib/api";
 import { invalidateDownloads, quickShareLink } from "../lib/downloads";
+import { libraryRowActions, sharedRowActions } from "../lib/downloadActions";
 import { inputCls } from "./ui/form";
 import { Button } from "./ui/Button";
 import { DownloadRow, IconBtn, UsageBar } from "./downloadRow";
@@ -280,28 +281,22 @@ export default function DownloadCenter() {
             <UsageBar />
             <div className="space-y-2">
               {library.map((job) => {
-                // E7·S5b — gate row actions on the stored media_kind. A generic uploaded file
-                // (media_kind='file') is download+share only: no player and no timeline to trim
-                // (Play/Edit are media-only), and no metadata/channel edit. Re-download needs a
-                // re-fetchable source, which an edit clip and an upload both lack (backend rejects
-                // both), so it's a true-download-only action.
-                const isFile = job.asset?.media_kind === "file";
-                const isMedia = !isFile;
-                const canRedownload = job.job_kind !== "edit" && job.job_kind !== "upload";
+                // Row actions gated on the stored media_kind + job_kind (see downloadActions).
+                const a = libraryRowActions(job);
                 return (
                   <DownloadRow key={job.id} job={job}>
-                    {isMedia && (
+                    {a.play && (
                       <IconBtn onClick={() => setPlayJob(job)} title={t("downloads.actions.play")}>
                         <PlayCircle className="w-4 h-4" />
                       </IconBtn>
                     )}
                     {saveBtn(job)}
-                    {isMedia && job.can_download && (job.asset?.duration_s ?? 0) > 0 && (
+                    {a.edit && (
                       <IconBtn onClick={() => setEditJob(job)} title={t("downloads.actions.edit")}>
                         <Scissors className="w-4 h-4" />
                       </IconBtn>
                     )}
-                    {isMedia && (
+                    {a.editDetails && (
                       <IconBtn
                         onClick={() => setMetaJob(job)}
                         title={t("downloads.actions.editDetails")}
@@ -318,7 +313,7 @@ export default function DownloadCenter() {
                     >
                       <Link2 className="w-4 h-4" />
                     </IconBtn>
-                    {canRedownload && (
+                    {a.redownload && (
                       <IconBtn
                         onClick={() =>
                           confirmThen(
@@ -367,18 +362,17 @@ export default function DownloadCenter() {
         {tab === "shared" && (
           <div className="space-y-2">
             {(sharedQ.data ?? []).map((job) => {
-              // Same media_kind gate as the library (S5b): a shared generic file is download-only —
-              // no player, no trim. Its owner set can_download, which still gates save/edit here.
-              const isMedia = job.asset?.media_kind !== "file";
+              // Same media_kind + can_download gate as the library, via the shared helper (S5b).
+              const a = sharedRowActions(job);
               return (
                 <DownloadRow key={job.id} job={job}>
-                  {isMedia && job.can_download && (
+                  {a.play && (
                     <IconBtn onClick={() => setPlayJob(job)} title={t("downloads.actions.play")}>
                       <PlayCircle className="w-4 h-4" />
                     </IconBtn>
                   )}
-                  {job.can_download && saveBtn(job)}
-                  {isMedia && job.can_download && (job.asset?.duration_s ?? 0) > 0 && (
+                  {a.save && saveBtn(job)}
+                  {a.edit && (
                     <IconBtn onClick={() => setEditJob(job)} title={t("downloads.actions.edit")}>
                       <Scissors className="w-4 h-4" />
                     </IconBtn>
@@ -399,11 +393,18 @@ export default function DownloadCenter() {
                 </DownloadRow>
               );
             })}
-            {sharedQ.data && sharedQ.data.length === 0 && (
-              <div className="text-sm text-muted py-10 text-center">
-                {t("downloads.empty.shared")}
-              </div>
-            )}
+            {(sharedQ.data ?? []).length === 0 &&
+              (sharedQ.isError && !sharedQ.data ? (
+                <StateMessage tone="error" onRetry={() => sharedQ.refetch()}>
+                  {t("common.loadError")}
+                </StateMessage>
+              ) : sharedQ.isLoading ? (
+                <LoadingState />
+              ) : (
+                <div className="text-sm text-muted py-10 text-center">
+                  {t("downloads.empty.shared")}
+                </div>
+              ))}
           </div>
         )}