mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-21 22:11:11 -05:00
Refactor code structure and remove redundant changes
This commit is contained in:
160
src-old/components/moderation/RejectionDialog.tsx
Normal file
160
src-old/components/moderation/RejectionDialog.tsx
Normal file
@@ -0,0 +1,160 @@
|
||||
import { useState } from 'react';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import { Textarea } from '@/components/ui/textarea';
|
||||
import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
|
||||
import { AlertCircle } from 'lucide-react';
|
||||
|
||||
export const REJECTION_REASONS = [
|
||||
{ value: 'incomplete', label: 'Incomplete Information', template: 'The submission is missing required information or details.' },
|
||||
{ value: 'inaccurate', label: 'Inaccurate Data', template: 'The information provided appears to be inaccurate or incorrect.' },
|
||||
{ value: 'duplicate', label: 'Duplicate Entry', template: 'This entry already exists in the database.' },
|
||||
{ value: 'inappropriate', label: 'Inappropriate Content', template: 'The submission contains inappropriate or irrelevant content.' },
|
||||
{ value: 'poor_quality', label: 'Poor Quality', template: 'The submission does not meet quality standards (e.g., blurry photos, unclear descriptions).' },
|
||||
{ value: 'spam', label: 'Spam', template: 'This appears to be spam or a test submission.' },
|
||||
{ value: 'custom', label: 'Other (Custom Reason)', template: '' },
|
||||
];
|
||||
|
||||
interface RejectionDialogProps {
|
||||
open: boolean;
|
||||
onOpenChange: (open: boolean) => void;
|
||||
itemCount: number;
|
||||
hasDependents: boolean;
|
||||
onReject: (reason: string, cascade: boolean) => void;
|
||||
}
|
||||
|
||||
export function RejectionDialog({
|
||||
open,
|
||||
onOpenChange,
|
||||
itemCount,
|
||||
hasDependents,
|
||||
onReject,
|
||||
}: RejectionDialogProps) {
|
||||
const [selectedReason, setSelectedReason] = useState<string>('incomplete');
|
||||
const [customReason, setCustomReason] = useState('');
|
||||
const [cascade, setCascade] = useState(true);
|
||||
|
||||
const handleSubmit = () => {
|
||||
const reasonTemplate = REJECTION_REASONS.find(r => r.value === selectedReason);
|
||||
const finalReason = selectedReason === 'custom'
|
||||
? customReason
|
||||
: reasonTemplate?.template || '';
|
||||
|
||||
if (!finalReason.trim()) {
|
||||
return;
|
||||
}
|
||||
|
||||
onReject(finalReason, cascade);
|
||||
onOpenChange(false);
|
||||
|
||||
// Reset state
|
||||
setSelectedReason('incomplete');
|
||||
setCustomReason('');
|
||||
setCascade(true);
|
||||
};
|
||||
|
||||
const currentReason = selectedReason === 'custom' ? customReason :
|
||||
REJECTION_REASONS.find(r => r.value === selectedReason)?.template || '';
|
||||
|
||||
return (
|
||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogContent className="max-w-2xl">
|
||||
<DialogHeader>
|
||||
<DialogTitle>Reject Submission Items</DialogTitle>
|
||||
<DialogDescription>
|
||||
You are about to reject {itemCount} item{itemCount !== 1 ? 's' : ''}.
|
||||
Please provide a reason for rejection.
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<div className="space-y-4">
|
||||
{hasDependents && (
|
||||
<div className="flex items-start gap-2 p-4 bg-warning/10 border border-warning/20 rounded-lg">
|
||||
<AlertCircle className="h-5 w-5 text-warning flex-shrink-0 mt-0.5" />
|
||||
<div className="text-sm">
|
||||
<p className="font-medium text-warning">Dependency Warning</p>
|
||||
<p className="text-muted-foreground mt-1">
|
||||
Some selected items have dependent items. You can choose to cascade the rejection to all dependents.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="space-y-3">
|
||||
<Label>Rejection Reason</Label>
|
||||
<RadioGroup value={selectedReason} onValueChange={setSelectedReason}>
|
||||
{REJECTION_REASONS.map((reason) => (
|
||||
<div key={reason.value} className="flex items-start space-x-2">
|
||||
<RadioGroupItem value={reason.value} id={reason.value} className="mt-1" />
|
||||
<Label htmlFor={reason.value} className="font-normal cursor-pointer flex-1">
|
||||
<span className="font-medium">{reason.label}</span>
|
||||
{reason.template && (
|
||||
<p className="text-sm text-muted-foreground mt-0.5">{reason.template}</p>
|
||||
)}
|
||||
</Label>
|
||||
</div>
|
||||
))}
|
||||
</RadioGroup>
|
||||
</div>
|
||||
|
||||
{selectedReason === 'custom' && (
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="custom-reason">Custom Reason *</Label>
|
||||
<Textarea
|
||||
id="custom-reason"
|
||||
placeholder="Provide a detailed reason for rejection..."
|
||||
value={customReason}
|
||||
onChange={(e) => setCustomReason(e.target.value)}
|
||||
rows={4}
|
||||
className="resize-none"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{hasDependents && (
|
||||
<div className="space-y-2 pt-2 border-t">
|
||||
<Label className="text-base">Dependency Handling</Label>
|
||||
<RadioGroup value={cascade ? 'cascade' : 'orphan'} onValueChange={(v) => setCascade(v === 'cascade')}>
|
||||
<div className="flex items-start space-x-2">
|
||||
<RadioGroupItem value="cascade" id="cascade" className="mt-1" />
|
||||
<Label htmlFor="cascade" className="font-normal cursor-pointer">
|
||||
<span className="font-medium">Cascade Rejection</span>
|
||||
<p className="text-sm text-muted-foreground">Reject all dependent items as well</p>
|
||||
</Label>
|
||||
</div>
|
||||
<div className="flex items-start space-x-2">
|
||||
<RadioGroupItem value="orphan" id="orphan" className="mt-1" />
|
||||
<Label htmlFor="orphan" className="font-normal cursor-pointer">
|
||||
<span className="font-medium">Keep Dependents Pending</span>
|
||||
<p className="text-sm text-muted-foreground">Leave dependent items in pending state</p>
|
||||
</Label>
|
||||
</div>
|
||||
</RadioGroup>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<DialogFooter>
|
||||
<Button variant="outline" onClick={() => onOpenChange(false)}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button
|
||||
variant="destructive"
|
||||
onClick={handleSubmit}
|
||||
disabled={!currentReason.trim()}
|
||||
>
|
||||
Reject {itemCount} Item{itemCount !== 1 ? 's' : ''}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user