Allow sort on all columns

This commit is contained in:
2026-01-11 15:57:03 +01:00
parent 90a8bbc979
commit 11c99dc4f1

View File

@@ -3,7 +3,7 @@ import { JobRow } from './JobRow';
import { ArrowUpDown } from 'lucide-react';
import { useState, useMemo } from 'react';
type SortKey = 'name' | 'end_date' | 'time_remaining' | 'runs' | 'status';
type SortKey = 'product_type_id' | 'name' | 'runs' | 'start_date' | 'end_date' | 'time_remaining' | 'duration' | 'status';
type SortOrder = 'asc' | 'desc';
interface JobsTableProps {
@@ -28,20 +28,31 @@ export function JobsTable({ jobs }: JobsTableProps) {
let comparison = 0;
switch (sortKey) {
case 'product_type_id':
comparison = a.product_type_id - b.product_type_id;
break;
case 'name':
comparison = a.name.localeCompare(b.name);
break;
case 'runs':
comparison = a.runs - b.runs;
break;
case 'start_date':
comparison = new Date(a.start_date.replace(' ', 'T') + 'Z').getTime() -
new Date(b.start_date.replace(' ', 'T') + 'Z').getTime();
break;
case 'end_date':
comparison = new Date(a.end_date.replace(' ', 'T') + 'Z').getTime() -
new Date(b.end_date.replace(' ', 'T') + 'Z').getTime();
break;
case 'time_remaining':
case 'time_remaining': {
const aTime = new Date(a.end_date.replace(' ', 'T') + 'Z').getTime() - Date.now();
const bTime = new Date(b.end_date.replace(' ', 'T') + 'Z').getTime() - Date.now();
comparison = aTime - bTime;
break;
case 'runs':
comparison = a.runs - b.runs;
}
case 'duration':
comparison = a.duration - b.duration;
break;
case 'status':
comparison = a.status.localeCompare(b.status);
@@ -82,13 +93,13 @@ export function JobsTable({ jobs }: JobsTableProps) {
<table className="w-full">
<thead className="bg-secondary/50 border-b border-border">
<tr className="eve-header">
<th className="py-3 px-4 text-left">Product</th>
<SortHeader label="Product" sortKeyName="product_type_id" />
<SortHeader label="Character" sortKeyName="name" />
<SortHeader label="Runs" sortKeyName="runs" />
<SortHeader label="Time Left" sortKeyName="time_remaining" />
<th className="py-3 px-4 text-left">Start</th>
<th className="py-3 px-4 text-left">End</th>
<th className="py-3 px-4 text-left">Duration</th>
<SortHeader label="Start" sortKeyName="start_date" />
<SortHeader label="End" sortKeyName="end_date" />
<SortHeader label="Duration" sortKeyName="duration" />
<SortHeader label="Status" sortKeyName="status" />
</tr>
</thead>