Merge pull request #5 from abhi1693/jarvis/ux-audit-departments
Departments UX: loading + safer head updates
This commit is contained in:
@@ -62,6 +62,8 @@ export default function DepartmentsPage() {
|
|||||||
<CardDescription>Optional head</CardDescription>
|
<CardDescription>Optional head</CardDescription>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent className="space-y-3">
|
<CardContent className="space-y-3">
|
||||||
|
{employees.isLoading ? <div className="text-sm text-muted-foreground">Loading employees…</div> : null}
|
||||||
|
{employees.error ? <div className="text-sm text-destructive">{(employees.error as Error).message}</div> : null}
|
||||||
<Input placeholder="Department name" value={name} onChange={(e) => setName(e.target.value)} />
|
<Input placeholder="Department name" value={name} onChange={(e) => setName(e.target.value)} />
|
||||||
<Select value={headId} onChange={(e) => setHeadId(e.target.value)}>
|
<Select value={headId} onChange={(e) => setHeadId(e.target.value)}>
|
||||||
<option value="">(no head)</option>
|
<option value="">(no head)</option>
|
||||||
@@ -80,7 +82,7 @@ export default function DepartmentsPage() {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
disabled={!name.trim() || createDepartment.isPending}
|
disabled={!name.trim() || createDepartment.isPending || employees.isFetching}
|
||||||
>
|
>
|
||||||
Create
|
Create
|
||||||
</Button>
|
</Button>
|
||||||
@@ -111,13 +113,9 @@ export default function DepartmentsPage() {
|
|||||||
<div className="mt-3 flex items-center gap-2">
|
<div className="mt-3 flex items-center gap-2">
|
||||||
<span className="text-xs text-muted-foreground">Head:</span>
|
<span className="text-xs text-muted-foreground">Head:</span>
|
||||||
<Select
|
<Select
|
||||||
|
disabled={d.id == null}
|
||||||
value={d.head_employee_id ? String(d.head_employee_id) : ""}
|
value={d.head_employee_id ? String(d.head_employee_id) : ""}
|
||||||
onChange={(e) =>
|
onBlur={(e) => { if (d.id == null) return; updateDepartment.mutate({ departmentId: Number(d.id), data: { head_employee_id: e.target.value ? Number(e.target.value) : null } }); }}
|
||||||
updateDepartment.mutate({
|
|
||||||
departmentId: Number(d.id),
|
|
||||||
data: { head_employee_id: e.target.value ? Number(e.target.value) : null },
|
|
||||||
})
|
|
||||||
}
|
|
||||||
>
|
>
|
||||||
<option value="">(none)</option>
|
<option value="">(none)</option>
|
||||||
{sortedEmployees.map((e) => (
|
{sortedEmployees.map((e) => (
|
||||||
|
|||||||
Reference in New Issue
Block a user