feat: Add team lead authorization for project deletion and implement delete confirmation modal in edit project page
This commit is contained in:
@@ -11,7 +11,7 @@ import { logFieldChange } from "@/lib/queries/fieldHistory";
|
|||||||
import { addNoteToProject } from "@/lib/queries/notes";
|
import { addNoteToProject } from "@/lib/queries/notes";
|
||||||
import initializeDatabase from "@/lib/init-db";
|
import initializeDatabase from "@/lib/init-db";
|
||||||
import { NextResponse } from "next/server";
|
import { NextResponse } from "next/server";
|
||||||
import { withReadAuth, withUserAuth } from "@/lib/middleware/auth";
|
import { withReadAuth, withUserAuth, withTeamLeadAuth } from "@/lib/middleware/auth";
|
||||||
import {
|
import {
|
||||||
logApiActionSafe,
|
logApiActionSafe,
|
||||||
AUDIT_ACTIONS,
|
AUDIT_ACTIONS,
|
||||||
@@ -155,4 +155,4 @@ async function deleteProjectHandler(req, { params }) {
|
|||||||
// Protected routes - require authentication
|
// Protected routes - require authentication
|
||||||
export const GET = withReadAuth(getProjectHandler);
|
export const GET = withReadAuth(getProjectHandler);
|
||||||
export const PUT = withUserAuth(updateProjectHandler);
|
export const PUT = withUserAuth(updateProjectHandler);
|
||||||
export const DELETE = withUserAuth(deleteProjectHandler);
|
export const DELETE = withTeamLeadAuth(deleteProjectHandler);
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { useEffect, useState, useRef } from "react";
|
import { useEffect, useState, useRef } from "react";
|
||||||
import { useParams } from "next/navigation";
|
import { useParams, useRouter } from "next/navigation";
|
||||||
import ProjectForm from "@/components/ProjectForm";
|
import ProjectForm from "@/components/ProjectForm";
|
||||||
import PageContainer from "@/components/ui/PageContainer";
|
import PageContainer from "@/components/ui/PageContainer";
|
||||||
import PageHeader from "@/components/ui/PageHeader";
|
import PageHeader from "@/components/ui/PageHeader";
|
||||||
@@ -9,16 +9,44 @@ import Button from "@/components/ui/Button";
|
|||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { LoadingState } from "@/components/ui/States";
|
import { LoadingState } from "@/components/ui/States";
|
||||||
import { useTranslation } from "@/lib/i18n";
|
import { useTranslation } from "@/lib/i18n";
|
||||||
|
import { useSession } from "next-auth/react";
|
||||||
|
|
||||||
export default function EditProjectPage() {
|
export default function EditProjectPage() {
|
||||||
const params = useParams();
|
const params = useParams();
|
||||||
|
const router = useRouter();
|
||||||
const id = params.id;
|
const id = params.id;
|
||||||
const [project, setProject] = useState(null);
|
const [project, setProject] = useState(null);
|
||||||
const [loading, setLoading] = useState(true);
|
const [loading, setLoading] = useState(true);
|
||||||
const [error, setError] = useState(null);
|
const [error, setError] = useState(null);
|
||||||
|
const [showDeleteModal, setShowDeleteModal] = useState(false);
|
||||||
|
const [deleting, setDeleting] = useState(false);
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
|
const { data: session } = useSession();
|
||||||
const formRef = useRef();
|
const formRef = useRef();
|
||||||
|
|
||||||
|
const handleDelete = async () => {
|
||||||
|
setDeleting(true);
|
||||||
|
try {
|
||||||
|
const res = await fetch(`/api/projects/${id}`, {
|
||||||
|
method: 'DELETE',
|
||||||
|
});
|
||||||
|
|
||||||
|
if (res.ok) {
|
||||||
|
router.push('/projects');
|
||||||
|
} else {
|
||||||
|
const data = await res.json();
|
||||||
|
alert(data.error || 'Błąd podczas usuwania projektu');
|
||||||
|
setDeleting(false);
|
||||||
|
setShowDeleteModal(false);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error deleting project:', error);
|
||||||
|
alert('Błąd podczas usuwania projektu');
|
||||||
|
setDeleting(false);
|
||||||
|
setShowDeleteModal(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const fetchProject = async () => {
|
const fetchProject = async () => {
|
||||||
try {
|
try {
|
||||||
@@ -130,7 +158,159 @@ export default function EditProjectPage() {
|
|||||||
/>
|
/>
|
||||||
<div className="max-w-2xl">
|
<div className="max-w-2xl">
|
||||||
<ProjectForm ref={formRef} initialData={project} />
|
<ProjectForm ref={formRef} initialData={project} />
|
||||||
|
|
||||||
|
{/* Delete Button - Only for team_lead */}
|
||||||
|
{session?.user?.role === 'team_lead' && (
|
||||||
|
<div className="mt-8 pt-6 border-t border-gray-200">
|
||||||
|
<div className="flex items-center justify-between">
|
||||||
|
<div>
|
||||||
|
<h3 className="text-sm font-medium text-gray-900">
|
||||||
|
Usuwanie projektu
|
||||||
|
</h3>
|
||||||
|
<p className="mt-1 text-sm text-gray-500">
|
||||||
|
Operacja nieodwracalna. Wszystkie powiązane dane zostaną trwale usunięte.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
<Button
|
||||||
|
variant="danger"
|
||||||
|
size="sm"
|
||||||
|
onClick={() => setShowDeleteModal(true)}
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
className="w-4 h-4 mr-2"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth={2}
|
||||||
|
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
Usuń projekt
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Delete Confirmation Modal */}
|
||||||
|
{showDeleteModal && (
|
||||||
|
<div
|
||||||
|
className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-[9999]"
|
||||||
|
onClick={(e) => e.target === e.currentTarget && !deleting && setShowDeleteModal(false)}
|
||||||
|
>
|
||||||
|
<div className="bg-white dark:bg-gray-800 rounded-lg p-6 w-full max-w-md mx-4">
|
||||||
|
<div className="flex items-center justify-between mb-4">
|
||||||
|
<div className="flex items-center">
|
||||||
|
<div className="flex-shrink-0 w-10 h-10 bg-red-100 rounded-full flex items-center justify-center">
|
||||||
|
<svg
|
||||||
|
className="w-6 h-6 text-red-600"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth={2}
|
||||||
|
d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<h3 className="ml-3 text-lg font-semibold text-gray-900 dark:text-white">
|
||||||
|
Potwierdź usunięcie
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
{!deleting && (
|
||||||
|
<button
|
||||||
|
onClick={() => setShowDeleteModal(false)}
|
||||||
|
className="text-gray-400 hover:text-gray-600 dark:hover:text-gray-200"
|
||||||
|
>
|
||||||
|
<svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="mb-6">
|
||||||
|
<p className="text-gray-700 dark:text-gray-300 mb-3">
|
||||||
|
Czy na pewno chcesz usunąć projekt <strong className="font-semibold">"{project?.project_name}"</strong>?
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-red-600 dark:text-red-400">
|
||||||
|
Ta operacja jest nieodwracalna. Zostaną usunięte wszystkie powiązane dane, w tym:
|
||||||
|
</p>
|
||||||
|
<ul className="mt-2 text-sm text-gray-600 dark:text-gray-400 list-disc list-inside space-y-1">
|
||||||
|
<li>Notatki projektu</li>
|
||||||
|
<li>Załączone pliki</li>
|
||||||
|
<li>Zadania projektu</li>
|
||||||
|
<li>Historia zmian</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex gap-3 justify-end">
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
onClick={() => setShowDeleteModal(false)}
|
||||||
|
disabled={deleting}
|
||||||
|
>
|
||||||
|
Anuluj
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
variant="danger"
|
||||||
|
onClick={handleDelete}
|
||||||
|
disabled={deleting}
|
||||||
|
>
|
||||||
|
{deleting ? (
|
||||||
|
<>
|
||||||
|
<svg
|
||||||
|
className="animate-spin -ml-1 mr-2 h-4 w-4 text-white"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
fill="none"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
>
|
||||||
|
<circle
|
||||||
|
className="opacity-25"
|
||||||
|
cx="12"
|
||||||
|
cy="12"
|
||||||
|
r="10"
|
||||||
|
stroke="currentColor"
|
||||||
|
strokeWidth="4"
|
||||||
|
></circle>
|
||||||
|
<path
|
||||||
|
className="opacity-75"
|
||||||
|
fill="currentColor"
|
||||||
|
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||||
|
></path>
|
||||||
|
</svg>
|
||||||
|
Usuwanie...
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<svg
|
||||||
|
className="w-4 h-4 mr-2"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth={2}
|
||||||
|
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
Tak, usuń projekt
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</PageContainer>
|
</PageContainer>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -75,3 +75,8 @@ export function withAdminAuth(handler) {
|
|||||||
export function withManagerAuth(handler) {
|
export function withManagerAuth(handler) {
|
||||||
return withAuth(handler, { requiredRole: 'project_manager' })
|
return withAuth(handler, { requiredRole: 'project_manager' })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Helper for team lead operations
|
||||||
|
export function withTeamLeadAuth(handler) {
|
||||||
|
return withAuth(handler, { requiredRole: 'team_lead' })
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user