GraphQL collections (#1536)
This commit is contained in:
Isha Gupta
GitHub
@@ -52,7 +52,10 @@ export default {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -63,6 +66,7 @@ export default {
|
||||
}
|
||||
this.$store.commit("postwoman/addNewCollection", {
|
||||
name: this.$data.name,
|
||||
flag: "rest",
|
||||
})
|
||||
this.$emit("hide-modal")
|
||||
this.syncCollections()
|
||||
|
||||
@@ -134,7 +134,10 @@ export default {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -144,6 +147,7 @@ export default {
|
||||
removeCollection() {
|
||||
this.$store.commit("postwoman/removeCollection", {
|
||||
collectionIndex: this.collectionIndex,
|
||||
flag: "rest",
|
||||
})
|
||||
this.$toast.error(this.$t("deleted"), {
|
||||
icon: "delete",
|
||||
@@ -156,6 +160,7 @@ export default {
|
||||
const oldFolderIndex = dataTransfer.getData("oldFolderIndex")
|
||||
const oldFolderName = dataTransfer.getData("oldFolderName")
|
||||
const requestIndex = dataTransfer.getData("requestIndex")
|
||||
const flag = "rest"
|
||||
this.$store.commit("postwoman/moveRequest", {
|
||||
oldCollectionIndex,
|
||||
newCollectionIndex: this.$props.collectionIndex,
|
||||
@@ -164,6 +169,7 @@ export default {
|
||||
oldFolderIndex,
|
||||
oldFolderName,
|
||||
requestIndex,
|
||||
flag,
|
||||
})
|
||||
this.syncCollections()
|
||||
},
|
||||
|
||||
@@ -54,7 +54,10 @@ export default {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -70,6 +73,7 @@ export default {
|
||||
this.$store.commit("postwoman/editCollection", {
|
||||
collection: collectionUpdated,
|
||||
collectionIndex: this.$props.editingCollectionIndex,
|
||||
flag: "rest",
|
||||
})
|
||||
this.$emit("hide-modal")
|
||||
this.syncCollections()
|
||||
|
||||
@@ -55,7 +55,10 @@ export default {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -65,6 +68,7 @@ export default {
|
||||
folder: { ...this.$props.folder, name: this.$data.name },
|
||||
folderIndex: this.$props.folderIndex,
|
||||
folderName: this.$props.folder.name,
|
||||
flag: "rest",
|
||||
})
|
||||
this.hideModal()
|
||||
this.syncCollections()
|
||||
|
||||
@@ -59,7 +59,10 @@ export default {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -75,6 +78,7 @@ export default {
|
||||
requestFolderIndex: this.$props.folderIndex,
|
||||
requestNew: requestUpdated,
|
||||
requestIndex: this.$props.requestIndex,
|
||||
flag: "rest",
|
||||
})
|
||||
|
||||
this.hideModal()
|
||||
|
||||
@@ -133,7 +133,10 @@ export default {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -145,6 +148,7 @@ export default {
|
||||
collectionIndex: this.$props.collectionIndex,
|
||||
folderName: this.$props.folder.name,
|
||||
folderIndex: this.$props.folderIndex,
|
||||
flag: "rest",
|
||||
})
|
||||
this.syncCollections()
|
||||
this.$toast.error(this.$t("deleted"), {
|
||||
@@ -157,6 +161,7 @@ export default {
|
||||
const oldFolderIndex = dataTransfer.getData("oldFolderIndex")
|
||||
const oldFolderName = dataTransfer.getData("oldFolderName")
|
||||
const requestIndex = dataTransfer.getData("requestIndex")
|
||||
const flag = "rest"
|
||||
|
||||
this.$store.commit("postwoman/moveRequest", {
|
||||
oldCollectionIndex,
|
||||
@@ -166,6 +171,7 @@ export default {
|
||||
oldFolderIndex,
|
||||
oldFolderName,
|
||||
requestIndex,
|
||||
flag,
|
||||
})
|
||||
this.syncCollections()
|
||||
},
|
||||
|
||||
@@ -172,7 +172,7 @@ export default {
|
||||
})
|
||||
.then(({ files }) => {
|
||||
let collections = JSON.parse(Object.values(files)[0].content)
|
||||
this.$store.commit("postwoman/replaceCollections", collections)
|
||||
this.$store.commit("postwoman/replaceCollections", { data: collections, flag: "rest" })
|
||||
this.fileImported()
|
||||
this.syncToFBCollections()
|
||||
})
|
||||
@@ -203,9 +203,10 @@ export default {
|
||||
} else if (collections.info && collections.info.schema.includes("v2.1.0")) {
|
||||
collections = [this.parsePostmanCollection(collections)]
|
||||
} else {
|
||||
return this.failedImport()
|
||||
this.failedImport()
|
||||
return
|
||||
}
|
||||
this.$store.commit("postwoman/replaceCollections", collections)
|
||||
this.$store.commit("postwoman/replaceCollections", { data: collections, flag: "rest" })
|
||||
this.fileImported()
|
||||
this.syncToFBCollections()
|
||||
}
|
||||
@@ -227,9 +228,10 @@ export default {
|
||||
collections = JSON.parse(content.replaceAll(/{{([a-z]+)}}/gi, "<<$1>>"))
|
||||
collections = [this.parsePostmanCollection(collections)]
|
||||
} else {
|
||||
return this.failedImport()
|
||||
this.failedImport()
|
||||
return
|
||||
}
|
||||
this.$store.commit("postwoman/importCollections", collections)
|
||||
this.$store.commit("postwoman/importCollections", { data: collections, flag: "rest" })
|
||||
this.fileImported()
|
||||
this.syncToFBCollections()
|
||||
}
|
||||
@@ -255,13 +257,19 @@ export default {
|
||||
})
|
||||
},
|
||||
syncCollections() {
|
||||
this.$store.commit("postwoman/replaceCollections", fb.currentCollections)
|
||||
this.$store.commit("postwoman/replaceCollections", {
|
||||
data: fb.currentCollections,
|
||||
flag: "rest",
|
||||
})
|
||||
this.fileImported()
|
||||
},
|
||||
syncToFBCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -88,7 +88,10 @@ export default {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -107,6 +110,7 @@ export default {
|
||||
collectionIndex: this.$props.collectionIndex,
|
||||
folderName: this.$props.folderName,
|
||||
requestIndex: this.$props.requestIndex,
|
||||
flag: "rest",
|
||||
})
|
||||
this.$toast.error(this.$t("deleted"), {
|
||||
icon: "delete",
|
||||
|
||||
@@ -146,7 +146,10 @@ export default {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -176,6 +179,7 @@ export default {
|
||||
collectionIndex: this.$data.requestData.collectionIndex,
|
||||
folderName: this.$data.requestData.folderName,
|
||||
requestIndex: this.$data.requestData.requestIndex,
|
||||
flag: "rest",
|
||||
})
|
||||
|
||||
this.hideModal()
|
||||
|
||||
80
components/collections/graphql/Add.vue
Normal file
80
components/collections/graphql/Add.vue
Normal file
@@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<SmartModal v-if="show" @close="hideModal">
|
||||
<div slot="header">
|
||||
<div class="row-wrapper">
|
||||
<h3 class="title">{{ $t("new_collection") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="body" class="flex flex-col">
|
||||
<label for="selectLabel">{{ $t("label") }}</label>
|
||||
<input
|
||||
type="text"
|
||||
id="selectLabel"
|
||||
v-model="name"
|
||||
:placeholder="$t('my_new_collection')"
|
||||
@keyup.enter="addNewCollection"
|
||||
/>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<div class="row-wrapper">
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
</button>
|
||||
<button class="icon primary" @click="addNewCollection">
|
||||
{{ $t("save") }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</SmartModal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
|
||||
export default {
|
||||
props: {
|
||||
show: Boolean,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
name: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
addNewCollection() {
|
||||
if (!this.$data.name) {
|
||||
this.$toast.info(this.$t("invalid_collection_name"))
|
||||
return
|
||||
}
|
||||
this.$store.commit("postwoman/addNewCollection", {
|
||||
name: this.$data.name,
|
||||
flag: "graphql",
|
||||
})
|
||||
this.$emit("hide-modal")
|
||||
this.syncCollections()
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal")
|
||||
this.$data.name = undefined
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
65
components/collections/graphql/AddFolder.vue
Normal file
65
components/collections/graphql/AddFolder.vue
Normal file
@@ -0,0 +1,65 @@
|
||||
<template>
|
||||
<SmartModal v-if="show" @close="show = false">
|
||||
<div slot="header">
|
||||
<div class="row-wrapper">
|
||||
<h3 class="title">{{ $t("new_folder") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="body" class="flex flex-col">
|
||||
<label for="selectLabel">{{ $t("label") }}</label>
|
||||
<input
|
||||
type="text"
|
||||
id="selectLabel"
|
||||
v-model="name"
|
||||
:placeholder="$t('my_new_folder')"
|
||||
@keyup.enter="addFolder"
|
||||
/>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<div class="row-wrapper">
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
</button>
|
||||
<button class="icon primary" @click="addFolder">
|
||||
{{ $t("save") }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</SmartModal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
show: Boolean,
|
||||
folder: Object,
|
||||
folderPath: String,
|
||||
collectionIndex: Number,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
name: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addFolder() {
|
||||
this.$emit("add-folder", {
|
||||
name: this.name,
|
||||
folder: this.folder,
|
||||
path: this.folderPath || `${this.collectionIndex}`,
|
||||
})
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal")
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
178
components/collections/graphql/Collection.vue
Normal file
178
components/collections/graphql/Collection.vue
Normal file
@@ -0,0 +1,178 @@
|
||||
<template>
|
||||
<div>
|
||||
<div
|
||||
:class="['row-wrapper transition duration-150 ease-in-out', { 'bg-bgDarkColor': dragging }]"
|
||||
@dragover.prevent
|
||||
@drop.prevent="dropEvent"
|
||||
@dragover="dragging = true"
|
||||
@drop="dragging = false"
|
||||
@dragleave="dragging = false"
|
||||
@dragend="dragging = false"
|
||||
>
|
||||
<button class="icon" @click="toggleShowChildren">
|
||||
<i class="material-icons" v-show="!showChildren && !isFiltered">arrow_right</i>
|
||||
<i class="material-icons" v-show="showChildren || isFiltered">arrow_drop_down</i>
|
||||
<i class="material-icons">folder</i>
|
||||
<span>{{ collection.name }}</span>
|
||||
</button>
|
||||
<div>
|
||||
<button
|
||||
v-if="doc"
|
||||
class="icon"
|
||||
@click="$emit('select-collection')"
|
||||
v-tooltip.left="$t('import')"
|
||||
>
|
||||
<i class="material-icons">topic</i>
|
||||
</button>
|
||||
<v-popover>
|
||||
<button class="tooltip-target icon" v-tooltip.left="$t('more')">
|
||||
<i class="material-icons">more_vert</i>
|
||||
</button>
|
||||
<template slot="popover">
|
||||
<div>
|
||||
<button
|
||||
class="icon"
|
||||
@click="$emit('add-folder', { folder: collection, path: `${collectionIndex}` })"
|
||||
v-close-popover
|
||||
>
|
||||
<i class="material-icons">create_new_folder</i>
|
||||
<span>{{ $t("new_folder") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="$emit('edit-collection')" v-close-popover>
|
||||
<i class="material-icons">create</i>
|
||||
<span>{{ $t("edit") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="confirmRemove = true" v-close-popover>
|
||||
<i class="material-icons">delete</i>
|
||||
<span>{{ $t("delete") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
</v-popover>
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="showChildren || isFiltered">
|
||||
<ul class="flex-col">
|
||||
<li
|
||||
v-for="(folder, index) in collection.folders"
|
||||
:key="folder.name"
|
||||
class="ml-8 border-l border-brdColor"
|
||||
>
|
||||
<CollectionsGraphqlFolder
|
||||
:folder="folder"
|
||||
:folder-index="index"
|
||||
:folder-path="`${collectionIndex}/${index}`"
|
||||
:collection-index="collectionIndex"
|
||||
:doc="doc"
|
||||
:isFiltered="isFiltered"
|
||||
@add-folder="$emit('add-folder', $event)"
|
||||
@edit-folder="$emit('edit-folder', $event)"
|
||||
@edit-request="$emit('edit-request', $event)"
|
||||
/>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="flex-col">
|
||||
<li
|
||||
v-for="(request, index) in collection.requests"
|
||||
:key="index"
|
||||
class="ml-8 border-l border-brdColor"
|
||||
>
|
||||
<CollectionsGraphqlRequest
|
||||
:request="request"
|
||||
:collection-index="collectionIndex"
|
||||
:folder-index="-1"
|
||||
:folder-name="collection.name"
|
||||
:request-index="index"
|
||||
:doc="doc"
|
||||
@edit-request="$emit('edit-request', $event)"
|
||||
/>
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li
|
||||
v-if="collection.folders.length === 0 && collection.requests.length === 0"
|
||||
class="flex ml-8 border-l border-brdColor"
|
||||
>
|
||||
<p class="info">
|
||||
<i class="material-icons">not_interested</i> {{ $t("collection_empty") }}
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<SmartConfirmModal
|
||||
:show="confirmRemove"
|
||||
:title="$t('are_you_sure_remove_collection')"
|
||||
@hide-modal="confirmRemove = false"
|
||||
@resolve="removeCollection"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
|
||||
export default {
|
||||
props: {
|
||||
collectionIndex: Number,
|
||||
collection: Object,
|
||||
doc: Boolean,
|
||||
isFiltered: Boolean,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showChildren: false,
|
||||
dragging: false,
|
||||
selectedFolder: {},
|
||||
confirmRemove: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
toggleShowChildren() {
|
||||
this.showChildren = !this.showChildren
|
||||
},
|
||||
removeCollection() {
|
||||
this.$store.commit("postwoman/removeCollection", {
|
||||
collectionIndex: this.collectionIndex,
|
||||
flag: "graphql",
|
||||
})
|
||||
this.$toast.error(this.$t("deleted"), {
|
||||
icon: "delete",
|
||||
})
|
||||
this.syncCollections()
|
||||
},
|
||||
dropEvent({ dataTransfer }) {
|
||||
this.dragging = !this.dragging
|
||||
const oldCollectionIndex = dataTransfer.getData("oldCollectionIndex")
|
||||
const oldFolderIndex = dataTransfer.getData("oldFolderIndex")
|
||||
const oldFolderName = dataTransfer.getData("oldFolderName")
|
||||
const requestIndex = dataTransfer.getData("requestIndex")
|
||||
const flag = "graphql"
|
||||
this.$store.commit("postwoman/moveRequest", {
|
||||
oldCollectionIndex,
|
||||
newCollectionIndex: this.$props.collectionIndex,
|
||||
newFolderIndex: -1,
|
||||
newFolderName: this.$props.collection.name,
|
||||
oldFolderIndex,
|
||||
oldFolderName,
|
||||
requestIndex,
|
||||
flag,
|
||||
})
|
||||
this.syncCollections()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
86
components/collections/graphql/Edit.vue
Normal file
86
components/collections/graphql/Edit.vue
Normal file
@@ -0,0 +1,86 @@
|
||||
<template>
|
||||
<SmartModal v-if="show" @close="hideModal">
|
||||
<div slot="header">
|
||||
<div class="row-wrapper">
|
||||
<h3 class="title">{{ $t("edit_collection") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="body" class="flex flex-col">
|
||||
<label for="selectLabel">{{ $t("label") }}</label>
|
||||
<input
|
||||
type="text"
|
||||
id="selectLabel"
|
||||
v-model="name"
|
||||
:placeholder="editingCollection.name"
|
||||
@keyup.enter="saveCollection"
|
||||
/>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<div class="row-wrapper">
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
</button>
|
||||
<button class="icon primary" @click="saveCollection">
|
||||
{{ $t("save") }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</SmartModal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
|
||||
export default {
|
||||
props: {
|
||||
show: Boolean,
|
||||
editingCollection: Object,
|
||||
editingCollectionIndex: Number,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
name: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
saveCollection() {
|
||||
if (!this.$data.name) {
|
||||
this.$toast.info(this.$t("invalid_collection_name"))
|
||||
return
|
||||
}
|
||||
const collectionUpdated = {
|
||||
...this.$props.editingCollection,
|
||||
name: this.$data.name,
|
||||
}
|
||||
this.$store.commit("postwoman/editCollection", {
|
||||
collection: collectionUpdated,
|
||||
collectionIndex: this.$props.editingCollectionIndex,
|
||||
flag: "graphql",
|
||||
})
|
||||
this.$emit("hide-modal")
|
||||
this.syncCollections()
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal")
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
81
components/collections/graphql/EditFolder.vue
Normal file
81
components/collections/graphql/EditFolder.vue
Normal file
@@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<SmartModal v-if="show" @close="show = false">
|
||||
<div slot="header">
|
||||
<div class="row-wrapper">
|
||||
<h3 class="title">{{ $t("edit_folder") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="body" class="flex flex-col">
|
||||
<label for="selectLabel">{{ $t("label") }}</label>
|
||||
<input
|
||||
type="text"
|
||||
id="selectLabel"
|
||||
v-model="name"
|
||||
:placeholder="folder.name"
|
||||
@keyup.enter="editFolder"
|
||||
/>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<div class="row-wrapper">
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
</button>
|
||||
<button class="icon primary" @click="editFolder">
|
||||
{{ $t("save") }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</SmartModal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
|
||||
export default {
|
||||
props: {
|
||||
show: Boolean,
|
||||
collectionIndex: Number,
|
||||
folder: Object,
|
||||
folderIndex: Number,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
name: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
editFolder() {
|
||||
this.$store.commit("postwoman/editFolder", {
|
||||
collectionIndex: this.$props.collectionIndex,
|
||||
folder: { ...this.$props.folder, name: this.$data.name },
|
||||
folderIndex: this.$props.folderIndex,
|
||||
folderName: this.$props.folder.name,
|
||||
flag: "graphql",
|
||||
})
|
||||
this.hideModal()
|
||||
this.syncCollections()
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal")
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
92
components/collections/graphql/EditRequest.vue
Normal file
92
components/collections/graphql/EditRequest.vue
Normal file
@@ -0,0 +1,92 @@
|
||||
<template>
|
||||
<SmartModal v-if="show" @close="hideModal">
|
||||
<div slot="header">
|
||||
<div class="row-wrapper">
|
||||
<h3 class="title">{{ $t("edit_request") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="body" class="flex flex-col">
|
||||
<label for="selectLabel">{{ $t("label") }}</label>
|
||||
<input
|
||||
type="text"
|
||||
id="selectLabel"
|
||||
v-model="requestUpdateData.name"
|
||||
@keyup.enter="saveRequest"
|
||||
:placeholder="request.name"
|
||||
/>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<div class="row-wrapper">
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
</button>
|
||||
<button class="icon primary" @click="saveRequest">
|
||||
{{ $t("save") }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</SmartModal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
|
||||
export default {
|
||||
props: {
|
||||
show: Boolean,
|
||||
collectionIndex: Number,
|
||||
folderIndex: Number,
|
||||
folderName: String,
|
||||
request: Object,
|
||||
requestIndex: Number,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
requestUpdateData: {
|
||||
name: undefined,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
saveRequest() {
|
||||
const requestUpdated = {
|
||||
...this.$props.request,
|
||||
name: this.$data.requestUpdateData.name || this.$props.request.name,
|
||||
}
|
||||
|
||||
this.$store.commit("postwoman/editRequest", {
|
||||
requestCollectionIndex: this.$props.collectionIndex,
|
||||
requestFolderName: this.$props.folderName,
|
||||
requestFolderIndex: this.$props.folderIndex,
|
||||
requestNew: requestUpdated,
|
||||
requestIndex: this.$props.requestIndex,
|
||||
flag: "graphql",
|
||||
})
|
||||
|
||||
this.hideModal()
|
||||
this.syncCollections()
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal")
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
180
components/collections/graphql/Folder.vue
Normal file
180
components/collections/graphql/Folder.vue
Normal file
@@ -0,0 +1,180 @@
|
||||
<template>
|
||||
<div>
|
||||
<div
|
||||
:class="['row-wrapper transition duration-150 ease-in-out', { 'bg-bgDarkColor': dragging }]"
|
||||
@dragover.prevent
|
||||
@drop.prevent="dropEvent"
|
||||
@dragover="dragging = true"
|
||||
@drop="dragging = false"
|
||||
@dragleave="dragging = false"
|
||||
@dragend="dragging = false"
|
||||
>
|
||||
<div>
|
||||
<button class="icon" @click="toggleShowChildren">
|
||||
<i class="material-icons" v-show="!showChildren && !isFiltered">arrow_right</i>
|
||||
<i class="material-icons" v-show="showChildren || isFiltered">arrow_drop_down</i>
|
||||
<i class="material-icons">folder_open</i>
|
||||
<span>{{ folder.name }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<v-popover>
|
||||
<button class="tooltip-target icon" v-tooltip.left="$t('more')">
|
||||
<i class="material-icons">more_vert</i>
|
||||
</button>
|
||||
<template slot="popover">
|
||||
<div>
|
||||
<button
|
||||
class="icon"
|
||||
@click="$emit('add-folder', { folder, path: folderPath })"
|
||||
v-close-popover
|
||||
>
|
||||
<i class="material-icons">create_new_folder</i>
|
||||
<span>{{ $t("new_folder") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button
|
||||
class="icon"
|
||||
@click="$emit('edit-folder', { folder, folderIndex, collectionIndex })"
|
||||
v-close-popover
|
||||
>
|
||||
<i class="material-icons">edit</i>
|
||||
<span>{{ $t("edit") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="confirmRemove = true" v-close-popover>
|
||||
<i class="material-icons">delete</i>
|
||||
<span>{{ $t("delete") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
</v-popover>
|
||||
</div>
|
||||
<div v-show="showChildren || isFiltered">
|
||||
<ul class="flex-col">
|
||||
<li
|
||||
v-for="(request, index) in folder.requests"
|
||||
:key="index"
|
||||
class="flex ml-8 border-l border-brdColor"
|
||||
>
|
||||
<CollectionsGraphqlRequest
|
||||
:request="request"
|
||||
:collection-index="collectionIndex"
|
||||
:folder-index="folderIndex"
|
||||
:folder-name="folder.name"
|
||||
:request-index="index"
|
||||
:doc="doc"
|
||||
@edit-request="$emit('edit-request', $event)"
|
||||
/>
|
||||
</li>
|
||||
</ul>
|
||||
<ul v-if="folder.folders && folder.folders.length" class="flex-col">
|
||||
<li
|
||||
v-for="(subFolder, subFolderIndex) in folder.folders"
|
||||
:key="subFolder.name"
|
||||
class="ml-8 border-l border-brdColor"
|
||||
>
|
||||
<CollectionsGraphqlFolder
|
||||
:folder="subFolder"
|
||||
:folder-index="subFolderIndex"
|
||||
:collection-index="collectionIndex"
|
||||
:doc="doc"
|
||||
:folder-path="`${folderPath}/${subFolderIndex}`"
|
||||
@add-folder="$emit('add-folder', $event)"
|
||||
@edit-folder="$emit('edit-folder', $event)"
|
||||
@edit-request="$emit('edit-request', $event)"
|
||||
/>
|
||||
</li>
|
||||
</ul>
|
||||
<ul
|
||||
v-if="
|
||||
folder.folders &&
|
||||
folder.folders.length === 0 &&
|
||||
folder.requests &&
|
||||
folder.requests.length === 0
|
||||
"
|
||||
>
|
||||
<li class="flex ml-8 border-l border-brdColor">
|
||||
<p class="info"><i class="material-icons">not_interested</i> {{ $t("folder_empty") }}</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<SmartConfirmModal
|
||||
:show="confirmRemove"
|
||||
:title="$t('are_you_sure_remove_folder')"
|
||||
@hide-modal="confirmRemove = false"
|
||||
@resolve="removeFolder"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
|
||||
export default {
|
||||
name: "folder",
|
||||
props: {
|
||||
folder: Object,
|
||||
folderIndex: Number,
|
||||
collectionIndex: Number,
|
||||
folderPath: String,
|
||||
doc: Boolean,
|
||||
isFiltered: Boolean,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showChildren: false,
|
||||
dragging: false,
|
||||
confirmRemove: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
toggleShowChildren() {
|
||||
this.showChildren = !this.showChildren
|
||||
},
|
||||
removeFolder() {
|
||||
this.$store.commit("postwoman/removeFolder", {
|
||||
collectionIndex: this.$props.collectionIndex,
|
||||
folderName: this.$props.folder.name,
|
||||
folderIndex: this.$props.folderIndex,
|
||||
flag: "graphql",
|
||||
})
|
||||
this.syncCollections()
|
||||
this.$toast.error(this.$t("deleted"), {
|
||||
icon: "delete",
|
||||
})
|
||||
},
|
||||
dropEvent({ dataTransfer }) {
|
||||
this.dragging = !this.dragging
|
||||
const oldCollectionIndex = dataTransfer.getData("oldCollectionIndex")
|
||||
const oldFolderIndex = dataTransfer.getData("oldFolderIndex")
|
||||
const oldFolderName = dataTransfer.getData("oldFolderName")
|
||||
const requestIndex = dataTransfer.getData("requestIndex")
|
||||
const flag = "graphql"
|
||||
|
||||
this.$store.commit("postwoman/moveRequest", {
|
||||
oldCollectionIndex,
|
||||
newCollectionIndex: this.$props.collectionIndex,
|
||||
newFolderIndex: this.$props.folderIndex,
|
||||
newFolderName: this.$props.folder.name,
|
||||
oldFolderIndex,
|
||||
oldFolderName,
|
||||
requestIndex,
|
||||
flag,
|
||||
})
|
||||
this.syncCollections()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
393
components/collections/graphql/ImportExport.vue
Normal file
393
components/collections/graphql/ImportExport.vue
Normal file
@@ -0,0 +1,393 @@
|
||||
<template>
|
||||
<SmartModal v-if="show" @close="hideModal">
|
||||
<div slot="header">
|
||||
<div class="row-wrapper">
|
||||
<h3 class="title">{{ $t("import_export") }} {{ $t("collections") }}</h3>
|
||||
<div>
|
||||
<v-popover>
|
||||
<button class="tooltip-target icon" v-tooltip.left="$t('more')">
|
||||
<i class="material-icons">more_vert</i>
|
||||
</button>
|
||||
<template slot="popover">
|
||||
<div>
|
||||
<button class="icon" @click="readCollectionGist" v-close-popover>
|
||||
<i class="material-icons">assignment_returned</i>
|
||||
<span>{{ $t("import_from_gist") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
v-tooltip.bottom="{
|
||||
content: !fb.currentUser
|
||||
? $t('login_with_github_to') + $t('create_secret_gist')
|
||||
: fb.currentUser.provider !== 'github.com'
|
||||
? $t('login_with_github_to') + $t('create_secret_gist')
|
||||
: null,
|
||||
}"
|
||||
>
|
||||
<button
|
||||
:disabled="
|
||||
!fb.currentUser ? true : fb.currentUser.provider !== 'github.com' ? true : false
|
||||
"
|
||||
class="icon"
|
||||
@click="createCollectionGist"
|
||||
v-close-popover
|
||||
>
|
||||
<i class="material-icons">assignment_turned_in</i>
|
||||
<span>{{ $t("create_secret_gist") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
</v-popover>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="body" class="flex flex-col">
|
||||
<div class="flex flex-col items-start p-2">
|
||||
<span
|
||||
v-tooltip="{
|
||||
content: !fb.currentUser ? $t('login_first') : $t('replace_current'),
|
||||
}"
|
||||
>
|
||||
<button :disabled="!fb.currentUser" class="icon" @click="syncCollections">
|
||||
<i class="material-icons">folder_shared</i>
|
||||
<span>{{ $t("import_from_sync") }}</span>
|
||||
</button>
|
||||
</span>
|
||||
<button
|
||||
class="icon"
|
||||
@click="openDialogChooseFileToReplaceWith"
|
||||
v-tooltip="$t('replace_current')"
|
||||
>
|
||||
<i class="material-icons">create_new_folder</i>
|
||||
<span>{{ $t("replace_json") }}</span>
|
||||
<input
|
||||
type="file"
|
||||
@change="replaceWithJSON"
|
||||
style="display: none"
|
||||
ref="inputChooseFileToReplaceWith"
|
||||
accept="application/json"
|
||||
/>
|
||||
</button>
|
||||
<button
|
||||
class="icon"
|
||||
@click="openDialogChooseFileToImportFrom"
|
||||
v-tooltip="$t('preserve_current')"
|
||||
>
|
||||
<i class="material-icons">folder_special</i>
|
||||
<span>{{ $t("import_json") }}</span>
|
||||
<input
|
||||
type="file"
|
||||
@change="importFromJSON"
|
||||
style="display: none"
|
||||
ref="inputChooseFileToImportFrom"
|
||||
accept="application/json"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
<div v-if="showJsonCode" class="row-wrapper">
|
||||
<textarea v-model="collectionJson" rows="8" readonly></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<div class="row-wrapper">
|
||||
<span>
|
||||
<SmartToggle :on="showJsonCode" @change="showJsonCode = $event">
|
||||
{{ $t("show_code") }}
|
||||
</SmartToggle>
|
||||
</span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
</button>
|
||||
<button class="icon primary" @click="exportJSON" v-tooltip="$t('download_file')">
|
||||
{{ $t("export") }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</SmartModal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
fb,
|
||||
showJsonCode: false,
|
||||
}
|
||||
},
|
||||
props: {
|
||||
show: Boolean,
|
||||
},
|
||||
computed: {
|
||||
collectionJson() {
|
||||
return JSON.stringify(this.$store.state.postwoman.collectionsGraphql, null, 2)
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async createCollectionGist() {
|
||||
await this.$axios
|
||||
.$post(
|
||||
"https://api.github.com/gists",
|
||||
{
|
||||
files: {
|
||||
"hoppscotch-collections.json": {
|
||||
content: this.collectionJson,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
headers: {
|
||||
Authorization: `token ${fb.currentUser.accessToken}`,
|
||||
Accept: "application/vnd.github.v3+json",
|
||||
},
|
||||
}
|
||||
)
|
||||
.then(({ html_url }) => {
|
||||
this.$toast.success(this.$t("gist_created"), {
|
||||
icon: "done",
|
||||
})
|
||||
window.open(html_url)
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$toast.error(this.$t("something_went_wrong"), {
|
||||
icon: "error",
|
||||
})
|
||||
console.log(error)
|
||||
})
|
||||
},
|
||||
async readCollectionGist() {
|
||||
let gist = prompt(this.$t("enter_gist_url"))
|
||||
if (!gist) return
|
||||
await this.$axios
|
||||
.$get(`https://api.github.com/gists/${gist.split("/").pop()}`, {
|
||||
headers: {
|
||||
Accept: "application/vnd.github.v3+json",
|
||||
},
|
||||
})
|
||||
.then(({ files }) => {
|
||||
let collections = JSON.parse(Object.values(files)[0].content)
|
||||
this.$store.commit("postwoman/replaceCollections", { data: collections, flag: "graphql" })
|
||||
this.fileImported()
|
||||
this.syncToFBCollections()
|
||||
})
|
||||
.catch((error) => {
|
||||
this.failedImport()
|
||||
console.log(error)
|
||||
})
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal")
|
||||
},
|
||||
openDialogChooseFileToReplaceWith() {
|
||||
this.$refs.inputChooseFileToReplaceWith.click()
|
||||
},
|
||||
openDialogChooseFileToImportFrom() {
|
||||
this.$refs.inputChooseFileToImportFrom.click()
|
||||
},
|
||||
replaceWithJSON() {
|
||||
let reader = new FileReader()
|
||||
reader.onload = ({ target }) => {
|
||||
let content = target.result
|
||||
let collections = JSON.parse(content)
|
||||
if (collections[0]) {
|
||||
let [name, folders, requests] = Object.keys(collections[0])
|
||||
if (name === "name" && folders === "folders" && requests === "requests") {
|
||||
// Do nothing
|
||||
}
|
||||
} else if (collections.info && collections.info.schema.includes("v2.1.0")) {
|
||||
collections = [this.parsePostmanCollection(collections)]
|
||||
} else {
|
||||
this.failedImport()
|
||||
return
|
||||
}
|
||||
this.$store.commit("postwoman/replaceCollections", { data: collections, flag: "graphql" })
|
||||
this.fileImported()
|
||||
this.syncToFBCollections()
|
||||
}
|
||||
reader.readAsText(this.$refs.inputChooseFileToReplaceWith.files[0])
|
||||
this.$refs.inputChooseFileToReplaceWith.value = ""
|
||||
},
|
||||
importFromJSON() {
|
||||
let reader = new FileReader()
|
||||
reader.onload = ({ target }) => {
|
||||
let content = target.result
|
||||
let collections = JSON.parse(content)
|
||||
if (collections[0]) {
|
||||
let [name, folders, requests] = Object.keys(collections[0])
|
||||
if (name === "name" && folders === "folders" && requests === "requests") {
|
||||
// Do nothing
|
||||
}
|
||||
} else if (collections.info && collections.info.schema.includes("v2.1.0")) {
|
||||
//replace the variables, postman uses {{var}}, Hoppscotch uses <<var>>
|
||||
collections = JSON.parse(content.replaceAll(/{{([a-z]+)}}/gi, "<<$1>>"))
|
||||
collections = [this.parsePostmanCollection(collections)]
|
||||
} else {
|
||||
this.failedImport()
|
||||
return
|
||||
}
|
||||
this.$store.commit("postwoman/importCollections", { data: collections, flag: "graphql" })
|
||||
this.fileImported()
|
||||
this.syncToFBCollections()
|
||||
}
|
||||
reader.readAsText(this.$refs.inputChooseFileToImportFrom.files[0])
|
||||
this.$refs.inputChooseFileToImportFrom.value = ""
|
||||
},
|
||||
exportJSON() {
|
||||
let text = this.collectionJson
|
||||
text = text.replace(/\n/g, "\r\n")
|
||||
let blob = new Blob([text], {
|
||||
type: "text/json",
|
||||
})
|
||||
let anchor = document.createElement("a")
|
||||
anchor.download = "hoppscotch-collection.json"
|
||||
anchor.href = window.URL.createObjectURL(blob)
|
||||
anchor.target = "_blank"
|
||||
anchor.style.display = "none"
|
||||
document.body.appendChild(anchor)
|
||||
anchor.click()
|
||||
document.body.removeChild(anchor)
|
||||
this.$toast.success(this.$t("download_started"), {
|
||||
icon: "done",
|
||||
})
|
||||
},
|
||||
syncCollections() {
|
||||
this.$store.commit("postwoman/replaceCollections", {
|
||||
data: fb.currentGraphqlCollections,
|
||||
flag: "graphql",
|
||||
})
|
||||
this.fileImported()
|
||||
},
|
||||
syncToFBCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
fileImported() {
|
||||
this.$toast.info(this.$t("file_imported"), {
|
||||
icon: "folder_shared",
|
||||
})
|
||||
},
|
||||
failedImport() {
|
||||
this.$toast.error(this.$t("import_failed"), {
|
||||
icon: "error",
|
||||
})
|
||||
},
|
||||
parsePostmanCollection({ info, name, item }) {
|
||||
let postwomanCollection = {
|
||||
name: "",
|
||||
folders: [],
|
||||
requests: [],
|
||||
}
|
||||
|
||||
postwomanCollection.name = info ? info.name : name
|
||||
|
||||
if (item && item.length > 0) {
|
||||
for (let collectionItem of item) {
|
||||
if (collectionItem.request) {
|
||||
if (postwomanCollection.hasOwnProperty("folders")) {
|
||||
postwomanCollection.name = info ? info.name : name
|
||||
postwomanCollection.requests.push(this.parsePostmanRequest(collectionItem))
|
||||
} else {
|
||||
postwomanCollection.name = name ? name : ""
|
||||
postwomanCollection.requests.push(this.parsePostmanRequest(collectionItem))
|
||||
}
|
||||
} else if (this.hasFolder(collectionItem)) {
|
||||
postwomanCollection.folders.push(this.parsePostmanCollection(collectionItem))
|
||||
} else {
|
||||
postwomanCollection.requests.push(this.parsePostmanRequest(collectionItem))
|
||||
}
|
||||
}
|
||||
}
|
||||
return postwomanCollection
|
||||
},
|
||||
parsePostmanRequest({ name, request }) {
|
||||
let pwRequest = {
|
||||
url: "",
|
||||
path: "",
|
||||
method: "",
|
||||
auth: "",
|
||||
httpUser: "",
|
||||
httpPassword: "",
|
||||
passwordFieldType: "password",
|
||||
bearerToken: "",
|
||||
headers: [],
|
||||
params: [],
|
||||
bodyParams: [],
|
||||
rawParams: "",
|
||||
rawInput: false,
|
||||
contentType: "",
|
||||
requestType: "",
|
||||
name: "",
|
||||
}
|
||||
|
||||
pwRequest.name = name
|
||||
let requestObjectUrl = request.url.raw.match(/^(.+:\/\/[^\/]+|{[^\/]+})(\/[^\?]+|).*$/)
|
||||
if (requestObjectUrl) {
|
||||
pwRequest.url = requestObjectUrl[1]
|
||||
pwRequest.path = requestObjectUrl[2] ? requestObjectUrl[2] : ""
|
||||
}
|
||||
pwRequest.method = request.method
|
||||
let itemAuth = request.auth ? request.auth : ""
|
||||
let authType = itemAuth ? itemAuth.type : ""
|
||||
if (authType === "basic") {
|
||||
pwRequest.auth = "Basic Auth"
|
||||
pwRequest.httpUser =
|
||||
itemAuth.basic[0].key === "username" ? itemAuth.basic[0].value : itemAuth.basic[1].value
|
||||
pwRequest.httpPassword =
|
||||
itemAuth.basic[0].key === "password" ? itemAuth.basic[0].value : itemAuth.basic[1].value
|
||||
} else if (authType === "oauth2") {
|
||||
pwRequest.auth = "OAuth 2.0"
|
||||
pwRequest.bearerToken =
|
||||
itemAuth.oauth2[0].key === "accessToken"
|
||||
? itemAuth.oauth2[0].value
|
||||
: itemAuth.oauth2[1].value
|
||||
} else if (authType === "bearer") {
|
||||
pwRequest.auth = "Bearer Token"
|
||||
pwRequest.bearerToken = itemAuth.bearer[0].value
|
||||
}
|
||||
let requestObjectHeaders = request.header
|
||||
if (requestObjectHeaders) {
|
||||
pwRequest.headers = requestObjectHeaders
|
||||
for (let header of pwRequest.headers) {
|
||||
delete header.name
|
||||
delete header.type
|
||||
}
|
||||
}
|
||||
let requestObjectParams = request.url.query
|
||||
if (requestObjectParams) {
|
||||
pwRequest.params = requestObjectParams
|
||||
for (let param of pwRequest.params) {
|
||||
delete param.disabled
|
||||
}
|
||||
}
|
||||
if (request.body) {
|
||||
if (request.body.mode === "urlencoded") {
|
||||
let params = request.body.urlencoded
|
||||
pwRequest.bodyParams = params ? params : []
|
||||
for (let param of pwRequest.bodyParams) {
|
||||
delete param.type
|
||||
}
|
||||
} else if (request.body.mode === "raw") {
|
||||
pwRequest.rawInput = true
|
||||
pwRequest.rawParams = request.body.raw
|
||||
}
|
||||
}
|
||||
return pwRequest
|
||||
},
|
||||
hasFolder(item) {
|
||||
return item.hasOwnProperty("item")
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
115
components/collections/graphql/Request.vue
Normal file
115
components/collections/graphql/Request.vue
Normal file
@@ -0,0 +1,115 @@
|
||||
<template>
|
||||
<div>
|
||||
<div
|
||||
:class="['row-wrapper transition duration-150 ease-in-out', { 'bg-bgDarkColor': dragging }]"
|
||||
draggable="true"
|
||||
@dragstart="dragStart"
|
||||
@dragover.stop
|
||||
@dragleave="dragging = false"
|
||||
@dragend="dragging = false"
|
||||
>
|
||||
<div>
|
||||
<button
|
||||
class="icon"
|
||||
@click="!doc ? selectRequest() : {}"
|
||||
v-tooltip="!doc ? $t('use_request') : ''"
|
||||
>
|
||||
<span>{{ request.name }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<v-popover>
|
||||
<button class="tooltip-target icon" v-tooltip="$t('more')">
|
||||
<i class="material-icons">more_vert</i>
|
||||
</button>
|
||||
<template slot="popover">
|
||||
<div>
|
||||
<button
|
||||
class="icon"
|
||||
@click="
|
||||
$emit('edit-request', {
|
||||
collectionIndex,
|
||||
folderIndex,
|
||||
folderName,
|
||||
request,
|
||||
requestIndex,
|
||||
})
|
||||
"
|
||||
v-close-popover
|
||||
>
|
||||
<i class="material-icons">edit</i>
|
||||
<span>{{ $t("edit") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="confirmRemove = true" v-close-popover>
|
||||
<i class="material-icons">delete</i>
|
||||
<span>{{ $t("delete") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
</v-popover>
|
||||
</div>
|
||||
<SmartConfirmModal
|
||||
:show="confirmRemove"
|
||||
:title="$t('are_you_sure_remove_request')"
|
||||
@hide-modal="confirmRemove = false"
|
||||
@resolve="removeRequest"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
|
||||
export default {
|
||||
props: {
|
||||
request: Object,
|
||||
collectionIndex: Number,
|
||||
folderIndex: Number,
|
||||
folderName: String,
|
||||
requestIndex: Number,
|
||||
doc: Boolean,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dragging: false,
|
||||
confirmRemove: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
selectRequest() {
|
||||
this.$store.commit("postwoman/selectGraphqlRequest", { request: this.request })
|
||||
},
|
||||
dragStart({ dataTransfer }) {
|
||||
this.dragging = !this.dragging
|
||||
dataTransfer.setData("oldCollectionIndex", this.$props.collectionIndex)
|
||||
dataTransfer.setData("oldFolderIndex", this.$props.folderIndex)
|
||||
dataTransfer.setData("oldFolderName", this.$props.folderName)
|
||||
dataTransfer.setData("requestIndex", this.$props.requestIndex)
|
||||
},
|
||||
removeRequest() {
|
||||
this.$store.commit("postwoman/removeRequest", {
|
||||
collectionIndex: this.$props.collectionIndex,
|
||||
folderName: this.$props.folderName,
|
||||
requestIndex: this.$props.requestIndex,
|
||||
flag: "graphql",
|
||||
})
|
||||
this.$toast.error(this.$t("deleted"), {
|
||||
icon: "delete",
|
||||
})
|
||||
this.confirmRemove = false
|
||||
this.syncCollections()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
225
components/collections/graphql/SaveRequest.vue
Normal file
225
components/collections/graphql/SaveRequest.vue
Normal file
@@ -0,0 +1,225 @@
|
||||
<template>
|
||||
<SmartModal v-if="show" @close="hideModal">
|
||||
<div slot="header">
|
||||
<div class="row-wrapper">
|
||||
<h3 class="title">{{ $t("save_request_as") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="body" class="flex flex-col">
|
||||
<label for="selectLabel">{{ $t("token_req_name") }}</label>
|
||||
<input type="text" id="selectLabel" v-model="requestData.name" @keyup.enter="saveRequestAs" />
|
||||
<ul>
|
||||
<li>
|
||||
<label for="selectCollection">{{ $t("collection") }}</label>
|
||||
<span class="select-wrapper">
|
||||
<select type="text" id="selectCollection" v-model="requestData.collectionIndex">
|
||||
<option :key="undefined" :value="undefined" hidden disabled selected>
|
||||
{{ $t("select_collection") }}
|
||||
</option>
|
||||
<option
|
||||
v-for="(collection, index) in $store.state.postwoman.collectionsGraphql"
|
||||
:key="index"
|
||||
:value="index"
|
||||
>
|
||||
{{ collection.name }}
|
||||
</option>
|
||||
</select>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
<label>{{ $t("folder") }}</label>
|
||||
<SmartAutoComplete
|
||||
:placeholder="$t('search')"
|
||||
:source="folders"
|
||||
:spellcheck="false"
|
||||
v-model="requestData.folderName"
|
||||
/>
|
||||
<ul>
|
||||
<li>
|
||||
<label for="selectRequest">{{ $t("request") }}</label>
|
||||
<span class="select-wrapper">
|
||||
<select type="text" id="selectRequest" v-model="requestData.requestIndex">
|
||||
<option :key="undefined" :value="undefined">/</option>
|
||||
<option v-for="(folder, index) in requests" :key="index" :value="index">
|
||||
{{ folder.name }}
|
||||
</option>
|
||||
</select>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<div class="row-wrapper">
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
</button>
|
||||
<button class="icon primary" @click="saveRequestAs">
|
||||
{{ $t("save") }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</SmartModal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
|
||||
export default {
|
||||
props: {
|
||||
show: Boolean,
|
||||
editingRequest: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
defaultRequestName: "Untitled Request",
|
||||
requestData: {
|
||||
name: undefined,
|
||||
collectionIndex: undefined,
|
||||
folderName: undefined,
|
||||
requestIndex: undefined,
|
||||
},
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
"requestData.collectionIndex": function resetFolderAndRequestIndex() {
|
||||
// if user has chosen some folder, than selected other collection, which doesn't have any folders
|
||||
// than `requestUpdateData.folderName` won't be reseted
|
||||
this.$data.requestData.folderName = undefined
|
||||
this.$data.requestData.requestIndex = undefined
|
||||
},
|
||||
"requestData.folderName": function resetRequestIndex() {
|
||||
this.$data.requestData.requestIndex = undefined
|
||||
},
|
||||
editingRequest({ name }) {
|
||||
this.$data.requestData.name = name || this.$data.defaultRequestName
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
folders() {
|
||||
const collections = this.$store.state.postwoman.collectionsGraphql
|
||||
const collectionIndex = this.$data.requestData.collectionIndex
|
||||
const userSelectedAnyCollection = collectionIndex !== undefined
|
||||
if (!userSelectedAnyCollection) return []
|
||||
|
||||
const noCollectionAvailable = collections[collectionIndex] !== undefined
|
||||
if (!noCollectionAvailable) return []
|
||||
|
||||
return getFolderNames(collections[collectionIndex].folders, [])
|
||||
},
|
||||
requests() {
|
||||
const collections = this.$store.state.postwoman.collectionsGraphql
|
||||
const collectionIndex = this.$data.requestData.collectionIndex
|
||||
const folderName = this.$data.requestData.folderName
|
||||
|
||||
const userSelectedAnyCollection = collectionIndex !== undefined
|
||||
if (!userSelectedAnyCollection) {
|
||||
return []
|
||||
}
|
||||
|
||||
const userSelectedAnyFolder = folderName !== undefined && folderName !== ""
|
||||
|
||||
if (userSelectedAnyFolder) {
|
||||
const collection = collections[collectionIndex]
|
||||
const folder = findFolder(folderName, collection)
|
||||
return folder.requests
|
||||
} else {
|
||||
const collection = collections[collectionIndex]
|
||||
const noCollectionAvailable = collection !== undefined
|
||||
|
||||
if (!noCollectionAvailable) {
|
||||
return []
|
||||
}
|
||||
|
||||
return collection.requests
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
saveRequestAs() {
|
||||
const userDidntSpecifyCollection = this.$data.requestData.collectionIndex === undefined
|
||||
if (userDidntSpecifyCollection) {
|
||||
this.$toast.error(this.$t("select_collection"), {
|
||||
icon: "error",
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.$data.requestData.name.length === 0) {
|
||||
this.$toast.error(this.$t("empty_req_name"), {
|
||||
icon: "error",
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
const requestUpdated = {
|
||||
...this.$props.editingRequest,
|
||||
name: this.$data.requestData.name,
|
||||
collection: this.$data.requestData.collectionIndex,
|
||||
}
|
||||
|
||||
this.$store.commit("postwoman/saveRequestAs", {
|
||||
request: requestUpdated,
|
||||
collectionIndex: this.$data.requestData.collectionIndex,
|
||||
folderName: this.$data.requestData.folderName,
|
||||
requestIndex: this.$data.requestData.requestIndex,
|
||||
flag: "graphql",
|
||||
})
|
||||
|
||||
this.hideModal()
|
||||
this.syncCollections()
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal")
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
function getFolderNames(folders, namesList) {
|
||||
if (folders.length) {
|
||||
folders.forEach((folder) => {
|
||||
namesList.push(folder.name)
|
||||
if (folder.folders && folder.folders.length) {
|
||||
getFolderNames(folder.folders, namesList)
|
||||
}
|
||||
})
|
||||
}
|
||||
return namesList
|
||||
}
|
||||
|
||||
function findFolder(folderName, currentFolder) {
|
||||
let selectedFolder
|
||||
let result
|
||||
|
||||
if (folderName === currentFolder.name) {
|
||||
return currentFolder
|
||||
}
|
||||
|
||||
for (let i = 0; i < currentFolder.folders.length; i++) {
|
||||
selectedFolder = currentFolder.folders[i]
|
||||
|
||||
result = findFolder(folderName, selectedFolder)
|
||||
|
||||
if (result !== false) {
|
||||
return result
|
||||
}
|
||||
}
|
||||
return false
|
||||
}
|
||||
</script>
|
||||
261
components/collections/graphql/index.vue
Normal file
261
components/collections/graphql/index.vue
Normal file
@@ -0,0 +1,261 @@
|
||||
<template>
|
||||
<AppSection class="yellow" :label="$t('collections')" ref="collections" no-legend>
|
||||
<div class="show-on-large-screen">
|
||||
<input
|
||||
aria-label="Search"
|
||||
type="search"
|
||||
:placeholder="$t('search')"
|
||||
v-model="filterText"
|
||||
class="rounded-t-lg"
|
||||
/>
|
||||
</div>
|
||||
<CollectionsGraphqlAdd :show="showModalAdd" @hide-modal="displayModalAdd(false)" />
|
||||
<CollectionsGraphqlEdit
|
||||
:show="showModalEdit"
|
||||
:editing-collection="editingCollection"
|
||||
:editing-collection-index="editingCollectionIndex"
|
||||
@hide-modal="displayModalEdit(false)"
|
||||
/>
|
||||
<CollectionsGraphqlAddFolder
|
||||
:show="showModalAddFolder"
|
||||
:folder="editingFolder"
|
||||
:folder-path="editingFolderPath"
|
||||
@add-folder="onAddFolder($event)"
|
||||
@hide-modal="displayModalAddFolder(false)"
|
||||
/>
|
||||
<CollectionsGraphqlEditFolder
|
||||
:show="showModalEditFolder"
|
||||
:collection-index="editingCollectionIndex"
|
||||
:folder="editingFolder"
|
||||
:folder-index="editingFolderIndex"
|
||||
@hide-modal="displayModalEditFolder(false)"
|
||||
/>
|
||||
<CollectionsGraphqlEditRequest
|
||||
:show="showModalEditRequest"
|
||||
:collection-index="editingCollectionIndex"
|
||||
:folder-index="editingFolderIndex"
|
||||
:folder-name="editingFolderName"
|
||||
:request="editingRequest"
|
||||
:request-index="editingRequestIndex"
|
||||
@hide-modal="displayModalEditRequest(false)"
|
||||
/>
|
||||
<CollectionsGraphqlImportExport
|
||||
:show="showModalImportExport"
|
||||
@hide-modal="displayModalImportExport(false)"
|
||||
/>
|
||||
<div class="border-b row-wrapper border-brdColor">
|
||||
<button class="icon" @click="displayModalAdd(true)">
|
||||
<i class="material-icons">add</i>
|
||||
<span>{{ $t("new") }}</span>
|
||||
</button>
|
||||
<button class="icon" @click="displayModalImportExport(true)">
|
||||
{{ $t("import_export") }}
|
||||
</button>
|
||||
</div>
|
||||
<p v-if="collections.length === 0" class="info">
|
||||
<i class="material-icons">help_outline</i> {{ $t("create_new_collection") }}
|
||||
</p>
|
||||
<div class="virtual-list">
|
||||
<ul class="flex-col">
|
||||
<li v-for="(collection, index) in filteredCollections" :key="collection.name">
|
||||
<CollectionsGraphqlCollection
|
||||
:name="collection.name"
|
||||
:collection-index="index"
|
||||
:collection="collection"
|
||||
:doc="doc"
|
||||
:isFiltered="filterText.length > 0"
|
||||
@edit-collection="editCollection(collection, index)"
|
||||
@add-folder="addFolder($event)"
|
||||
@edit-folder="editFolder($event)"
|
||||
@edit-request="editRequest($event)"
|
||||
@select-collection="$emit('use-collection', collection)"
|
||||
/>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<p v-if="filterText && filteredCollections.length === 0" class="info">
|
||||
<i class="material-icons">not_interested</i> {{ $t("nothing_found") }} "{{ filterText }}"
|
||||
</p>
|
||||
</AppSection>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.virtual-list {
|
||||
max-height: calc(100vh - 270px);
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
|
||||
export default {
|
||||
props: {
|
||||
doc: Boolean,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showModalAdd: false,
|
||||
showModalEdit: false,
|
||||
showModalImportExport: false,
|
||||
showModalAddFolder: false,
|
||||
showModalEditFolder: false,
|
||||
showModalEditRequest: false,
|
||||
editingCollection: undefined,
|
||||
editingCollectionIndex: undefined,
|
||||
editingFolder: undefined,
|
||||
editingFolderName: undefined,
|
||||
editingFolderIndex: undefined,
|
||||
editingFolderPath: undefined,
|
||||
editingRequest: undefined,
|
||||
editingRequestIndex: undefined,
|
||||
filterText: "",
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
collections() {
|
||||
return fb.currentUser !== null
|
||||
? fb.currentGraphqlCollections
|
||||
: this.$store.state.postwoman.collectionsGraphql
|
||||
},
|
||||
filteredCollections() {
|
||||
const collections =
|
||||
fb.currentUser !== null
|
||||
? fb.currentGraphqlCollections
|
||||
: this.$store.state.postwoman.collectionsGraphql
|
||||
|
||||
if (!this.filterText) return collections
|
||||
|
||||
const filterText = this.filterText.toLowerCase()
|
||||
const filteredCollections = []
|
||||
|
||||
for (let collection of collections) {
|
||||
const filteredRequests = []
|
||||
const filteredFolders = []
|
||||
for (let request of collection.requests) {
|
||||
if (request.name.toLowerCase().includes(filterText)) filteredRequests.push(request)
|
||||
}
|
||||
for (let folder of collection.folders) {
|
||||
const filteredFolderRequests = []
|
||||
for (let request of folder.requests) {
|
||||
if (request.name.toLowerCase().includes(filterText))
|
||||
filteredFolderRequests.push(request)
|
||||
}
|
||||
if (filteredFolderRequests.length > 0) {
|
||||
const filteredFolder = Object.assign({}, folder)
|
||||
filteredFolder.requests = filteredFolderRequests
|
||||
filteredFolders.push(filteredFolder)
|
||||
}
|
||||
}
|
||||
|
||||
if (filteredRequests.length + filteredFolders.length > 0) {
|
||||
const filteredCollection = Object.assign({}, collection)
|
||||
filteredCollection.requests = filteredRequests
|
||||
filteredCollection.folders = filteredFolders
|
||||
filteredCollections.push(filteredCollection)
|
||||
}
|
||||
}
|
||||
|
||||
return filteredCollections
|
||||
},
|
||||
},
|
||||
async mounted() {
|
||||
this._keyListener = function (e) {
|
||||
if (e.key === "Escape") {
|
||||
e.preventDefault()
|
||||
this.showModalAdd = this.showModalEdit = this.showModalImportExport = this.showModalAddFolder = this.showModalEditFolder = this.showModalEditRequest = false
|
||||
}
|
||||
}
|
||||
document.addEventListener("keydown", this._keyListener.bind(this))
|
||||
},
|
||||
methods: {
|
||||
displayModalAdd(shouldDisplay) {
|
||||
this.showModalAdd = shouldDisplay
|
||||
},
|
||||
displayModalEdit(shouldDisplay) {
|
||||
this.showModalEdit = shouldDisplay
|
||||
|
||||
if (!shouldDisplay) this.resetSelectedData()
|
||||
},
|
||||
displayModalImportExport(shouldDisplay) {
|
||||
this.showModalImportExport = shouldDisplay
|
||||
},
|
||||
displayModalAddFolder(shouldDisplay) {
|
||||
this.showModalAddFolder = shouldDisplay
|
||||
|
||||
if (!shouldDisplay) this.resetSelectedData()
|
||||
},
|
||||
displayModalEditFolder(shouldDisplay) {
|
||||
this.showModalEditFolder = shouldDisplay
|
||||
|
||||
if (!shouldDisplay) this.resetSelectedData()
|
||||
},
|
||||
displayModalEditRequest(shouldDisplay) {
|
||||
this.showModalEditRequest = shouldDisplay
|
||||
|
||||
if (!shouldDisplay) this.resetSelectedData()
|
||||
},
|
||||
editCollection(collection, collectionIndex) {
|
||||
this.$data.editingCollection = collection
|
||||
this.$data.editingCollectionIndex = collectionIndex
|
||||
this.displayModalEdit(true)
|
||||
this.syncCollections()
|
||||
},
|
||||
onAddFolder({ name, path }) {
|
||||
const flag = "graphql"
|
||||
this.$store.commit("postwoman/addFolder", {
|
||||
name,
|
||||
path,
|
||||
flag,
|
||||
})
|
||||
|
||||
this.displayModalAddFolder(false)
|
||||
this.syncCollections()
|
||||
},
|
||||
addFolder(payload) {
|
||||
const { folder, path } = payload
|
||||
this.$data.editingFolder = folder
|
||||
this.$data.editingFolderPath = path
|
||||
this.displayModalAddFolder(true)
|
||||
},
|
||||
editFolder(payload) {
|
||||
const { collectionIndex, folder, folderIndex } = payload
|
||||
this.$data.editingCollectionIndex = collectionIndex
|
||||
this.$data.editingFolder = folder
|
||||
this.$data.editingFolderIndex = folderIndex
|
||||
this.displayModalEditFolder(true)
|
||||
this.syncCollections()
|
||||
},
|
||||
editRequest(payload) {
|
||||
const { collectionIndex, folderIndex, folderName, request, requestIndex } = payload
|
||||
this.$data.editingCollectionIndex = collectionIndex
|
||||
this.$data.editingFolderIndex = folderIndex
|
||||
this.$data.editingFolderName = folderName
|
||||
this.$data.editingRequest = request
|
||||
this.$data.editingRequestIndex = requestIndex
|
||||
this.displayModalEditRequest(true)
|
||||
this.syncCollections()
|
||||
},
|
||||
resetSelectedData() {
|
||||
this.$data.editingCollection = undefined
|
||||
this.$data.editingCollectionIndex = undefined
|
||||
this.$data.editingFolder = undefined
|
||||
this.$data.editingFolderIndex = undefined
|
||||
this.$data.editingRequest = undefined
|
||||
this.$data.editingRequestIndex = undefined
|
||||
},
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
document.removeEventListener("keydown", this._keyListener)
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -199,9 +199,11 @@ export default {
|
||||
this.syncCollections()
|
||||
},
|
||||
onAddFolder({ name, path }) {
|
||||
const flag = "rest"
|
||||
this.$store.commit("postwoman/addFolder", {
|
||||
name,
|
||||
path,
|
||||
flag,
|
||||
})
|
||||
|
||||
this.displayModalAddFolder(false)
|
||||
@@ -242,7 +244,10 @@ export default {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -1108,7 +1108,7 @@ describe("FirebaseInstance", () => {
|
||||
|
||||
signInUser()
|
||||
|
||||
await expect(fb.writeCollections([])).resolves.toBeUndefined()
|
||||
await expect(fb.writeCollections([], "collections")).resolves.toBeUndefined()
|
||||
})
|
||||
|
||||
test("rejects for non-authenticated request", async () => {
|
||||
@@ -1116,7 +1116,7 @@ describe("FirebaseInstance", () => {
|
||||
|
||||
signOutUser()
|
||||
|
||||
await expect(fb.writeCollections([])).rejects.toBeDefined()
|
||||
await expect(fb.writeCollections([], "collections")).rejects.toBeDefined()
|
||||
})
|
||||
|
||||
test("stores data on firestore with proper structure", async () => {
|
||||
@@ -1124,7 +1124,7 @@ describe("FirebaseInstance", () => {
|
||||
|
||||
signInUser()
|
||||
|
||||
await fb.writeCollections([])
|
||||
await fb.writeCollections([], "collections")
|
||||
|
||||
const doc = (
|
||||
await mocksdk
|
||||
@@ -1152,7 +1152,7 @@ describe("FirebaseInstance", () => {
|
||||
|
||||
signInUser()
|
||||
|
||||
await fb.writeCollections([])
|
||||
await fb.writeCollections([], "collections")
|
||||
|
||||
const doc = (
|
||||
await mocksdk
|
||||
|
||||
@@ -35,6 +35,7 @@ export class FirebaseInstance {
|
||||
this.currentHistory = []
|
||||
this.currentGraphqlHistory = []
|
||||
this.currentCollections = []
|
||||
this.currentGraphqlCollections = []
|
||||
this.currentEnvironments = []
|
||||
|
||||
this.app.auth().onAuthStateChanged((user) => {
|
||||
@@ -133,6 +134,21 @@ export class FirebaseInstance {
|
||||
}
|
||||
})
|
||||
|
||||
this.usersCollection
|
||||
.doc(this.currentUser.uid)
|
||||
.collection("collectionsGraphql")
|
||||
.onSnapshot((collectionsRef) => {
|
||||
const collections = []
|
||||
collectionsRef.forEach((doc) => {
|
||||
const collection = doc.data()
|
||||
collection.id = doc.id
|
||||
collections.push(collection)
|
||||
})
|
||||
if (collections.length > 0) {
|
||||
this.currentGraphqlCollections = collections[0].collection
|
||||
}
|
||||
})
|
||||
|
||||
this.usersCollection
|
||||
.doc(this.currentUser.uid)
|
||||
.collection("environments")
|
||||
@@ -319,7 +335,7 @@ export class FirebaseInstance {
|
||||
}
|
||||
}
|
||||
|
||||
async writeCollections(collection) {
|
||||
async writeCollections(collection, flag) {
|
||||
const cl = {
|
||||
updatedOn: new Date(),
|
||||
author: this.currentUser.uid,
|
||||
@@ -329,11 +345,7 @@ export class FirebaseInstance {
|
||||
}
|
||||
|
||||
try {
|
||||
await this.usersCollection
|
||||
.doc(this.currentUser.uid)
|
||||
.collection("collections")
|
||||
.doc("sync")
|
||||
.set(cl)
|
||||
await this.usersCollection.doc(this.currentUser.uid).collection(flag).doc("sync").set(cl)
|
||||
} catch (e) {
|
||||
console.error("error updating", cl, e)
|
||||
|
||||
|
||||
11
package-lock.json
generated
11
package-lock.json
generated
@@ -5,6 +5,7 @@
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "hoppscotch",
|
||||
"version": "2.0.0",
|
||||
"hasInstallScript": true,
|
||||
"dependencies": {
|
||||
@@ -1821,6 +1822,7 @@
|
||||
"jest-resolve": "^26.6.2",
|
||||
"jest-util": "^26.6.2",
|
||||
"jest-worker": "^26.6.2",
|
||||
"node-notifier": "^8.0.0",
|
||||
"slash": "^3.0.0",
|
||||
"source-map": "^0.6.0",
|
||||
"string-length": "^4.0.1",
|
||||
@@ -4030,6 +4032,7 @@
|
||||
"merge-source-map": "^1.1.0",
|
||||
"postcss": "^7.0.14",
|
||||
"postcss-selector-parser": "^6.0.2",
|
||||
"prettier": "^1.18.2",
|
||||
"source-map": "~0.6.1",
|
||||
"vue-template-es2015-compiler": "^1.9.0"
|
||||
},
|
||||
@@ -6036,6 +6039,7 @@
|
||||
"dependencies": {
|
||||
"anymatch": "~3.1.1",
|
||||
"braces": "~3.0.2",
|
||||
"fsevents": "~2.3.1",
|
||||
"glob-parent": "~5.1.0",
|
||||
"is-binary-path": "~2.1.0",
|
||||
"is-glob": "~4.0.1",
|
||||
@@ -8796,7 +8800,8 @@
|
||||
"esprima": "^4.0.1",
|
||||
"estraverse": "^4.2.0",
|
||||
"esutils": "^2.0.2",
|
||||
"optionator": "^0.8.1"
|
||||
"optionator": "^0.8.1",
|
||||
"source-map": "~0.6.1"
|
||||
},
|
||||
"bin": {
|
||||
"escodegen": "bin/escodegen.js",
|
||||
@@ -12234,6 +12239,7 @@
|
||||
"@types/node": "*",
|
||||
"anymatch": "^3.0.3",
|
||||
"fb-watchman": "^2.0.0",
|
||||
"fsevents": "^2.1.2",
|
||||
"graceful-fs": "^4.2.4",
|
||||
"jest-regex-util": "^26.0.0",
|
||||
"jest-serializer": "^26.6.2",
|
||||
@@ -26484,7 +26490,8 @@
|
||||
"dependencies": {
|
||||
"chokidar": "^3.4.1",
|
||||
"graceful-fs": "^4.1.2",
|
||||
"neo-async": "^2.5.0"
|
||||
"neo-async": "^2.5.0",
|
||||
"watchpack-chokidar2": "^2.0.1"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"watchpack-chokidar2": "^2.0.1"
|
||||
|
||||
@@ -225,6 +225,14 @@
|
||||
>
|
||||
<i class="material-icons">photo_filter</i>
|
||||
</button>
|
||||
<button
|
||||
class="icon"
|
||||
@click="saveRequest"
|
||||
ref="saveRequest"
|
||||
v-tooltip.bottom="$t('save_to_collections')"
|
||||
>
|
||||
<i class="material-icons">create_new_folder</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<GraphqlQueryEditor
|
||||
@@ -402,11 +410,11 @@
|
||||
/>
|
||||
</SmartTab>
|
||||
|
||||
<!-- <SmartTab :id="'collections'" :label="$t('collections')">
|
||||
<Collections />
|
||||
<SmartTab :id="'collections'" :label="$t('collections')">
|
||||
<CollectionsGraphql />
|
||||
</SmartTab>
|
||||
|
||||
<SmartTab :id="'env'" :label="$t('environments')">
|
||||
<!-- <SmartTab :id="'env'" :label="$t('environments')">
|
||||
<Environments @use-environment="useSelectedEnvironment($event)" />
|
||||
</SmartTab>
|
||||
|
||||
@@ -416,6 +424,11 @@
|
||||
</SmartTabs>
|
||||
</aside>
|
||||
</div>
|
||||
<CollectionsGraphqlSaveRequest
|
||||
:show="showSaveRequestModal"
|
||||
@hide-modal="hideRequestModal"
|
||||
:editing-request="editRequest"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -454,6 +467,8 @@ export default {
|
||||
isPollingSchema: false,
|
||||
timeoutSubscription: null,
|
||||
activeSidebar: true,
|
||||
editRequest: {},
|
||||
showSaveRequestModal: false,
|
||||
|
||||
settings: {
|
||||
SCROLL_INTO_ENABLED:
|
||||
@@ -463,7 +478,22 @@ export default {
|
||||
},
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
selectedRequest(newValue) {
|
||||
if (!newValue) return
|
||||
this.url = newValue.url
|
||||
this.gqlQueryString = newValue.query
|
||||
this.headers = newValue.headers
|
||||
this.variableString = newValue.variables
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
selectedRequest() {
|
||||
return this.$store.state.postwoman.selectedGraphqlRequest
|
||||
},
|
||||
editingRequest() {
|
||||
return this.$store.state.postwoman.editingRequest
|
||||
},
|
||||
filteredQueryFields() {
|
||||
return this.getFilteredGraphqlFields({
|
||||
filterText: this.graphqlFieldsFilterText,
|
||||
@@ -553,6 +583,19 @@ export default {
|
||||
next()
|
||||
},
|
||||
methods: {
|
||||
hideRequestModal() {
|
||||
this.showSaveRequestModal = false
|
||||
this.editRequest = {}
|
||||
},
|
||||
saveRequest() {
|
||||
this.editRequest = {
|
||||
url: this.url,
|
||||
query: this.gqlQueryString,
|
||||
headers: this.headers,
|
||||
variables: this.variableString,
|
||||
}
|
||||
this.showSaveRequestModal = true
|
||||
},
|
||||
useSelectedEnvironment(event) {
|
||||
console.log("use selected environment")
|
||||
},
|
||||
|
||||
@@ -256,7 +256,14 @@ export default {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)),
|
||||
"collections"
|
||||
)
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collectionsGraphql)),
|
||||
"collectionsGraphql"
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -49,6 +49,13 @@ export const state = () => ({
|
||||
requests: [],
|
||||
},
|
||||
],
|
||||
collectionsGraphql: [
|
||||
{
|
||||
name: "My GraphQL Collection",
|
||||
folders: [],
|
||||
requests: [],
|
||||
},
|
||||
],
|
||||
environments: [
|
||||
{
|
||||
name: "My Environment Variables",
|
||||
@@ -57,6 +64,7 @@ export const state = () => ({
|
||||
],
|
||||
editingEnvironment: {},
|
||||
selectedRequest: {},
|
||||
selectedGraphqlRequest: {},
|
||||
editingRequest: {},
|
||||
})
|
||||
|
||||
@@ -150,12 +158,18 @@ export const mutations = {
|
||||
environments[environmentIndex] = environment
|
||||
},
|
||||
|
||||
replaceCollections(state, collections) {
|
||||
state.collections = collections
|
||||
replaceCollections(state, item) {
|
||||
let collections = item.data
|
||||
const flag = item.flag
|
||||
if (flag == "rest") state.collections = collections
|
||||
else state.collectionsGraphql = collections
|
||||
},
|
||||
|
||||
importCollections(state, collections) {
|
||||
state.collections = [...state.collections, ...collections]
|
||||
importCollections(state, item) {
|
||||
let collections = item.data
|
||||
const flag = item.flag
|
||||
if (flag == "rest") state.collections = [...state.collections, ...collections]
|
||||
else state.collectionsGraphql = [...state.collectionsGraphql, ...collections]
|
||||
|
||||
let index = 0
|
||||
for (let collection of collections) {
|
||||
@@ -164,44 +178,69 @@ export const mutations = {
|
||||
}
|
||||
},
|
||||
|
||||
addNewCollection({ collections }, collection) {
|
||||
const { name } = collection
|
||||
const duplicateCollection = collections.some(
|
||||
addNewCollection({ collections, collectionsGraphql }, collection) {
|
||||
const name = collection.name
|
||||
const flag = collection.flag
|
||||
let duplicateCollection = null
|
||||
if (flag == "rest") {
|
||||
duplicateCollection = collections.some(
|
||||
(item) => item.name.toLowerCase() === name.toLowerCase()
|
||||
)
|
||||
} else {
|
||||
duplicateCollection = collectionsGraphql.some(
|
||||
(item) => item.name.toLowerCase() === name.toLowerCase()
|
||||
)
|
||||
}
|
||||
if (duplicateCollection) {
|
||||
this.$toast.info("Duplicate collection")
|
||||
return
|
||||
}
|
||||
if (flag == "rest") {
|
||||
collections.push({
|
||||
name: "",
|
||||
folders: [],
|
||||
requests: [],
|
||||
...collection,
|
||||
})
|
||||
} else {
|
||||
collectionsGraphql.push({
|
||||
name: "",
|
||||
folders: [],
|
||||
requests: [],
|
||||
...collection,
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
removeCollection({ collections }, payload) {
|
||||
const { collectionIndex } = payload
|
||||
collections.splice(collectionIndex, 1)
|
||||
removeCollection({ collections, collectionsGraphql }, payload) {
|
||||
const { collectionIndex, flag } = payload
|
||||
if (flag == "rest") collections.splice(collectionIndex, 1)
|
||||
else collectionsGraphql.splice(collectionIndex, 1)
|
||||
},
|
||||
|
||||
editCollection({ collections }, payload) {
|
||||
const { collection, collectionIndex } = payload
|
||||
editCollection({ collections, collectionsGraphql }, payload) {
|
||||
const { collection, collectionIndex, flag } = payload
|
||||
const { name } = collection
|
||||
const duplicateCollection = collections.some(
|
||||
let duplicateCollection = null
|
||||
if (flag == "rest") {
|
||||
duplicateCollection = collections.some(
|
||||
(item) => item.name.toLowerCase() === name.toLowerCase()
|
||||
)
|
||||
} else {
|
||||
duplicateCollection = collectionsGraphql.some(
|
||||
(item) => item.name.toLowerCase() === name.toLowerCase()
|
||||
)
|
||||
}
|
||||
if (duplicateCollection) {
|
||||
this.$toast.info("Duplicate collection")
|
||||
return
|
||||
}
|
||||
collections[collectionIndex] = collection
|
||||
if (flag == "rest") collections[collectionIndex] = collection
|
||||
else collectionsGraphql[collectionIndex] = collection
|
||||
},
|
||||
|
||||
addFolder({ collections }, payload) {
|
||||
const { name, path } = payload
|
||||
|
||||
addFolder({ collections, collectionsGraphql }, payload) {
|
||||
const { name, path, flag } = payload
|
||||
const newFolder = {
|
||||
name: name,
|
||||
requests: [],
|
||||
@@ -211,15 +250,20 @@ export const mutations = {
|
||||
// Walk from collections to destination with the path
|
||||
const indexPaths = path.split("/").map((x) => parseInt(x))
|
||||
|
||||
let target = collections[indexPaths.shift()]
|
||||
let target = null
|
||||
if (flag == "rest") target = collections[indexPaths.shift()]
|
||||
else target = collectionsGraphql[indexPaths.shift()]
|
||||
|
||||
while (indexPaths.length > 0) target = target.folders[indexPaths.shift()]
|
||||
|
||||
target.folders.push(newFolder)
|
||||
},
|
||||
|
||||
editFolder({ collections }, payload) {
|
||||
const { collectionIndex, folder, folderIndex, folderName } = payload
|
||||
const collection = collections[collectionIndex]
|
||||
editFolder({ collections, collectionsGraphql }, payload) {
|
||||
const { collectionIndex, folder, folderIndex, folderName, flag } = payload
|
||||
let collection = null
|
||||
if (flag == "rest") collection = collections[collectionIndex]
|
||||
else collection = collectionsGraphql[collectionIndex]
|
||||
|
||||
let parentFolder = findFolder(folderName, collection, true)
|
||||
if (parentFolder && parentFolder.folders) {
|
||||
@@ -227,9 +271,11 @@ export const mutations = {
|
||||
}
|
||||
},
|
||||
|
||||
removeFolder({ collections }, payload) {
|
||||
const { collectionIndex, folderIndex, folderName } = payload
|
||||
const collection = collections[collectionIndex]
|
||||
removeFolder({ collections, collectionsGraphql }, payload) {
|
||||
const { collectionIndex, folderIndex, folderName, flag } = payload
|
||||
let collection = null
|
||||
if (flag == "rest") collection = collections[collectionIndex]
|
||||
else collection = collectionsGraphql[collectionIndex]
|
||||
|
||||
let parentFolder = findFolder(folderName, collection, true)
|
||||
if (parentFolder && parentFolder.folders) {
|
||||
@@ -237,16 +283,18 @@ export const mutations = {
|
||||
}
|
||||
},
|
||||
|
||||
editRequest({ collections }, payload) {
|
||||
editRequest({ collections, collectionsGraphql }, payload) {
|
||||
const {
|
||||
requestCollectionIndex,
|
||||
requestFolderName,
|
||||
requestFolderIndex,
|
||||
requestNew,
|
||||
requestIndex,
|
||||
flag,
|
||||
} = payload
|
||||
|
||||
let collection = collections[requestCollectionIndex]
|
||||
let collection = null
|
||||
if (flag == "rest") collection = collections[requestCollectionIndex]
|
||||
else collection = collectionsGraphql[requestCollectionIndex]
|
||||
|
||||
if (requestFolderIndex === -1) {
|
||||
Vue.set(collection.requests, requestIndex, requestNew)
|
||||
@@ -257,9 +305,10 @@ export const mutations = {
|
||||
Vue.set(folder.requests, requestIndex, requestNew)
|
||||
},
|
||||
|
||||
saveRequestAs({ collections }, payload) {
|
||||
let { request, collectionIndex, folderName, requestIndex } = payload
|
||||
saveRequestAs({ collections, collectionsGraphql }, payload) {
|
||||
let { request, collectionIndex, folderName, requestIndex, flag } = payload
|
||||
|
||||
if (flag == "rest") {
|
||||
// Filter out all file inputs
|
||||
request = {
|
||||
...request,
|
||||
@@ -267,32 +316,47 @@ export const mutations = {
|
||||
param?.value?.[0] instanceof File ? { ...param, value: "" } : param
|
||||
),
|
||||
}
|
||||
}
|
||||
|
||||
const specifiedCollection = collectionIndex !== undefined
|
||||
const specifiedFolder = folderName !== undefined
|
||||
const specifiedRequest = requestIndex !== undefined
|
||||
|
||||
if (specifiedCollection && specifiedFolder && specifiedRequest) {
|
||||
const folder = findFolder(folderName, collections[collectionIndex])
|
||||
const folder = findFolder(
|
||||
folderName,
|
||||
flag == "rest" ? collections[collectionIndex] : collectionsGraphql[collectionIndex]
|
||||
)
|
||||
Vue.set(folder.requests, requestIndex, request)
|
||||
} else if (specifiedCollection && specifiedFolder && !specifiedRequest) {
|
||||
const folder = findFolder(folderName, collections[collectionIndex])
|
||||
const folder = findFolder(
|
||||
folderName,
|
||||
flag == "rest" ? collections[collectionIndex] : collectionsGraphql[collectionIndex]
|
||||
)
|
||||
const requests = folder.requests
|
||||
const lastRequestIndex = requests.length - 1
|
||||
Vue.set(requests, lastRequestIndex + 1, request)
|
||||
} else if (specifiedCollection && !specifiedFolder && specifiedRequest) {
|
||||
const requests = collections[collectionIndex].requests
|
||||
const requests =
|
||||
flag == "rest"
|
||||
? collections[collectionIndex].requests
|
||||
: collectionsGraphql[collectionIndex].requests
|
||||
Vue.set(requests, requestIndex, request)
|
||||
} else if (specifiedCollection && !specifiedFolder && !specifiedRequest) {
|
||||
const requests = collections[collectionIndex].requests
|
||||
const requests =
|
||||
flag == "rest"
|
||||
? collections[collectionIndex].requests
|
||||
: collectionsGraphql[collectionIndex].requests
|
||||
const lastRequestIndex = requests.length - 1
|
||||
Vue.set(requests, lastRequestIndex + 1, request)
|
||||
}
|
||||
},
|
||||
|
||||
removeRequest({ collections }, payload) {
|
||||
const { collectionIndex, folderName, requestIndex } = payload
|
||||
let collection = collections[collectionIndex]
|
||||
removeRequest({ collections, collectionsGraphql }, payload) {
|
||||
const { collectionIndex, folderName, requestIndex, flag } = payload
|
||||
let collection = null
|
||||
if (flag == "rest") collection = collections[collectionIndex]
|
||||
else collection = collectionsGraphql[collectionIndex]
|
||||
|
||||
if (collection.name === folderName) {
|
||||
collection.requests.splice(requestIndex, 1)
|
||||
@@ -309,7 +373,11 @@ export const mutations = {
|
||||
state.selectedRequest = Object.assign({}, request)
|
||||
},
|
||||
|
||||
moveRequest({ collections }, payload) {
|
||||
selectGraphqlRequest(state, { request }) {
|
||||
state.selectedGraphqlRequest = Object.assign({}, request)
|
||||
},
|
||||
|
||||
moveRequest({ collections, collectionsGraphql }, payload) {
|
||||
const {
|
||||
oldCollectionIndex,
|
||||
newCollectionIndex,
|
||||
@@ -317,11 +385,15 @@ export const mutations = {
|
||||
newFolderName,
|
||||
oldFolderName,
|
||||
requestIndex,
|
||||
flag,
|
||||
} = payload
|
||||
|
||||
const isCollection = newFolderIndex === -1
|
||||
const oldCollection = collections[oldCollectionIndex]
|
||||
const newCollection = collections[newCollectionIndex]
|
||||
let oldCollection = null
|
||||
if (flag == "rest") oldCollection = collections[oldCollectionIndex]
|
||||
else oldCollection = collectionsGraphql[oldCollectionIndex]
|
||||
let newCollection = null
|
||||
if (flag == "rest") newCollection = collections[newCollectionIndex]
|
||||
else newCollection = collectionsGraphql[newCollectionIndex]
|
||||
const request = findRequest(oldFolderName, oldCollection, requestIndex)
|
||||
|
||||
if (isCollection) {
|
||||
|
||||
Reference in New Issue
Block a user