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

Minor refactoring and code splitting

Browse Source
This commit is contained in:
Liyas Thomas
2020-12-01 05:09:16 +05:30
parent 6098d55b57
commit a8fd0fcd19
3 changed files with 47 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/layout/history.vue
View File

@@ -306,7 +306,7 @@ ol {
</style> </style>
<script> <script>
import { findStatusGroup } from "~/pages/index" import findStatusGroup from "~/helpers/findStatusGroup"
import { fb } from "~/helpers/fb" import { fb } from "~/helpers/fb"
import closeIcon from "~/static/icons/close-24px.svg?inline" import closeIcon from "~/static/icons/close-24px.svg?inline"
import deleteIcon from "~/static/icons/delete-24px.svg?inline" import deleteIcon from "~/static/icons/delete-24px.svg?inline"

36
helpers/findStatusGroup.js Normal file
View File

@@ -0,0 +1,36 @@
const statusCategories = () => [
{
name: "informational",
statusCodeRegex: new RegExp(/[1][0-9]+/),
className: "info-response",
},
{
name: "successful",
statusCodeRegex: new RegExp(/[2][0-9]+/),
className: "success-response",
},
{
name: "redirection",
statusCodeRegex: new RegExp(/[3][0-9]+/),
className: "redir-response",
},
{
name: "client error",
statusCodeRegex: new RegExp(/[4][0-9]+/),
className: "cl-error-response",
},
{
name: "server error",
statusCodeRegex: new RegExp(/[5][0-9]+/),
className: "sv-error-response",
},
{
// this object is a catch-all for when no other objects match and should always be last
name: "unknown",
statusCodeRegex: new RegExp(/.*/),
className: "missing-data-response",
},
]
export default findStatusGroup = (responseStatus) =>
statusCategories.find(({ statusCodeRegex }) => statusCodeRegex.test(responseStatus))

167
pages/index.vue
View File

@@ -16,124 +16,19 @@
autofocus autofocus
/> />
<template slot="popover"> <template slot="popover">
<div> <div
v-for="(methodMenuItem, index) in methodMenuItems"
:key="`method-${index}`"
>
<button <button
class="icon" class="icon"
@click=" @click="
customMethod = false customMethod = methodMenuItem == 'CUSTOM' ? true : false
method = 'GET' method = methodMenuItem
" "
v-close-popover v-close-popover
> >
GET {{ methodMenuItem }}
</button>
</div>
<div>
<button
class="icon"
@click="
customMethod = false
method = 'HEAD'
"
v-close-popover
>
HEAD
</button>
</div>
<div>
<button
class="icon"
@click="
customMethod = false
method = 'POST'
"
v-close-popover
>
POST
</button>
</div>
<div>
<button
class="icon"
@click="
customMethod = false
method = 'PUT'
"
v-close-popover
>
PUT
</button>
</div>
<div>
<button
class="icon"
@click="
customMethod = false
method = 'DELETE'
"
v-close-popover
>
DELETE
</button>
</div>
<div>
<button
class="icon"
@click="
customMethod = false
method = 'CONNECT'
"
v-close-popover
>
CONNECT
</button>
</div>
<div>
<button
class="icon"
@click="
customMethod = false
method = 'OPTIONS'
"
v-close-popover
>
OPTIONS
</button>
</div>
<div>
<button
class="icon"
@click="
customMethod = false
method = 'TRACE'
"
v-close-popover
>
TRACE
</button>
</div>
<div>
<button
class="icon"
@click="
customMethod = false
method = 'PATCH'
"
v-close-popover
>
PATCH
</button>
</div>
<div>
<button
class="icon"
@click="
customMethod = true
method = 'CUSTOM'
"
v-close-popover
>
CUSTOM
</button> </button>
</div> </div>
</template> </template>
@@ -177,15 +72,11 @@
</button> </button>
</li> </li>
</ul> </ul>
<div class="blue"> <div>
<label for="name">{{ $t("token_req_name") }}</label> <label for="name">{{ $t("token_req_name") }}</label>
<input id="name" name="name" type="text" v-model="name" /> <input id="name" name="name" type="text" v-model="name" />
</div> </div>
<div <div label="Request Body" v-if="['POST', 'PUT', 'PATCH', 'DELETE'].includes(method)">
class="blue"
label="Request Body"
v-if="['POST', 'PUT', 'PATCH', 'DELETE'].includes(method)"
>
<ul> <ul>
<li> <li>
<label for="contentType">{{ $t("content_type") }}</label> <label for="contentType">{{ $t("content_type") }}</label>
@@ -1080,7 +971,6 @@
</li> </li>
</ul> </ul>
</div> </div>
<div slot="footer"></div>
</modal> </modal>
<modal v-if="showTokenList" @close="showTokenList = false"> <modal v-if="showTokenList" @close="showTokenList = false">
@@ -1156,7 +1046,6 @@
{{ $t("empty") }} {{ $t("empty") }}
</p> </p>
</div> </div>
<div slot="footer"></div>
</modal> </modal>
<modal v-if="showTokenRequestList" @close="showTokenRequestList = false"> <modal v-if="showTokenRequestList" @close="showTokenRequestList = false">
@@ -1266,42 +1155,7 @@ import { knownContentTypes, isJSONContentType } from "~/helpers/utils/contenttyp
import closeIcon from "~/static/icons/close-24px.svg?inline" import closeIcon from "~/static/icons/close-24px.svg?inline"
import deleteIcon from "~/static/icons/delete-24px.svg?inline" import deleteIcon from "~/static/icons/delete-24px.svg?inline"
import { codegens, generateCodeWithGenerator } from "~/helpers/codegen/codegen" import { codegens, generateCodeWithGenerator } from "~/helpers/codegen/codegen"
import findStatusGroup from "~/helpers/findStatusGroup"
const statusCategories = [
{
name: "informational",
statusCodeRegex: new RegExp(/[1][0-9]+/),
className: "info-response",
},
{
name: "successful",
statusCodeRegex: new RegExp(/[2][0-9]+/),
className: "success-response",
},
{
name: "redirection",
statusCodeRegex: new RegExp(/[3][0-9]+/),
className: "redir-response",
},
{
name: "client error",
statusCodeRegex: new RegExp(/[4][0-9]+/),
className: "cl-error-response",
},
{
name: "server error",
statusCodeRegex: new RegExp(/[5][0-9]+/),
className: "sv-error-response",
},
{
// this object is a catch-all for when no other objects match and should always be last
name: "unknown",
statusCodeRegex: new RegExp(/.*/),
className: "missing-data-response",
},
]
export const findStatusGroup = (responseStatus) =>
statusCategories.find(({ statusCodeRegex }) => statusCodeRegex.test(responseStatus))
export default { export default {
components: { components: {
@@ -1388,7 +1242,6 @@ export default {
contentType(contentType, oldContentType) { contentType(contentType, oldContentType) {
const getDefaultParams = (contentType) => { const getDefaultParams = (contentType) => {
if (isJSONContentType(contentType)) return "{}" if (isJSONContentType(contentType)) return "{}"
switch (contentType) { switch (contentType) {
case "application/xml": case "application/xml":
return "<?xml version='1.0' encoding='utf-8'?>" return "<?xml version='1.0' encoding='utf-8'?>"