Add clean button and functionality
Implement a "clean" button to delete signatures not in the pasted list.
This commit is contained in:
@@ -1,10 +1,12 @@
|
||||
|
||||
import { useParams, useNavigate } from "react-router-dom";
|
||||
import { useEffect } from "react";
|
||||
import { useEffect, useState } from "react";
|
||||
import { toast } from "@/hooks/use-toast";
|
||||
import { useQueryClient } from "@tanstack/react-query";
|
||||
import SystemTracker from "@/components/SystemTracker";
|
||||
import RegionMap from "@/components/RegionMap";
|
||||
import { Switch } from "@/components/ui/switch";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import pb from "@/lib/pocketbase";
|
||||
|
||||
interface Signature {
|
||||
@@ -21,6 +23,7 @@ const SystemView = () => {
|
||||
const { system, region } = useParams();
|
||||
const navigate = useNavigate();
|
||||
const queryClient = useQueryClient();
|
||||
const [cleanMode, setCleanMode] = useState(false);
|
||||
|
||||
if (!system) {
|
||||
navigate("/");
|
||||
@@ -90,6 +93,15 @@ const SystemView = () => {
|
||||
}
|
||||
};
|
||||
|
||||
const deleteSignature = async (signatureId: string): Promise<void> => {
|
||||
try {
|
||||
await pb.collection('signature').delete(signatureId);
|
||||
} catch (error) {
|
||||
console.error('Failed to delete signature:', error);
|
||||
throw error;
|
||||
}
|
||||
};
|
||||
|
||||
const handlePaste = async (e: ClipboardEvent) => {
|
||||
const pastedText = e.clipboardData?.getData('text');
|
||||
if (!pastedText?.trim()) return;
|
||||
@@ -120,6 +132,24 @@ const SystemView = () => {
|
||||
return;
|
||||
}
|
||||
|
||||
// If clean mode is enabled, delete signatures not in the pasted list
|
||||
if (cleanMode) {
|
||||
const existingSignatures = await pb.collection('signature').getFullList({
|
||||
filter: `system='${systemId}'`
|
||||
});
|
||||
|
||||
const pastedIdentifiers = new Set(parsedSignatures.map(sig => sig.identifier));
|
||||
const signaturesToDelete = existingSignatures.filter(sig => !pastedIdentifiers.has(sig.identifier));
|
||||
|
||||
for (const sig of signaturesToDelete) {
|
||||
await deleteSignature(sig.id);
|
||||
}
|
||||
|
||||
if (signaturesToDelete.length > 0) {
|
||||
console.log(`Deleted ${signaturesToDelete.length} signatures not in pasted data`);
|
||||
}
|
||||
}
|
||||
|
||||
// Save all new/updated signatures
|
||||
for (const signature of parsedSignatures) {
|
||||
await saveSignature(signature);
|
||||
@@ -128,9 +158,10 @@ const SystemView = () => {
|
||||
// Invalidate queries to refresh the data
|
||||
queryClient.invalidateQueries({ queryKey: ['signatures', system] });
|
||||
|
||||
const cleanText = cleanMode ? ` (${cleanMode ? 'cleaned' : ''})` : '';
|
||||
toast({
|
||||
title: "Success",
|
||||
description: `${parsedSignatures.length} signatures processed.`
|
||||
description: `${parsedSignatures.length} signatures processed${cleanText}.`
|
||||
});
|
||||
|
||||
} catch (error) {
|
||||
@@ -148,14 +179,26 @@ const SystemView = () => {
|
||||
return () => {
|
||||
document.removeEventListener('paste', handlePaste);
|
||||
};
|
||||
}, [system]);
|
||||
}, [system, cleanMode]);
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900">
|
||||
<div className="container mx-auto px-4 py-8">
|
||||
<div className="text-center mb-8">
|
||||
<h1 className="text-4xl font-bold text-white mb-2">System: {system}</h1>
|
||||
<p className="text-slate-300">Viewing signatures and regional overview • Press Ctrl+V to paste signatures</p>
|
||||
<div className="flex items-center justify-center gap-4 text-slate-300">
|
||||
<p>Viewing signatures and regional overview • Press Ctrl+V to paste signatures</p>
|
||||
<div className="flex items-center space-x-2">
|
||||
<Switch
|
||||
id="clean-mode"
|
||||
checked={cleanMode}
|
||||
onCheckedChange={setCleanMode}
|
||||
/>
|
||||
<Label htmlFor="clean-mode" className="text-sm text-slate-300">
|
||||
Clean mode {cleanMode ? '(will delete missing signatures)' : ''}
|
||||
</Label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
|
||||
|
Reference in New Issue
Block a user