feat: implement template update functionality with file handling and validation
This commit is contained in:
@@ -3,9 +3,11 @@
|
||||
import { useState } from "react";
|
||||
import Button from "@/components/ui/Button";
|
||||
import Badge from "@/components/ui/Badge";
|
||||
import TemplateEditForm from "./TemplateEditForm";
|
||||
|
||||
export default function TemplateList({ templates, onTemplateDeleted }) {
|
||||
export default function TemplateList({ templates, onTemplateDeleted, onTemplateUpdated }) {
|
||||
const [deletingId, setDeletingId] = useState(null);
|
||||
const [editingId, setEditingId] = useState(null);
|
||||
|
||||
const handleDelete = async (templateId) => {
|
||||
if (!confirm("Czy na pewno chcesz usunąć ten szablon?")) {
|
||||
@@ -32,6 +34,19 @@ export default function TemplateList({ templates, onTemplateDeleted }) {
|
||||
}
|
||||
};
|
||||
|
||||
const handleEdit = (templateId) => {
|
||||
setEditingId(templateId);
|
||||
};
|
||||
|
||||
const handleEditCancel = () => {
|
||||
setEditingId(null);
|
||||
};
|
||||
|
||||
const handleTemplateUpdated = (updatedTemplate) => {
|
||||
onTemplateUpdated(updatedTemplate);
|
||||
setEditingId(null);
|
||||
};
|
||||
|
||||
const formatFileSize = (bytes) => {
|
||||
if (bytes === 0) return "0 Bytes";
|
||||
const k = 1024;
|
||||
@@ -90,54 +105,74 @@ export default function TemplateList({ templates, onTemplateDeleted }) {
|
||||
key={template.template_id}
|
||||
className="border border-gray-200 rounded-lg p-4 hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-2 mb-1">
|
||||
<h4 className="font-medium text-gray-900">
|
||||
{template.template_name}
|
||||
</h4>
|
||||
<Badge variant="success" size="xs">
|
||||
Aktywny
|
||||
</Badge>
|
||||
{editingId === template.template_id ? (
|
||||
<div>
|
||||
<h4 className="font-medium text-gray-900 mb-4">
|
||||
Edytuj szablon: {template.template_name}
|
||||
</h4>
|
||||
<TemplateEditForm
|
||||
template={template}
|
||||
onTemplateUpdated={handleTemplateUpdated}
|
||||
onCancel={handleEditCancel}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-2 mb-1">
|
||||
<h4 className="font-medium text-gray-900">
|
||||
{template.template_name}
|
||||
</h4>
|
||||
<Badge variant="success" size="xs">
|
||||
Aktywny
|
||||
</Badge>
|
||||
</div>
|
||||
|
||||
{template.description && (
|
||||
<p className="text-sm text-gray-600 mb-2">
|
||||
{template.description}
|
||||
</p>
|
||||
)}
|
||||
|
||||
<div className="flex items-center gap-4 text-sm text-gray-500">
|
||||
<span>
|
||||
Plik: {template.original_filename}
|
||||
</span>
|
||||
<span>
|
||||
Rozmiar: {formatFileSize(template.file_size)}
|
||||
</span>
|
||||
<span>
|
||||
Dodano: {formatDate(template.created_at)}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{template.description && (
|
||||
<p className="text-sm text-gray-600 mb-2">
|
||||
{template.description}
|
||||
</p>
|
||||
)}
|
||||
|
||||
<div className="flex items-center gap-4 text-sm text-gray-500">
|
||||
<span>
|
||||
Plik: {template.original_filename}
|
||||
</span>
|
||||
<span>
|
||||
Rozmiar: {formatFileSize(template.file_size)}
|
||||
</span>
|
||||
<span>
|
||||
Dodano: {formatDate(template.created_at)}
|
||||
</span>
|
||||
<div className="flex gap-2 ml-4">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => window.open(template.file_path, "_blank")}
|
||||
>
|
||||
Pobierz
|
||||
</Button>
|
||||
<Button
|
||||
variant="secondary"
|
||||
size="sm"
|
||||
onClick={() => handleEdit(template.template_id)}
|
||||
>
|
||||
Edytuj
|
||||
</Button>
|
||||
<Button
|
||||
variant="danger"
|
||||
size="sm"
|
||||
onClick={() => handleDelete(template.template_id)}
|
||||
disabled={deletingId === template.template_id}
|
||||
>
|
||||
{deletingId === template.template_id ? "Usuwanie..." : "Usuń"}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-2 ml-4">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => window.open(template.file_path, "_blank")}
|
||||
>
|
||||
Pobierz
|
||||
</Button>
|
||||
<Button
|
||||
variant="danger"
|
||||
size="sm"
|
||||
onClick={() => handleDelete(template.template_id)}
|
||||
disabled={deletingId === template.template_id}
|
||||
>
|
||||
{deletingId === template.template_id ? "Usuwanie..." : "Usuń"}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user