diff --git a/client/src/components/MonteurField.tsx b/client/src/components/MonteurField.tsx new file mode 100644 index 0000000..0dbfd2b --- /dev/null +++ b/client/src/components/MonteurField.tsx @@ -0,0 +1,42 @@ +import { useState } from 'react'; + +export const MONTEURE = ['Michael', 'Daniel', 'Dietmar', 'Fidelis']; + +interface Props { + value: string; + onChange: (v: string) => void; + onCommit?: (v: string) => void; +} + +export default function MonteurField({ value, onChange, onCommit }: Props) { + const [customMode, setCustomMode] = useState(() => value !== '' && !MONTEURE.includes(value)); + + function handleSelect(v: string) { + if (v === '__custom__') { + setCustomMode(true); + return; + } + setCustomMode(false); + onChange(v); + onCommit?.(v); + } + + return ( + + ); +} diff --git a/client/src/pages/Dashboard.tsx b/client/src/pages/Dashboard.tsx index 7d5756e..e1c7c89 100644 --- a/client/src/pages/Dashboard.tsx +++ b/client/src/pages/Dashboard.tsx @@ -2,6 +2,7 @@ import { useEffect, useMemo, useState } from 'react'; import { useNavigate } from 'react-router-dom'; import { api } from '../lib/api'; import type { Projekt, ProjektStatus } from '../lib/types'; +import MonteurField from '../components/MonteurField'; function dd(s: string | null) { if (!s) return '–'; @@ -101,9 +102,7 @@ export default function Dashboard() { - + setForm({ ...form, monteur: v })} />