Function HttpMessageEdit

web/src/js/components/contentviews/HttpMessage.tsx:50–92

({ flow, message, stopEdit }: HttpMessageEditProps)

};

function HttpMessageEdit({ flow, message, stopEdit }: HttpMessageEditProps) {
    const dispatch = useAppDispatch();

    const part = flow.request === message ? "request" : "response";
    const url = MessageUtils.getContentURL(flow, message);
    const content = useContent(url, message.contentHash);
    const [editedContent, setEditedContent] = useState<string>();

    const save = async () => {
        await dispatch(
            flowActions.update(flow, {
                [part]: { content: editedContent ?? content ?? "" },
            }),
        );
        stopEdit();
    };
    return (
        <div className="contentview" key="edit">
            <div className="controls">
                <h5>[Editing]</h5>
                <Button
                    onClick={save}
                    icon="fa-check text-success"
                    className="btn-xs"
                >
                    Done
                </Button>
                &nbsp;
                <Button
                    onClick={() => stopEdit()}
                    icon="fa-times text-danger"
                    className="btn-xs"
                >
                    Cancel
                </Button>
            </div>
            <CodeEditor
                initialContent={content || ""}
                onChange={setEditedContent}
            />
        </div>
    );
}

type HttpMessageViewProps = {
    flow: HTTPFlow;