mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-22 13:31:22 -05:00
Refactor: Improve desktop layout and fix release lock
This commit is contained in:
@@ -413,7 +413,7 @@ export const QueueItem = memo(({
|
|||||||
/>
|
/>
|
||||||
</div>
|
</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 */}
|
{/* Show Review Items button for content submissions */}
|
||||||
{item.type === 'content_submission' && (
|
{item.type === 'content_submission' && (
|
||||||
<>
|
<>
|
||||||
@@ -421,7 +421,7 @@ export const QueueItem = memo(({
|
|||||||
onClick={() => onOpenReviewManager(item.id)}
|
onClick={() => onOpenReviewManager(item.id)}
|
||||||
disabled={actionLoading === item.id || isLockedByOther || currentLockSubmissionId !== item.id}
|
disabled={actionLoading === item.id || isLockedByOther || currentLockSubmissionId !== item.id}
|
||||||
variant="outline"
|
variant="outline"
|
||||||
className={`flex-1 ${isMobile ? 'h-11' : ''}`}
|
className={isMobile ? 'h-11' : ''}
|
||||||
size={isMobile ? "default" : "default"}
|
size={isMobile ? "default" : "default"}
|
||||||
>
|
>
|
||||||
<ListTree className={isMobile ? "w-5 h-5 mr-2" : "w-4 h-4 mr-2"} />
|
<ListTree className={isMobile ? "w-5 h-5 mr-2" : "w-4 h-4 mr-2"} />
|
||||||
@@ -453,7 +453,7 @@ export const QueueItem = memo(({
|
|||||||
<Button
|
<Button
|
||||||
onClick={() => onApprove(item, 'approved', notes[item.id])}
|
onClick={() => onApprove(item, 'approved', notes[item.id])}
|
||||||
disabled={actionLoading === item.id || isLockedByOther || currentLockSubmissionId !== item.id}
|
disabled={actionLoading === item.id || isLockedByOther || currentLockSubmissionId !== item.id}
|
||||||
className={`flex-1 ${isMobile ? 'h-11' : ''}`}
|
className={isMobile ? 'h-11' : ''}
|
||||||
size={isMobile ? "default" : "default"}
|
size={isMobile ? "default" : "default"}
|
||||||
>
|
>
|
||||||
<CheckCircle className={isMobile ? "w-5 h-5 mr-2" : "w-4 h-4 mr-2"} />
|
<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"
|
variant="destructive"
|
||||||
onClick={() => onApprove(item, 'rejected', notes[item.id])}
|
onClick={() => onApprove(item, 'rejected', notes[item.id])}
|
||||||
disabled={actionLoading === item.id || isLockedByOther || currentLockSubmissionId !== item.id}
|
disabled={actionLoading === item.id || isLockedByOther || currentLockSubmissionId !== item.id}
|
||||||
className={`flex-1 ${isMobile ? 'h-11' : ''}`}
|
className={isMobile ? 'h-11' : ''}
|
||||||
size={isMobile ? "default" : "default"}
|
size={isMobile ? "default" : "default"}
|
||||||
>
|
>
|
||||||
<XCircle className={isMobile ? "w-5 h-5 mr-2" : "w-4 h-4 mr-2"} />
|
<XCircle className={isMobile ? "w-5 h-5 mr-2" : "w-4 h-4 mr-2"} />
|
||||||
|
|||||||
@@ -126,7 +126,7 @@ export function SubmissionChangesDisplay({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{(changes.action === 'edit' || changes.action === 'create') && changes.totalChanges > 0 && (
|
{(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) => (
|
{changes.fieldChanges.slice(0, 5).map((change, idx) => (
|
||||||
<FieldDiff key={idx} change={change} compact />
|
<FieldDiff key={idx} change={change} compact />
|
||||||
))}
|
))}
|
||||||
|
|||||||
@@ -231,6 +231,7 @@ export const useModerationQueue = (config?: UseModerationQueueConfig) => {
|
|||||||
const releaseLock = useCallback(async (submissionId: string): Promise<boolean> => {
|
const releaseLock = useCallback(async (submissionId: string): Promise<boolean> => {
|
||||||
if (!user?.id) return false;
|
if (!user?.id) return false;
|
||||||
|
|
||||||
|
setIsLoading(true);
|
||||||
try {
|
try {
|
||||||
const { data, error } = await supabase.rpc('release_submission_lock', {
|
const { data, error } = await supabase.rpc('release_submission_lock', {
|
||||||
submission_id: submissionId,
|
submission_id: submissionId,
|
||||||
@@ -250,6 +251,11 @@ export const useModerationQueue = (config?: UseModerationQueueConfig) => {
|
|||||||
|
|
||||||
fetchStats();
|
fetchStats();
|
||||||
|
|
||||||
|
toast({
|
||||||
|
title: 'Lock Released',
|
||||||
|
description: 'You can now claim another submission',
|
||||||
|
});
|
||||||
|
|
||||||
// Trigger refresh callback
|
// Trigger refresh callback
|
||||||
if (onLockStateChange) {
|
if (onLockStateChange) {
|
||||||
onLockStateChange();
|
onLockStateChange();
|
||||||
@@ -261,9 +267,16 @@ export const useModerationQueue = (config?: UseModerationQueueConfig) => {
|
|||||||
return false;
|
return false;
|
||||||
} catch (error: any) {
|
} catch (error: any) {
|
||||||
console.error('Error releasing lock:', error);
|
console.error('Error releasing lock:', error);
|
||||||
|
toast({
|
||||||
|
title: 'Error',
|
||||||
|
description: error.message || 'Failed to release lock',
|
||||||
|
variant: 'destructive',
|
||||||
|
});
|
||||||
return false;
|
return false;
|
||||||
|
} finally {
|
||||||
|
setIsLoading(false);
|
||||||
}
|
}
|
||||||
}, [user, fetchStats]);
|
}, [user, fetchStats, toast, onLockStateChange]);
|
||||||
|
|
||||||
// Get time remaining on current lock
|
// Get time remaining on current lock
|
||||||
const getTimeRemaining = useCallback((): number | null => {
|
const getTimeRemaining = useCallback((): number | null => {
|
||||||
|
|||||||
Reference in New Issue
Block a user