chore: bump deps + refactor: consistent import / export modal

This commit is contained in:
liyasthomas
2021-06-07 15:22:34 +05:30
parent 50fa1c8f0a
commit 766c31fa56
6 changed files with 66 additions and 99 deletions

View File

@@ -72,7 +72,7 @@
class="icon" class="icon"
@click="openDialogChooseFileToReplaceWith" @click="openDialogChooseFileToReplaceWith"
> >
<i class="material-icons">create_new_folder</i> <i class="material-icons">folder_special</i>
<span>{{ $t("replace_json") }}</span> <span>{{ $t("replace_json") }}</span>
<input <input
ref="inputChooseFileToReplaceWith" ref="inputChooseFileToReplaceWith"
@@ -87,7 +87,7 @@
class="icon" class="icon"
@click="openDialogChooseFileToImportFrom" @click="openDialogChooseFileToImportFrom"
> >
<i class="material-icons">folder_special</i> <i class="material-icons">create_new_folder</i>
<span>{{ $t("import_json") }}</span> <span>{{ $t("import_json") }}</span>
<input <input
ref="inputChooseFileToImportFrom" ref="inputChooseFileToImportFrom"
@@ -99,25 +99,22 @@
</button> </button>
<button <button
v-if="collectionsType.type == 'team-collections'" v-if="collectionsType.type == 'team-collections'"
v-tooltip="$t('replace_current')" v-tooltip="$t('preserve_current')"
class="icon" class="icon"
@click="mode = 'import_from_my_collections'" @click="mode = 'import_from_my_collections'"
> >
<i class="material-icons">folder_special</i> <i class="material-icons">folder_shared</i>
<span>{{ "Import from My Collections" }}</span> <span>{{ $t("import_from_my_collections") }}</span>
</button> </button>
<button <button
v-tooltip="$t('show_code')" v-tooltip="$t('download_file')"
class="icon" class="icon"
@click=" @click="exportJSON"
() => {
mode = 'export_as_json'
getJSONCollection()
}
"
> >
<i class="material-icons">folder_special</i> <i class="material-icons">drive_file_move</i>
<span>{{ "Export As JSON" }}</span> <span>
{{ $t("export_as_json") }}
</span>
</button> </button>
</div> </div>
<div v-if="mode == 'import_from_my_collections'"> <div v-if="mode == 'import_from_my_collections'">
@@ -149,26 +146,19 @@
</option> </option>
</select> </select>
</span> </span>
<button <div slot="footer">
class="m-2 icon primary" <div class="row-wrapper">
:disabled="mySelectedCollectionID == undefined" <span></span>
@click="importFromMyCollections" <span>
> <button
{{ $t("import") }} class="m-2 icon primary"
</button> :disabled="mySelectedCollectionID == undefined"
</div> @click="importFromMyCollections"
<div v-if="mode == 'export_as_json'"> >
<textarea v-model="collectionJson" rows="8" readonly></textarea> {{ $t("import") }}
<div class="row-wrapper"> </button>
<span class="m-2"> </span>
<button </div>
v-tooltip="$t('download_file')"
class="icon primary"
@click="exportJSON"
>
{{ $t("export") }}
</button>
</span>
</div> </div>
</div> </div>
</div> </div>
@@ -399,6 +389,7 @@ export default {
return this.collectionJson return this.collectionJson
}, },
exportJSON() { exportJSON() {
this.getJSONCollection()
let text = this.collectionJson let text = this.collectionJson
text = text.replace(/\n/g, "\r\n") text = text.replace(/\n/g, "\r\n")
const blob = new Blob([text], { const blob = new Blob([text], {

View File

@@ -59,7 +59,7 @@
class="icon" class="icon"
@click="openDialogChooseFileToReplaceWith" @click="openDialogChooseFileToReplaceWith"
> >
<i class="material-icons">create_new_folder</i> <i class="material-icons">folder_special</i>
<span>{{ $t("replace_json") }}</span> <span>{{ $t("replace_json") }}</span>
<input <input
ref="inputChooseFileToReplaceWith" ref="inputChooseFileToReplaceWith"
@@ -74,7 +74,7 @@
class="icon" class="icon"
@click="openDialogChooseFileToImportFrom" @click="openDialogChooseFileToImportFrom"
> >
<i class="material-icons">folder_special</i> <i class="material-icons">create_new_folder</i>
<span>{{ $t("import_json") }}</span> <span>{{ $t("import_json") }}</span>
<input <input
ref="inputChooseFileToImportFrom" ref="inputChooseFileToImportFrom"
@@ -84,30 +84,16 @@
@change="importFromJSON" @change="importFromJSON"
/> />
</button> </button>
</div> <button
<div v-if="showJsonCode" class="row-wrapper"> v-tooltip="$t('download_file')"
<textarea v-model="collectionJson" rows="8" readonly></textarea> class="icon"
</div> @click="exportJSON"
</div> >
<div slot="footer"> <i class="material-icons">drive_file_move</i>
<div class="row-wrapper"> <span>
<span> {{ $t("export_as_json") }}
<SmartToggle :on="showJsonCode" @change="showJsonCode = $event"> </span>
{{ $t("show_code") }} </button>
</SmartToggle>
</span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
</button>
<button
v-tooltip="$t('download_file')"
class="icon primary"
@click="exportJSON"
>
{{ $t("export") }}
</button>
</span>
</div> </div>
</div> </div>
</SmartModal> </SmartModal>
@@ -128,7 +114,6 @@ export default {
data() { data() {
return { return {
fb, fb,
showJsonCode: false,
} }
}, },
subscriptions() { subscriptions() {

View File

@@ -61,7 +61,7 @@
class="icon" class="icon"
@click="openDialogChooseFileToReplaceWith" @click="openDialogChooseFileToReplaceWith"
> >
<i class="material-icons">create_new_folder</i> <i class="material-icons">folder_special</i>
<span>{{ $t("replace_json") }}</span> <span>{{ $t("replace_json") }}</span>
<input <input
ref="inputChooseFileToReplaceWith" ref="inputChooseFileToReplaceWith"
@@ -76,7 +76,7 @@
class="icon" class="icon"
@click="openDialogChooseFileToImportFrom" @click="openDialogChooseFileToImportFrom"
> >
<i class="material-icons">folder_special</i> <i class="material-icons">create_new_folder</i>
<span>{{ $t("import_json") }}</span> <span>{{ $t("import_json") }}</span>
<input <input
ref="inputChooseFileToImportFrom" ref="inputChooseFileToImportFrom"
@@ -86,30 +86,16 @@
@change="importFromJSON" @change="importFromJSON"
/> />
</button> </button>
</div> <button
<div v-if="showJsonCode" class="row-wrapper"> v-tooltip="$t('download_file')"
<textarea v-model="environmentJson" rows="8" readonly></textarea> class="icon"
</div> @click="exportJSON"
</div> >
<div slot="footer"> <i class="material-icons">drive_file_move</i>
<div class="row-wrapper"> <span>
<span> {{ $t("export_as_json") }}
<SmartToggle :on="showJsonCode" @change="showJsonCode = $event"> </span>
{{ $t("show_code") }} </button>
</SmartToggle>
</span>
<span>
<button class="icon" @click="hideModal">
{{ $t("cancel") }}
</button>
<button
v-tooltip="$t('download_file')"
class="icon primary"
@click="exportJSON"
>
{{ $t("export") }}
</button>
</span>
</div> </div>
</div> </div>
</SmartModal> </SmartModal>
@@ -117,7 +103,11 @@
<script> <script>
import { fb } from "~/helpers/fb" import { fb } from "~/helpers/fb"
import { environments$, replaceEnvironments, appendEnvironments } from "~/newstore/environments" import {
environments$,
replaceEnvironments,
appendEnvironments,
} from "~/newstore/environments"
export default { export default {
props: { props: {
@@ -126,12 +116,11 @@ export default {
data() { data() {
return { return {
fb, fb,
showJsonCode: false,
} }
}, },
subscriptions() { subscriptions() {
return { return {
environments: environments$ environments: environments$,
} }
}, },
computed: { computed: {

View File

@@ -330,5 +330,7 @@
"disable_exit": "Only owner cannot exit the team", "disable_exit": "Only owner cannot exit the team",
"folder_renamed": "Folder renamed successfully", "folder_renamed": "Folder renamed successfully",
"role_updated": "User role(s) updated successfully", "role_updated": "User role(s) updated successfully",
"user_removed": "User removed successfully" "user_removed": "User removed successfully",
"import_from_my_collections": "Import from My Collections",
"export_as_json": "Export as JSON"
} }

14
package-lock.json generated
View File

@@ -75,7 +75,7 @@
"stylelint": "^13.12.0", "stylelint": "^13.12.0",
"stylelint-config-prettier": "^8.0.2", "stylelint-config-prettier": "^8.0.2",
"stylelint-config-standard": "^22.0.0", "stylelint-config-standard": "^22.0.0",
"ts-jest": "^27.0.2", "ts-jest": "^27.0.3",
"vue-jest": "^3.0.7", "vue-jest": "^3.0.7",
"worker-loader": "^3.0.8" "worker-loader": "^3.0.8"
} }
@@ -36133,9 +36133,9 @@
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w==" "integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
}, },
"node_modules/ts-jest": { "node_modules/ts-jest": {
"version": "27.0.2", "version": "27.0.3",
"resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.0.2.tgz", "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.0.3.tgz",
"integrity": "sha512-pozjHOOfm+sbv9kXCvTFVyDntWvuJztzkNFql/akD75hSMZ2jsbidVauOhBRImAopXohqcLtPK/NTTIS8Y49Ug==", "integrity": "sha512-U5rdMjnYam9Ucw+h0QvtNDbc5+88nxt7tbIvqaZUhFrfG4+SkWhMXjejCLVGcpILTPuV+H3W/GZDZrnZFpPeXw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"bs-logger": "0.x", "bs-logger": "0.x",
@@ -69388,9 +69388,9 @@
} }
}, },
"ts-jest": { "ts-jest": {
"version": "27.0.2", "version": "27.0.3",
"resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.0.2.tgz", "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.0.3.tgz",
"integrity": "sha512-pozjHOOfm+sbv9kXCvTFVyDntWvuJztzkNFql/akD75hSMZ2jsbidVauOhBRImAopXohqcLtPK/NTTIS8Y49Ug==", "integrity": "sha512-U5rdMjnYam9Ucw+h0QvtNDbc5+88nxt7tbIvqaZUhFrfG4+SkWhMXjejCLVGcpILTPuV+H3W/GZDZrnZFpPeXw==",
"dev": true, "dev": true,
"requires": { "requires": {
"bs-logger": "0.x", "bs-logger": "0.x",

View File

@@ -91,7 +91,7 @@
"stylelint": "^13.12.0", "stylelint": "^13.12.0",
"stylelint-config-prettier": "^8.0.2", "stylelint-config-prettier": "^8.0.2",
"stylelint-config-standard": "^22.0.0", "stylelint-config-standard": "^22.0.0",
"ts-jest": "^27.0.2", "ts-jest": "^27.0.3",
"vue-jest": "^3.0.7", "vue-jest": "^3.0.7",
"worker-loader": "^3.0.8" "worker-loader": "^3.0.8"
} }