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

Initial prettier formatted files

Browse Source
This commit is contained in:
Dmitry Yankowski
2020-02-24 13:44:50 -05:00
parent 1543c990ca
commit 777e629b3d
83 changed files with 18556 additions and 19258 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
components/ace-editor.vue
View File

@@ -3,89 +3,87 @@
</template>
<script>
const DEFAULT_THEME = "twilight";
const DEFAULT_THEME = 'twilight'
import ace from "ace-builds";
import "ace-builds/webpack-resolver";
import ace from 'ace-builds'
import 'ace-builds/webpack-resolver'
export default {
props: {
value: {
type: String,
default: ""
default: '',
},
theme: {
type: String,
required: false
required: false,
},
lang: {
type: String,
default: "json"
default: 'json',
},
options: {
type: Object,
default: {}
}
default: {},
},
},
data() {
return {
editor: null,
cacheValue: ""
};
cacheValue: '',
}
},
watch: {
value(value) {
if (value !== this.cacheValue) {
this.editor.session.setValue(value, 1);
this.cacheValue = value;
this.editor.session.setValue(value, 1)
this.cacheValue = value
}
},
theme() {
this.editor.setTheme("ace/theme/" + this.defineTheme());
this.editor.setTheme('ace/theme/' + this.defineTheme())
},
lang(value) {
this.editor.getSession().setMode("ace/mode/" + value);
this.editor.getSession().setMode('ace/mode/' + value)
},
options(value) {
this.editor.setOptions(value);
}
this.editor.setOptions(value)
},
},
mounted() {
const editor = ace.edit(this.$refs.editor, {
theme: `ace/theme/${this.defineTheme()}`,
mode: `ace/mode/${this.lang}`,
...this.options
});
...this.options,
})
if (this.value) editor.setValue(this.value, 1);
if (this.value) editor.setValue(this.value, 1)
this.editor = editor;
this.cacheValue = this.value;
this.editor = editor
this.cacheValue = this.value
editor.on("change", () => {
const content = editor.getValue();
this.$emit("input", content);
this.cacheValue = content;
});
editor.on('change', () => {
const content = editor.getValue()
this.$emit('input', content)
this.cacheValue = content
})
},
methods: {
defineTheme() {
if (this.theme) {
return this.theme;
return this.theme
}
return (
this.$store.state.postwoman.settings.THEME_ACE_EDITOR || DEFAULT_THEME
);
}
return this.$store.state.postwoman.settings.THEME_ACE_EDITOR || DEFAULT_THEME
},
},
beforeDestroy() {
this.editor.destroy();
this.editor.container.remove();
}
};
this.editor.destroy()
this.editor.container.remove()
},
}
</script>

100
components/autocomplete.vue
View File

@@ -57,7 +57,7 @@
display: block;
padding: 8px 16px;
font-size: 16px;
font-family: "Roboto Mono", monospace;
font-family: 'Roboto Mono', monospace;
font-weight: 400;
&:last-child {
@@ -76,42 +76,42 @@
</style>
<script>
const KEY_TAB = 9;
const KEY_ESC = 27;
const KEY_TAB = 9
const KEY_ESC = 27
const KEY_ARROW_UP = 38;
const KEY_ARROW_DOWN = 40;
const KEY_ARROW_UP = 38
const KEY_ARROW_DOWN = 40
export default {
props: {
spellcheck: {
type: Boolean,
default: true,
required: false
required: false,
},
placeholder: {
type: String,
default: "",
required: false
default: '',
required: false,
},
source: {
type: Array,
required: true
required: true,
},
value: {
type: String,
default: "",
required: false
}
default: '',
required: false,
},
},
watch: {
text() {
this.$emit("input", this.text);
}
this.$emit('input', this.text)
},
},
data() {
@@ -120,69 +120,67 @@ export default {
selectionStart: 0,
suggestionsOffsetLeft: 0,
currentSuggestionIndex: -1,
suggestionsVisible: false
};
suggestionsVisible: false,
}
},
methods: {
updateSuggestions(event) {
// Hide suggestions if ESC pressed.
if (event.which && event.which === KEY_ESC) {
event.preventDefault();
this.suggestionsVisible = false;
this.currentSuggestionIndex = -1;
return;
event.preventDefault()
this.suggestionsVisible = false
this.currentSuggestionIndex = -1
return
}
// As suggestions is a reactive property, this implicitly
// causes suggestions to update.
this.selectionStart = this.$refs.acInput.selectionStart;
this.suggestionsOffsetLeft = 12 * this.selectionStart;
this.suggestionsVisible = true;
this.selectionStart = this.$refs.acInput.selectionStart
this.suggestionsOffsetLeft = 12 * this.selectionStart
this.suggestionsVisible = true
},
forceSuggestion(text) {
let input = this.text.substring(0, this.selectionStart);
this.text = input + text;
let input = this.text.substring(0, this.selectionStart)
this.text = input + text
this.selectionStart = this.text.length;
this.suggestionsVisible = true;
this.currentSuggestionIndex = -1;
this.selectionStart = this.text.length
this.suggestionsVisible = true
this.currentSuggestionIndex = -1
},
handleKeystroke(event) {
switch (event.which) {
case KEY_ARROW_UP:
event.preventDefault();
event.preventDefault()
this.currentSuggestionIndex =
this.currentSuggestionIndex - 1 >= 0
? this.currentSuggestionIndex - 1
: 0;
break;
this.currentSuggestionIndex - 1 >= 0 ? this.currentSuggestionIndex - 1 : 0
break
case KEY_ARROW_DOWN:
event.preventDefault();
event.preventDefault()
this.currentSuggestionIndex =
this.currentSuggestionIndex < this.suggestions.length - 1
? this.currentSuggestionIndex + 1
: this.suggestions.length - 1;
break;
: this.suggestions.length - 1
break
case KEY_TAB:
event.preventDefault();
event.preventDefault()
let activeSuggestion = this.suggestions[
this.currentSuggestionIndex >= 0 ? this.currentSuggestionIndex : 0
];
]
if (activeSuggestion) {
let input = this.text.substring(0, this.selectionStart);
this.text = input + activeSuggestion;
let input = this.text.substring(0, this.selectionStart)
this.text = input + activeSuggestion
}
break;
break
default:
break;
break
}
}
},
},
computed: {
@@ -192,7 +190,7 @@ export default {
* @returns {default.props.source|{type, required}}
*/
suggestions() {
let input = this.text.substring(0, this.selectionStart);
let input = this.text.substring(0, this.selectionStart)
return (
this.source
@@ -200,20 +198,20 @@ export default {
return (
entry.toLowerCase().startsWith(input.toLowerCase()) &&
input.toLowerCase() !== entry.toLowerCase()
);
)
})
// Cut off the part that's already been typed.
.map(entry => entry.substring(this.selectionStart))
// We only want the top 6 suggestions.
.slice(0, 6)
);
}
)
},
},
mounted() {
this.updateSuggestions({
target: this.$refs.acInput
});
}
};
target: this.$refs.acInput,
})
},
}
</script>

42
components/collections/addCollection.vue
View File

@@ -4,7 +4,7 @@
<ul>
<li>
<div class="flex-wrap">
<h3 class="title">{{ $t("new_collection") }}</h3>
<h3 class="title">{{ $t('new_collection') }}</h3>
<div>
<button class="icon" @click="hideModal">
<i class="material-icons">close</i>
@@ -31,10 +31,10 @@
<span></span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
{{ $t('cancel') }}
</button>
<button class="icon primary" @click="addNewCollection">
{{ $t("save") }}
{{ $t('save') }}
</button>
</span>
</div>
@@ -43,44 +43,42 @@
</template>
<script>
import { fb } from "../../functions/fb";
import { fb } from '../../functions/fb'
export default {
props: {
show: Boolean
show: Boolean,
},
components: {
modal: () => import("../../components/modal")
modal: () => import('../../components/modal'),
},
data() {
return {
name: undefined
};
name: undefined,
}
},
methods: {
syncCollections() {
if (fb.currentUser !== null) {
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)))
}
}
},
addNewCollection() {
if (!this.$data.name) {
this.$toast.info($t("invalid_collection_name"));
return;
this.$toast.info($t('invalid_collection_name'))
return
}
this.$store.commit("postwoman/addNewCollection", {
name: this.$data.name
});
this.$emit("hide-modal");
this.syncCollections();
this.$store.commit('postwoman/addNewCollection', {
name: this.$data.name,
})
this.$emit('hide-modal')
this.syncCollections()
},
hideModal() {
this.$emit("hide-modal");
}
}
};
this.$emit('hide-modal')
},
},
}
</script>

30
components/collections/addFolder.vue
View File

@@ -4,7 +4,7 @@
<ul>
<li>
<div class="flex-wrap">
<h3 class="title">{{ $t("new_folder") }}</h3>
<h3 class="title">{{ $t('new_folder') }}</h3>
<div>
<button class="icon" @click="hideModal">
<i class="material-icons">close</i>
@@ -31,10 +31,10 @@
<span></span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
{{ $t('cancel') }}
</button>
<button class="icon primary" @click="addNewFolder">
{{ $t("save") }}
{{ $t('save') }}
</button>
</span>
</div>
@@ -47,27 +47,27 @@ export default {
props: {
show: Boolean,
collection: Object,
collectionIndex: Number
collectionIndex: Number,
},
components: {
modal: () => import("../../components/modal")
modal: () => import('../../components/modal'),
},
data() {
return {
name: undefined
};
name: undefined,
}
},
methods: {
addNewFolder() {
this.$store.commit("postwoman/addNewFolder", {
this.$store.commit('postwoman/addNewFolder', {
folder: { name: this.$data.name },
collectionIndex: this.$props.collectionIndex
});
this.hideModal();
collectionIndex: this.$props.collectionIndex,
})
this.hideModal()
},
hideModal() {
this.$emit("hide-modal");
}
}
};
this.$emit('hide-modal')
},
},
}
</script>

50
components/collections/collection.vue
View File

@@ -17,23 +17,19 @@
<div>
<button class="icon" @click="$emit('add-folder')" v-close-popover>
<i class="material-icons">create_new_folder</i>
<span>{{ $t("new_folder") }}</span>
<span>{{ $t('new_folder') }}</span>
</button>
</div>
<div>
<button
class="icon"
@click="$emit('edit-collection')"
v-close-popover
>
<button class="icon" @click="$emit('edit-collection')" v-close-popover>
<i class="material-icons">create</i>
<span>{{ $t("edit") }}</span>
<span>{{ $t('edit') }}</span>
</button>
</div>
<div>
<button class="icon" @click="removeCollection" v-close-popover>
<i class="material-icons">delete</i>
<span>{{ $t("delete") }}</span>
<span>{{ $t('delete') }}</span>
</button>
</div>
</template>
@@ -51,12 +47,8 @@
@edit-request="$emit('edit-request', $event)"
/>
</li>
<li
v-if="
collection.folders.length === 0 && collection.requests.length === 0
"
>
<label>{{ $t("collection_empty") }}</label>
<li v-if="collection.folders.length === 0 && collection.requests.length === 0">
<label>{{ $t('collection_empty') }}</label>
</li>
</ul>
<ul>
@@ -71,7 +63,7 @@
request,
collectionIndex,
folderIndex: undefined,
requestIndex: index
requestIndex: index,
})
"
/>
@@ -97,32 +89,32 @@ ul li {
<script>
export default {
components: {
folder: () => import("./folder"),
request: () => import("./request")
folder: () => import('./folder'),
request: () => import('./request'),
},
props: {
collectionIndex: Number,
collection: Object
collection: Object,
},
data() {
return {
showChildren: false,
selectedFolder: {}
};
selectedFolder: {},
}
},
methods: {
toggleShowChildren() {
this.showChildren = !this.showChildren;
this.showChildren = !this.showChildren
},
removeCollection() {
if (!confirm("Are you sure you want to remove this Collection?")) return;
this.$store.commit("postwoman/removeCollection", {
collectionIndex: this.collectionIndex
});
if (!confirm('Are you sure you want to remove this Collection?')) return
this.$store.commit('postwoman/removeCollection', {
collectionIndex: this.collectionIndex,
})
},
editFolder(collectionIndex, folder, folderIndex) {
this.$emit("edit-folder", { collectionIndex, folder, folderIndex });
}
}
};
this.$emit('edit-folder', { collectionIndex, folder, folderIndex })
},
},
}
</script>

38
components/collections/editCollection.vue
View File

@@ -4,7 +4,7 @@
<ul>
<li>
<div class="flex-wrap">
<h3 class="title">{{ $t("edit_collection") }}</h3>
<h3 class="title">{{ $t('edit_collection') }}</h3>
<div>
<button class="icon" @click="hideModal">
<i class="material-icons">close</i>
@@ -31,10 +31,10 @@
<span></span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
{{ $t('cancel') }}
</button>
<button class="icon primary" @click="saveCollection">
{{ $t("save") }}
{{ $t('save') }}
</button>
</span>
</div>
@@ -47,35 +47,35 @@ export default {
props: {
show: Boolean,
editingCollection: Object,
editingCollectionIndex: Number
editingCollectionIndex: Number,
},
components: {
modal: () => import("../../components/modal")
modal: () => import('../../components/modal'),
},
data() {
return {
name: undefined
};
name: undefined,
}
},
methods: {
saveCollection() {
if (!this.$data.name) {
this.$toast.info($t("invalid_collection_name"));
return;
this.$toast.info($t('invalid_collection_name'))
return
}
const collectionUpdated = {
...this.$props.editingCollection,
name: this.$data.name
};
this.$store.commit("postwoman/editCollection", {
name: this.$data.name,
}
this.$store.commit('postwoman/editCollection', {
collection: collectionUpdated,
collectionIndex: this.$props.editingCollectionIndex
});
this.$emit("hide-modal");
collectionIndex: this.$props.editingCollectionIndex,
})
this.$emit('hide-modal')
},
hideModal() {
this.$emit("hide-modal");
}
}
};
this.$emit('hide-modal')
},
},
}
</script>

37
components/collections/editFolder.vue
View File

@@ -4,7 +4,7 @@
<ul>
<li>
<div class="flex-wrap">
<h3 class="title">{{ $t("edit_folder") }}</h3>
<h3 class="title">{{ $t('edit_folder') }}</h3>
<div>
<button class="icon" @click="hideModal">
<i class="material-icons">close</i>
@@ -17,12 +17,7 @@
<div slot="body">
<ul>
<li>
<input
type="text"
v-model="name"
:placeholder="folder.name"
@keyup.enter="editFolder"
/>
<input type="text" v-model="name" :placeholder="folder.name" @keyup.enter="editFolder" />
</li>
</ul>
</div>
@@ -31,10 +26,10 @@
<span></span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
{{ $t('cancel') }}
</button>
<button class="icon primary" @click="editFolder">
{{ $t("save") }}
{{ $t('save') }}
</button>
</span>
</div>
@@ -49,28 +44,28 @@ export default {
collection: Object,
collectionIndex: Number,
folder: Object,
folderIndex: Number
folderIndex: Number,
},
components: {
modal: () => import("../../components/modal")
modal: () => import('../../components/modal'),
},
data() {
return {
name: undefined
};
name: undefined,
}
},
methods: {
editFolder() {
this.$store.commit("postwoman/editFolder", {
this.$store.commit('postwoman/editFolder', {
collectionIndex: this.$props.collectionIndex,
folder: { ...this.$props.folder, name: this.$data.name },
folderIndex: this.$props.folderIndex
});
this.hideModal();
folderIndex: this.$props.folderIndex,
})
this.hideModal()
},
hideModal() {
this.$emit("hide-modal");
}
}
};
this.$emit('hide-modal')
},
},
}
</script>

95
components/collections/editRequest.vue
View File

@@ -4,7 +4,7 @@
<ul>
<li>
<div class="flex-wrap">
<h3 class="title">{{ $t("edit_request") }}</h3>
<h3 class="title">{{ $t('edit_request') }}</h3>
<div>
<button class="icon" @click="hideModal">
<i class="material-icons">close</i>
@@ -17,7 +17,7 @@
<div slot="body">
<ul>
<li>
<label for="selectLabel">{{ $t("label") }}</label>
<label for="selectLabel">{{ $t('label') }}</label>
<input
type="text"
id="selectLabel"
@@ -25,24 +25,14 @@
@keyup.enter="saveRequest"
:placeholder="request.name"
/>
<label for="selectCollection">{{ $t("collection") }}</label>
<label for="selectCollection">{{ $t('collection') }}</label>
<span class="select-wrapper">
<select
type="text"
id="selectCollection"
v-model="requestUpdateData.collectionIndex"
>
<select type="text" id="selectCollection" v-model="requestUpdateData.collectionIndex">
<option :key="undefined" :value="undefined" hidden disabled selected>{{
$t('current_collection')
}}</option>
<option
:key="undefined"
:value="undefined"
hidden
disabled
selected
>{{ $t("current_collection") }}</option
>
<option
v-for="(collection, index) in $store.state.postwoman
.collections"
v-for="(collection, index) in $store.state.postwoman.collections"
:key="index"
:value="index"
>
@@ -50,19 +40,11 @@
</option>
</select>
</span>
<label for="selectFolder">{{ $t("folder") }}</label>
<label for="selectFolder">{{ $t('folder') }}</label>
<span class="select-wrapper">
<select
type="text"
id="selectFolder"
v-model="requestUpdateData.folderIndex"
>
<select type="text" id="selectFolder" v-model="requestUpdateData.folderIndex">
<option :key="undefined" :value="undefined">/</option>
<option
v-for="(folder, index) in folders"
:key="index"
:value="index"
>
<option v-for="(folder, index) in folders" :key="index" :value="index">
{{ folder.name }}
</option>
</select>
@@ -75,10 +57,10 @@
<span></span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
{{ $t('cancel') }}
</button>
<button class="icon primary" @click="saveRequest">
{{ $t("save") }}
{{ $t('save') }}
</button>
</span>
</div>
@@ -93,42 +75,39 @@ export default {
collectionIndex: Number,
folderIndex: Number,
request: Object,
requestIndex: Number
requestIndex: Number,
},
components: {
modal: () => import("../../components/modal")
modal: () => import('../../components/modal'),
},
data() {
return {
requestUpdateData: {
name: undefined,
collectionIndex: undefined,
folderIndex: undefined
}
};
folderIndex: undefined,
},
}
},
watch: {
"requestUpdateData.collectionIndex": function resetFolderIndex() {
'requestUpdateData.collectionIndex': function resetFolderIndex() {
// if user choosen some folder, than selected other collection, which doesn't have any folders
// than `requestUpdateData.folderIndex` won't be reseted
this.$data.requestUpdateData.folderIndex = undefined;
}
this.$data.requestUpdateData.folderIndex = undefined
},
},
computed: {
folders() {
const userSelectedAnyCollection =
this.$data.requestUpdateData.collectionIndex !== undefined;
if (!userSelectedAnyCollection) return [];
const userSelectedAnyCollection = this.$data.requestUpdateData.collectionIndex !== undefined
if (!userSelectedAnyCollection) return []
return this.$store.state.postwoman.collections[
this.$data.requestUpdateData.collectionIndex
].folders;
}
return this.$store.state.postwoman.collections[this.$data.requestUpdateData.collectionIndex]
.folders
},
},
methods: {
saveRequest() {
const userSelectedAnyCollection =
this.$data.requestUpdateData.collectionIndex !== undefined;
const userSelectedAnyCollection = this.$data.requestUpdateData.collectionIndex !== undefined
const requestUpdated = {
...this.$props.request,
@@ -136,25 +115,25 @@ export default {
collection: userSelectedAnyCollection
? this.$data.requestUpdateData.collectionIndex
: this.$props.collectionIndex,
folder: this.$data.requestUpdateData.folderIndex
};
folder: this.$data.requestUpdateData.folderIndex,
}
// pass data separately to don't depend on request's collection, folder fields
// probably, they should be deprecated because they don't describe request itself
this.$store.commit("postwoman/editRequest", {
this.$store.commit('postwoman/editRequest', {
requestOldCollectionIndex: this.$props.collectionIndex,
requestOldFolderIndex: this.$props.folderIndex,
requestOldIndex: this.$props.requestIndex,
requestNew: requestUpdated,
requestNewCollectionIndex: requestUpdated.collection,
requestNewFolderIndex: requestUpdated.folder
});
requestNewFolderIndex: requestUpdated.folder,
})
this.hideModal();
this.hideModal()
},
hideModal() {
this.$emit("hide-modal");
}
}
};
this.$emit('hide-modal')
},
},
}
</script>

36
components/collections/folder.vue
View File

@@ -17,13 +17,13 @@
<div>
<button class="icon" @click="editFolder" v-close-popover>
<i class="material-icons">edit</i>
<span>{{ $t("edit") }}</span>
<span>{{ $t('edit') }}</span>
</button>
</div>
<div>
<button class="icon" @click="removeFolder" v-close-popover>
<i class="material-icons">delete</i>
<span>{{ $t("delete") }}</span>
<span>{{ $t('delete') }}</span>
</button>
</div>
</template>
@@ -43,13 +43,13 @@
request,
collectionIndex,
folderIndex,
requestIndex: index
requestIndex: index,
})
"
/>
</li>
<li v-if="folder.requests.length === 0">
<label>{{ $t("folder_empty") }}</label>
<label>{{ $t('folder_empty') }}</label>
</li>
</ul>
</div>
@@ -74,33 +74,33 @@ export default {
props: {
folder: Object,
collectionIndex: Number,
folderIndex: Number
folderIndex: Number,
},
components: {
request: () => import("./request")
request: () => import('./request'),
},
data() {
return {
showChildren: false
};
showChildren: false,
}
},
methods: {
toggleShowChildren() {
this.showChildren = !this.showChildren;
this.showChildren = !this.showChildren
},
selectRequest(request) {
this.$store.commit("postwoman/selectRequest", { request });
this.$store.commit('postwoman/selectRequest', { request })
},
removeFolder() {
if (!confirm("Are you sure you want to remove this folder?")) return;
this.$store.commit("postwoman/removeFolder", {
if (!confirm('Are you sure you want to remove this folder?')) return
this.$store.commit('postwoman/removeFolder', {
collectionIndex: this.collectionIndex,
folderIndex: this.folderIndex
});
folderIndex: this.folderIndex,
})
},
editFolder() {
this.$emit("edit-folder");
}
}
};
this.$emit('edit-folder')
},
},
}
</script>

290
components/collections/importExportCollections.vue
View File

@@ -14,18 +14,12 @@
<div class="flex-wrap">
<span
v-tooltip="{
content: !fb.currentUser
? $t('login_first')
: $t('replace_current')
content: !fb.currentUser ? $t('login_first') : $t('replace_current'),
}"
>
<button
:disabled="!fb.currentUser"
class="icon"
@click="syncCollections"
>
<button :disabled="!fb.currentUser" class="icon" @click="syncCollections">
<i class="material-icons">folder_shared</i>
<span>{{ $t("import_from_sync") }}</span>
<span>{{ $t('import_from_sync') }}</span>
</button>
</span>
<button
@@ -34,7 +28,7 @@
v-tooltip="$t('replace_current')"
>
<i class="material-icons">create_new_folder</i>
<span>{{ $t("replace_json") }}</span>
<span>{{ $t('replace_json') }}</span>
<input
type="file"
@change="replaceWithJSON"
@@ -49,7 +43,7 @@
v-tooltip="$t('preserve_current')"
>
<i class="material-icons">folder_special</i>
<span>{{ $t("import_json") }}</span>
<span>{{ $t('import_json') }}</span>
<input
type="file"
@change="importFromJSON"
@@ -70,14 +64,10 @@
<span></span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
{{ $t('cancel') }}
</button>
<button
class="icon primary"
@click="exportJSON"
v-tooltip="$t('download_file')"
>
{{ $t("export") }}
<button class="icon primary" @click="exportJSON" v-tooltip="$t('download_file')">
{{ $t('export') }}
</button>
</span>
</div>
@@ -86,239 +76,211 @@
</template>
<script>
import { fb } from "../../functions/fb";
import { fb } from '../../functions/fb'
export default {
data() {
return {
fb
};
fb,
}
},
props: {
show: Boolean
show: Boolean,
},
components: {
modal: () => import("../../components/modal")
modal: () => import('../../components/modal'),
},
computed: {
collectionJson() {
return JSON.stringify(this.$store.state.postwoman.collections, null, 2);
}
return JSON.stringify(this.$store.state.postwoman.collections, null, 2)
},
},
methods: {
hideModal() {
this.$emit("hide-modal");
this.$emit('hide-modal')
},
openDialogChooseFileToReplaceWith() {
this.$refs.inputChooseFileToReplaceWith.click();
this.$refs.inputChooseFileToReplaceWith.click()
},
openDialogChooseFileToImportFrom() {
this.$refs.inputChooseFileToImportFrom.click();
this.$refs.inputChooseFileToImportFrom.click()
},
replaceWithJSON() {
let reader = new FileReader();
let reader = new FileReader()
reader.onload = event => {
let content = event.target.result;
let collections = JSON.parse(content);
let content = event.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"
) {
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 if (collections.info && collections.info.schema.includes('v2.1.0')) {
collections = this.parsePostmanCollection(collections)
} else {
return this.failedImport();
return this.failedImport()
}
this.$store.commit("postwoman/importCollections", collections);
this.fileImported();
};
reader.readAsText(this.$refs.inputChooseFileToReplaceWith.files[0]);
this.$store.commit('postwoman/importCollections', collections)
this.fileImported()
}
reader.readAsText(this.$refs.inputChooseFileToReplaceWith.files[0])
},
importFromJSON() {
let reader = new FileReader();
let reader = new FileReader()
reader.onload = event => {
let content = event.target.result;
let collections = JSON.parse(content);
let content = event.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"
) {
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 if (collections.info && collections.info.schema.includes('v2.1.0')) {
collections = this.parsePostmanCollection(collections)
} else {
return this.failedImport();
return this.failedImport()
}
this.$store.commit("postwoman/importCollections", collections);
this.fileImported();
};
reader.readAsText(this.$refs.inputChooseFileToImportFrom.files[0]);
this.$store.commit('postwoman/importCollections', collections)
this.fileImported()
}
reader.readAsText(this.$refs.inputChooseFileToImportFrom.files[0])
},
exportJSON() {
let text = this.collectionJson;
text = text.replace(/\n/g, "\r\n");
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 = "postwoman-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"
});
type: 'text/json',
})
let anchor = document.createElement('a')
anchor.download = 'postwoman-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", fb.currentCollections);
this.fileImported();
this.$store.commit('postwoman/replaceCollections', fb.currentCollections)
this.fileImported()
},
fileImported() {
this.$toast.info(this.$t("file_imported"), {
icon: "folder_shared"
});
this.$toast.info(this.$t('file_imported'), {
icon: 'folder_shared',
})
},
failedImport() {
this.$toast.error(this.$t("import_failed"), {
icon: "error"
});
this.$toast.error(this.$t('import_failed'), {
icon: 'error',
})
},
parsePostmanCollection(collection, folders = true) {
let postwomanCollection = folders
? [
{
name: "",
name: '',
folders: [],
requests: []
}
requests: [],
},
]
: {
name: "",
requests: []
};
name: '',
requests: [],
}
for (let collectionItem of collection.item) {
if (collectionItem.request) {
if (postwomanCollection[0]) {
postwomanCollection[0].name = collection.info
? collection.info.name
: "";
postwomanCollection[0].requests.push(
this.parsePostmanRequest(collectionItem)
);
postwomanCollection[0].name = collection.info ? collection.info.name : ''
postwomanCollection[0].requests.push(this.parsePostmanRequest(collectionItem))
} else {
postwomanCollection.name = collection.name ? collection.name : "";
postwomanCollection.requests.push(
this.parsePostmanRequest(collectionItem)
);
postwomanCollection.name = collection.name ? collection.name : ''
postwomanCollection.requests.push(this.parsePostmanRequest(collectionItem))
}
} else if (collectionItem.item) {
if (collectionItem.item[0]) {
postwomanCollection[0].folders.push(
this.parsePostmanCollection(collectionItem, false)
);
postwomanCollection[0].folders.push(this.parsePostmanCollection(collectionItem, false))
}
}
}
return postwomanCollection;
return postwomanCollection
},
parsePostmanRequest(requestObject) {
let pwRequest = {
url: "",
path: "",
method: "",
auth: "",
httpUser: "",
httpPassword: "",
passwordFieldType: "password",
bearerToken: "",
url: '',
path: '',
method: '',
auth: '',
httpUser: '',
httpPassword: '',
passwordFieldType: 'password',
bearerToken: '',
headers: [],
params: [],
bodyParams: [],
rawParams: "",
rawParams: '',
rawInput: false,
contentType: "",
requestType: "",
name: ""
};
contentType: '',
requestType: '',
name: '',
}
pwRequest.name = requestObject.name;
pwRequest.name = requestObject.name
let requestObjectUrl = requestObject.request.url.raw.match(
/^(.+:\/\/[^\/]+|{[^\/]+})(\/[^\?]+|).*$/
);
pwRequest.url = requestObjectUrl[1];
pwRequest.path = requestObjectUrl[2] ? requestObjectUrl[2] : "";
pwRequest.method = requestObject.request.method;
let itemAuth = requestObject.request.auth
? requestObject.request.auth
: "";
let authType = itemAuth ? itemAuth.type : "";
if (authType === "basic") {
pwRequest.auth = "Basic Auth";
)
pwRequest.url = requestObjectUrl[1]
pwRequest.path = requestObjectUrl[2] ? requestObjectUrl[2] : ''
pwRequest.method = requestObject.request.method
let itemAuth = requestObject.request.auth ? requestObject.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;
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";
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].key === 'accessToken'
? itemAuth.oauth2[0].value
: itemAuth.oauth2[1].value;
} else if (authType === "bearer") {
pwRequest.auth = "Bearer Token";
pwRequest.bearerToken = itemAuth.bearer[0].value;
: itemAuth.oauth2[1].value
} else if (authType === 'bearer') {
pwRequest.auth = 'Bearer Token'
pwRequest.bearerToken = itemAuth.bearer[0].value
}
let requestObjectHeaders = requestObject.request.header;
let requestObjectHeaders = requestObject.request.header
if (requestObjectHeaders) {
pwRequest.headers = requestObjectHeaders;
pwRequest.headers = requestObjectHeaders
for (let header of pwRequest.headers) {
delete header.name;
delete header.type;
delete header.name
delete header.type
}
}
let requestObjectParams = requestObject.request.url.query;
let requestObjectParams = requestObject.request.url.query
if (requestObjectParams) {
pwRequest.params = requestObjectParams;
pwRequest.params = requestObjectParams
for (let param of pwRequest.params) {
delete param.disabled;
delete param.disabled
}
}
if (requestObject.request.body) {
if (requestObject.request.body.mode === "urlencoded") {
let params = requestObject.request.body.urlencoded;
pwRequest.bodyParams = params ? params : [];
if (requestObject.request.body.mode === 'urlencoded') {
let params = requestObject.request.body.urlencoded
pwRequest.bodyParams = params ? params : []
for (let param of pwRequest.bodyParams) {
delete param.type;
delete param.type
}
} else if (requestObject.request.body.mode === "raw") {
pwRequest.rawInput = true;
pwRequest.rawParams = requestObject.request.body.raw;
} else if (requestObject.request.body.mode === 'raw') {
pwRequest.rawInput = true
pwRequest.rawParams = requestObject.request.body.raw
}
}
return pwRequest;
}
}
};
return pwRequest
},
},
}
</script>

132
components/collections/index.vue
View File

@@ -43,12 +43,12 @@ TODO:
<div>
<button class="icon" @click="displayModalAdd(true)">
<i class="material-icons">add</i>
<span>{{ $t("new") }}</span>
<span>{{ $t('new') }}</span>
</button>
</div>
<div>
<button class="icon" @click="displayModalImportExport(true)">
{{ $t("import_export") }}
{{ $t('import_export') }}
</button>
<!-- <a
href="https://github.com/liyasthomas/postwoman/wiki/Collections"
@@ -89,7 +89,7 @@ TODO:
<nuxt-link :to="localePath('doc')" :aria-label="$t('documentation')">
<button class="icon">
<i class="material-icons">books</i>
<span>{{ $t("generate_docs") }}</span>
<span>{{ $t('generate_docs') }}</span>
</button>
</nuxt-link>
</pw-section>
@@ -107,20 +107,20 @@ ul {
</style>
<script>
import collection from "./collection";
import { fb } from "../../functions/fb";
import collection from './collection'
import { fb } from '../../functions/fb'
export default {
components: {
collection,
"pw-section": () => import("../section"),
addCollection: () => import("./addCollection"),
addFolder: () => import("./addFolder"),
editCollection: () => import("./editCollection"),
editFolder: () => import("./editFolder"),
editRequest: () => import("./editRequest"),
importExportCollections: () => import("./importExportCollections"),
VirtualList: () => import("vue-virtual-scroll-list")
'pw-section': () => import('../section'),
addCollection: () => import('./addCollection'),
addFolder: () => import('./addFolder'),
editCollection: () => import('./editCollection'),
editFolder: () => import('./editFolder'),
editRequest: () => import('./editRequest'),
importExportCollections: () => import('./importExportCollections'),
VirtualList: () => import('vue-virtual-scroll-list'),
},
data() {
return {
@@ -135,100 +135,98 @@ export default {
editingFolder: undefined,
editingFolderIndex: undefined,
editingRequest: undefined,
editingRequestIndex: undefined
};
editingRequestIndex: undefined,
}
},
computed: {
collections() {
return this.$store.state.postwoman.collections;
}
return this.$store.state.postwoman.collections
},
},
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;
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));
}
document.addEventListener('keydown', this._keyListener.bind(this))
},
methods: {
displayModalAdd(shouldDisplay) {
this.showModalAdd = shouldDisplay;
this.showModalAdd = shouldDisplay
},
displayModalEdit(shouldDisplay) {
this.showModalEdit = shouldDisplay;
this.showModalEdit = shouldDisplay
if (!shouldDisplay) this.resetSelectedData();
if (!shouldDisplay) this.resetSelectedData()
},
displayModalImportExport(shouldDisplay) {
this.showModalImportExport = shouldDisplay;
this.showModalImportExport = shouldDisplay
},
displayModalAddFolder(shouldDisplay) {
this.showModalAddFolder = shouldDisplay;
this.showModalAddFolder = shouldDisplay
if (!shouldDisplay) this.resetSelectedData();
if (!shouldDisplay) this.resetSelectedData()
},
displayModalEditFolder(shouldDisplay) {
this.showModalEditFolder = shouldDisplay;
this.showModalEditFolder = shouldDisplay
if (!shouldDisplay) this.resetSelectedData();
if (!shouldDisplay) this.resetSelectedData()
},
displayModalEditRequest(shouldDisplay) {
this.showModalEditRequest = shouldDisplay;
this.showModalEditRequest = shouldDisplay
if (!shouldDisplay) this.resetSelectedData();
if (!shouldDisplay) this.resetSelectedData()
},
editCollection(collection, collectionIndex) {
this.$data.editingCollection = collection;
this.$data.editingCollectionIndex = collectionIndex;
this.displayModalEdit(true);
this.syncCollections();
this.$data.editingCollection = collection
this.$data.editingCollectionIndex = collectionIndex
this.displayModalEdit(true)
this.syncCollections()
},
addFolder(collection, collectionIndex) {
this.$data.editingCollection = collection;
this.$data.editingCollectionIndex = collectionIndex;
this.displayModalAddFolder(true);
this.syncCollections();
this.$data.editingCollection = collection
this.$data.editingCollectionIndex = collectionIndex
this.displayModalAddFolder(true)
this.syncCollections()
},
editFolder(payload) {
const { collectionIndex, folder, folderIndex } = payload;
this.$data.editingCollection = collection;
this.$data.editingCollectionIndex = collectionIndex;
this.$data.editingFolder = folder;
this.$data.editingFolderIndex = folderIndex;
this.displayModalEditFolder(true);
this.syncCollections();
const { collectionIndex, folder, folderIndex } = payload
this.$data.editingCollection = collection
this.$data.editingCollectionIndex = collectionIndex
this.$data.editingFolder = folder
this.$data.editingFolderIndex = folderIndex
this.displayModalEditFolder(true)
this.syncCollections()
},
editRequest(payload) {
const { request, collectionIndex, folderIndex, requestIndex } = payload;
this.$data.editingCollectionIndex = collectionIndex;
this.$data.editingFolderIndex = folderIndex;
this.$data.editingRequest = request;
this.$data.editingRequestIndex = requestIndex;
this.displayModalEditRequest(true);
this.syncCollections();
const { request, collectionIndex, folderIndex, requestIndex } = payload
this.$data.editingCollectionIndex = collectionIndex
this.$data.editingFolderIndex = folderIndex
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;
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) {
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)))
}
}
}
},
},
beforeDestroy() {
document.removeEventListener("keydown", this._keyListener);
}
};
document.removeEventListener('keydown', this._keyListener)
},
}
</script>

28
components/collections/request.vue
View File

@@ -1,11 +1,7 @@
<template>
<div class="flex-wrap">
<div>
<button
class="icon"
@click="selectRequest()"
v-tooltip="$t('use_request')"
>
<button class="icon" @click="selectRequest()" v-tooltip="$t('use_request')">
<i class="material-icons">insert_drive_file</i>
<span>{{ request.name }}</span>
</button>
@@ -18,13 +14,13 @@
<div>
<button class="icon" @click="$emit('edit-request')" v-close-popover>
<i class="material-icons">edit</i>
<span>{{ $t("edit") }}</span>
<span>{{ $t('edit') }}</span>
</button>
</div>
<div>
<button class="icon" @click="removeRequest" v-close-popover>
<i class="material-icons">delete</i>
<span>{{ $t("delete") }}</span>
<span>{{ $t('delete') }}</span>
</button>
</div>
</template>
@@ -51,20 +47,20 @@ export default {
request: Object,
collectionIndex: Number,
folderIndex: Number,
requestIndex: Number
requestIndex: Number,
},
methods: {
selectRequest() {
this.$store.commit("postwoman/selectRequest", { request: this.request });
this.$store.commit('postwoman/selectRequest', { request: this.request })
},
removeRequest() {
if (!confirm("Are you sure you want to remove this request?")) return;
this.$store.commit("postwoman/removeRequest", {
if (!confirm('Are you sure you want to remove this request?')) return
this.$store.commit('postwoman/removeRequest', {
collectionIndex: this.collectionIndex,
folderIndex: this.folderIndex,
requestIndex: this.requestIndex
});
}
}
};
requestIndex: this.requestIndex,
})
},
},
}
</script>

170
components/collections/saveRequestAs.vue
View File

@@ -4,7 +4,7 @@
<ul>
<li>
<div class="flex-wrap">
<h3 class="title">{{ $t("save_request_as") }}</h3>
<h3 class="title">{{ $t('save_request_as') }}</h3>
<div>
<button class="icon" @click="hideModal">
<i class="material-icons">close</i>
@@ -17,7 +17,7 @@
<div slot="body">
<ul>
<li>
<label for="selectLabel">{{ $t("label") }}</label>
<label for="selectLabel">{{ $t('label') }}</label>
<input
type="text"
id="selectLabel"
@@ -25,24 +25,14 @@
:placeholder="defaultRequestName"
@keyup.enter="saveRequestAs"
/>
<label for="selectCollection">{{ $t("collection") }}</label>
<label for="selectCollection">{{ $t('collection') }}</label>
<span class="select-wrapper">
<select
type="text"
id="selectCollection"
v-model="requestData.collectionIndex"
>
<select type="text" id="selectCollection" v-model="requestData.collectionIndex">
<option :key="undefined" :value="undefined" hidden disabled selected>{{
$t('select_collection')
}}</option>
<option
:key="undefined"
:value="undefined"
hidden
disabled
selected
>{{ $t("select_collection") }}</option
>
<option
v-for="(collection, index) in $store.state.postwoman
.collections"
v-for="(collection, index) in $store.state.postwoman.collections"
:key="index"
:value="index"
>
@@ -50,36 +40,20 @@
</option>
</select>
</span>
<label for="selectFolder">{{ $t("folder") }}</label>
<label for="selectFolder">{{ $t('folder') }}</label>
<span class="select-wrapper">
<select
type="text"
id="selectFolder"
v-model="requestData.folderIndex"
>
<select type="text" id="selectFolder" v-model="requestData.folderIndex">
<option :key="undefined" :value="undefined">/</option>
<option
v-for="(folder, index) in folders"
:key="index"
:value="index"
>
<option v-for="(folder, index) in folders" :key="index" :value="index">
{{ folder.name }}
</option>
</select>
</span>
<label for="selectRequest">{{ $t("request") }}</label>
<label for="selectRequest">{{ $t('request') }}</label>
<span class="select-wrapper">
<select
type="text"
id="selectRequest"
v-model="requestData.requestIndex"
>
<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"
>
<option v-for="(folder, index) in requests" :key="index" :value="index">
{{ folder.name }}
</option>
</select>
@@ -92,10 +66,10 @@
<span></span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
{{ $t('cancel') }}
</button>
<button class="icon primary" @click="saveRequestAs">
{{ $t("save") }}
{{ $t('save') }}
</button>
</span>
</div>
@@ -104,123 +78,113 @@
</template>
<script>
import { fb } from "../../functions/fb";
import { fb } from '../../functions/fb'
export default {
props: {
show: Boolean,
editingRequest: Object
editingRequest: Object,
},
components: {
modal: () => import("../../components/modal")
modal: () => import('../../components/modal'),
},
data() {
return {
defaultRequestName: "My Request",
defaultRequestName: 'My Request',
requestData: {
name: undefined,
collectionIndex: undefined,
folderIndex: undefined,
requestIndex: undefined
}
};
requestIndex: undefined,
},
}
},
watch: {
"requestData.collectionIndex": function resetFolderAndRequestIndex() {
'requestData.collectionIndex': function resetFolderAndRequestIndex() {
// if user choosen some folder, than selected other collection, which doesn't have any folders
// than `requestUpdateData.folderIndex` won't be reseted
this.$data.requestData.folderIndex = undefined;
this.$data.requestData.requestIndex = undefined;
this.$data.requestData.folderIndex = undefined
this.$data.requestData.requestIndex = undefined
},
'requestData.folderIndex': function resetRequestIndex() {
this.$data.requestData.requestIndex = undefined
},
"requestData.folderIndex": function resetRequestIndex() {
this.$data.requestData.requestIndex = undefined;
}
},
computed: {
folders() {
const userSelectedAnyCollection =
this.$data.requestData.collectionIndex !== undefined;
if (!userSelectedAnyCollection) return [];
const userSelectedAnyCollection = this.$data.requestData.collectionIndex !== undefined
if (!userSelectedAnyCollection) return []
const noCollectionAvailable =
this.$store.state.postwoman.collections[
this.$data.requestData.collectionIndex
] !== undefined;
if (!noCollectionAvailable) return [];
this.$store.state.postwoman.collections[this.$data.requestData.collectionIndex] !==
undefined
if (!noCollectionAvailable) return []
return this.$store.state.postwoman.collections[
this.$data.requestData.collectionIndex
].folders;
return this.$store.state.postwoman.collections[this.$data.requestData.collectionIndex].folders
},
requests() {
const userSelectedAnyCollection =
this.$data.requestData.collectionIndex !== undefined;
if (!userSelectedAnyCollection) return [];
const userSelectedAnyCollection = this.$data.requestData.collectionIndex !== undefined
if (!userSelectedAnyCollection) return []
const userSelectedAnyFolder =
this.$data.requestData.folderIndex !== undefined;
const userSelectedAnyFolder = this.$data.requestData.folderIndex !== undefined
if (userSelectedAnyFolder) {
const collection = this.$store.state.postwoman.collections[
this.$data.requestData.collectionIndex
];
const folder = collection.folders[this.$data.requestData.folderIndex];
const requests = folder.requests;
return requests;
]
const folder = collection.folders[this.$data.requestData.folderIndex]
const requests = folder.requests
return requests
} else {
const collection = this.$store.state.postwoman.collections[
this.$data.requestData.collectionIndex
];
]
const noCollectionAvailable =
this.$store.state.postwoman.collections[
this.$data.requestData.collectionIndex
] !== undefined;
if (!noCollectionAvailable) return [];
this.$store.state.postwoman.collections[this.$data.requestData.collectionIndex] !==
undefined
if (!noCollectionAvailable) return []
const requests = collection.requests;
return requests;
const requests = collection.requests
return requests
}
}
},
},
methods: {
syncCollections() {
if (fb.currentUser !== null) {
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)))
}
}
},
saveRequestAs() {
const userDidntSpecifyCollection =
this.$data.requestData.collectionIndex === undefined;
const userDidntSpecifyCollection = this.$data.requestData.collectionIndex === undefined
if (userDidntSpecifyCollection) {
this.$toast.error(this.$t("select_collection"), {
icon: "error"
});
return;
this.$toast.error(this.$t('select_collection'), {
icon: 'error',
})
return
}
const requestUpdated = {
...this.$props.editingRequest,
name: this.$data.requestData.name || this.$data.defaultRequestName,
collection: this.$data.requestData.collectionIndex
};
collection: this.$data.requestData.collectionIndex,
}
this.$store.commit("postwoman/saveRequestAs", {
this.$store.commit('postwoman/saveRequestAs', {
request: requestUpdated,
collectionIndex: this.$data.requestData.collectionIndex,
folderIndex: this.$data.requestData.folderIndex,
requestIndex: this.$data.requestData.requestIndex
});
requestIndex: this.$data.requestData.requestIndex,
})
this.hideModal();
this.syncCollections();
this.hideModal()
this.syncCollections()
},
hideModal() {
this.$emit("hide-modal");
this.$emit("hide-model"); // for backward compatibility // TODO: use fixed event
}
}
};
this.$emit('hide-modal')
this.$emit('hide-model') // for backward compatibility // TODO: use fixed event
},
},
}
</script>

50
components/environments/addEnvironment.vue
View File

@@ -4,7 +4,7 @@
<ul>
<li>
<div class="flex-wrap">
<h3 class="title">{{ $t("new_environment") }}</h3>
<h3 class="title">{{ $t('new_environment') }}</h3>
<div>
<button class="icon" @click="hideModal">
<i class="material-icons">close</i>
@@ -31,10 +31,10 @@
<span></span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
{{ $t('cancel') }}
</button>
<button class="icon primary" @click="addNewEnvironment">
{{ $t("save") }}
{{ $t('save') }}
</button>
</span>
</div>
@@ -43,52 +43,50 @@
</template>
<script>
import { fb } from "../../functions/fb";
import { fb } from '../../functions/fb'
export default {
props: {
show: Boolean
show: Boolean,
},
components: {
modal: () => import("../../components/modal")
modal: () => import('../../components/modal'),
},
data() {
return {
name: undefined
};
name: undefined,
}
},
methods: {
syncEnvironments() {
if (fb.currentUser !== null) {
if (fb.currentSettings[1].value) {
fb.writeEnvironments(
JSON.parse(JSON.stringify(this.$store.state.postwoman.environments))
);
fb.writeEnvironments(JSON.parse(JSON.stringify(this.$store.state.postwoman.environments)))
}
}
},
addNewEnvironment() {
if (!this.$data.name) {
this.$toast.info(this.$t("invalid_environment_name"));
return;
this.$toast.info(this.$t('invalid_environment_name'))
return
}
let newEnvironment = [
{
name: this.$data.name,
variables: []
}
];
this.$store.commit("postwoman/importAddEnvironments", {
variables: [],
},
]
this.$store.commit('postwoman/importAddEnvironments', {
environments: newEnvironment,
confirmation: "Environment added"
});
this.$emit("hide-modal");
this.syncEnvironments();
confirmation: 'Environment added',
})
this.$emit('hide-modal')
this.syncEnvironments()
},
hideModal() {
this.$data.name = undefined;
this.$emit("hide-modal");
}
}
};
this.$data.name = undefined
this.$emit('hide-modal')
},
},
}
</script>

132
components/environments/editEnvironment.vue
View File

@@ -4,7 +4,7 @@
<ul>
<li>
<div class="flex-wrap">
<h3 class="title">{{ $t("edit_environment") }}</h3>
<h3 class="title">{{ $t('edit_environment') }}</h3>
<div>
<button class="icon" @click="hideModal">
<i class="material-icons">close</i>
@@ -28,13 +28,9 @@
<ul>
<li>
<div class="flex-wrap">
<label for="variableList">{{ $t("env_variable_list") }}</label>
<label for="variableList">{{ $t('env_variable_list') }}</label>
<div>
<button
class="icon"
@click="clearContent($event)"
v-tooltip.bottom="$t('clear')"
>
<button class="icon" @click="clearContent($event)" v-tooltip.bottom="$t('clear')">
<i class="material-icons">clear_all</i>
</button>
</div>
@@ -49,10 +45,7 @@
></textarea>
</li>
</ul>
<ul
v-for="(variable, index) in this.editingEnvCopy.variables"
:key="index"
>
<ul v-for="(variable, index) in this.editingEnvCopy.variables" :key="index">
<li>
<input
:placeholder="$t('parameter_count', { count: index + 1 })"
@@ -61,7 +54,7 @@
@change="
$store.commit('postwoman/setVariableKey', {
index,
value: $event.target.value
value: $event.target.value,
})
"
autofocus
@@ -72,14 +65,12 @@
:placeholder="$t('value_count', { count: index + 1 })"
:name="'value' + index"
:value="
typeof variable.value === 'string'
? variable.value
: JSON.stringify(variable.value)
typeof variable.value === 'string' ? variable.value : JSON.stringify(variable.value)
"
@change="
$store.commit('postwoman/setVariableValue', {
index,
value: $event.target.value
value: $event.target.value,
})
"
/>
@@ -101,7 +92,7 @@
<li>
<button class="icon" @click="addEnvironmentVariable">
<i class="material-icons">add</i>
<span>{{ $t("add_new") }}</span>
<span>{{ $t('add_new') }}</span>
</button>
</li>
</ul>
@@ -111,10 +102,10 @@
<span></span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
{{ $t('cancel') }}
</button>
<button class="icon primary" @click="saveEnvironment">
{{ $t("save") }}
{{ $t('save') }}
</button>
</span>
</div>
@@ -123,99 +114,94 @@
</template>
<script>
import textareaAutoHeight from "../../directives/textareaAutoHeight";
import textareaAutoHeight from '../../directives/textareaAutoHeight'
export default {
directives: {
textareaAutoHeight
textareaAutoHeight,
},
props: {
show: Boolean,
editingEnvironment: Object,
editingEnvironmentIndex: Number
editingEnvironmentIndex: Number,
},
components: {
modal: () => import("../../components/modal")
modal: () => import('../../components/modal'),
},
data() {
return {
name: undefined
};
name: undefined,
}
},
watch: {
editingEnvironment: function(update) {
this.name = this.$props.editingEnvironment && this.$props.editingEnvironment.name
? this.$props.editingEnvironment.name
: undefined
this.$store.commit(
"postwoman/setEditingEnvironment",
this.$props.editingEnvironment
);
}
this.name =
this.$props.editingEnvironment && this.$props.editingEnvironment.name
? this.$props.editingEnvironment.name
: undefined
this.$store.commit('postwoman/setEditingEnvironment', this.$props.editingEnvironment)
},
},
computed: {
editingEnvCopy() {
return this.$store.state.postwoman.editingEnvironment;
return this.$store.state.postwoman.editingEnvironment
},
variableString() {
const result = this.editingEnvCopy.variables;
return result === "" ? "" : JSON.stringify(result);
}
const result = this.editingEnvCopy.variables
return result === '' ? '' : JSON.stringify(result)
},
},
methods: {
clearContent(e) {
this.$store.commit("postwoman/removeVariables", []);
e.target.innerHTML = this.doneButton;
this.$toast.info(this.$t("cleared"), {
icon: "clear_all"
});
setTimeout(
() => (e.target.innerHTML = '<i class="material-icons">clear_all</i>'),
1000
);
this.$store.commit('postwoman/removeVariables', [])
e.target.innerHTML = this.doneButton
this.$toast.info(this.$t('cleared'), {
icon: 'clear_all',
})
setTimeout(() => (e.target.innerHTML = '<i class="material-icons">clear_all</i>'), 1000)
},
addEnvironmentVariable() {
let value = { key: "", value: "" };
this.$store.commit("postwoman/addVariable", value);
let value = { key: '', value: '' }
this.$store.commit('postwoman/addVariable', value)
},
removeEnvironmentVariable(index) {
let variableIndex = index;
const oldVariables = this.editingEnvCopy.variables.slice();
let variableIndex = index
const oldVariables = this.editingEnvCopy.variables.slice()
const newVariables = this.editingEnvCopy.variables.filter(
(variable, index) => variableIndex !== index
);
)
this.$store.commit("postwoman/removeVariable", newVariables);
this.$toast.error(this.$t("deleted"), {
icon: "delete",
this.$store.commit('postwoman/removeVariable', newVariables)
this.$toast.error(this.$t('deleted'), {
icon: 'delete',
action: {
text: this.$t("undo"),
text: this.$t('undo'),
onClick: (e, toastObject) => {
this.$store.commit("postwoman/removeVariable", oldVariables);
toastObject.remove();
}
}
});
this.$store.commit('postwoman/removeVariable', oldVariables)
toastObject.remove()
},
},
})
},
saveEnvironment() {
if (!this.$data.name) {
this.$toast.info(this.$t("invalid_environment_name"));
return;
this.$toast.info(this.$t('invalid_environment_name'))
return
}
const environmentUpdated = {
...this.editingEnvCopy,
name: this.$data.name
};
this.$store.commit("postwoman/saveEnvironment", {
name: this.$data.name,
}
this.$store.commit('postwoman/saveEnvironment', {
environment: environmentUpdated,
environmentIndex: this.$props.editingEnvironmentIndex
});
this.$emit("hide-modal");
environmentIndex: this.$props.editingEnvironmentIndex,
})
this.$emit('hide-modal')
},
hideModal() {
this.$data.name = undefined;
this.$emit("hide-modal");
}
}
};
this.$data.name = undefined
this.$emit('hide-modal')
},
},
}
</script>

28
components/environments/environment.vue
View File

@@ -1,11 +1,7 @@
<template>
<div class="flex-wrap">
<div>
<button
class="icon"
@click="$emit('select-environment')"
v-tooltip="$t('use_environment')"
>
<button class="icon" @click="$emit('select-environment')" v-tooltip="$t('use_environment')">
<i class="material-icons">insert_drive_file</i>
<span>{{ environment.name }}</span>
</button>
@@ -16,19 +12,15 @@
</button>
<template slot="popover">
<div>
<button
class="icon"
@click="$emit('edit-environment')"
v-close-popover
>
<button class="icon" @click="$emit('edit-environment')" v-close-popover>
<i class="material-icons">create</i>
<span>{{ $t("edit") }}</span>
<span>{{ $t('edit') }}</span>
</button>
</div>
<div>
<button class="icon" @click="removeEnvironment" v-close-popover>
<i class="material-icons">delete</i>
<span>{{ $t("delete") }}</span>
<span>{{ $t('delete') }}</span>
</button>
</div>
</template>
@@ -53,13 +45,13 @@ ul li {
export default {
props: {
environment: Object,
environmentIndex: Number
environmentIndex: Number,
},
methods: {
removeEnvironment() {
if (!confirm("Are you sure you want to remove this environment?")) return;
this.$store.commit("postwoman/removeEnvironment", this.environmentIndex);
}
}
};
if (!confirm('Are you sure you want to remove this environment?')) return
this.$store.commit('postwoman/removeEnvironment', this.environmentIndex)
},
},
}
</script>

127
components/environments/importExportEnvironment.vue
View File

@@ -14,18 +14,12 @@
<div class="flex-wrap">
<span
v-tooltip="{
content: !fb.currentUser
? $t('login_first')
: $t('replace_current')
content: !fb.currentUser ? $t('login_first') : $t('replace_current'),
}"
>
<button
:disabled="!fb.currentUser"
class="icon"
@click="syncEnvironments"
>
<button :disabled="!fb.currentUser" class="icon" @click="syncEnvironments">
<i class="material-icons">folder_shared</i>
<span>{{ $t("import_from_sync") }}</span>
<span>{{ $t('import_from_sync') }}</span>
</button>
</span>
<button
@@ -34,7 +28,7 @@
v-tooltip="$t('replace_current')"
>
<i class="material-icons">create_new_folder</i>
<span>{{ $t("replace_json") }}</span>
<span>{{ $t('replace_json') }}</span>
<input
type="file"
@change="replaceWithJSON"
@@ -49,7 +43,7 @@
v-tooltip="$t('preserve_current')"
>
<i class="material-icons">folder_special</i>
<span>{{ $t("import_json") }}</span>
<span>{{ $t('import_json') }}</span>
<input
type="file"
@change="importFromJSON"
@@ -70,14 +64,10 @@
<span></span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
{{ $t('cancel') }}
</button>
<button
class="icon primary"
@click="exportJSON"
v-tooltip="$t('download_file')"
>
{{ $t("export") }}
<button class="icon primary" @click="exportJSON" v-tooltip="$t('download_file')">
{{ $t('export') }}
</button>
</span>
</div>
@@ -86,88 +76,85 @@
</template>
<script>
import { fb } from "../../functions/fb";
import { fb } from '../../functions/fb'
export default {
data() {
return {
fb
};
fb,
}
},
props: {
show: Boolean
show: Boolean,
},
components: {
modal: () => import("../../components/modal")
modal: () => import('../../components/modal'),
},
computed: {
environmentJson() {
return JSON.stringify(this.$store.state.postwoman.environments, null, 2);
}
return JSON.stringify(this.$store.state.postwoman.environments, null, 2)
},
},
methods: {
hideModal() {
this.$emit("hide-modal");
this.$emit('hide-modal')
},
openDialogChooseFileToReplaceWith() {
this.$refs.inputChooseFileToReplaceWith.click();
this.$refs.inputChooseFileToReplaceWith.click()
},
openDialogChooseFileToImportFrom() {
this.$refs.inputChooseFileToImportFrom.click();
this.$refs.inputChooseFileToImportFrom.click()
},
replaceWithJSON() {
let reader = new FileReader();
let reader = new FileReader()
reader.onload = event => {
let content = event.target.result;
let environments = JSON.parse(content);
this.$store.commit("postwoman/replaceEnvironments", environments);
};
reader.readAsText(this.$refs.inputChooseFileToReplaceWith.files[0]);
this.fileImported();
let content = event.target.result
let environments = JSON.parse(content)
this.$store.commit('postwoman/replaceEnvironments', environments)
}
reader.readAsText(this.$refs.inputChooseFileToReplaceWith.files[0])
this.fileImported()
},
importFromJSON() {
let reader = new FileReader();
let reader = new FileReader()
reader.onload = event => {
let content = event.target.result;
let environments = JSON.parse(content);
let confirmation = this.$t("file_imported")
this.$store.commit("postwoman/importAddEnvironments", {
let content = event.target.result
let environments = JSON.parse(content)
let confirmation = this.$t('file_imported')
this.$store.commit('postwoman/importAddEnvironments', {
environments,
confirmation
});
};
reader.readAsText(this.$refs.inputChooseFileToImportFrom.files[0]);
confirmation,
})
}
reader.readAsText(this.$refs.inputChooseFileToImportFrom.files[0])
},
exportJSON() {
let text = this.environmentJson;
text = text.replace(/\n/g, "\r\n");
let text = this.environmentJson
text = text.replace(/\n/g, '\r\n')
let blob = new Blob([text], {
type: "text/json"
});
let anchor = document.createElement("a");
anchor.download = "postwoman-environment.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"
});
type: 'text/json',
})
let anchor = document.createElement('a')
anchor.download = 'postwoman-environment.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',
})
},
syncEnvironments() {
this.$store.commit(
"postwoman/replaceEnvironments",
fb.currentEnvironments
);
this.fileImported();
this.$store.commit('postwoman/replaceEnvironments', fb.currentEnvironments)
this.fileImported()
},
fileImported() {
this.$toast.info(this.$t("file_imported"), {
icon: "folder_shared"
});
}
}
};
this.$toast.info(this.$t('file_imported'), {
icon: 'folder_shared',
})
},
},
}
</script>

82
components/environments/index.vue
View File

@@ -1,10 +1,5 @@
<template>
<pw-section
class="green"
icon="history"
:label="$t('environment')"
ref="environment"
>
<pw-section class="green" icon="history" :label="$t('environment')" ref="environment">
<addEnvironment :show="showModalAdd" @hide-modal="displayModalAdd(false)" />
<editEnvironment
:show="showModalEdit"
@@ -20,12 +15,12 @@
<div>
<button class="icon" @click="displayModalAdd(true)">
<i class="material-icons">add</i>
<span>{{ $t("new") }}</span>
<span>{{ $t('new') }}</span>
</button>
</div>
<div>
<button class="icon" @click="displayModalImportExport(true)">
{{ $t("import_export") }}
{{ $t('import_export') }}
</button>
</div>
</div>
@@ -39,10 +34,7 @@
:remain="Math.min(5, environments.length)"
>
<ul>
<li
v-for="(environment, index) in environments"
:key="environment.name"
>
<li v-for="(environment, index) in environments" :key="environment.name">
<environment
:environmentIndex="index"
:environment="environment"
@@ -70,20 +62,20 @@ ul {
</style>
<script>
import environment from "./environment";
import { fb } from "../../functions/fb";
import environment from './environment'
import { fb } from '../../functions/fb'
const updateOnLocalStorage = (propertyName, property) =>
window.localStorage.setItem(propertyName, JSON.stringify(property));
window.localStorage.setItem(propertyName, JSON.stringify(property))
export default {
components: {
environment,
"pw-section": () => import("../section"),
addEnvironment: () => import("./addEnvironment"),
editEnvironment: () => import("./editEnvironment"),
importExportEnvironment: () => import("./importExportEnvironment"),
VirtualList: () => import("vue-virtual-scroll-list")
'pw-section': () => import('../section'),
addEnvironment: () => import('./addEnvironment'),
editEnvironment: () => import('./editEnvironment'),
importExportEnvironment: () => import('./importExportEnvironment'),
VirtualList: () => import('vue-virtual-scroll-list'),
},
data() {
return {
@@ -91,57 +83,55 @@ export default {
showModalAdd: false,
showModalEdit: false,
editingEnvironment: undefined,
editingEnvironmentIndex: undefined
};
editingEnvironmentIndex: undefined,
}
},
computed: {
environments() {
return this.$store.state.postwoman.environments;
}
return this.$store.state.postwoman.environments
},
},
async mounted() {
this._keyListener = function(e) {
if (e.key === "Escape") {
e.preventDefault();
this.showModalImportExport = false;
if (e.key === 'Escape') {
e.preventDefault()
this.showModalImportExport = false
}
};
document.addEventListener("keydown", this._keyListener.bind(this));
}
document.addEventListener('keydown', this._keyListener.bind(this))
},
methods: {
displayModalAdd(shouldDisplay) {
this.showModalAdd = shouldDisplay;
this.showModalAdd = shouldDisplay
},
displayModalEdit(shouldDisplay) {
this.showModalEdit = shouldDisplay;
this.showModalEdit = shouldDisplay
if (!shouldDisplay) this.resetSelectedData();
if (!shouldDisplay) this.resetSelectedData()
},
displayModalImportExport(shouldDisplay) {
this.showModalImportExport = shouldDisplay;
this.showModalImportExport = shouldDisplay
},
editEnvironment(environment, environmentIndex) {
this.$data.editingEnvironment = environment;
this.$data.editingEnvironmentIndex = environmentIndex;
this.displayModalEdit(true);
this.syncEnvironments;
this.$data.editingEnvironment = environment
this.$data.editingEnvironmentIndex = environmentIndex
this.displayModalEdit(true)
this.syncEnvironments
},
resetSelectedData() {
this.$data.editingEnvironment = undefined;
this.$data.editingEnvironmentIndex = undefined;
this.$data.editingEnvironment = undefined
this.$data.editingEnvironmentIndex = undefined
},
syncEnvironments() {
if (fb.currentUser !== null) {
if (fb.currentSettings[1].value) {
fb.writeEnvironments(
JSON.parse(JSON.stringify(this.$store.state.postwoman.environments))
);
fb.writeEnvironments(JSON.parse(JSON.stringify(this.$store.state.postwoman.environments)))
}
}
}
},
},
beforeDestroy() {
document.removeEventListener("keydown", this._keyListener);
}
};
document.removeEventListener('keydown', this._keyListener)
},
}
</script>

28
components/firebase/feeds.vue
View File

@@ -10,7 +10,7 @@
<div class="show-on-large-screen">
<li class="info">
<label>
{{ feed.label || $t("no_label") }}
{{ feed.label || $t('no_label') }}
</label>
</li>
<button class="icon" @click="deleteFeed(feed)">
@@ -19,14 +19,14 @@
</div>
<div class="show-on-large-screen">
<li class="info clamb-3">
<label>{{ feed.message || $t("empty") }}</label>
<label>{{ feed.message || $t('empty') }}</label>
</li>
</div>
</ul>
</virtual-list>
<ul v-else>
<li>
<label class="info">{{ $t("empty") }}</label>
<label class="info">{{ $t('empty') }}</label>
</li>
</ul>
</template>
@@ -55,24 +55,24 @@ ol {
</style>
<script>
import { fb } from "../../functions/fb";
import { fb } from '../../functions/fb'
export default {
components: {
VirtualList: () => import("vue-virtual-scroll-list")
VirtualList: () => import('vue-virtual-scroll-list'),
},
data() {
return {
fb
};
fb,
}
},
methods: {
deleteFeed(feed) {
fb.deleteFeed(feed.id);
this.$toast.error(this.$t("deleted"), {
icon: "delete"
});
}
}
};
fb.deleteFeed(feed.id)
this.$toast.error(this.$t('deleted'), {
icon: 'delete',
})
},
},
}
</script>

20
components/firebase/inputform.vue
View File

@@ -46,24 +46,24 @@ ol {
</style>
<script>
import { fb } from "../../functions/fb";
import { fb } from '../../functions/fb'
export default {
data() {
return {
message: null,
label: null
};
label: null,
}
},
methods: {
formPost() {
if (!(this.message || this.label)) {
return;
return
}
fb.writeFeeds(this.message, this.label);
this.message = null;
this.label = null;
}
}
};
fb.writeFeeds(this.message, this.label)
this.message = null
this.label = null
},
},
}
</script>

70
components/firebase/login.vue
View File

@@ -41,75 +41,75 @@
</template>
<script>
import firebase from "firebase/app";
import { fb } from "../../functions/fb";
import firebase from 'firebase/app'
import { fb } from '../../functions/fb'
export default {
data() {
return {
fb
};
fb,
}
},
methods: {
signInWithGoogle() {
const provider = new firebase.auth.GoogleAuthProvider();
const provider = new firebase.auth.GoogleAuthProvider()
firebase
.auth()
.signInWithPopup(provider)
.then(({ additionalUserInfo }) => {
if (additionalUserInfo.isNewUser) {
this.$toast.info(`${this.$t("turn_on")} ${this.$t("sync")}`, {
icon: "sync",
this.$toast.info(`${this.$t('turn_on')} ${this.$t('sync')}`, {
icon: 'sync',
duration: null,
closeOnSwipe: false,
action: {
text: this.$t("yes"),
text: this.$t('yes'),
onClick: (e, toastObject) => {
fb.writeSettings("syncHistory", false);
fb.writeSettings("syncCollections", true);
this.$router.push({ path: "/settings" });
toastObject.remove();
}
}
});
fb.writeSettings('syncHistory', false)
fb.writeSettings('syncCollections', true)
this.$router.push({ path: '/settings' })
toastObject.remove()
},
},
})
}
})
.catch(err => {
this.$toast.show(err.message || err, {
icon: "error"
});
});
icon: 'error',
})
})
},
signInWithGithub() {
const provider = new firebase.auth.GithubAuthProvider();
const provider = new firebase.auth.GithubAuthProvider()
firebase
.auth()
.signInWithPopup(provider)
.then(({ additionalUserInfo }) => {
if (additionalUserInfo.isNewUser) {
this.$toast.info(`${this.$t("turn_on")} ${this.$t("sync")}`, {
icon: "sync",
this.$toast.info(`${this.$t('turn_on')} ${this.$t('sync')}`, {
icon: 'sync',
duration: null,
closeOnSwipe: false,
action: {
text: this.$t("yes"),
text: this.$t('yes'),
onClick: (e, toastObject) => {
fb.writeSettings("syncHistory", false);
fb.writeSettings("syncCollections", true);
this.$router.push({ path: "/settings" });
toastObject.remove();
}
}
});
fb.writeSettings('syncHistory', false)
fb.writeSettings('syncCollections', true)
this.$router.push({ path: '/settings' })
toastObject.remove()
},
},
})
}
})
.catch(err => {
this.$toast.show(err.message || err, {
icon: "error"
});
});
}
}
};
icon: 'error',
})
})
},
},
}
</script>

18
components/graphql/argument.vue
View File

@@ -11,28 +11,28 @@
<style scoped lang="scss"></style>
<script>
import typelink from "./typelink";
import typelink from './typelink'
export default {
components: {
typelink: typelink
typelink: typelink,
},
props: {
gqlArg: Object
gqlArg: Object,
},
computed: {
argName() {
return this.gqlArg.name;
return this.gqlArg.name
},
argType() {
return this.gqlArg.type;
}
return this.gqlArg.type
},
},
methods: {
jumpCallback(typeName) {}
}
};
jumpCallback(typeName) {},
},
}
</script>

35
components/graphql/field.vue
View File

@@ -6,10 +6,7 @@
(
<span v-for="(field, index) in fieldArgs" :key="index">
{{ field.name }}:
<typelink
:gqlType="field.type"
:jumpTypeCallback="jumpTypeCallback"
/>
<typelink :gqlType="field.type" :jumpTypeCallback="jumpTypeCallback" />
<span v-if="index !== fieldArgs.length - 1">
,
</span>
@@ -23,7 +20,7 @@
</div>
<div class="field-deprecated" v-if="gqlField.isDeprecated">
{{ $t("deprecated") }}
{{ $t('deprecated') }}
</div>
</div>
</template>
@@ -53,16 +50,16 @@
</style>
<script>
import typelink from "./typelink";
import typelink from './typelink'
export default {
components: {
typelink: typelink
typelink: typelink,
},
props: {
gqlField: Object,
jumpTypeCallback: Function
jumpTypeCallback: Function,
},
computed: {
@@ -71,23 +68,21 @@ export default {
return (
acc +
`${arg.name}: ${arg.type.toString()}${
index !== this.gqlField.args.length - 1 ? ", " : ""
index !== this.gqlField.args.length - 1 ? ', ' : ''
}`
);
}, "");
const argsString = args.length > 0 ? `(${args})` : "";
return `${
this.gqlField.name
}${argsString}: ${this.gqlField.type.toString()}`;
)
}, '')
const argsString = args.length > 0 ? `(${args})` : ''
return `${this.gqlField.name}${argsString}: ${this.gqlField.type.toString()}`
},
fieldName() {
return this.gqlField.name;
return this.gqlField.name
},
fieldArgs() {
return this.gqlField.args || [];
}
}
};
return this.gqlField.args || []
},
},
}
</script>

145
components/graphql/queryeditor.vue
View File

@@ -3,86 +3,79 @@
</template>
<script>
const DEFAULT_THEME = "twilight";
const DEFAULT_THEME = 'twilight'
import ace from "ace-builds";
import * as gql from "graphql";
import { getAutocompleteSuggestions } from "graphql-language-service-interface";
import "ace-builds/webpack-resolver";
import "ace-builds/src-noconflict/ext-language_tools";
import debounce from "../../functions/utils/debounce";
import ace from 'ace-builds'
import * as gql from 'graphql'
import { getAutocompleteSuggestions } from 'graphql-language-service-interface'
import 'ace-builds/webpack-resolver'
import 'ace-builds/src-noconflict/ext-language_tools'
import debounce from '../../functions/utils/debounce'
export default {
props: {
value: {
type: String,
default: ""
default: '',
},
theme: {
type: String,
required: false
required: false,
},
lang: {
type: String,
default: "json"
default: 'json',
},
options: {
type: Object,
default: {}
}
default: {},
},
},
data() {
return {
editor: null,
cacheValue: "",
validationSchema: null
};
cacheValue: '',
validationSchema: null,
}
},
watch: {
value(value) {
if (value !== this.cacheValue) {
this.editor.session.setValue(value, 1);
this.cacheValue = value;
this.editor.session.setValue(value, 1)
this.cacheValue = value
}
},
theme() {
this.editor.setTheme(`ace/theme/${this.defineTheme()}`);
this.editor.setTheme(`ace/theme/${this.defineTheme()}`)
},
lang(value) {
this.editor.getSession().setMode(`ace/mode/${value}`);
this.editor.getSession().setMode(`ace/mode/${value}`)
},
options(value) {
this.editor.setOptions(value);
}
this.editor.setOptions(value)
},
},
mounted() {
let langTools = ace.require("ace/ext/language_tools");
let langTools = ace.require('ace/ext/language_tools')
const editor = ace.edit(this.$refs.editor, {
theme: `ace/theme/${this.defineTheme()}`,
mode: `ace/mode/${this.lang}`,
enableBasicAutocompletion: true,
enableLiveAutocompletion: true,
...this.options
});
...this.options,
})
const completer = {
getCompletions: (
editor,
_session,
{ row, column },
_prefix,
callback
) => {
getCompletions: (editor, _session, { row, column }, _prefix, callback) => {
if (this.validationSchema) {
const completions = getAutocompleteSuggestions(
this.validationSchema,
editor.getValue(),
{ line: row, character: column }
);
const completions = getAutocompleteSuggestions(this.validationSchema, editor.getValue(), {
line: row,
character: column,
})
callback(
null,
@@ -90,64 +83,60 @@ export default {
name: label,
value: label,
score: 1.0,
meta: detail
meta: detail,
}))
);
)
} else {
callback(null, []);
callback(null, [])
}
}
};
},
}
langTools.setCompleters([completer]);
langTools.setCompleters([completer])
if (this.value) editor.setValue(this.value, 1);
if (this.value) editor.setValue(this.value, 1)
this.editor = editor;
this.cacheValue = this.value;
this.editor = editor
this.cacheValue = this.value
editor.on("change", () => {
const content = editor.getValue();
this.$emit("input", content);
this.parseContents(content);
this.cacheValue = content;
});
editor.on('change', () => {
const content = editor.getValue()
this.$emit('input', content)
this.parseContents(content)
this.cacheValue = content
})
this.parseContents(this.value);
this.parseContents(this.value)
},
methods: {
defineTheme() {
if (this.theme) {
return this.theme;
return this.theme
} else {
return (
this.$store.state.postwoman.settings.THEME_ACE_EDITOR || DEFAULT_THEME
);
return this.$store.state.postwoman.settings.THEME_ACE_EDITOR || DEFAULT_THEME
}
},
setValidationSchema(schema) {
this.validationSchema = schema;
this.parseContents(this.cacheValue);
this.validationSchema = schema
this.parseContents(this.cacheValue)
},
parseContents: debounce(function(content) {
if (content !== "") {
if (content !== '') {
try {
const doc = gql.parse(content);
const doc = gql.parse(content)
if (this.validationSchema) {
this.editor.session.setAnnotations(
gql
.validate(this.validationSchema, doc)
.map(({ locations, message }) => ({
row: locations[0].line - 1,
column: locations[0].column - 1,
text: message,
type: "error"
}))
);
gql.validate(this.validationSchema, doc).map(({ locations, message }) => ({
row: locations[0].line - 1,
column: locations[0].column - 1,
text: message,
type: 'error',
}))
)
}
} catch (e) {
this.editor.session.setAnnotations([
@@ -155,19 +144,19 @@ export default {
row: e.locations[0].line - 1,
column: e.locations[0].column - 1,
text: e.message,
type: "error"
}
]);
type: 'error',
},
])
}
} else {
this.editor.session.setAnnotations([]);
this.editor.session.setAnnotations([])
}
}, 2000)
}, 2000),
},
beforeDestroy() {
this.editor.destroy();
this.editor.container.remove();
}
};
this.editor.destroy()
this.editor.container.remove()
},
}
</script>

10
components/graphql/type.vue
View File

@@ -6,7 +6,7 @@
</div>
<div v-if="gqlType.getFields">
<h5>{{ $t("fields") }}</h5>
<h5>{{ $t('fields') }}</h5>
<div v-for="field in gqlType.getFields()" :key="field.name">
<gql-field :gqlField="field" :jumpTypeCallback="jumpTypeCallback" />
</div>
@@ -33,12 +33,12 @@
<script>
export default {
components: {
"gql-field": () => import("./field")
'gql-field': () => import('./field'),
},
props: {
gqlType: {},
jumpTypeCallback: Function
}
};
jumpTypeCallback: Function,
},
}
</script>

16
components/graphql/typelink.vue
View File

@@ -5,7 +5,7 @@
<style scoped lang="scss">
.typelink {
color: var(--ac-color);
font-family: "Roboto Mono", monospace;
font-family: 'Roboto Mono', monospace;
font-weight: 400;
cursor: pointer;
}
@@ -16,19 +16,19 @@ export default {
props: {
gqlType: null,
// (typeName: string) => void
jumpTypeCallback: Function
jumpTypeCallback: Function,
},
computed: {
typeString() {
return this.gqlType.toString();
}
return this.gqlType.toString()
},
},
methods: {
jumpToType() {
this.jumpTypeCallback(this.gqlType);
}
}
};
this.jumpTypeCallback(this.gqlType)
},
},
}
</script>

246
components/history.vue
View File

@@ -28,11 +28,11 @@
:class="{ stared: entry.star }"
@click="toggleStar(entry)"
v-tooltip="{
content: !entry.star ? $t('add_star') : $t('remove_star')
content: !entry.star ? $t('add_star') : $t('remove_star'),
}"
>
<i class="material-icons">
{{ entry.star ? "star" : "star_border" }}
{{ entry.star ? 'star' : 'star_border' }}
</i>
</button>
<li>
@@ -73,7 +73,7 @@
v-close-popover
>
<i class="material-icons">restore</i>
<span>{{ $t("restore") }}</span>
<span>{{ $t('restore') }}</span>
</button>
</div>
<div>
@@ -85,7 +85,7 @@
v-close-popover
>
<i class="material-icons">delete</i>
<span>{{ $t("delete") }}</span>
<span>{{ $t('delete') }}</span>
</button>
</div>
</template>
@@ -162,15 +162,13 @@
</transition>
</ul>
</virtual-list>
<ul
:class="{ hidden: filteredHistory.length != 0 || history.length === 0 }"
>
<ul :class="{ hidden: filteredHistory.length != 0 || history.length === 0 }">
<li>
<label>{{ $t("nothing_found") }} "{{ filterText }}"</label>
<label>{{ $t('nothing_found') }} "{{ filterText }}"</label>
</li>
</ul>
<p v-if="history.length === 0" class="info">
{{ $t("history_empty") }}
{{ $t('history_empty') }}
</p>
<div v-if="history.length !== 0">
<div class="flex-wrap" v-if="!isClearingHistory">
@@ -181,7 +179,7 @@
@click="enableHistoryClearing"
>
<i class="material-icons">clear_all</i>
<span>{{ $t("clear_all") }}</span>
<span>{{ $t('clear_all') }}</span>
</button>
<v-popover>
<button class="tooltip-target icon" v-tooltip="$t('sort')">
@@ -191,49 +189,45 @@
<div>
<button class="icon" @click="sort_by_label()" v-close-popover>
<i class="material-icons">sort_by_alpha</i>
<span>{{ $t("label") }}</span>
<span>{{ $t('label') }}</span>
</button>
</div>
<div>
<button class="icon" @click="sort_by_time()" v-close-popover>
<i class="material-icons">access_time</i>
<span>{{ $t("time") }}</span>
<span>{{ $t('time') }}</span>
</button>
</div>
<div>
<button
class="icon"
@click="sort_by_status_code()"
v-close-popover
>
<button class="icon" @click="sort_by_status_code()" v-close-popover>
<i class="material-icons">assistant</i>
<span>{{ $t("status") }}</span>
<span>{{ $t('status') }}</span>
</button>
</div>
<div>
<button class="icon" @click="sort_by_url()" v-close-popover>
<i class="material-icons">language</i>
<span>{{ $t("url") }}</span>
<span>{{ $t('url') }}</span>
</button>
</div>
<div>
<button class="icon" @click="sort_by_path()" v-close-popover>
<i class="material-icons">timeline</i>
<span>{{ $t("path") }}</span>
<span>{{ $t('path') }}</span>
</button>
</div>
<div v-if="showMore">
<button class="icon" @click="sort_by_duration()" v-close-popover>
<i class="material-icons">timer</i>
<span>{{ $t("duration") }}</span>
<span>{{ $t('duration') }}</span>
</button>
</div>
<div>
<button class="icon" @click="toggleCollapse()">
<i class="material-icons">
{{ !showMore ? "first_page" : "last_page" }}
{{ !showMore ? 'first_page' : 'last_page' }}
</i>
<span>{{ !showMore ? $t("show_more") : $t("hide_more") }}</span>
<span>{{ !showMore ? $t('show_more') : $t('hide_more') }}</span>
</button>
</div>
</template>
@@ -241,7 +235,7 @@
</div>
<div class="flex-wrap" v-else>
<label for="clear-history-button" class="info">
{{ $t("are_you_sure") }}
{{ $t('are_you_sure') }}
</label>
<div>
<button
@@ -301,7 +295,7 @@ ol {
position: absolute;
top: 10px;
right: 10px;
font-family: "Roboto Mono", monospace;
font-family: 'Roboto Mono', monospace;
font-weight: 400;
background-color: transparent;
padding: 2px 6px;
@@ -326,24 +320,24 @@ ol {
</style>
<script>
import { findStatusGroup } from "../pages/index";
import { fb } from "../functions/fb";
import { findStatusGroup } from '../pages/index'
import { fb } from '../functions/fb'
const updateOnLocalStorage = (propertyName, property) =>
window.localStorage.setItem(propertyName, JSON.stringify(property));
window.localStorage.setItem(propertyName, JSON.stringify(property))
export default {
components: {
"pw-section": () => import("./section"),
VirtualList: () => import("vue-virtual-scroll-list")
'pw-section': () => import('./section'),
VirtualList: () => import('vue-virtual-scroll-list'),
},
data() {
return {
history:
fb.currentUser !== null
? fb.currentHistory
: JSON.parse(window.localStorage.getItem("history")) || [],
filterText: "",
: JSON.parse(window.localStorage.getItem('history')) || [],
filterText: '',
showFilter: false,
isClearingHistory: false,
reverse_sort_label: false,
@@ -351,166 +345,144 @@ export default {
reverse_sort_status_code: false,
reverse_sort_url: false,
reverse_sort_path: false,
showMore: false
};
showMore: false,
}
},
computed: {
filteredHistory() {
this.history =
fb.currentUser !== null
? fb.currentHistory
: JSON.parse(window.localStorage.getItem("history")) || [];
: JSON.parse(window.localStorage.getItem('history')) || []
return this.history.filter(entry => {
const filterText = this.filterText.toLowerCase();
const filterText = this.filterText.toLowerCase()
return Object.keys(entry).some(key => {
let value = entry[key];
value = typeof value !== "string" ? value.toString() : value;
return value.toLowerCase().includes(filterText);
});
});
}
let value = entry[key]
value = typeof value !== 'string' ? value.toString() : value
return value.toLowerCase().includes(filterText)
})
})
},
},
methods: {
clearHistory() {
if (fb.currentUser !== null) {
fb.clearHistory();
fb.clearHistory()
}
this.history = [];
this.filterText = "";
this.disableHistoryClearing();
updateOnLocalStorage("history", this.history);
this.$toast.error(this.$t("history_deleted"), {
icon: "delete"
});
this.history = []
this.filterText = ''
this.disableHistoryClearing()
updateOnLocalStorage('history', this.history)
this.$toast.error(this.$t('history_deleted'), {
icon: 'delete',
})
},
useHistory(entry) {
this.$emit("useHistory", entry);
this.$emit('useHistory', entry)
},
findEntryStatus(entry) {
const foundStatusGroup = findStatusGroup(entry.status);
const foundStatusGroup = findStatusGroup(entry.status)
return (
foundStatusGroup || {
className: ""
className: '',
}
);
)
},
deleteHistory(entry) {
if (fb.currentUser !== null) {
fb.deleteHistory(entry);
fb.deleteHistory(entry)
}
this.history.splice(this.history.indexOf(entry), 1);
this.history.splice(this.history.indexOf(entry), 1)
if (this.history.length === 0) {
this.filterText = "";
this.filterText = ''
}
updateOnLocalStorage("history", this.history);
this.$toast.error(this.$t("deleted"), {
icon: "delete"
});
updateOnLocalStorage('history', this.history)
this.$toast.error(this.$t('deleted'), {
icon: 'delete',
})
},
addEntry(entry) {
this.history.push(entry);
updateOnLocalStorage("history", this.history);
this.history.push(entry)
updateOnLocalStorage('history', this.history)
},
enableHistoryClearing() {
if (!this.history || !this.history.length) return;
this.isClearingHistory = true;
if (!this.history || !this.history.length) return
this.isClearingHistory = true
},
disableHistoryClearing() {
this.isClearingHistory = false;
this.isClearingHistory = false
},
sort_by_time() {
let byDate = this.history.slice(0);
let byDate = this.history.slice(0)
byDate.sort((a, b) => {
let date_a = a.date.split("/");
let date_b = b.date.split("/");
let time_a = a.time.split(":");
let time_b = b.time.split(":");
let final_a = new Date(
date_a[2],
date_a[1],
date_a[0],
time_a[0],
time_a[1],
time_a[2]
);
let final_b = new Date(
date_b[2],
date_b[1],
date_b[0],
time_b[0],
time_b[1],
time_b[2]
);
if (this.reverse_sort_time) return final_b - final_a;
else return final_a - final_b;
});
this.history = byDate;
this.reverse_sort_time = !this.reverse_sort_time;
let date_a = a.date.split('/')
let date_b = b.date.split('/')
let time_a = a.time.split(':')
let time_b = b.time.split(':')
let final_a = new Date(date_a[2], date_a[1], date_a[0], time_a[0], time_a[1], time_a[2])
let final_b = new Date(date_b[2], date_b[1], date_b[0], time_b[0], time_b[1], time_b[2])
if (this.reverse_sort_time) return final_b - final_a
else return final_a - final_b
})
this.history = byDate
this.reverse_sort_time = !this.reverse_sort_time
},
sort_by_status_code() {
let byCode = this.history.slice(0);
let byCode = this.history.slice(0)
byCode.sort((a, b) => {
if (this.reverse_sort_status_code) return b.status - a.status;
else return a.status - b.status;
});
this.history = byCode;
this.reverse_sort_status_code = !this.reverse_sort_status_code;
if (this.reverse_sort_status_code) return b.status - a.status
else return a.status - b.status
})
this.history = byCode
this.reverse_sort_status_code = !this.reverse_sort_status_code
},
sort_by_url() {
let byUrl = this.history.slice(0);
let byUrl = this.history.slice(0)
byUrl.sort((a, b) => {
if (this.reverse_sort_url)
return a.url === b.url ? 0 : +(a.url < b.url) || -1;
else return a.url === b.url ? 0 : +(a.url > b.url) || -1;
});
this.history = byUrl;
this.reverse_sort_url = !this.reverse_sort_url;
if (this.reverse_sort_url) return a.url === b.url ? 0 : +(a.url < b.url) || -1
else return a.url === b.url ? 0 : +(a.url > b.url) || -1
})
this.history = byUrl
this.reverse_sort_url = !this.reverse_sort_url
},
sort_by_label() {
let byLabel = this.history.slice(0);
let byLabel = this.history.slice(0)
byLabel.sort((a, b) => {
if (this.reverse_sort_label)
return a.label === b.label ? 0 : +(a.label < b.label) || -1;
else return a.label === b.label ? 0 : +(a.label > b.label) || -1;
});
this.history = byLabel;
this.reverse_sort_label = !this.reverse_sort_label;
if (this.reverse_sort_label) return a.label === b.label ? 0 : +(a.label < b.label) || -1
else return a.label === b.label ? 0 : +(a.label > b.label) || -1
})
this.history = byLabel
this.reverse_sort_label = !this.reverse_sort_label
},
sort_by_path() {
let byPath = this.history.slice(0);
let byPath = this.history.slice(0)
byPath.sort((a, b) => {
if (this.reverse_sort_path)
return a.path === b.path ? 0 : +(a.path < b.path) || -1;
else return a.path === b.path ? 0 : +(a.path > b.path) || -1;
});
this.history = byPath;
this.reverse_sort_path = !this.reverse_sort_path;
if (this.reverse_sort_path) return a.path === b.path ? 0 : +(a.path < b.path) || -1
else return a.path === b.path ? 0 : +(a.path > b.path) || -1
})
this.history = byPath
this.reverse_sort_path = !this.reverse_sort_path
},
sort_by_duration() {
let byDuration = this.history.slice(0);
let byDuration = this.history.slice(0)
byDuration.sort((a, b) => {
if (this.reverse_sort_duration)
return a.duration === b.duration
? 0
: +(a.duration < b.duration) || -1;
else
return a.duration === b.duration
? 0
: +(a.duration > b.duration) || -1;
});
this.history = byDuration;
this.reverse_sort_duration = !this.reverse_sort_duration;
return a.duration === b.duration ? 0 : +(a.duration < b.duration) || -1
else return a.duration === b.duration ? 0 : +(a.duration > b.duration) || -1
})
this.history = byDuration
this.reverse_sort_duration = !this.reverse_sort_duration
},
toggleCollapse() {
this.showMore = !this.showMore;
this.showMore = !this.showMore
},
toggleStar(entry) {
if (fb.currentUser !== null) {
fb.toggleStar(entry, !entry.star);
fb.toggleStar(entry, !entry.star)
}
entry.star = !entry.star;
updateOnLocalStorage("history", this.history);
}
}
};
entry.star = !entry.star
updateOnLocalStorage('history', this.history)
},
},
}
</script>

8
components/logo.vue
View File

@@ -49,8 +49,8 @@
export default {
props: {
color: {
type: String
}
}
};
type: String,
},
},
}
</script>

33
components/section.vue
View File

@@ -1,12 +1,9 @@
<template>
<fieldset
:id="label.toLowerCase()"
:class="{ 'no-colored-frames': !frameColorsEnabled }"
>
<fieldset :id="label.toLowerCase()" :class="{ 'no-colored-frames': !frameColorsEnabled }">
<legend @click.prevent="collapse">
<span>{{ label }}</span>
<i class="material-icons">
{{ isCollapsed ? "expand_more" : "expand_less" }}
{{ isCollapsed ? 'expand_more' : 'expand_less' }}
</i>
</legend>
<div class="collapsible" :class="{ hidden: collapsed }">
@@ -25,32 +22,32 @@ fieldset.no-colored-frames legend {
export default {
computed: {
frameColorsEnabled() {
return this.$store.state.postwoman.settings.FRAME_COLORS_ENABLED || false;
}
return this.$store.state.postwoman.settings.FRAME_COLORS_ENABLED || false
},
},
data() {
return {
isCollapsed: false
};
isCollapsed: false,
}
},
props: {
label: {
type: String,
default: "Section"
default: 'Section',
},
collapsed: {
type: Boolean
}
type: Boolean,
},
},
methods: {
collapse({ target }) {
const parent = target.parentNode.parentNode;
parent.querySelector(".collapsible").classList.toggle("hidden");
this.isCollapsed = !this.isCollapsed;
}
}
};
const parent = target.parentNode.parentNode
parent.querySelector('.collapsible').classList.toggle('hidden')
this.isCollapsed = !this.isCollapsed
},
},
}
</script>

12
components/settings/swatch.vue
View File

@@ -45,15 +45,15 @@ export default {
props: {
color: {
type: String,
required: true
required: true,
},
name: {
type: String
type: String,
},
active: {
type: Boolean,
default: false
}
}
};
default: false,
},
},
}
</script>

14
components/toggle.vue
View File

@@ -84,15 +84,15 @@ export default {
props: {
on: {
type: Boolean,
default: false
}
default: false,
},
},
methods: {
toggle() {
const containsOnClass = this.$refs.toggle.classList.toggle("on");
this.$emit("change", containsOnClass);
}
}
};
const containsOnClass = this.$refs.toggle.classList.toggle('on')
this.$emit('change', containsOnClass)
},
},
}
</script>