sanjidarimi
70 lines
2.6 KiB
TypeScript
70 lines
2.6 KiB
TypeScript
import { useState } from "react";
|
|
import { T_projects } from "@/types/projects.type";
|
|
import { X } from "lucide-react";
|
|
|
|
export const EditProjectModal = ({
|
|
project,
|
|
onClose,
|
|
onSave
|
|
}: {
|
|
project: T_projects;
|
|
onClose: () => void;
|
|
onSave: (data: Partial<T_projects>) => void
|
|
}) => {
|
|
const [formData, setFormData] = useState({
|
|
name: project.name,
|
|
shortDescription: project.description,
|
|
previewUrl: project.liveLink,
|
|
});
|
|
|
|
const handleSubmit = (e: React.FormEvent) => {
|
|
e.preventDefault();
|
|
onSave(formData);
|
|
};
|
|
|
|
return (
|
|
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-sm">
|
|
<div className="glass-strong w-full max-w-md p-8 rounded-2xl shadow-2xl relative">
|
|
<button onClick={onClose} className="absolute top-4 right-4 text-muted-foreground hover:text-foreground">
|
|
<X size={24} />
|
|
</button>
|
|
|
|
<h2 className="text-2xl font-bold mb-6 neon-text-glow">Edit Project</h2>
|
|
|
|
<form onSubmit={handleSubmit} className="space-y-4">
|
|
<div>
|
|
<label className="text-sm font-medium mb-1 block">Project Title</label>
|
|
<input
|
|
className="w-full bg-background border border-border p-2.5 rounded-lg focus:ring-2 focus:ring-primary outline-none"
|
|
value={formData.name}
|
|
onChange={(e) => setFormData({ ...formData, name: e.target.value })}
|
|
/>
|
|
</div>
|
|
<div>
|
|
<label className="text-sm font-medium mb-1 block">Short Description</label>
|
|
<textarea
|
|
className="w-full bg-background border border-border p-2.5 rounded-lg focus:ring-2 focus:ring-primary outline-none h-24"
|
|
value={formData.shortDescription}
|
|
onChange={(e) => setFormData({ ...formData, shortDescription: e.target.value })}
|
|
/>
|
|
</div>
|
|
<div>
|
|
<label className="text-sm font-medium mb-1 block">Preview URL</label>
|
|
<input
|
|
className="w-full bg-background border border-border p-2.5 rounded-lg focus:ring-2 focus:ring-primary outline-none"
|
|
value={formData.previewUrl}
|
|
onChange={(e) => setFormData({ ...formData, previewUrl: e.target.value })}
|
|
/>
|
|
</div>
|
|
|
|
<button
|
|
type="submit"
|
|
className="w-full py-3 bg-primary text-primary-foreground font-bold rounded-lg mt-4 neon-glow hover:neon-glow-strong transition-all"
|
|
>
|
|
Update Project
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
);
|
|
}; |