fix(frontend/services): store modal values in local state

closes #503
This commit is contained in:
Viren070
2025-11-22 23:36:15 +00:00
parent dbe86edc92
commit abd802cc74
@@ -456,7 +456,6 @@ function Content() {
onOpenChange={setModalOpen} onOpenChange={setModalOpen}
serviceId={modalService} serviceId={modalService}
values={modalValues} values={modalValues}
onChange={handleModalValuesChange}
onSubmit={handleModalSubmit} onSubmit={handleModalSubmit}
onClose={handleModalClose} onClose={handleModalClose}
/> />
@@ -529,7 +528,6 @@ function ServiceModal({
onOpenChange, onOpenChange,
serviceId, serviceId,
values, values,
onChange,
onSubmit, onSubmit,
onClose, onClose,
}: { }: {
@@ -537,23 +535,28 @@ function ServiceModal({
onOpenChange: (v: boolean) => void; onOpenChange: (v: boolean) => void;
serviceId: ServiceId | null; serviceId: ServiceId | null;
values: Record<string, any>; values: Record<string, any>;
onChange: (v: Record<string, any>) => void;
onSubmit: (v: Record<string, any>) => void; onSubmit: (v: Record<string, any>) => void;
onClose: () => void; onClose: () => void;
}) { }) {
const { status } = useStatus(); const { status } = useStatus();
const [localValues, setLocalValues] = useState<Record<string, any>>({});
useEffect(() => {
if (open) {
setLocalValues(values);
}
}, [open, values]);
if (!status) return null; if (!status) return null;
if (!serviceId) return null; if (!serviceId) return null;
const meta = status.settings.services[serviceId]!; const meta = status.settings.services[serviceId]!;
const credentials = meta.credentials || []; const credentials = meta.credentials || [];
const handleCredentialChange = (optId: string, newValue: any) => { const handleCredentialChange = (optId: string, newValue: any) => {
// Create a new object with all existing values plus the updated one setLocalValues((prev) => ({
const updatedValues = { ...prev,
...values,
[optId]: newValue, [optId]: newValue,
}; }));
onChange(updatedValues);
}; };
return ( return (
@@ -566,7 +569,7 @@ function ServiceModal({
className="space-y-4" className="space-y-4"
onSubmit={(e) => { onSubmit={(e) => {
e.preventDefault(); e.preventDefault();
onSubmit(values); onSubmit(localValues);
}} }}
> >
{credentials.map((opt) => ( {credentials.map((opt) => (
@@ -576,7 +579,7 @@ function ServiceModal({
...opt, ...opt,
required: false, // override required to false to allow unsetting required: false, // override required to false to allow unsetting
}} }}
value={opt.forced || opt.default || values[opt.id]} value={opt.forced || opt.default || localValues[opt.id]}
onChange={(v) => handleCredentialChange(opt.id, v || undefined)} onChange={(v) => handleCredentialChange(opt.id, v || undefined)}
/> />
))} ))}