Refactor: Improve desktop layout and fix release lock

This commit is contained in:
gpt-engineer-app[bot]
2025-10-15 15:02:30 +00:00
parent 415aa45f4c
commit 9904a0c36b
3 changed files with 19 additions and 6 deletions

View File

@@ -413,7 +413,7 @@ export const QueueItem = memo(({
/>
</div>
<div className={`flex gap-2 pt-2 ${isMobile ? 'flex-col' : 'flex-col sm:flex-row'}`}>
<div className={isMobile ? 'flex flex-col gap-2 pt-2' : 'grid grid-cols-2 lg:grid-cols-4 gap-2 pt-2'}>
{/* Show Review Items button for content submissions */}
{item.type === 'content_submission' && (
<>
@@ -421,7 +421,7 @@ export const QueueItem = memo(({
onClick={() => onOpenReviewManager(item.id)}
disabled={actionLoading === item.id || isLockedByOther || currentLockSubmissionId !== item.id}
variant="outline"
className={`flex-1 ${isMobile ? 'h-11' : ''}`}
className={isMobile ? 'h-11' : ''}
size={isMobile ? "default" : "default"}
>
<ListTree className={isMobile ? "w-5 h-5 mr-2" : "w-4 h-4 mr-2"} />
@@ -453,7 +453,7 @@ export const QueueItem = memo(({
<Button
onClick={() => onApprove(item, 'approved', notes[item.id])}
disabled={actionLoading === item.id || isLockedByOther || currentLockSubmissionId !== item.id}
className={`flex-1 ${isMobile ? 'h-11' : ''}`}
className={isMobile ? 'h-11' : ''}
size={isMobile ? "default" : "default"}
>
<CheckCircle className={isMobile ? "w-5 h-5 mr-2" : "w-4 h-4 mr-2"} />
@@ -463,7 +463,7 @@ export const QueueItem = memo(({
variant="destructive"
onClick={() => onApprove(item, 'rejected', notes[item.id])}
disabled={actionLoading === item.id || isLockedByOther || currentLockSubmissionId !== item.id}
className={`flex-1 ${isMobile ? 'h-11' : ''}`}
className={isMobile ? 'h-11' : ''}
size={isMobile ? "default" : "default"}
>
<XCircle className={isMobile ? "w-5 h-5 mr-2" : "w-4 h-4 mr-2"} />

View File

@@ -126,7 +126,7 @@ export function SubmissionChangesDisplay({
</div>
{(changes.action === 'edit' || changes.action === 'create') && changes.totalChanges > 0 && (
<div className="flex flex-wrap gap-1">
<div className="flex flex-wrap gap-1 lg:grid lg:grid-cols-2 xl:grid-cols-3">
{changes.fieldChanges.slice(0, 5).map((change, idx) => (
<FieldDiff key={idx} change={change} compact />
))}

View File

@@ -231,6 +231,7 @@ export const useModerationQueue = (config?: UseModerationQueueConfig) => {
const releaseLock = useCallback(async (submissionId: string): Promise<boolean> => {
if (!user?.id) return false;
setIsLoading(true);
try {
const { data, error } = await supabase.rpc('release_submission_lock', {
submission_id: submissionId,
@@ -250,6 +251,11 @@ export const useModerationQueue = (config?: UseModerationQueueConfig) => {
fetchStats();
toast({
title: 'Lock Released',
description: 'You can now claim another submission',
});
// Trigger refresh callback
if (onLockStateChange) {
onLockStateChange();
@@ -261,9 +267,16 @@ export const useModerationQueue = (config?: UseModerationQueueConfig) => {
return false;
} catch (error: any) {
console.error('Error releasing lock:', error);
toast({
title: 'Error',
description: error.message || 'Failed to release lock',
variant: 'destructive',
});
return false;
} finally {
setIsLoading(false);
}
}, [user, fetchStats]);
}, [user, fetchStats, toast, onLockStateChange]);
// Get time remaining on current lock
const getTimeRemaining = useCallback((): number | null => {