mirror of
https://github.com/PeterMaquiran/tvone.git
synced 2026-04-23 12:35:51 +00:00
add page
This commit is contained in:
@@ -0,0 +1,264 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import React, { useEffect, useState } from "react";
|
||||||
|
import {
|
||||||
|
FolderTree,
|
||||||
|
Edit3,
|
||||||
|
Trash2,
|
||||||
|
Plus,
|
||||||
|
ChevronRight,
|
||||||
|
ChevronDown,
|
||||||
|
} from "lucide-react";
|
||||||
|
import { getTree, getFlat, updateCategory, createCategory, deleteCategory } from "@/lib/categories.api";
|
||||||
|
|
||||||
|
/* ================= TYPES ================= */
|
||||||
|
interface Category {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
slug: string;
|
||||||
|
parentId?: string | null;
|
||||||
|
children?: Category[];
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ================= API ================= */
|
||||||
|
|
||||||
|
/* ================= UTIL ================= */
|
||||||
|
function slugify(text: string) {
|
||||||
|
return text
|
||||||
|
.toLowerCase()
|
||||||
|
.trim()
|
||||||
|
.replace(/\s+/g, "-")
|
||||||
|
.replace(/[^a-z0-9-]/g, "");
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ================= PAGE ================= */
|
||||||
|
export default function CategoriesPage() {
|
||||||
|
const [tree, setTree] = useState<Category[]>([]);
|
||||||
|
const [flat, setFlat] = useState<Category[]>([]);
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
|
const [modalOpen, setModalOpen] = useState(false);
|
||||||
|
|
||||||
|
const [form, setForm] = useState({
|
||||||
|
id: null as string | null,
|
||||||
|
name: "",
|
||||||
|
slug: "",
|
||||||
|
parentId: null as string | null,
|
||||||
|
});
|
||||||
|
|
||||||
|
/* ================= LOAD ================= */
|
||||||
|
async function load() {
|
||||||
|
setLoading(true);
|
||||||
|
try {
|
||||||
|
const [t, f] = await Promise.all([getTree(), getFlat()]);
|
||||||
|
setTree(t);
|
||||||
|
setFlat(f);
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
load();
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
/* ================= CRUD ================= */
|
||||||
|
async function save() {
|
||||||
|
const payload = {
|
||||||
|
name: form.name,
|
||||||
|
slug: form.slug || slugify(form.name),
|
||||||
|
parentId: form.parentId,
|
||||||
|
};
|
||||||
|
|
||||||
|
if (form.id) {
|
||||||
|
await updateCategory(form.id, payload);
|
||||||
|
} else {
|
||||||
|
await createCategory(payload);
|
||||||
|
}
|
||||||
|
|
||||||
|
closeModal();
|
||||||
|
load();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function remove(id: string) {
|
||||||
|
if (!confirm("Delete this category?")) return;
|
||||||
|
await deleteCategory(id);
|
||||||
|
load();
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ================= MODAL ================= */
|
||||||
|
function openCreate(parentId?: string) {
|
||||||
|
setForm({
|
||||||
|
id: null,
|
||||||
|
name: "",
|
||||||
|
slug: "",
|
||||||
|
parentId: parentId || null,
|
||||||
|
});
|
||||||
|
setModalOpen(true);
|
||||||
|
}
|
||||||
|
|
||||||
|
function openEdit(cat: Category) {
|
||||||
|
setForm({
|
||||||
|
id: cat.id,
|
||||||
|
name: cat.name,
|
||||||
|
slug: cat.slug,
|
||||||
|
parentId: cat.parentId || null,
|
||||||
|
});
|
||||||
|
setModalOpen(true);
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeModal() {
|
||||||
|
setModalOpen(false);
|
||||||
|
setForm({ id: null, name: "", slug: "", parentId: null });
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ================= TREE ================= */
|
||||||
|
function TreeNode({
|
||||||
|
node,
|
||||||
|
level = 0,
|
||||||
|
}: {
|
||||||
|
node: Category;
|
||||||
|
level?: number;
|
||||||
|
}) {
|
||||||
|
const [open, setOpen] = useState(true);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div style={{ marginLeft: level * 14 }} className="border-l pl-3">
|
||||||
|
|
||||||
|
{/* NODE */}
|
||||||
|
<div className="flex items-center justify-between py-2 group">
|
||||||
|
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
|
||||||
|
<button onClick={() => setOpen(!open)}>
|
||||||
|
{open ? (
|
||||||
|
<ChevronDown size={14} />
|
||||||
|
) : (
|
||||||
|
<ChevronRight size={14} />
|
||||||
|
)}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<FolderTree size={14} className="text-blue-500" />
|
||||||
|
|
||||||
|
<span
|
||||||
|
onClick={() => openEdit(node)}
|
||||||
|
className="text-sm font-medium cursor-pointer hover:text-blue-600"
|
||||||
|
>
|
||||||
|
{node.name}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* ACTIONS */}
|
||||||
|
<div className="flex gap-2 opacity-0 group-hover:opacity-100 transition">
|
||||||
|
|
||||||
|
<button
|
||||||
|
onClick={() => openCreate(node.id)}
|
||||||
|
className="text-green-600"
|
||||||
|
>
|
||||||
|
<Plus size={14} />
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button onClick={() => openEdit(node)}>
|
||||||
|
<Edit3 size={14} />
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button onClick={() => remove(node.id)}>
|
||||||
|
<Trash2 size={14} className="text-red-500" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* CHILDREN */}
|
||||||
|
{open &&
|
||||||
|
node.children?.map((child) => (
|
||||||
|
<TreeNode
|
||||||
|
key={child.id}
|
||||||
|
node={child}
|
||||||
|
level={level + 1}
|
||||||
|
/>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ================= UI ================= */
|
||||||
|
return (
|
||||||
|
<div className="p-8 bg-slate-50 min-h-screen">
|
||||||
|
|
||||||
|
{/* HEADER */}
|
||||||
|
<div className="flex justify-between mb-6">
|
||||||
|
<h1 className="text-xl font-semibold">
|
||||||
|
Category Manager
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<button
|
||||||
|
onClick={() => openCreate()}
|
||||||
|
className="bg-blue-600 text-white px-4 py-2 rounded"
|
||||||
|
>
|
||||||
|
+ New Category
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* TREE */}
|
||||||
|
<div className="bg-white border rounded-xl p-4">
|
||||||
|
{loading ? (
|
||||||
|
<p>Loading...</p>
|
||||||
|
) : (
|
||||||
|
tree.map((node) => (
|
||||||
|
<TreeNode key={node.id} node={node} />
|
||||||
|
))
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* MODAL */}
|
||||||
|
{modalOpen && (
|
||||||
|
<div className="fixed inset-0 bg-black/40 flex items-center justify-center">
|
||||||
|
|
||||||
|
<div className="bg-white w-[420px] p-5 rounded-xl">
|
||||||
|
|
||||||
|
<h2 className="font-semibold mb-4">
|
||||||
|
{form.id ? "Edit Category" : "Create Category"}
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<input
|
||||||
|
className="w-full border p-2 rounded mb-2"
|
||||||
|
placeholder="Name"
|
||||||
|
value={form.name}
|
||||||
|
onChange={(e) =>
|
||||||
|
setForm({
|
||||||
|
...form,
|
||||||
|
name: e.target.value,
|
||||||
|
slug: slugify(e.target.value),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<input
|
||||||
|
className="w-full border p-2 rounded mb-3"
|
||||||
|
placeholder="Slug"
|
||||||
|
value={form.slug}
|
||||||
|
onChange={(e) =>
|
||||||
|
setForm({ ...form, slug: e.target.value })
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className="flex justify-end gap-2">
|
||||||
|
|
||||||
|
<button onClick={closeModal}>
|
||||||
|
Cancel
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button
|
||||||
|
onClick={save}
|
||||||
|
className="bg-blue-600 text-white px-3 py-1 rounded"
|
||||||
|
>
|
||||||
|
Save
|
||||||
|
</button>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -0,0 +1,343 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import React, { useEffect, useState } from "react";
|
||||||
|
import Image from "next/image";
|
||||||
|
import {
|
||||||
|
LayoutDashboard,
|
||||||
|
Newspaper,
|
||||||
|
Users,
|
||||||
|
BarChart3,
|
||||||
|
Settings,
|
||||||
|
HelpCircle,
|
||||||
|
Tag,
|
||||||
|
FolderTree,
|
||||||
|
Edit3,
|
||||||
|
Trash2,
|
||||||
|
Plus,
|
||||||
|
ChevronRight,
|
||||||
|
ChevronDown,
|
||||||
|
} from "lucide-react";
|
||||||
|
import { createCategory, deleteCategory, getFlat, getTree, updateCategory } from "@/lib/categories.api";
|
||||||
|
import { slugify } from "@/lib/slug";
|
||||||
|
|
||||||
|
/* ================= TYPES ================= */
|
||||||
|
interface Category {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
slug: string;
|
||||||
|
parentId?: string | null;
|
||||||
|
children?: Category[];
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ================= PAGE ================= */
|
||||||
|
export default function CategoriesPage() {
|
||||||
|
const [tree, setTree] = useState<Category[]>([]);
|
||||||
|
const [flat, setFlat] = useState<Category[]>([]);
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
|
const [modalOpen, setModalOpen] = useState(false);
|
||||||
|
|
||||||
|
const [form, setForm] = useState({
|
||||||
|
id: null as string | null,
|
||||||
|
name: "",
|
||||||
|
slug: "",
|
||||||
|
parentId: null as string | null,
|
||||||
|
});
|
||||||
|
|
||||||
|
/* ================= LOAD ================= */
|
||||||
|
async function load() {
|
||||||
|
setLoading(true);
|
||||||
|
try {
|
||||||
|
const [t, f] = await Promise.all([getTree(), getFlat()]);
|
||||||
|
setTree(t);
|
||||||
|
setFlat(f);
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
load();
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
/* ================= CRUD ================= */
|
||||||
|
async function save() {
|
||||||
|
const payload = {
|
||||||
|
name: form.name,
|
||||||
|
slug: form.slug || slugify(form.name),
|
||||||
|
parentId: form.parentId,
|
||||||
|
};
|
||||||
|
|
||||||
|
if (form.id) {
|
||||||
|
await updateCategory(form.id, payload);
|
||||||
|
} else {
|
||||||
|
await createCategory(payload);
|
||||||
|
}
|
||||||
|
|
||||||
|
closeModal();
|
||||||
|
load();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function remove(id: string) {
|
||||||
|
if (!confirm("Delete this category?")) return;
|
||||||
|
await deleteCategory(id);
|
||||||
|
load();
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ================= MODAL ================= */
|
||||||
|
function openCreate(parentId?: string) {
|
||||||
|
setForm({
|
||||||
|
id: null,
|
||||||
|
name: "",
|
||||||
|
slug: "",
|
||||||
|
parentId: parentId || null,
|
||||||
|
});
|
||||||
|
setModalOpen(true);
|
||||||
|
}
|
||||||
|
|
||||||
|
function openEdit(cat: Category) {
|
||||||
|
setForm({
|
||||||
|
id: cat.id,
|
||||||
|
name: cat.name,
|
||||||
|
slug: cat.slug,
|
||||||
|
parentId: cat.parentId || null,
|
||||||
|
});
|
||||||
|
setModalOpen(true);
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeModal() {
|
||||||
|
setModalOpen(false);
|
||||||
|
setForm({ id: null, name: "", slug: "", parentId: null });
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ================= TREE ================= */
|
||||||
|
function TreeNode({
|
||||||
|
node,
|
||||||
|
level = 0,
|
||||||
|
}: {
|
||||||
|
node: Category;
|
||||||
|
level?: number;
|
||||||
|
}) {
|
||||||
|
const [open, setOpen] = useState(true);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div style={{ marginLeft: level * 14 }} className="border-l pl-3">
|
||||||
|
|
||||||
|
<div className="flex items-center justify-between py-2 group">
|
||||||
|
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
|
||||||
|
<button onClick={() => setOpen(!open)}>
|
||||||
|
{open ? (
|
||||||
|
<ChevronDown size={14} />
|
||||||
|
) : (
|
||||||
|
<ChevronRight size={14} />
|
||||||
|
)}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<FolderTree size={14} className="text-blue-500" />
|
||||||
|
|
||||||
|
<span
|
||||||
|
onClick={() => openEdit(node)}
|
||||||
|
className="text-sm font-medium cursor-pointer hover:text-blue-600"
|
||||||
|
>
|
||||||
|
{node.name}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex gap-2 opacity-0 group-hover:opacity-100 transition">
|
||||||
|
|
||||||
|
<button
|
||||||
|
onClick={() => openCreate(node.id)}
|
||||||
|
className="text-green-600"
|
||||||
|
>
|
||||||
|
<Plus size={14} />
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button onClick={() => openEdit(node)}>
|
||||||
|
<Edit3 size={14} />
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button onClick={() => remove(node.id)}>
|
||||||
|
<Trash2 size={14} className="text-red-500" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{open &&
|
||||||
|
node.children?.map((child) => (
|
||||||
|
<TreeNode
|
||||||
|
key={child.id}
|
||||||
|
node={child}
|
||||||
|
level={level + 1}
|
||||||
|
/>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ================= UI ================= */
|
||||||
|
return (
|
||||||
|
<div className="flex h-screen bg-slate-50 text-slate-900">
|
||||||
|
|
||||||
|
{/* ================= SIDEBAR ================= */}
|
||||||
|
{/* Sidebar Lateral */}
|
||||||
|
<aside className="w-64 backdrop-blur-xl bg-white/80 border-r border-slate-200 p-6 flex flex-col">
|
||||||
|
<div className="flex items-center gap-2 mb-10 px-2">
|
||||||
|
<div className="w-10 h-10 bg-white rounded-lg flex items-center justify-center font-bold italic">
|
||||||
|
<Image src="/logo.png" alt="TVone" width={50} height={50} />
|
||||||
|
</div>
|
||||||
|
<span className="font-bold text-sm tracking-tight leading-tight uppercase">
|
||||||
|
TVone<br/><span className="text-blue-600 text-[10px]">de Notícias</span>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<nav className="flex-1 space-y-1">
|
||||||
|
<NavItem icon={<LayoutDashboard size={18}/>} label="Painel" />
|
||||||
|
<NavItem icon={<Newspaper size={18}/>} label="Meus Artigos" />
|
||||||
|
<NavItem icon={<Users size={18}/>} label="Equipa" />
|
||||||
|
<NavItem icon={<BarChart3 size={18}/>} label="Análises" />
|
||||||
|
<NavItem icon={<Newspaper size={18}/>} label="Adicionar Notícia" active />
|
||||||
|
<NavItem icon={<Settings size={18}/>} label="Definições" />
|
||||||
|
<NavItem icon={<HelpCircle size={18}/>} label="Ajuda" />
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
{/* User Activity Feed */}
|
||||||
|
<div className="mt-auto pt-6 border-t border-slate-200">
|
||||||
|
<h4 className="text-[10px] font-bold uppercase text-slate-400 mb-4 px-2 tracking-widest">Atividade Recente</h4>
|
||||||
|
<div className="space-y-3 px-2">
|
||||||
|
<ActivityItem user="James Wilson" action="atualizou 'Mercado'" />
|
||||||
|
<ActivityItem user="Sarah Johnson" action="criou 'Startups'" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
|
||||||
|
{/* ================= MAIN ================= */}
|
||||||
|
<div className="flex-1 flex flex-col">
|
||||||
|
|
||||||
|
{/* HEADER */}
|
||||||
|
<header className="h-14 bg-white border-b flex items-center justify-between px-6">
|
||||||
|
|
||||||
|
<input
|
||||||
|
placeholder="Search categories..."
|
||||||
|
className="bg-slate-100 px-4 py-1 rounded-full text-sm w-72 outline-none"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className="flex items-center gap-3">
|
||||||
|
|
||||||
|
<span className="text-sm text-slate-600">
|
||||||
|
Admin
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<img
|
||||||
|
src="https://ui-avatars.com/api/?name=Admin"
|
||||||
|
className="w-8 h-8 rounded-full"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
{/* CONTENT */}
|
||||||
|
<main className="p-6 overflow-y-auto">
|
||||||
|
|
||||||
|
{/* TOP BAR */}
|
||||||
|
<div className="flex justify-between mb-6">
|
||||||
|
|
||||||
|
<h1 className="text-xl font-semibold">
|
||||||
|
Categories
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<button
|
||||||
|
onClick={() => openCreate()}
|
||||||
|
className="bg-blue-600 text-white px-4 py-2 rounded"
|
||||||
|
>
|
||||||
|
+ New Category
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* TREE */}
|
||||||
|
<div className="bg-white border rounded-xl p-4">
|
||||||
|
{loading ? (
|
||||||
|
<p>Loading...</p>
|
||||||
|
) : (
|
||||||
|
tree.map((node) => (
|
||||||
|
<TreeNode key={node.id} node={node} />
|
||||||
|
))
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* ================= MODAL ================= */}
|
||||||
|
{modalOpen && (
|
||||||
|
<div className="fixed inset-0 bg-black/40 flex items-center justify-center">
|
||||||
|
|
||||||
|
<div className="bg-white w-[420px] p-5 rounded-xl">
|
||||||
|
|
||||||
|
<h2 className="font-semibold mb-4">
|
||||||
|
{form.id ? "Edit Category" : "Create Category"}
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<input
|
||||||
|
className="w-full border p-2 rounded mb-2"
|
||||||
|
placeholder="Name"
|
||||||
|
value={form.name}
|
||||||
|
onChange={(e) =>
|
||||||
|
setForm({
|
||||||
|
...form,
|
||||||
|
name: e.target.value,
|
||||||
|
slug: slugify(e.target.value),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<input
|
||||||
|
className="w-full border p-2 rounded mb-3"
|
||||||
|
placeholder="Slug"
|
||||||
|
value={form.slug}
|
||||||
|
onChange={(e) =>
|
||||||
|
setForm({ ...form, slug: e.target.value })
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className="flex justify-end gap-2">
|
||||||
|
|
||||||
|
<button onClick={closeModal}>
|
||||||
|
Cancel
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button
|
||||||
|
onClick={save}
|
||||||
|
className="bg-blue-600 text-white px-3 py-1 rounded"
|
||||||
|
>
|
||||||
|
Save
|
||||||
|
</button>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Componentes Auxiliares para Limpeza de Código
|
||||||
|
const NavItem = ({ icon, label, active = false }: { icon: any, label: string, active?: boolean }) => (
|
||||||
|
<div className={`flex items-center gap-3 px-3 py-2 rounded-xl text-sm font-medium transition-all cursor-pointer ${
|
||||||
|
active ? 'bg-blue-600 text-white shadow-md shadow-blue-200' : 'text-slate-500 hover:bg-slate-100'
|
||||||
|
}`}>
|
||||||
|
{icon}
|
||||||
|
{label}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
|
||||||
|
const ActivityItem = ({ user, action }: { user: string, action: string }) => (
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<div className="w-6 h-6 bg-slate-200 rounded-full shrink-0" />
|
||||||
|
<p className="text-[10px] leading-tight text-slate-600">
|
||||||
|
<span className="font-bold block text-slate-900">{user}</span> {action}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
@@ -0,0 +1,50 @@
|
|||||||
|
// export function CategoryModal({
|
||||||
|
// open,
|
||||||
|
// onClose,
|
||||||
|
// form,
|
||||||
|
// setForm,
|
||||||
|
// onSave,
|
||||||
|
// }: any) {
|
||||||
|
// if (!open) return null;
|
||||||
|
|
||||||
|
// return (
|
||||||
|
// <div className="fixed inset-0 bg-black/30 flex items-center justify-center">
|
||||||
|
|
||||||
|
// <div className="bg-white p-5 rounded-xl w-[400px]">
|
||||||
|
|
||||||
|
// <h2 className="font-semibold mb-3">
|
||||||
|
// {form.id ? "Edit Category" : "New Category"}
|
||||||
|
// </h2>
|
||||||
|
|
||||||
|
// <input
|
||||||
|
// className="w-full border p-2 rounded mb-2"
|
||||||
|
// placeholder="Name"
|
||||||
|
// value={form.name}
|
||||||
|
// onChange={(e) =>
|
||||||
|
// setForm({ ...form, name: e.target.value })
|
||||||
|
// }
|
||||||
|
// />
|
||||||
|
|
||||||
|
// <input
|
||||||
|
// className="w-full border p-2 rounded mb-3"
|
||||||
|
// placeholder="Slug (auto)"
|
||||||
|
// value={form.slug}
|
||||||
|
// onChange={(e) =>
|
||||||
|
// setForm({ ...form, slug: e.target.value })
|
||||||
|
// }
|
||||||
|
// />
|
||||||
|
|
||||||
|
// <div className="flex justify-end gap-2">
|
||||||
|
// <button onClick={onClose}>Cancel</button>
|
||||||
|
|
||||||
|
// <button
|
||||||
|
// onClick={onSave}
|
||||||
|
// className="bg-blue-600 text-white px-3 py-1 rounded"
|
||||||
|
// >
|
||||||
|
// Save
|
||||||
|
// </button>
|
||||||
|
// </div>
|
||||||
|
// </div>
|
||||||
|
// </div>
|
||||||
|
// );
|
||||||
|
// }
|
||||||
@@ -0,0 +1,116 @@
|
|||||||
|
// "use client";
|
||||||
|
|
||||||
|
// import React, { useState } from "react";
|
||||||
|
// import {
|
||||||
|
// FolderTree,
|
||||||
|
// Edit3,
|
||||||
|
// Trash2,
|
||||||
|
// Plus,
|
||||||
|
// ChevronRight,
|
||||||
|
// ChevronDown,
|
||||||
|
// } from "lucide-react";
|
||||||
|
// import { Category } from "@/lib/categories.api";
|
||||||
|
|
||||||
|
// export function CategoryTree({
|
||||||
|
// nodes,
|
||||||
|
// onEdit,
|
||||||
|
// onDelete,
|
||||||
|
// onAddChild,
|
||||||
|
// }: {
|
||||||
|
// nodes: Category[];
|
||||||
|
// onEdit: (c: Category) => void;
|
||||||
|
// onDelete: (id: string) => void;
|
||||||
|
// onAddChild: (parentId: string) => void;
|
||||||
|
// }) {
|
||||||
|
// return (
|
||||||
|
// <div>
|
||||||
|
// {nodes.map((node) => (
|
||||||
|
// <TreeNode
|
||||||
|
// key={node.id}
|
||||||
|
// node={node}
|
||||||
|
// onEdit={onEdit}
|
||||||
|
// onDelete={onDelete}
|
||||||
|
// onAddChild={onAddChild}
|
||||||
|
// />
|
||||||
|
// ))}
|
||||||
|
// </div>
|
||||||
|
// );
|
||||||
|
// }
|
||||||
|
|
||||||
|
// function TreeNode({
|
||||||
|
// node,
|
||||||
|
// onEdit,
|
||||||
|
// onDelete,
|
||||||
|
// onAddChild,
|
||||||
|
// }: {
|
||||||
|
// node: Category;
|
||||||
|
// onEdit: (c: Category) => void;
|
||||||
|
// onDelete: (id: string) => void;
|
||||||
|
// onAddChild: (parentId: string) => void;
|
||||||
|
// }) {
|
||||||
|
// const [open, setOpen] = useState(true);
|
||||||
|
|
||||||
|
// return (
|
||||||
|
// <div className="ml-2 border-l pl-3">
|
||||||
|
|
||||||
|
// {/* NODE ROW */}
|
||||||
|
// <div className="flex items-center justify-between py-2 group">
|
||||||
|
|
||||||
|
// <div className="flex items-center gap-2">
|
||||||
|
|
||||||
|
// <button onClick={() => setOpen(!open)}>
|
||||||
|
// {open ? (
|
||||||
|
// <ChevronDown size={14} />
|
||||||
|
// ) : (
|
||||||
|
// <ChevronRight size={14} />
|
||||||
|
// )}
|
||||||
|
// </button>
|
||||||
|
|
||||||
|
// <FolderTree size={14} className="text-blue-500" />
|
||||||
|
|
||||||
|
// {/* INLINE EDIT TRIGGER */}
|
||||||
|
// <span
|
||||||
|
// onClick={() => onEdit(node)}
|
||||||
|
// className="text-sm font-medium cursor-pointer hover:text-blue-600"
|
||||||
|
// >
|
||||||
|
// {node.name}
|
||||||
|
// </span>
|
||||||
|
// </div>
|
||||||
|
|
||||||
|
// {/* ACTIONS (SHOW ON HOVER) */}
|
||||||
|
// <div className="flex gap-2 opacity-0 group-hover:opacity-100 transition">
|
||||||
|
|
||||||
|
// <button
|
||||||
|
// onClick={() => onAddChild(node.id)}
|
||||||
|
// className="text-green-600"
|
||||||
|
// >
|
||||||
|
// <Plus size={14} />
|
||||||
|
// </button>
|
||||||
|
|
||||||
|
// <button onClick={() => onEdit(node)}>
|
||||||
|
// <Edit3 size={14} />
|
||||||
|
// </button>
|
||||||
|
|
||||||
|
// <button onClick={() => onDelete(node.id)}>
|
||||||
|
// <Trash2 size={14} className="text-red-500" />
|
||||||
|
// </button>
|
||||||
|
// </div>
|
||||||
|
// </div>
|
||||||
|
|
||||||
|
// {/* CHILDREN */}
|
||||||
|
// {open && node.children?.length ? (
|
||||||
|
// <div>
|
||||||
|
// {node.children.map((child) => (
|
||||||
|
// <TreeNode
|
||||||
|
// key={child.id}
|
||||||
|
// node={child}
|
||||||
|
// onEdit={onEdit}
|
||||||
|
// onDelete={onDelete}
|
||||||
|
// onAddChild={onAddChild}
|
||||||
|
// />
|
||||||
|
// ))}
|
||||||
|
// </div>
|
||||||
|
// ) : null}
|
||||||
|
// </div>
|
||||||
|
// );
|
||||||
|
// }
|
||||||
@@ -0,0 +1,89 @@
|
|||||||
|
import { useEffect, useState } from "react";
|
||||||
|
import {
|
||||||
|
Category,
|
||||||
|
getCategoriesTree,
|
||||||
|
getCategoriesFlat,
|
||||||
|
createCategory,
|
||||||
|
updateCategory,
|
||||||
|
deleteCategory,
|
||||||
|
} from "@/lib/categories.api";
|
||||||
|
import { slugify } from "@/lib/slug";
|
||||||
|
|
||||||
|
export function useCategories() {
|
||||||
|
const [tree, setTree] = useState<Category[]>([]);
|
||||||
|
const [flat, setFlat] = useState<Category[]>([]);
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
|
const [form, setForm] = useState({
|
||||||
|
id: null as string | null,
|
||||||
|
name: "",
|
||||||
|
slug: "",
|
||||||
|
parentId: null as string | null,
|
||||||
|
});
|
||||||
|
|
||||||
|
async function load() {
|
||||||
|
setLoading(true);
|
||||||
|
try {
|
||||||
|
const [t, f] = await Promise.all([
|
||||||
|
getCategoriesTree(),
|
||||||
|
getCategoriesFlat(),
|
||||||
|
]);
|
||||||
|
|
||||||
|
setTree(t);
|
||||||
|
setFlat(f);
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
load();
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
async function save() {
|
||||||
|
const payload = {
|
||||||
|
name: form.name,
|
||||||
|
slug: form.slug || slugify(form.name),
|
||||||
|
parentId: form.parentId,
|
||||||
|
};
|
||||||
|
|
||||||
|
if (form.id) {
|
||||||
|
await updateCategory(form.id, payload);
|
||||||
|
} else {
|
||||||
|
await createCategory(payload);
|
||||||
|
}
|
||||||
|
|
||||||
|
resetForm();
|
||||||
|
load();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function remove(id: string) {
|
||||||
|
await deleteCategory(id);
|
||||||
|
load();
|
||||||
|
}
|
||||||
|
|
||||||
|
function edit(cat: Category) {
|
||||||
|
setForm({
|
||||||
|
id: cat.id,
|
||||||
|
name: cat.name,
|
||||||
|
slug: cat.slug,
|
||||||
|
parentId: cat.parentId || null,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function resetForm() {
|
||||||
|
setForm({ id: null, name: "", slug: "", parentId: null });
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
tree,
|
||||||
|
flat,
|
||||||
|
form,
|
||||||
|
setForm,
|
||||||
|
save,
|
||||||
|
remove,
|
||||||
|
edit,
|
||||||
|
resetForm,
|
||||||
|
loading,
|
||||||
|
};
|
||||||
|
}
|
||||||
@@ -0,0 +1,54 @@
|
|||||||
|
const API = "http://localhost:3001/categories";
|
||||||
|
|
||||||
|
export interface Category {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
slug: string;
|
||||||
|
parentId?: string | null;
|
||||||
|
children?: Category[];
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function getCategoriesTree(): Promise<Category[]> {
|
||||||
|
const res = await fetch(`${API}/`);
|
||||||
|
const data = await res.json();
|
||||||
|
return Array.isArray(data) ? data : data?.data ?? [];
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function getCategoriesFlat(): Promise<Category[]> {
|
||||||
|
const res = await fetch(API);
|
||||||
|
const data = await res.json();
|
||||||
|
return Array.isArray(data) ? data : [];
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function createCategory(payload: Partial<Category>) {
|
||||||
|
return fetch(API, {
|
||||||
|
method: "POST",
|
||||||
|
headers: { "Content-Type": "application/json" },
|
||||||
|
body: JSON.stringify(payload),
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function updateCategory(id: string, payload: Partial<Category>) {
|
||||||
|
return fetch(`${API}/${id}`, {
|
||||||
|
method: "PATCH",
|
||||||
|
headers: { "Content-Type": "application/json" },
|
||||||
|
body: JSON.stringify(payload),
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function deleteCategory(id: string) {
|
||||||
|
return fetch(`${API}/${id}`, { method: "DELETE" });
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export async function getTree(): Promise<Category[]> {
|
||||||
|
const res = await fetch(`${API}/`);
|
||||||
|
const data = await res.json();
|
||||||
|
return Array.isArray(data) ? data : data?.data ?? [];
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function getFlat(): Promise<Category[]> {
|
||||||
|
const res = await fetch(API);
|
||||||
|
const data = await res.json();
|
||||||
|
return Array.isArray(data) ? data : [];
|
||||||
|
}
|
||||||
+55
-55
@@ -1,63 +1,63 @@
|
|||||||
import fs from "fs";
|
// import fs from "fs";
|
||||||
import path from "path";
|
// import path from "path";
|
||||||
|
|
||||||
export type SliderPhoto = { src: string; alt: string };
|
// export type SliderPhoto = { src: string; alt: string };
|
||||||
|
|
||||||
function slugToAlt(filename: string): string {
|
// function slugToAlt(filename: string): string {
|
||||||
const base = filename.replace(/\.[^.]+$/, "");
|
// const base = filename.replace(/\.[^.]+$/, "");
|
||||||
const words = base.replace(/[-_]+/g, " ").trim();
|
// const words = base.replace(/[-_]+/g, " ").trim();
|
||||||
return words || "Slide";
|
// return words || "Slide";
|
||||||
}
|
// }
|
||||||
|
|
||||||
export function parseManifest(data: unknown): SliderPhoto[] {
|
// export function parseManifest(data: unknown): SliderPhoto[] {
|
||||||
if (!Array.isArray(data)) return [];
|
// if (!Array.isArray(data)) return [];
|
||||||
const out: SliderPhoto[] = [];
|
// const out: SliderPhoto[] = [];
|
||||||
for (const item of data) {
|
// for (const item of data) {
|
||||||
if (typeof item !== "object" || item === null || !("src" in item)) continue;
|
// if (typeof item !== "object" || item === null || !("src" in item)) continue;
|
||||||
const src = (item as { src: unknown }).src;
|
// const src = (item as { src: unknown }).src;
|
||||||
if (typeof src !== "string" || !src.startsWith("/")) continue;
|
// if (typeof src !== "string" || !src.startsWith("/")) continue;
|
||||||
const altRaw = (item as { alt?: unknown }).alt;
|
// const altRaw = (item as { alt?: unknown }).alt;
|
||||||
const alt = typeof altRaw === "string" && altRaw.trim() ? altRaw.trim() : slugToAlt(src.split("/").pop() ?? "");
|
// const alt = typeof altRaw === "string" && altRaw.trim() ? altRaw.trim() : slugToAlt(src.split("/").pop() ?? "");
|
||||||
out.push({ src, alt });
|
// out.push({ src, alt });
|
||||||
}
|
// }
|
||||||
return out;
|
// return out;
|
||||||
}
|
// }
|
||||||
|
|
||||||
const IMAGE_EXT = /\.(jpe?g|png|webp|gif|avif)$/i;
|
// const IMAGE_EXT = /\.(jpe?g|png|webp|gif|avif)$/i;
|
||||||
|
|
||||||
function scanSliderDirectory(dir: string): SliderPhoto[] {
|
// function scanSliderDirectory(dir: string): SliderPhoto[] {
|
||||||
let names: string[] = [];
|
// let names: string[] = [];
|
||||||
try {
|
// try {
|
||||||
names = fs.readdirSync(dir);
|
// names = fs.readdirSync(dir);
|
||||||
} catch {
|
// } catch {
|
||||||
return [];
|
// return [];
|
||||||
}
|
// }
|
||||||
return names
|
// return names
|
||||||
.filter((f) => IMAGE_EXT.test(f))
|
// .filter((f) => IMAGE_EXT.test(f))
|
||||||
.sort((a, b) => a.localeCompare(b, undefined, { sensitivity: "base" }))
|
// .sort((a, b) => a.localeCompare(b, undefined, { sensitivity: "base" }))
|
||||||
.map((f) => ({
|
// .map((f) => ({
|
||||||
src: `/slider/${f}`,
|
// src: `/slider/${f}`,
|
||||||
alt: slugToAlt(f),
|
// alt: slugToAlt(f),
|
||||||
}));
|
// }));
|
||||||
}
|
// }
|
||||||
|
|
||||||
/**
|
// /**
|
||||||
* Reads `public/slider/manifest.json` when present (full control: order + alt).
|
// * Reads `public/slider/manifest.json` when present (full control: order + alt).
|
||||||
* Otherwise scans `public/slider` for image files (drop-in updates, no code edits).
|
// * Otherwise scans `public/slider` for image files (drop-in updates, no code edits).
|
||||||
*/
|
// */
|
||||||
export function readSliderPhotos(): SliderPhoto[] {
|
// export function readSliderPhotos(): SliderPhoto[] {
|
||||||
const dir = path.join(process.cwd(), "public", "slider");
|
// const dir = path.join(process.cwd(), "public", "slider");
|
||||||
if (!fs.existsSync(dir)) return [];
|
// if (!fs.existsSync(dir)) return [];
|
||||||
|
|
||||||
const manifestPath = path.join(dir, "manifest.json");
|
// const manifestPath = path.join(dir, "manifest.json");
|
||||||
if (fs.existsSync(manifestPath)) {
|
// if (fs.existsSync(manifestPath)) {
|
||||||
try {
|
// try {
|
||||||
const raw = JSON.parse(fs.readFileSync(manifestPath, "utf8")) as unknown;
|
// const raw = JSON.parse(fs.readFileSync(manifestPath, "utf8")) as unknown;
|
||||||
return parseManifest(raw);
|
// return parseManifest(raw);
|
||||||
} catch {
|
// } catch {
|
||||||
return [];
|
// return [];
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
|
|
||||||
return scanSliderDirectory(dir);
|
// return scanSliderDirectory(dir);
|
||||||
}
|
// }
|
||||||
|
|||||||
@@ -0,0 +1,7 @@
|
|||||||
|
export function slugify(text: string) {
|
||||||
|
return text
|
||||||
|
.toLowerCase()
|
||||||
|
.trim()
|
||||||
|
.replace(/\s+/g, "-")
|
||||||
|
.replace(/[^a-z0-9-]/g, "");
|
||||||
|
}
|
||||||
@@ -9,6 +9,9 @@
|
|||||||
"lint": "eslint"
|
"lint": "eslint"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@dnd-kit/core": "^6.3.1",
|
||||||
|
"@dnd-kit/sortable": "^10.0.0",
|
||||||
|
"@dnd-kit/utilities": "^3.2.2",
|
||||||
"@react-oauth/google": "^0.13.5",
|
"@react-oauth/google": "^0.13.5",
|
||||||
"@tinymce/tinymce-react": "^6.3.0",
|
"@tinymce/tinymce-react": "^6.3.0",
|
||||||
"framer-motion": "^12.38.0",
|
"framer-motion": "^12.38.0",
|
||||||
|
|||||||
Generated
+56
@@ -8,6 +8,15 @@ importers:
|
|||||||
|
|
||||||
.:
|
.:
|
||||||
dependencies:
|
dependencies:
|
||||||
|
'@dnd-kit/core':
|
||||||
|
specifier: ^6.3.1
|
||||||
|
version: 6.3.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
|
||||||
|
'@dnd-kit/sortable':
|
||||||
|
specifier: ^10.0.0
|
||||||
|
version: 10.0.0(@dnd-kit/core@6.3.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4))(react@19.2.4)
|
||||||
|
'@dnd-kit/utilities':
|
||||||
|
specifier: ^3.2.2
|
||||||
|
version: 3.2.2(react@19.2.4)
|
||||||
'@react-oauth/google':
|
'@react-oauth/google':
|
||||||
specifier: ^0.13.5
|
specifier: ^0.13.5
|
||||||
version: 0.13.5(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
|
version: 0.13.5(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
|
||||||
@@ -143,6 +152,28 @@ packages:
|
|||||||
resolution: {integrity: sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==}
|
resolution: {integrity: sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==}
|
||||||
engines: {node: '>=6.9.0'}
|
engines: {node: '>=6.9.0'}
|
||||||
|
|
||||||
|
'@dnd-kit/accessibility@3.1.1':
|
||||||
|
resolution: {integrity: sha512-2P+YgaXF+gRsIihwwY1gCsQSYnu9Zyj2py8kY5fFvUM1qm2WA2u639R6YNVfU4GWr+ZM5mqEsfHZZLoRONbemw==}
|
||||||
|
peerDependencies:
|
||||||
|
react: '>=16.8.0'
|
||||||
|
|
||||||
|
'@dnd-kit/core@6.3.1':
|
||||||
|
resolution: {integrity: sha512-xkGBRQQab4RLwgXxoqETICr6S5JlogafbhNsidmrkVv2YRs5MLwpjoF2qpiGjQt8S9AoxtIV603s0GIUpY5eYQ==}
|
||||||
|
peerDependencies:
|
||||||
|
react: '>=16.8.0'
|
||||||
|
react-dom: '>=16.8.0'
|
||||||
|
|
||||||
|
'@dnd-kit/sortable@10.0.0':
|
||||||
|
resolution: {integrity: sha512-+xqhmIIzvAYMGfBYYnbKuNicfSsk4RksY2XdmJhT+HAC01nix6fHCztU68jooFiMUB01Ky3F0FyOvhG/BZrWkg==}
|
||||||
|
peerDependencies:
|
||||||
|
'@dnd-kit/core': ^6.3.0
|
||||||
|
react: '>=16.8.0'
|
||||||
|
|
||||||
|
'@dnd-kit/utilities@3.2.2':
|
||||||
|
resolution: {integrity: sha512-+MKAJEOfaBe5SmV6t34p80MMKhjvUz0vRrvVJbPT0WElzaOJ/1xs+D+KDv+tD/NE5ujfrChEcshd4fLn0wpiqg==}
|
||||||
|
peerDependencies:
|
||||||
|
react: '>=16.8.0'
|
||||||
|
|
||||||
'@emnapi/core@1.9.1':
|
'@emnapi/core@1.9.1':
|
||||||
resolution: {integrity: sha512-mukuNALVsoix/w1BJwFzwXBN/dHeejQtuVzcDsfOEsdpCumXb/E9j8w11h5S54tT1xhifGfbbSm/ICrObRb3KA==}
|
resolution: {integrity: sha512-mukuNALVsoix/w1BJwFzwXBN/dHeejQtuVzcDsfOEsdpCumXb/E9j8w11h5S54tT1xhifGfbbSm/ICrObRb3KA==}
|
||||||
|
|
||||||
@@ -2154,6 +2185,31 @@ snapshots:
|
|||||||
'@babel/helper-string-parser': 7.27.1
|
'@babel/helper-string-parser': 7.27.1
|
||||||
'@babel/helper-validator-identifier': 7.28.5
|
'@babel/helper-validator-identifier': 7.28.5
|
||||||
|
|
||||||
|
'@dnd-kit/accessibility@3.1.1(react@19.2.4)':
|
||||||
|
dependencies:
|
||||||
|
react: 19.2.4
|
||||||
|
tslib: 2.8.1
|
||||||
|
|
||||||
|
'@dnd-kit/core@6.3.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4)':
|
||||||
|
dependencies:
|
||||||
|
'@dnd-kit/accessibility': 3.1.1(react@19.2.4)
|
||||||
|
'@dnd-kit/utilities': 3.2.2(react@19.2.4)
|
||||||
|
react: 19.2.4
|
||||||
|
react-dom: 19.2.4(react@19.2.4)
|
||||||
|
tslib: 2.8.1
|
||||||
|
|
||||||
|
'@dnd-kit/sortable@10.0.0(@dnd-kit/core@6.3.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4))(react@19.2.4)':
|
||||||
|
dependencies:
|
||||||
|
'@dnd-kit/core': 6.3.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
|
||||||
|
'@dnd-kit/utilities': 3.2.2(react@19.2.4)
|
||||||
|
react: 19.2.4
|
||||||
|
tslib: 2.8.1
|
||||||
|
|
||||||
|
'@dnd-kit/utilities@3.2.2(react@19.2.4)':
|
||||||
|
dependencies:
|
||||||
|
react: 19.2.4
|
||||||
|
tslib: 2.8.1
|
||||||
|
|
||||||
'@emnapi/core@1.9.1':
|
'@emnapi/core@1.9.1':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@emnapi/wasi-threads': 1.2.0
|
'@emnapi/wasi-threads': 1.2.0
|
||||||
|
|||||||
Reference in New Issue
Block a user