Multipart form UI and fixes

This commit is contained in:
Gregory Schier
2023-11-14 00:32:02 -08:00
parent a4f5e4a6b8
commit f60cb35b5e
7 changed files with 113 additions and 45 deletions

View File

@@ -1,6 +1,6 @@
import { useCallback, useMemo } from 'react';
import type { HttpRequest } from '../lib/models';
import type { PairEditorProps } from './core/PairEditor';
import type { Pair, PairEditorProps } from './core/PairEditor';
import { PairEditor } from './core/PairEditor';
type Props = {
@@ -10,18 +10,19 @@ type Props = {
};
export function FormUrlencodedEditor({ body, forceUpdateKey, onChange }: Props) {
const pairs = useMemo(
const pairs = useMemo<Pair[]>(
() =>
(Array.isArray(body.form) ? body.form : []).map((p) => ({
enabled: p.enabled,
name: p.name,
value: p.value,
enabled: !!p.enabled,
name: p.name || '',
value: p.value || '',
})),
[body.form],
);
const handleChange = useCallback<PairEditorProps['onChange']>(
(pairs) => onChange({ form: pairs }),
(pairs) =>
onChange({ form: pairs.map((p) => ({ enabled: p.enabled, name: p.name, value: p.value })) }),
[onChange],
);