This commit is contained in:
2025-07-07 19:52:05 +02:00
parent ad7ada88c2
commit 2ba0f735fd

View File

@@ -1,4 +1,5 @@
import { useState } from 'react';
import { IndJob } from '@/lib/types'; import { IndJob } from '@/lib/types';
import { formatISK } from '@/utils/priceUtils'; import { formatISK } from '@/utils/priceUtils';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
@@ -29,12 +30,16 @@ const RecapPopover: React.FC<RecapPopoverProps> = ({
value: calculateJobValue(job) value: calculateJobValue(job)
})) }))
.filter(({ value }) => value !== 0) .filter(({ value }) => value !== 0)
.sort((a, b) => Math.abs(b.value) - Math.abs(a.value)); .sort((a, b) => sortDescending ? Math.abs(b.value) - Math.abs(a.value) : Math.abs(a.value) - Math.abs(b.value));
const handleJobClick = (jobId: string) => { const handleJobClick = (jobId: string) => {
navigate(`/${jobId}`); navigate(`/${jobId}`);
}; };
const toggleSort = () => {
setSortDescending(!sortDescending);
};
return ( return (
<Popover> <Popover>
<PopoverTrigger asChild> <PopoverTrigger asChild>
@@ -42,7 +47,16 @@ const RecapPopover: React.FC<RecapPopoverProps> = ({
</PopoverTrigger> </PopoverTrigger>
<PopoverContent className="w-[30rem] bg-gray-800/95 border-gray-600 text-white max-h-[40rem] overflow-y-auto"> <PopoverContent className="w-[30rem] bg-gray-800/95 border-gray-600 text-white max-h-[40rem] overflow-y-auto">
<CardHeader className="pb-3"> <CardHeader className="pb-3">
<CardTitle className="text-lg text-white">{title}</CardTitle> <CardTitle className="text-lg text-white flex items-center justify-between">
<span>{title}</span>
<button
onClick={toggleSort}
className="flex items-center gap-1 text-sm font-normal text-gray-300 hover:text-white transition-colors"
title="Click to toggle sort order"
>
Sort {sortDescending ? <ChevronDown className="w-4 h-4" /> : <ChevronUp className="w-4 h-4" />}
</button>
</CardTitle>
</CardHeader> </CardHeader>
<CardContent className="space-y-2"> <CardContent className="space-y-2">
{jobContributions.length === 0 ? ( {jobContributions.length === 0 ? (
@@ -52,7 +66,7 @@ const RecapPopover: React.FC<RecapPopoverProps> = ({
<div <div
key={job.id} key={job.id}
onClick={() => handleJobClick(job.id)} onClick={() => handleJobClick(job.id)}
className="flex justify-between items-center p-2 rounded hover:bg-gray-700/50 cursor-pointer transition-colors border-l-2 border-l-gray-600" className={`flex justify-between items-center p-2 rounded hover:bg-gray-700/50 cursor-pointer transition-colors border-l-2 border-l-gray-600 ${getStatusBackgroundColor(job.status)}`}
> >
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0">
<div className="text-sm font-medium text-blue-400 truncate" title={job.outputItem}> <div className="text-sm font-medium text-blue-400 truncate" title={job.outputItem}>