btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

feat: persist line wrap setting (#3647)

Browse Source 
Co-authored-by: jamesgeorge007 <jamesgeorge998001@gmail.com>
This commit is contained in:
Muhammed Ajmal M
2024-02-09 14:05:09 +05:30
committed by GitHub
parent 6a0e73fdec
commit 47226be6d0
21 changed files with 273 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/hoppscotch-common/src/components/cookies/EditCookie.vue
View File

@@ -22,9 +22,9 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'cookie')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip', allowHTML: true }"
@@ -102,6 +102,8 @@ import {
useCopyResponse,
useDownloadResponse,
} from "~/composables/lens-actions"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
// TODO: Build Managed Mode!
@@ -122,7 +124,7 @@ const toast = useToast()
const cookieEditor = ref<HTMLElement>()
const rawCookieString = ref("")
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "cookie")
useCodemirror(
cookieEditor,
@@ -131,7 +133,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "text/plain",
placeholder: `${t("cookies.modal.enter_cookie_string")}`,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,

10
packages/hoppscotch-common/src/components/graphql/Headers.vue
View File

@@ -27,9 +27,9 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'graphqlHeaders')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
@@ -315,6 +315,8 @@ import { commonHeaders } from "~/helpers/headers"
import { useCodemirror } from "@composables/codemirror"
import { objRemoveKey } from "~/helpers/functional/object"
import { useVModel } from "@vueuse/core"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
import { HoppGQLHeader } from "~/helpers/graphql"
import { throwError } from "~/helpers/functional/error"
import { HoppInheritedProperty } from "~/helpers/types/HoppInheritedProperties"
@@ -338,7 +340,7 @@ const request = useVModel(props, "modelValue", emit)
const idTicker = ref(0)
const linewrapEnabled = ref(false)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "graphqlHeaders")
const bulkMode = ref(false)
const bulkHeaders = ref("")
@@ -353,7 +355,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "text/x-yaml",
placeholder: `${t("state.bulk_mode_placeholder")}`,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,

10
packages/hoppscotch-common/src/components/graphql/Query.vue
View File

@@ -61,9 +61,9 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'graphqlQuery')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
@@ -112,6 +112,8 @@ import {
socketDisconnect,
subscriptionState,
} from "~/helpers/graphql/connection"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
// Template refs
const queryEditor = ref<any | null>(null)
@@ -137,7 +139,7 @@ const prettifyQueryIcon = refAutoReset<
typeof IconWand | typeof IconCheck | typeof IconInfo
>(IconWand, 1000)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "graphqlQuery")
const selectedOperation = ref<gql.OperationDefinitionNode | null>(null)
@@ -184,7 +186,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "graphql",
placeholder: `${t("request.query")}`,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: createGQLQueryLinter(schema),
completer: queryCompleter(schema),

12
packages/hoppscotch-common/src/components/graphql/Response.vue
View File

@@ -16,9 +16,11 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="
toggleNestedSetting('WRAP_LINES', 'graphqlResponseBody')
"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip', allowHTML: true }"
@@ -99,6 +101,8 @@ import { useI18n } from "@composables/i18n"
import { defineActionHandler } from "~/helpers/actions"
import { getPlatformSpecialKey as getSpecialKey } from "~/helpers/platformutils"
import { GQLResponseEvent } from "~/helpers/graphql/connection"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
import interfaceLanguages from "~/helpers/utils/interfaceLanguages"
import {
useCopyInterface,
@@ -133,8 +137,8 @@ const responseString = computed(() => {
})
const schemaEditor = ref<any | null>(null)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "graphqlResponseBody")
const copyInterfaceTippyActions = ref<any | null>(null)
const linewrapEnabled = ref(true)
useCodemirror(
schemaEditor,
@@ -143,7 +147,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "application/ld+json",
readOnly: true,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,

10
packages/hoppscotch-common/src/components/graphql/Sidebar.vue
View File

@@ -127,9 +127,9 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'graphqlSchema')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
@@ -202,6 +202,8 @@ import {
subscriptionFields,
} from "~/helpers/graphql/connection"
import { platform } from "~/platform"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
type NavigationTabs = "history" | "collection" | "docs" | "schema"
type GqlTabs = "queries" | "mutations" | "subscriptions" | "types"
@@ -349,7 +351,7 @@ const handleJumpToType = async (type: GraphQLType) => {
}
const schemaEditor = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "graphqlSchema")
useCodemirror(
schemaEditor,
@@ -358,7 +360,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "graphql",
readOnly: true,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,

10
packages/hoppscotch-common/src/components/graphql/Variable.vue
View File

@@ -49,9 +49,9 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'graphqlVariables')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
@@ -93,6 +93,8 @@ import {
socketDisconnect,
subscriptionState,
} from "~/helpers/graphql/connection"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
const t = useI18n()
const toast = useToast()
@@ -114,7 +116,7 @@ const variableString = useVModel(props, "modelValue", emit)
const variableEditor = ref<any | null>(null)
const linewrapEnabled = ref(false)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "graphqlVariables")
const copyVariablesIcon = refAutoReset<typeof IconCopy | typeof IconCheck>(
IconCopy,
@@ -131,7 +133,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "application/ld+json",
placeholder: `${t("request.variables")}`,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: computed(() =>
variableString.value.length > 0 ? jsonLinter : null

10
packages/hoppscotch-common/src/components/http/CodegenModal.vue
View File

@@ -86,9 +86,9 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'codeGen')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip', allowHTML: true }"
@@ -161,6 +161,8 @@ import cloneDeep from "lodash-es/cloneDeep"
import { platform } from "~/platform"
import { RESTTabService } from "~/services/tab/rest"
import { useService } from "dioc/vue"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
const t = useI18n()
@@ -224,7 +226,7 @@ const requestCode = computed(() => {
// Template refs
const tippyActions = ref<any | null>(null)
const generatedCode = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "codeGen")
useCodemirror(
generatedCode,
@@ -233,7 +235,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "text/plain",
readOnly: true,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,

11
packages/hoppscotch-common/src/components/http/Headers.vue
View File

@@ -29,9 +29,9 @@
v-if="bulkMode"
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'httpHeaders')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
@@ -332,6 +332,9 @@ import { useVModel } from "@vueuse/core"
import { useService } from "dioc/vue"
import { InspectionService, InspectorResult } from "~/services/inspection"
import { RESTTabService } from "~/services/tab/rest"
import { toggleSetting } from "~/newstore/settings"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
import { HoppInheritedProperty } from "~/helpers/types/HoppInheritedProperties"
const t = useI18n()
@@ -346,7 +349,7 @@ const idTicker = ref(0)
const bulkMode = ref(false)
const bulkHeaders = ref("")
const bulkEditor = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "httpHeaders")
const deletionToast = ref<{ goAway: (delay: number) => void } | null>(null)
@@ -371,7 +374,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "text/x-yaml",
placeholder: `${t("state.bulk_mode_placeholder")}`,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter,
completer: null,

10
packages/hoppscotch-common/src/components/http/ImportCurl.vue
View File

@@ -22,9 +22,9 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'importCurl')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip', allowHTML: true }"
@@ -96,6 +96,8 @@ import IconTrash2 from "~icons/lucide/trash-2"
import { platform } from "~/platform"
import { RESTTabService } from "~/services/tab/rest"
import { useService } from "dioc/vue"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
const t = useI18n()
@@ -106,7 +108,7 @@ const tabs = useService(RESTTabService)
const curl = ref("")
const curlEditor = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "importCurl")
const props = defineProps<{ show: boolean; text: string }>()
@@ -117,7 +119,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "application/x-sh",
placeholder: `${t("request.enter_curl")}`,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,

10
packages/hoppscotch-common/src/components/http/Parameters.vue
View File

@@ -24,9 +24,9 @@
v-if="bulkMode"
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'httpParams')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
@@ -205,6 +205,8 @@ import { useVModel } from "@vueuse/core"
import { useService } from "dioc/vue"
import { InspectionService, InspectorResult } from "~/services/inspection"
import { RESTTabService } from "~/services/tab/rest"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
const colorMode = useColorMode()
@@ -217,7 +219,7 @@ const idTicker = ref(0)
const bulkMode = ref(false)
const bulkParams = ref("")
const bulkEditor = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "httpParams")
const deletionToast = ref<{ goAway: (delay: number) => void } | null>(null)
@@ -228,7 +230,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "text/x-yaml",
placeholder: `${t("state.bulk_mode_placeholder")}`,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter,
completer: null,

10
packages/hoppscotch-common/src/components/http/PreRequestScript.vue
View File

@@ -23,9 +23,9 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'httpPreRequest')"
/>
</div>
</div>
@@ -72,6 +72,8 @@ import linter from "~/helpers/editor/linting/preRequest"
import completer from "~/helpers/editor/completion/preRequest"
import { useI18n } from "@composables/i18n"
import { useVModel } from "@vueuse/core"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
const t = useI18n()
@@ -85,7 +87,7 @@ const emit = defineEmits<{
const preRequestScript = useVModel(props, "modelValue", emit)
const preRequestEditor = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "httpPreRequest")
useCodemirror(
preRequestEditor,
@@ -93,7 +95,7 @@ useCodemirror(
reactive({
extendedEditorConfig: {
mode: "application/javascript",
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
placeholder: `${t("preRequest.javascript_code")}`,
},
linter,

10
packages/hoppscotch-common/src/components/http/RawBody.vue
View File

@@ -23,9 +23,9 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'httpRequestBody')"
/>
<HoppButtonSecondary
v-if="
@@ -85,6 +85,8 @@ import { isJSONContentType } from "~/helpers/utils/contenttypes"
import jsonLinter from "~/helpers/editor/linting/json"
import { readFileAsText } from "~/helpers/functional/files"
import xmlFormat from "xml-formatter"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
type PossibleContentTypes = Exclude<
ValidContentTypes,
@@ -122,7 +124,7 @@ const langLinter = computed(() =>
isJSONContentType(body.value.contentType) ? jsonLinter : null
)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "httpRequestBody")
const rawBodyParameters = ref<any | null>(null)
const codemirrorValue: Ref<string | undefined> =
@@ -148,7 +150,7 @@ useCodemirror(
codemirrorValue,
reactive({
extendedEditorConfig: {
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
mode: rawInputEditorLang,
placeholder: t("request.raw_body").toString(),
},

10
packages/hoppscotch-common/src/components/http/Tests.vue
View File

@@ -23,9 +23,9 @@
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'httpTest')"
/>
</div>
</div>
@@ -72,6 +72,8 @@ import linter from "~/helpers/editor/linting/testScript"
import completer from "~/helpers/editor/completion/testScript"
import { useI18n } from "@composables/i18n"
import { useVModel } from "@vueuse/core"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
const t = useI18n()
@@ -81,7 +83,7 @@ const props = defineProps<{
const emit = defineEmits(["update:modelValue"])
const testScript = useVModel(props, "modelValue", emit)
const testScriptEditor = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "httpTest")
useCodemirror(
testScriptEditor,
@@ -89,7 +91,7 @@ useCodemirror(
reactive({
extendedEditorConfig: {
mode: "application/javascript",
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
placeholder: `${t("test.javascript_code")}`,
},
linter,

10
packages/hoppscotch-common/src/components/http/URLEncodedParams.vue
View File

@@ -24,9 +24,9 @@
v-if="bulkMode"
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'httpUrlEncoded')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
@@ -196,6 +196,8 @@ import { useColorMode } from "@composables/theming"
import { objRemoveKey } from "~/helpers/functional/object"
import { throwError } from "~/helpers/functional/error"
import { useVModel } from "@vueuse/core"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
type Body = HoppRESTReqBody & {
contentType: "application/x-www-form-urlencoded"
@@ -220,7 +222,7 @@ const idTicker = ref(0)
const bulkMode = ref(false)
const bulkUrlEncodedParams = ref("")
const bulkEditor = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "httpUrlEncoded")
const deletionToast = ref<{ goAway: (delay: number) => void } | null>(null)
@@ -231,7 +233,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "text/x-yaml",
placeholder: `${t("state.bulk_mode_placeholder")}`,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter,
completer: null,

10
packages/hoppscotch-common/src/components/lenses/renderers/HTMLLensRenderer.vue
View File

@@ -11,9 +11,9 @@
v-if="response.body"
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'httpResponseBody')"
/>
<HoppButtonSecondary
v-if="response.body"
@@ -76,6 +76,8 @@ import { useI18n } from "@composables/i18n"
import type { HoppRESTResponse } from "~/helpers/types/HoppRESTResponse"
import { defineActionHandler } from "~/helpers/actions"
import { getPlatformSpecialKey as getSpecialKey } from "~/helpers/platformutils"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
const t = useI18n()
@@ -84,7 +86,7 @@ const props = defineProps<{
}>()
const htmlResponse = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "httpResponseBody")
const { responseBodyText } = useResponseBody(props.response)
const { downloadIcon, downloadResponse } = useDownloadResponse(
@@ -104,7 +106,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "htmlmixed",
readOnly: true,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,

10
packages/hoppscotch-common/src/components/lenses/renderers/JSONLensRenderer.vue
View File

@@ -14,9 +14,9 @@
v-if="response.body"
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'httpResponseBody')"
/>
<HoppButtonSecondary
v-if="response.body"
@@ -260,6 +260,8 @@ import {
} from "@composables/lens-actions"
import { defineActionHandler } from "~/helpers/actions"
import { getPlatformSpecialKey as getSpecialKey } from "~/helpers/platformutils"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
import interfaceLanguages from "~/helpers/utils/interfaceLanguages"
const t = useI18n()
@@ -371,8 +373,8 @@ const { downloadIcon, downloadResponse } = useDownloadResponse(
// Template refs
const tippyActions = ref<any | null>(null)
const jsonResponse = ref<any | null>(null)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "httpResponseBody")
const copyInterfaceTippyActions = ref<any | null>(null)
const linewrapEnabled = ref(true)
const { cursor } = useCodemirror(
jsonResponse,
@@ -381,7 +383,7 @@ const { cursor } = useCodemirror(
extendedEditorConfig: {
mode: "application/ld+json",
readOnly: true,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,

10
packages/hoppscotch-common/src/components/lenses/renderers/RawLensRenderer.vue
View File

@@ -11,9 +11,9 @@
v-if="response.body"
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'httpResponseBody')"
/>
<HoppButtonSecondary
v-if="response.body"
@@ -58,6 +58,8 @@ import {
import { objFieldMatches } from "~/helpers/functional/object"
import { defineActionHandler } from "~/helpers/actions"
import { getPlatformSpecialKey as getSpecialKey } from "~/helpers/platformutils"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
const t = useI18n()
@@ -97,7 +99,7 @@ const { downloadIcon, downloadResponse } = useDownloadResponse(
const { copyIcon, copyResponse } = useCopyResponse(responseBodyText)
const rawResponse = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "httpResponseBody")
useCodemirror(
rawResponse,
@@ -106,7 +108,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "text/plain",
readOnly: true,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,

10
packages/hoppscotch-common/src/components/lenses/renderers/XMLLensRenderer.vue
View File

@@ -11,9 +11,9 @@
v-if="response.body"
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': linewrapEnabled }"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="linewrapEnabled = !linewrapEnabled"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'httpResponseBody')"
/>
<HoppButtonSecondary
v-if="response.body"
@@ -58,6 +58,8 @@ import {
import { defineActionHandler } from "~/helpers/actions"
import { getPlatformSpecialKey as getSpecialKey } from "~/helpers/platformutils"
import { objFieldMatches } from "~/helpers/functional/object"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
const t = useI18n()
@@ -91,7 +93,7 @@ const { downloadIcon, downloadResponse } = useDownloadResponse(
const { copyIcon, copyResponse } = useCopyResponse(responseBodyText)
const xmlResponse = ref<any | null>(null)
const linewrapEnabled = ref(true)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "httpResponseBody")
useCodemirror(
xmlResponse,
@@ -100,7 +102,7 @@ useCodemirror(
extendedEditorConfig: {
mode: "application/xml",
readOnly: true,
lineWrapping: linewrapEnabled,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,