diff --git a/src/app/admin/page.tsx b/src/app/admin/page.tsx new file mode 100644 index 0000000..317f197 --- /dev/null +++ b/src/app/admin/page.tsx @@ -0,0 +1,532 @@ +"use client"; + +import { useState } from "react"; +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple"; +import FooterBase from "@/components/sections/footer/FooterBase"; +import { Plus, Edit2, Trash2, Search, Upload, Save, X } from "lucide-react"; + +interface Paper { + id: string; + title: string; + authors: string; + abstract: string; + category: string; + content: string; + imageSrc?: string; + videoSrc?: string; + datePublished: string; +} + +interface FormData { + title: string; + authors: string; + abstract: string; + category: string; + content: string; + imageSrc: string; + videoSrc: string; + datePublished: string; +} + +const initialFormData: FormData = { + title: "", authors: "", abstract: "", category: "", content: "", imageSrc: "", videoSrc: "", datePublished: new Date().toISOString().split("T")[0], +}; + +export default function AdminPanel() { + const [papers, setPapers] = useState([ + { + id: "1", title: "Understanding Transformer Architectures", authors: "Dr. Sarah Chen", abstract: "A comprehensive guide to transformer models and self-attention mechanisms.", category: "Machine Learning", content: "Full paper content here...", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AiFVBjLIhN4wfw5B7Ckuzx9bEy/a-visualization-of-transformer-architect-1773067748719-ccd2f4eb.png", datePublished: "2025-01-28"}, + ]); + + const [formData, setFormData] = useState(initialFormData); + const [editingId, setEditingId] = useState(null); + const [searchTerm, setSearchTerm] = useState(""); + const [showForm, setShowForm] = useState(false); + const [uploadProgress, setUploadProgress] = useState(0); + + const handleFormChange = ( + e: React.ChangeEvent< + HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement + > + ) => { + const { name, value } = e.target; + setFormData((prev) => ({ + ...prev, + [name]: value, + })); + }; + + const handleFileUpload = ( + e: React.ChangeEvent, + field: "imageSrc" | "videoSrc" + ) => { + const file = e.target.files?.[0]; + if (file) { + setUploadProgress(0); + const interval = setInterval(() => { + setUploadProgress((prev) => { + if (prev >= 100) { + clearInterval(interval); + return 100; + } + return prev + Math.random() * 30; + }); + }, 200); + + setTimeout(() => { + const url = URL.createObjectURL(file); + setFormData((prev) => ({ + ...prev, + [field]: url, + })); + setUploadProgress(0); + }, 1500); + } + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + + if (!formData.title || !formData.authors || !formData.abstract) { + alert("Please fill in all required fields"); + return; + } + + if (editingId) { + setPapers((prev) => + prev.map((paper) => + paper.id === editingId + ? { + ...paper, + ...formData, + } + : paper + ) + ); + setEditingId(null); + } else { + const newPaper: Paper = { + id: Date.now().toString(), + ...formData, + }; + setPapers((prev) => [newPaper, ...prev]); + } + + setFormData(initialFormData); + setShowForm(false); + }; + + const handleEdit = (paper: Paper) => { + setFormData({ + title: paper.title, + authors: paper.authors, + abstract: paper.abstract, + category: paper.category, + content: paper.content, + imageSrc: paper.imageSrc || "", videoSrc: paper.videoSrc || "", datePublished: paper.datePublished, + }); + setEditingId(paper.id); + setShowForm(true); + }; + + const handleDelete = (id: string) => { + if (confirm("Are you sure you want to delete this paper?")) { + setPapers((prev) => prev.filter((paper) => paper.id !== id)); + } + }; + + const filteredPapers = papers.filter( + (paper) => + paper.title.toLowerCase().includes(searchTerm.toLowerCase()) || + paper.authors.toLowerCase().includes(searchTerm.toLowerCase()) || + paper.category.toLowerCase().includes(searchTerm.toLowerCase()) + ); + + return ( + + + +
+
+ {/* Header */} +
+

Paper Management

+

Create, read, update, and delete research papers

+
+ + {/* Search and Add Button */} +
+
+ + setSearchTerm(e.target.value)} + className="w-full pl-10 pr-4 py-2 rounded-lg border border-card bg-card text-foreground placeholder-foreground/50 focus:outline-none focus:ring-2 focus:ring-primary-cta" + /> +
+ +
+ + {/* Form Modal */} + {showForm && ( +
+
+
+

+ {editingId ? "Edit Paper" : "Create New Paper"} +

+ +
+ +
+ {/* Metadata Fields */} +
+

Paper Metadata

+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+
+ + {/* Content Editor */} +
+

Paper Content

+ +
+ +