fix
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
import { useCallback, useState } from "react";
|
||||
import { apiFetch, ApiError, toFormData } from "@/lib/api";
|
||||
import { useList } from "@/lib/useResource";
|
||||
import { useToast } from "@/components/toast";
|
||||
@@ -14,10 +14,8 @@ import {
|
||||
PageHeader,
|
||||
Select,
|
||||
Textarea,
|
||||
Badge,
|
||||
Switch,
|
||||
} from "@/components/ui";
|
||||
import { EditIcon, PlusIcon, TrashIcon } from "@/components/icons";
|
||||
import { EditIcon, EyeIcon, PlusIcon, TrashIcon } from "@/components/icons";
|
||||
import { MediaPreview } from "@/components/MediaPreview";
|
||||
import { ImagePicker } from "@/components/ImagePicker";
|
||||
import { pickUrl, SOUND_KEYS, VIDEO_KEYS, IMAGE_KEYS } from "@/lib/media";
|
||||
@@ -70,14 +68,27 @@ function DeepLink({ deep_link }: { deep_link?: string | null }) {
|
||||
}
|
||||
|
||||
export default function MediaDeepLinksPage() {
|
||||
const { data, loading, error, reload } = useList<Media>("/media", {
|
||||
deeplink_only: 1,
|
||||
});
|
||||
const { data: allMedia, loading: allLoading } = useList<Media>("/media", {
|
||||
count: 500,
|
||||
});
|
||||
const { data, loading, error, reload: reloadHidden } = useList<Media>(
|
||||
"/media",
|
||||
{ deeplink_only: 1 },
|
||||
);
|
||||
// The "use an existing media" picker. /media only lists visible media, so it
|
||||
// must be refetched whenever a media moves in or out of deep-link mode —
|
||||
// otherwise a just-unhidden media is missing from the picker until a reload.
|
||||
const {
|
||||
data: allMedia,
|
||||
loading: allLoading,
|
||||
reload: reloadAll,
|
||||
} = useList<Media>("/media", { count: 500 });
|
||||
const toast = useToast();
|
||||
|
||||
// Both lists change together on every toggle.
|
||||
const reload = useCallback(() => {
|
||||
reloadHidden();
|
||||
reloadAll();
|
||||
}, [reloadHidden, reloadAll]);
|
||||
|
||||
// Non-null while the modal edits an existing row (null = create).
|
||||
const [editing, setEditing] = useState<Media | null>(null);
|
||||
const [open, setOpen] = useState(false);
|
||||
const [saving, setSaving] = useState(false);
|
||||
@@ -118,17 +129,29 @@ export default function MediaDeepLinksPage() {
|
||||
setOpen(true);
|
||||
}
|
||||
|
||||
async function toggleHidden(row: Media) {
|
||||
function openEdit(row: Media) {
|
||||
setEditing(row);
|
||||
setSource("new"); // the edit form always shows the media fields
|
||||
setExistingId("");
|
||||
setTitle(row.title ?? "");
|
||||
setCaption(row.caption ?? "");
|
||||
setType(row.type ?? "audio");
|
||||
setDuration(row.duration != null ? String(row.duration) : "");
|
||||
setFile(null);
|
||||
setExternalUrl(row.external_url ?? "");
|
||||
setImageId(row.image_id ?? null);
|
||||
setImageFile(null);
|
||||
setOpen(true);
|
||||
}
|
||||
|
||||
// Take a media back out of deep-link-only mode (it returns to the lists).
|
||||
async function unhide(row: Media) {
|
||||
try {
|
||||
await apiFetch(`/media/${row.id}`, {
|
||||
method: "POST",
|
||||
body: toFormData({
|
||||
is_deeplink_only: !row.is_deeplink_only ? 1 : 0,
|
||||
}),
|
||||
body: toFormData({ is_deeplink_only: 0 }),
|
||||
});
|
||||
toast.success(
|
||||
row.is_deeplink_only ? "از لینک مستقیم خارج شد." : "به لینک مستقیم تبدیل شد.",
|
||||
);
|
||||
toast.success("از لینک مستقیم خارج شد.");
|
||||
reload();
|
||||
} catch (err) {
|
||||
toast.error(err instanceof ApiError ? err.message : "خطا در ذخیره‌سازی");
|
||||
@@ -140,13 +163,20 @@ export default function MediaDeepLinksPage() {
|
||||
setSaving(true);
|
||||
try {
|
||||
if (editing) {
|
||||
setOpen(false);
|
||||
reload();
|
||||
// Edit an existing deep-link media. It stays deeplink-only.
|
||||
const body = toFormData({
|
||||
title,
|
||||
caption,
|
||||
type,
|
||||
duration,
|
||||
file,
|
||||
external_url: externalUrl,
|
||||
image_id: imageId,
|
||||
image: imageFile,
|
||||
});
|
||||
await apiFetch(`/media/${editing.id}`, { method: "POST", body });
|
||||
toast.success("لینک مستقیم بهروزرسانی شد.");
|
||||
return;
|
||||
}
|
||||
|
||||
if (source === "existing") {
|
||||
} else if (source === "existing") {
|
||||
// Toggle the chosen existing media to deeplink-only.
|
||||
if (!existingId) {
|
||||
toast.error("رسانهای را انتخاب کنید.");
|
||||
@@ -256,12 +286,16 @@ export default function MediaDeepLinksPage() {
|
||||
}
|
||||
actions={(row) => (
|
||||
<>
|
||||
<Button variant="ghost" onClick={() => openEdit(row)} aria-label="ویرایش">
|
||||
<EditIcon className="h-4 w-4" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
onClick={() => toggleHidden(row)}
|
||||
onClick={() => unhide(row)}
|
||||
aria-label="نمایش در فهرست"
|
||||
title="نمایش در فهرست"
|
||||
>
|
||||
<EditIcon className="h-4 w-4" />
|
||||
<EyeIcon className="h-4 w-4" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
@@ -278,7 +312,7 @@ export default function MediaDeepLinksPage() {
|
||||
<Modal
|
||||
open={open}
|
||||
onClose={() => setOpen(false)}
|
||||
title="لینک مستقیم رسانه جدید"
|
||||
title={editing ? "ویرایش لینک مستقیم رسانه" : "لینک مستقیم رسانه جدید"}
|
||||
footer={
|
||||
<>
|
||||
<Button variant="secondary" onClick={() => setOpen(false)}>
|
||||
@@ -295,15 +329,17 @@ export default function MediaDeepLinksPage() {
|
||||
onSubmit={save}
|
||||
className="flex flex-col gap-4"
|
||||
>
|
||||
<Field label="منبع رسانه" required>
|
||||
<Select
|
||||
value={source}
|
||||
onChange={(e) => setSource(e.target.value as "new" | "existing")}
|
||||
>
|
||||
<option value="new">بارگذاری رسانه جدید</option>
|
||||
<option value="existing">استفاده از رسانه موجود</option>
|
||||
</Select>
|
||||
</Field>
|
||||
{!editing && (
|
||||
<Field label="منبع رسانه" required>
|
||||
<Select
|
||||
value={source}
|
||||
onChange={(e) => setSource(e.target.value as "new" | "existing")}
|
||||
>
|
||||
<option value="new">بارگذاری رسانه جدید</option>
|
||||
<option value="existing">استفاده از رسانه موجود</option>
|
||||
</Select>
|
||||
</Field>
|
||||
)}
|
||||
|
||||
{source === "existing" ? (
|
||||
<Field label="انتخاب رسانه" required>
|
||||
@@ -348,6 +384,7 @@ export default function MediaDeepLinksPage() {
|
||||
onPickId={setImageId}
|
||||
file={imageFile}
|
||||
onPickFile={setImageFile}
|
||||
existingUrl={editing ? pickUrl(editing, IMAGE_KEYS) : null}
|
||||
/>
|
||||
</Field>
|
||||
|
||||
@@ -358,7 +395,10 @@ export default function MediaDeepLinksPage() {
|
||||
</Select>
|
||||
</Field>
|
||||
|
||||
<Field label="فایل" hint="بارگذاری فایل یا وارد کردن لینک خارجی">
|
||||
<Field
|
||||
label={editing ? "فایل (در صورت تغییر)" : "فایل"}
|
||||
hint="بارگذاری فایل یا وارد کردن لینک خارجی"
|
||||
>
|
||||
<Input
|
||||
type="file"
|
||||
accept="audio/*,video/*"
|
||||
@@ -392,8 +432,18 @@ export default function MediaDeepLinksPage() {
|
||||
)}
|
||||
|
||||
<p className="rounded-xl border border-border bg-surface-muted p-3 text-xs text-muted">
|
||||
پس از ذخیره، این رسانه در فهرست «رسانهها» نمایش داده نمیشود و فقط با لینک
|
||||
مستقیم قابل دسترسی است.
|
||||
{editing ? (
|
||||
<>
|
||||
این رسانه در فهرست «رسانهها» نمایش داده نمیشود و فقط با لینک مستقیم
|
||||
قابل دسترسی است. برای بازگرداندن آن به فهرست، از دکمه «نمایش در فهرست»
|
||||
استفاده کنید.
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
پس از ذخیره، این رسانه در فهرست «رسانهها» نمایش داده نمیشود و فقط با
|
||||
لینک مستقیم قابل دسترسی است.
|
||||
</>
|
||||
)}
|
||||
</p>
|
||||
</form>
|
||||
</Modal>
|
||||
|
||||
Reference in New Issue
Block a user