Shot Table Sort Direction Fix Test

❌ Issue Identified

Problem: Shot table header sorting direction only goes down (descending) and never goes up (ascending).

Root Cause: Incorrect logic in toggleSorting parameter in frontend/src/components/shot/columns.ts

🔍 Technical Analysis

The issue was in the TanStack Table toggleSorting method call:

❌ Before (Broken)

onClick: () => column.toggleSorting(column.getIsSorted() === 'asc')

Logic:

When currently ascending → passes true → forces descending
When currently descending → passes false → should go ascending but doesn't work properly
When no sort → passes false → goes ascending (this worked)

✅ After (Fixed)

onClick: () => column.toggleSorting(column.getIsSorted() === 'desc')

Logic:

When currently ascending → passes false → toggles to descending
When currently descending → passes true → toggles to ascending
When no sort → passes false → goes ascending

📝 TanStack Table toggleSorting Method

According to TanStack Table documentation:

toggleSorting(desc?: boolean) - toggleSorting() - cycles: none → asc → desc → none - toggleSorting(false) - cycles: none → asc → desc → none - toggleSorting(true) - cycles: none → desc → asc → none

The parameter desc indicates whether to prefer descending sort when toggling from no sort.

✅ Files Fixed

Updated frontend/src/components/shot/columns.ts - Fixed all sortable columns:

✅ Shot Name column
✅ Episode column
✅ Frame Range column
✅ Frames column (frame count)
✅ Status column
✅ Description column

Note: Task status columns are dynamically generated and inherit the same pattern, so they're also fixed.

🧪 Testing Instructions

To verify the fix works correctly:

Navigate to Shot Table: Go to any project's shots page and switch to table view
Test Sort Cycle: Click on any sortable column header (e.g., "Shot Name")
Verify Ascending: First click should sort ascending (A→Z, 1→9) with up arrow ↑
Verify Descending: Second click should sort descending (Z→A, 9→1) with down arrow ↓
Verify Clear: Third click should clear sort (original order) with up-down arrow ↕
Test Multiple Columns: Repeat for Episode, Frame Range, Frames, Status, Description
Visual Feedback: Confirm icons change correctly: ↕ → ↑ → ↓ → ↕

🎯 Expected Behavior

After the fix, clicking column headers should cycle through:

1. No Sort (↕ up-down arrow) → Original data order 2. Ascending (↑ up arrow) → A-Z, 1-9, earliest-latest 3. Descending (↓ down arrow) → Z-A, 9-1, latest-earliest 4. Back to No Sort (↕ up-down arrow)

🔄 Related Issue

Note: The same issue exists in frontend/src/components/task/columns.ts and should be fixed there as well for consistency.

This affects the task table sorting behavior in the same way.

✅ Fix Summary

Changed: column.getIsSorted() === 'asc' → column.getIsSorted() === 'desc'

Result: Proper sort direction cycling with correct visual feedback

Impact: All sortable columns in shot table now work correctly

Status: Ready for testing

🔧 Shot Table Sort Direction Fix