Hartmut/CapaKraken
1
0
Fork 0
Code Issues 10 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(admin): hard-delete resources (admin-only)

Browse Source 
Adds a transactional hard-delete procedure behind adminProcedure that
removes a resource's assignments and vacations first, then the record
itself, and writes an audit log entry.  The ResourceModal exposes a
"Delete Resource" button (edit mode, ADMIN role only) with an inline
confirm step before the mutation fires.

Co-Authored-By: claude-flow <ruv@ruv.net>
This commit is contained in:
Hartmut Nörenberg
2026-04-03 15:23:30 +02:00
parent 3979d342c8
commit 0d0707264d
2 changed files with 93 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/components/resources/ResourceModal.tsx
+62 -14
View File
@@ -6,6 +6,7 @@ import type { Resource, SkillEntry } from "@capakraken/shared";
import { GERMAN_FEDERAL_STATES, inferStateFromPostalCode, ResourceType } from "@capakraken/shared";
import { trpc } from "~/lib/trpc/client.js";
import { InfoTooltip } from "~/components/ui/InfoTooltip.js";
import { usePermissions } from "~/hooks/usePermissions.js";
interface RoleAssignment {
roleId: string;
@@ -193,10 +194,12 @@ export function ResourceModal({ mode, resource, onClose }: ResourceModalProps) {
resource ? resourceToFormState(resource) : defaultFormState(),
);
const [errorMsg, setErrorMsg] = useState<string | null>(null);
const [confirmDelete, setConfirmDelete] = useState(false);
const panelRef = useRef<HTMLDivElement>(null);
useFocusTrap(panelRef, true);
const { canManageUsers } = usePermissions();
const utils = trpc.useUtils();
const { data: availableRoles } = trpc.role.list.useQuery(
@@ -225,8 +228,17 @@ export function ResourceModal({ mode, resource, onClose }: ResourceModalProps) {
const createMutation = trpc.resource.create.useMutation();
const updateMutation = trpc.resource.update.useMutation();
const hardDeleteMutation = trpc.resource.hardDelete.useMutation({
onSuccess: () => {
void utils.resource.invalidate();
onClose();
},
onError: (err) => {
setErrorMsg(err.message);
},
});
const isMutating = createMutation.isPending || updateMutation.isPending;
const isMutating = createMutation.isPending || updateMutation.isPending || hardDeleteMutation.isPending;
function setField<K extends keyof FormState>(key: K, value: FormState[K]) {
setForm((prev) => ({ ...prev, [key]: value }));
@@ -955,19 +967,55 @@ export function ResourceModal({ mode, resource, onClose }: ResourceModalProps) {
</div>
{/* Footer */}
<div className="flex items-center justify-end gap-3 px-6 py-4 border-t border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-900 rounded-b-xl">
<button
type="button"
onClick={onClose}
disabled={isMutating}
className="px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 disabled:opacity-50 transition-colors"
>
Cancel
</button>
<button type="submit" disabled={isMutating} className={PRIMARY_BTN}>
{isMutating && <Spinner />}
{isMutating ? "Saving…" : "Save"}
</button>
<div className="flex items-center justify-between gap-3 px-6 py-4 border-t border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-900 rounded-b-xl">
<div>
{mode === "edit" && canManageUsers && resource && (
confirmDelete ? (
<div className="flex items-center gap-2">
<span className="text-xs text-red-600 dark:text-red-400 font-medium">Permanently delete this resource?</span>
<button
type="button"
onClick={() => void hardDeleteMutation.mutateAsync({ id: resource.id })}
disabled={isMutating}
className="px-3 py-1.5 text-xs font-medium text-white bg-red-600 hover:bg-red-700 rounded-lg disabled:opacity-50 transition-colors"
>
{hardDeleteMutation.isPending ? "Deleting…" : "Yes, delete"}
</button>
<button
type="button"
onClick={() => setConfirmDelete(false)}
disabled={isMutating}
className="px-3 py-1.5 text-xs font-medium text-gray-600 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-200 disabled:opacity-50"
>
Cancel
</button>
</div>
) : (
<button
type="button"
onClick={() => setConfirmDelete(true)}
disabled={isMutating}
className="px-3 py-1.5 text-xs font-medium text-red-600 dark:text-red-400 hover:text-red-800 dark:hover:text-red-200 border border-red-300 dark:border-red-700 rounded-lg disabled:opacity-50 transition-colors"
>
Delete Resource
</button>
)
)}
</div>
<div className="flex items-center gap-3">
<button
type="button"
onClick={onClose}
disabled={isMutating}
className="px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 disabled:opacity-50 transition-colors"
>
Cancel
</button>
<button type="submit" disabled={isMutating} className={PRIMARY_BTN}>
{isMutating && <Spinner />}
{isMutating ? "Saving…" : "Save"}
</button>
</div>
</div>
</form>
</div>