Allowing switching between body types without losing state in REST UI.

This commit is contained in:
mike12345567 2021-12-21 12:25:37 +00:00
parent 4b2ce2a280
commit 0841e2b50d
1 changed files with 22 additions and 10 deletions

View File

@ -16,17 +16,33 @@
export let query export let query
export let bodyType export let bodyType
let text = ""
let json = ""
$: checkRequestBody(bodyType) $: checkRequestBody(bodyType)
$: updateRequestBody(bodyType, text, json)
function checkRequestBody(type) { function checkRequestBody(type) {
if (!bodyType || !query) { if (!bodyType || !query) {
return return
} }
const currentType = typeof query?.fields.requestBody const currentType = typeof query?.fields.requestBody
if (objectTypes.includes(type) && currentType !== "object") { const isObject = objectTypes.includes(type)
query.fields.requestBody = {} const isText = textTypes.includes(type)
} else if (textTypes.includes(type) && currentType !== "string") { if (isText && currentType === "string") {
query.fields.requestBody = "" text = query.fields.requestBody
} else if (isObject && currentType === "object") {
json = query.fields.requestBody
}
}
function updateRequestBody(type, text, json) {
if (type === RawRestBodyTypes.NONE) {
query.fields.requestBody = null
} else if (objectTypes.includes(type)) {
query.fields.requestBody = json
} else {
query.fields.requestBody = text
} }
} }
@ -49,16 +65,12 @@
<Body size="S" weight="800">THE REQUEST DOES NOT HAVE A BODY</Body> <Body size="S" weight="800">THE REQUEST DOES NOT HAVE A BODY</Body>
</div> </div>
{:else if objectTypes.includes(bodyType)} {:else if objectTypes.includes(bodyType)}
<KeyValueBuilder <KeyValueBuilder bind:object={json} name="param" headings />
bind:object={query.fields.requestBody}
name="param"
headings
/>
{:else if textTypes.includes(bodyType)} {:else if textTypes.includes(bodyType)}
<CodeMirrorEditor <CodeMirrorEditor
height={200} height={200}
mode={editorMode(bodyType)} mode={editorMode(bodyType)}
value={query.fields.requestBody} value={text}
resize="vertical" resize="vertical"
on:change={e => (query.fields.requestBody = e.detail)} on:change={e => (query.fields.requestBody = e.detail)}
/> />