Moved text based content lenses to use the mixin

This commit is contained in:
Andrew Bastin
2020-06-26 14:57:55 -04:00
parent d8b5fc5d3f
commit 28ddce1bc4
4 changed files with 12 additions and 15 deletions

View File

@@ -75,11 +75,13 @@
</template> </template>
<script> <script>
import AceEditor from "../../ui/ace-editor" import AceEditor from "../../ui/ace-editor"
import TextContentRendererMixin from "./mixins/TextContentRendererMixin"
export default { export default {
components: { components: {
Editor: AceEditor, Editor: AceEditor,
}, },
mixins: [TextContentRendererMixin],
props: { props: {
response: {}, response: {},
}, },
@@ -94,9 +96,6 @@ export default {
} }
}, },
computed: { computed: {
responseBodyText() {
return new TextDecoder("utf-8").decode(this.response.body)
},
responseType() { responseType() {
return (this.response.headers["content-type"] || "").split(";")[0].toLowerCase() return (this.response.headers["content-type"] || "").split(";")[0].toLowerCase()
}, },

View File

@@ -39,7 +39,7 @@
</div> </div>
<div id="response-details-wrapper"> <div id="response-details-wrapper">
<Editor <Editor
:value="responseBodyText" :value="jsonBodyText"
:lang="'json'" :lang="'json'"
:options="{ :options="{
maxLines: responseBodyMaxLines, maxLines: responseBodyMaxLines,
@@ -58,11 +58,13 @@
<script> <script>
import AceEditor from "../../ui/ace-editor" import AceEditor from "../../ui/ace-editor"
import { isJSONContentType } from "~/helpers/utils/contenttypes" import { isJSONContentType } from "~/helpers/utils/contenttypes"
import TextContentRendererMixin from "./mixins/TextContentRendererMixin"
export default { export default {
components: { components: {
Editor: AceEditor, Editor: AceEditor,
}, },
mixins: [TextContentRendererMixin],
props: { props: {
response: {}, response: {},
}, },
@@ -76,16 +78,12 @@ export default {
} }
}, },
computed: { computed: {
responseBodyText() { jsonBodyText() {
try { try {
return JSON.stringify( return JSON.stringify(JSON.parse(this.responseBodyText), null, 2)
JSON.parse(new TextDecoder("utf-8").decode(new Uint8Array(this.response.body))),
null,
2
)
} catch (e) { } catch (e) {
// Most probs invalid JSON was returned, so drop prettification (should we warn ?) // Most probs invalid JSON was returned, so drop prettification (should we warn ?)
return new TextDecoder("utf-8").decode(new Uint8Array(this.response.body)) return new this.responseBodyText()
} }
}, },
responseType() { responseType() {

View File

@@ -58,11 +58,13 @@
<script> <script>
import AceEditor from "../../ui/ace-editor" import AceEditor from "../../ui/ace-editor"
import { isJSONContentType } from "~/helpers/utils/contenttypes" import { isJSONContentType } from "~/helpers/utils/contenttypes"
import TextContentRendererMixin from "./mixins/TextContentRendererMixin"
export default { export default {
components: { components: {
Editor: AceEditor, Editor: AceEditor,
}, },
mixins: [TextContentRendererMixin],
props: { props: {
response: {}, response: {},
}, },
@@ -73,7 +75,6 @@ export default {
doneButton: '<i class="material-icons">done</i>', doneButton: '<i class="material-icons">done</i>',
downloadButton: '<i class="material-icons">save_alt</i>', downloadButton: '<i class="material-icons">save_alt</i>',
copyButton: '<i class="material-icons">content_copy</i>', copyButton: '<i class="material-icons">content_copy</i>',
responseBodyText: new TextDecoder("utf-8").decode(new Uint8Array(this.response.body)),
} }
}, },
computed: { computed: {

View File

@@ -57,11 +57,13 @@
</template> </template>
<script> <script>
import AceEditor from "../../ui/ace-editor" import AceEditor from "../../ui/ace-editor"
import TextContentRendererMixin from "./mixins/TextContentRendererMixin"
export default { export default {
components: { components: {
Editor: AceEditor, Editor: AceEditor,
}, },
mixins: [TextContentRendererMixin],
props: { props: {
response: {}, response: {},
}, },
@@ -75,9 +77,6 @@ export default {
} }
}, },
computed: { computed: {
responseBodyText() {
return new TextDecoder("utf-8").decode(this.response.body)
},
responseType() { responseType() {
return (this.response.headers["content-type"] || "").split(";")[0].toLowerCase() return (this.response.headers["content-type"] || "").split(";")[0].toLowerCase()
}, },