feat: add sub category

app/dashboard/breathing/page.tsx

@@ -129,7 +129,8 @@ export default function BreathingPage() {
         duration: numOrUndefined(form.duration),
         description: form.description,
         image_id: numOrUndefined(form.image_id),
-        breathing_color_id: breathingColorId ?? undefined,
+        // Send null (not undefined) so choosing "بدون رنگ" actually clears it.
+        breathing_color_id: breathingColorId,
       };
       if (editing) {
         // Update is JSON on /breathing-templates/:id

app/dashboard/music/playlists/page.tsx

@@ -6,6 +6,7 @@ import { useList } from "@/lib/useResource";
 import { useToast } from "@/components/toast";
 import { DataTable, type Column } from "@/components/DataTable";
 import {
+  Badge,
   Button,
   ConfirmDialog,
   Field,
@@ -13,6 +14,7 @@ import {
   Textarea,
   Modal,
   PageHeader,
+  Switch,
 } from "@/components/ui";
 import { EditIcon, PlusIcon, TrashIcon } from "@/components/icons";
 import { ImagePicker } from "@/components/ImagePicker";
@@ -28,6 +30,9 @@ interface Playlist {
   image?: unknown;
   detail_image_id?: number | null;
   detail_image?: unknown;
+  is_premium?: boolean;
+  categories?: { id: number; name?: string }[];
+  subcategories?: { id: number; name?: string }[];
 }
 
 interface MusicCategory {
@@ -53,6 +58,7 @@ export default function MusicPlaylistsPage() {
   const [imageFile, setImageFile] = useState<File | null>(null);
   const [detailImageId, setDetailImageId] = useState<number | null>(null);
   const [detailImageFile, setDetailImageFile] = useState<File | null>(null);
+  const [isPremium, setIsPremium] = useState(false);
 
   const [deleting, setDeleting] = useState<Playlist | null>(null);
   const [removing, setRemoving] = useState(false);
@@ -71,6 +77,7 @@ export default function MusicPlaylistsPage() {
     setImageFile(null);
     setDetailImageId(null);
     setDetailImageFile(null);
+    setIsPremium(false);
     setOpen(true);
   }
   function openEdit(row: Playlist) {
@@ -83,6 +90,7 @@ export default function MusicPlaylistsPage() {
     setImageFile(null);
     setDetailImageId(row.detail_image_id ?? null);
     setDetailImageFile(null);
+    setIsPremium(row.is_premium ?? false);
     setOpen(true);
   }
 
@@ -101,6 +109,7 @@ export default function MusicPlaylistsPage() {
             image: imageFile,
             detail_image_id: detailImageId,
             detail_image: detailImageFile,
+            is_premium: isPremium,
           }),
         });
         toast.success("پلی‌لیست ویرایش شد.");
@@ -117,6 +126,7 @@ export default function MusicPlaylistsPage() {
             image: imageFile,
             detail_image_id: detailImageId,
             detail_image: detailImageFile,
+            is_premium: isPremium,
           }),
         });
         toast.success("پلی‌لیست افزوده شد.");
@@ -156,11 +166,30 @@ export default function MusicPlaylistsPage() {
       ),
     },
     { key: "name", header: "نام" },
+    {
+      key: "subcategories",
+      header: "زیر‌دسته",
+      render: (r) =>
+        r.subcategories?.length
+          ? r.subcategories.map((s) => s.name).filter(Boolean).join("، ")
+          : "—",
+    },
     {
       key: "description",
       header: "توضیحات",
       render: (r) => r.description ?? "—",
     },
+    {
+      key: "is_premium",
+      header: "ویژه",
+      className: "w-20",
+      render: (r) =>
+        r.is_premium ? (
+          <Badge tone="primary">ویژه</Badge>
+        ) : (
+          <Badge tone="neutral">رایگان</Badge>
+        ),
+    },
   ];
 
   return (
@@ -257,6 +286,8 @@ export default function MusicPlaylistsPage() {
             />
           </Field>
 
+          <Switch checked={isPremium} onChange={setIsPremium} label="ویژه (پرمیوم)" />
+
           {!editing && (
             <>
               <Field label="دسته‌بندی‌ها">

app/dashboard/sliders/page.tsx

@@ -16,10 +16,10 @@ import {
   Textarea,
 } from "@/components/ui";
 import { EditIcon, PlusIcon, TrashIcon } from "@/components/icons";
-import { toFa } from "@/lib/utils";
-import { MediaPreview } from "@/components/MediaPreview";
 import { ImagePicker } from "@/components/ImagePicker";
+import { MediaPreview } from "@/components/MediaPreview";
 import { pickUrl, IMAGE_KEYS } from "@/lib/media";
+import { toFa } from "@/lib/utils";
 
 interface SliderAction {
   path?: string;
@@ -37,7 +37,7 @@ interface Slider {
 }
 
 const ACTION_TYPES = [
-  { value: "screen", label: "صفحه (screen)" },
+  { value: "navigation", label: "صفحه (navigation)" },
   { value: "link", label: "لینک (link)" },
 ];
 
@@ -51,7 +51,7 @@ export default function SlidersPage() {
   const [description, setDescription] = useState("");
   const [url, setUrl] = useState("");
   const [actionPath, setActionPath] = useState("");
-  const [actionType, setActionType] = useState("screen");
+  const [actionType, setActionType] = useState("navigation");
   const [imageId, setImageId] = useState<number | null>(null);
   const [imageFile, setImageFile] = useState<File | null>(null);
   const [saving, setSaving] = useState(false);
@@ -65,7 +65,7 @@ export default function SlidersPage() {
     setDescription("");
     setUrl("");
     setActionPath("");
-    setActionType("screen");
+    setActionType("navigation");
     setImageId(null);
     setImageFile(null);
     setOpen(true);
@@ -76,7 +76,7 @@ export default function SlidersPage() {
     setDescription(row.description ?? "");
     setUrl(row.url ?? "");
     setActionPath(row.action?.path ?? "");
-    setActionType(row.action?.type ?? "screen");
+    setActionType(row.action?.type ?? "navigation");
     setImageId(row.image_id ?? null);
     setImageFile(null);
     setOpen(true);
@@ -86,9 +86,8 @@ export default function SlidersPage() {
     e.preventDefault();
     setSaving(true);
     try {
-      // Both create and edit go through multipart (the image is a file). The
-      // nested action uses literal bracket keys; edit posts to /slider/:id,
-      // which the backend also accepts as a multipart update.
+      // Multipart for both (so an image file can be uploaded). Bracket keys
+      // build the nested action object; update uses POST /slider/:id.
       const body = toFormData({
         title,
         description,
@@ -102,6 +101,7 @@ export default function SlidersPage() {
         await apiFetch(`/slider/${editing.id}`, { method: "POST", body });
         toast.success("اسلایدر ویرایش شد.");
       } else {
+        await apiFetch("/slider", { method: "POST", body });
         await apiFetch("/slider", { method: "POST", body });
         toast.success("اسلایدر افزوده شد.");
       }
@@ -132,7 +132,7 @@ export default function SlidersPage() {
   const columns: Column<Slider>[] = [
     { key: "id", header: "شناسه", render: (r) => toFa(r.id), className: "w-24" },
     {
-      key: "thumbnail",
+      key: "image",
       header: "تصویر",
       className: "w-20",
       render: (r) => (
@@ -236,6 +236,16 @@ export default function SlidersPage() {
             />
           </Field>
 
+          <Field label="تصویر">
+            <ImagePicker
+              imageId={imageId}
+              onPickId={setImageId}
+              file={imageFile}
+              onPickFile={setImageFile}
+              existingUrl={editing ? pickUrl(editing, IMAGE_KEYS) : null}
+            />
+          </Field>
+
           <Field label="توضیحات">
             <Textarea
               value={description}