dave/eve-industrializer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor: Move status navigation buttons

Browse Source 
Relocate the status navigation buttons to below the header, between the header and details sections of the job card. This change aims to improve the layout and address the issue of long job names. Also, ensure no duplicate code.
This commit is contained in:
gpt-engineer-app[bot]
2025-07-09 22:49:53 +00:00
committed by PhatPhuckDave
parent d4d17ae987
commit 5e2caefaaf
3 changed files with 80 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/JobCardHeader.tsx
View File

@@ -1,4 +1,3 @@
import { CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Copy, BarChart3 } from 'lucide-react';
@@ -43,6 +42,7 @@ const JobCardHeader: React.FC<JobCardHeaderProps> = ({
};
return (
<>
<div className="flex justify-between items-start">
<div className="flex-1 min-w-0">
<div className="flex items-center gap-2 mb-2">
@@ -71,7 +71,6 @@ const JobCardHeader: React.FC<JobCardHeaderProps> = ({
</div>
<div className="flex flex-col gap-2 flex-shrink-0 items-end">
<div className="flex items-center gap-2">
<JobStatusNavigation job={job} />
<JobStatusDropdown job={job} />
<Button
variant="outline"
@@ -106,6 +105,11 @@ const JobCardHeader: React.FC<JobCardHeaderProps> = ({
<BOMActions job={job} onImportBOM={onImportBOM} />
</div>
</div>
</div>
<div className="flex justify-center mt-2 mb-2">
<JobStatusNavigation job={job} />
</div>
<TransactionChart
job={job}
@@ -127,7 +131,7 @@ const JobCardHeader: React.FC<JobCardHeaderProps> = ({
isOpen={totalProfitChartOpen}
onClose={() => setTotalProfitChartOpen(false)}
/>
</div>
</>
);
};

12
src/components/JobStatusNavigation.tsx
View File

@@ -67,7 +67,7 @@ const JobStatusNavigation: React.FC<JobStatusNavigationProps> = ({ job }) => {
};
return (
<div className="flex gap-1">
<div className="flex gap-2 items-center">
{previousStatus && (
<Button
variant="outline"
@@ -76,11 +76,12 @@ const JobStatusNavigation: React.FC<JobStatusNavigationProps> = ({ job }) => {
e.stopPropagation();
handleStatusChange(previousStatus);
}}
className="border-gray-600 hover:bg-gray-800 p-2"
className="border-gray-600 hover:bg-gray-800 px-3"
data-no-navigate
title={`Move to ${previousStatus}`}
>
<ChevronLeft className="w-4 h-4" />
<ChevronLeft className="w-4 h-4 mr-1" />
{previousStatus}
</Button>
)}
{nextStatus && (
@@ -91,11 +92,12 @@ const JobStatusNavigation: React.FC<JobStatusNavigationProps> = ({ job }) => {
e.stopPropagation();
handleStatusChange(nextStatus);
}}
className="border-gray-600 hover:bg-gray-800 p-2"
className="border-gray-600 hover:bg-gray-800 px-3"
data-no-navigate
title={`Move to ${nextStatus}`}
>
<ChevronRight className="w-4 h-4" />
{nextStatus}
<ChevronRight className="w-4 h-4 ml-1" />
</Button>
)}
</div>

14
src/utils/jobStatusUtils.ts
View File

@@ -52,16 +52,20 @@ export const getStatusPriority = (status: IndJobStatusOptions): number => {
}
};
export const JOB_STATUSES = ['Planned', 'Acquisition', 'Staging', 'Inbound', 'Running', 'Done', 'Delivered', 'Outbound', 'Selling', 'Closed', 'Tracked'] as const;
// Use the actual type values from the enum
export const JOB_STATUSES: IndJobStatusOptions[] = [
'Planned', 'Acquisition', 'Staging', 'Inbound', 'Running', 'Done',
'Delivered', 'Outbound', 'Selling', 'Closed', 'Tracked'
];
export const getNextStatus = (currentStatus: string): string | null => {
const currentIndex = JOB_STATUSES.indexOf(currentStatus as any);
export const getNextStatus = (currentStatus: string): IndJobStatusOptions | null => {
const currentIndex = JOB_STATUSES.indexOf(currentStatus as IndJobStatusOptions);
if (currentIndex === -1 || currentIndex === JOB_STATUSES.length - 1) return null;
return JOB_STATUSES[currentIndex + 1];
};
export const getPreviousStatus = (currentStatus: string): string | null => {
const currentIndex = JOB_STATUSES.indexOf(currentStatus as any);
export const getPreviousStatus = (currentStatus: string): IndJobStatusOptions | null => {
const currentIndex = JOB_STATUSES.indexOf(currentStatus as IndJobStatusOptions);
if (currentIndex <= 0) return null;
return JOB_STATUSES[currentIndex - 1];
};