From 766c31fa56b4a3e508b2150bca9148d4a4aab4bc Mon Sep 17 00:00:00 2001
From: liyasthomas <liyascthomas@gmail.com>
Date: Mon, 7 Jun 2021 15:22:34 +0530
Subject: [PATCH] chore: bump deps + refactor: consistent import / export modal

---
 components/collections/ImportExport.vue       | 59 ++++++++-----------
 .../collections/graphql/ImportExport.vue      | 39 ++++--------
 components/environments/ImportExport.vue      | 47 ++++++---------
 lang/en-US.json                               |  4 +-
 package-lock.json                             | 14 ++---
 package.json                                  |  2 +-
 6 files changed, 66 insertions(+), 99 deletions(-)

diff --git a/components/collections/ImportExport.vue b/components/collections/ImportExport.vue
index 13ebd1e71..76578ee42 100644
--- a/components/collections/ImportExport.vue
+++ b/components/collections/ImportExport.vue
@@ -72,7 +72,7 @@
           class="icon"
           @click="openDialogChooseFileToReplaceWith"
         >
-          <i class="material-icons">create_new_folder</i>
+          <i class="material-icons">folder_special</i>
           <span>{{ $t("replace_json") }}</span>
           <input
             ref="inputChooseFileToReplaceWith"
@@ -87,7 +87,7 @@
           class="icon"
           @click="openDialogChooseFileToImportFrom"
         >
-          <i class="material-icons">folder_special</i>
+          <i class="material-icons">create_new_folder</i>
           <span>{{ $t("import_json") }}</span>
           <input
             ref="inputChooseFileToImportFrom"
@@ -99,25 +99,22 @@
         </button>
         <button
           v-if="collectionsType.type == 'team-collections'"
-          v-tooltip="$t('replace_current')"
+          v-tooltip="$t('preserve_current')"
           class="icon"
           @click="mode = 'import_from_my_collections'"
         >
-          <i class="material-icons">folder_special</i>
-          <span>{{ "Import from My Collections" }}</span>
+          <i class="material-icons">folder_shared</i>
+          <span>{{ $t("import_from_my_collections") }}</span>
         </button>
         <button
-          v-tooltip="$t('show_code')"
+          v-tooltip="$t('download_file')"
           class="icon"
-          @click="
-            () => {
-              mode = 'export_as_json'
-              getJSONCollection()
-            }
-          "
+          @click="exportJSON"
         >
-          <i class="material-icons">folder_special</i>
-          <span>{{ "Export As JSON" }}</span>
+          <i class="material-icons">drive_file_move</i>
+          <span>
+            {{ $t("export_as_json") }}
+          </span>
         </button>
       </div>
       <div v-if="mode == 'import_from_my_collections'">
@@ -149,26 +146,19 @@
             </option>
           </select>
         </span>
-        <button
-          class="m-2 icon primary"
-          :disabled="mySelectedCollectionID == undefined"
-          @click="importFromMyCollections"
-        >
-          {{ $t("import") }}
-        </button>
-      </div>
-      <div v-if="mode == 'export_as_json'">
-        <textarea v-model="collectionJson" rows="8" readonly></textarea>
-        <div class="row-wrapper">
-          <span class="m-2">
-            <button
-              v-tooltip="$t('download_file')"
-              class="icon primary"
-              @click="exportJSON"
-            >
-              {{ $t("export") }}
-            </button>
-          </span>
+        <div slot="footer">
+          <div class="row-wrapper">
+            <span></span>
+            <span>
+              <button
+                class="m-2 icon primary"
+                :disabled="mySelectedCollectionID == undefined"
+                @click="importFromMyCollections"
+              >
+                {{ $t("import") }}
+              </button>
+            </span>
+          </div>
         </div>
       </div>
     </div>
@@ -399,6 +389,7 @@ export default {
       return this.collectionJson
     },
     exportJSON() {
+      this.getJSONCollection()
       let text = this.collectionJson
       text = text.replace(/\n/g, "\r\n")
       const blob = new Blob([text], {
diff --git a/components/collections/graphql/ImportExport.vue b/components/collections/graphql/ImportExport.vue
index 44a726c88..9e47312d6 100644
--- a/components/collections/graphql/ImportExport.vue
+++ b/components/collections/graphql/ImportExport.vue
@@ -59,7 +59,7 @@
           class="icon"
           @click="openDialogChooseFileToReplaceWith"
         >
-          <i class="material-icons">create_new_folder</i>
+          <i class="material-icons">folder_special</i>
           <span>{{ $t("replace_json") }}</span>
           <input
             ref="inputChooseFileToReplaceWith"
@@ -74,7 +74,7 @@
           class="icon"
           @click="openDialogChooseFileToImportFrom"
         >
-          <i class="material-icons">folder_special</i>
+          <i class="material-icons">create_new_folder</i>
           <span>{{ $t("import_json") }}</span>
           <input
             ref="inputChooseFileToImportFrom"
@@ -84,30 +84,16 @@
             @change="importFromJSON"
           />
         </button>
-      </div>
-      <div v-if="showJsonCode" class="row-wrapper">
-        <textarea v-model="collectionJson" rows="8" readonly></textarea>
-      </div>
-    </div>
-    <div slot="footer">
-      <div class="row-wrapper">
-        <span>
-          <SmartToggle :on="showJsonCode" @change="showJsonCode = $event">
-            {{ $t("show_code") }}
-          </SmartToggle>
-        </span>
-        <span>
-          <button class="icon" @click="hideModal">
-            {{ $t("cancel") }}
-          </button>
-          <button
-            v-tooltip="$t('download_file')"
-            class="icon primary"
-            @click="exportJSON"
-          >
-            {{ $t("export") }}
-          </button>
-        </span>
+        <button
+          v-tooltip="$t('download_file')"
+          class="icon"
+          @click="exportJSON"
+        >
+          <i class="material-icons">drive_file_move</i>
+          <span>
+            {{ $t("export_as_json") }}
+          </span>
+        </button>
       </div>
     </div>
   </SmartModal>
@@ -128,7 +114,6 @@ export default {
   data() {
     return {
       fb,
-      showJsonCode: false,
     }
   },
   subscriptions() {
diff --git a/components/environments/ImportExport.vue b/components/environments/ImportExport.vue
index 369a46f83..f9408c97a 100644
--- a/components/environments/ImportExport.vue
+++ b/components/environments/ImportExport.vue
@@ -61,7 +61,7 @@
           class="icon"
           @click="openDialogChooseFileToReplaceWith"
         >
-          <i class="material-icons">create_new_folder</i>
+          <i class="material-icons">folder_special</i>
           <span>{{ $t("replace_json") }}</span>
           <input
             ref="inputChooseFileToReplaceWith"
@@ -76,7 +76,7 @@
           class="icon"
           @click="openDialogChooseFileToImportFrom"
         >
-          <i class="material-icons">folder_special</i>
+          <i class="material-icons">create_new_folder</i>
           <span>{{ $t("import_json") }}</span>
           <input
             ref="inputChooseFileToImportFrom"
@@ -86,30 +86,16 @@
             @change="importFromJSON"
           />
         </button>
-      </div>
-      <div v-if="showJsonCode" class="row-wrapper">
-        <textarea v-model="environmentJson" rows="8" readonly></textarea>
-      </div>
-    </div>
-    <div slot="footer">
-      <div class="row-wrapper">
-        <span>
-          <SmartToggle :on="showJsonCode" @change="showJsonCode = $event">
-            {{ $t("show_code") }}
-          </SmartToggle>
-        </span>
-        <span>
-          <button class="icon" @click="hideModal">
-            {{ $t("cancel") }}
-          </button>
-          <button
-            v-tooltip="$t('download_file')"
-            class="icon primary"
-            @click="exportJSON"
-          >
-            {{ $t("export") }}
-          </button>
-        </span>
+        <button
+          v-tooltip="$t('download_file')"
+          class="icon"
+          @click="exportJSON"
+        >
+          <i class="material-icons">drive_file_move</i>
+          <span>
+            {{ $t("export_as_json") }}
+          </span>
+        </button>
       </div>
     </div>
   </SmartModal>
@@ -117,7 +103,11 @@
 
 <script>
 import { fb } from "~/helpers/fb"
-import { environments$, replaceEnvironments, appendEnvironments } from "~/newstore/environments"
+import {
+  environments$,
+  replaceEnvironments,
+  appendEnvironments,
+} from "~/newstore/environments"
 
 export default {
   props: {
@@ -126,12 +116,11 @@ export default {
   data() {
     return {
       fb,
-      showJsonCode: false,
     }
   },
   subscriptions() {
     return {
-      environments: environments$
+      environments: environments$,
     }
   },
   computed: {
diff --git a/lang/en-US.json b/lang/en-US.json
index 1d86c5d73..dd17f01ae 100644
--- a/lang/en-US.json
+++ b/lang/en-US.json
@@ -330,5 +330,7 @@
   "disable_exit": "Only owner cannot exit the team",
   "folder_renamed": "Folder renamed 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"
 }
diff --git a/package-lock.json b/package-lock.json
index f223edc90..587836fb0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -75,7 +75,7 @@
         "stylelint": "^13.12.0",
         "stylelint-config-prettier": "^8.0.2",
         "stylelint-config-standard": "^22.0.0",
-        "ts-jest": "^27.0.2",
+        "ts-jest": "^27.0.3",
         "vue-jest": "^3.0.7",
         "worker-loader": "^3.0.8"
       }
@@ -36133,9 +36133,9 @@
       "integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
     },
     "node_modules/ts-jest": {
-      "version": "27.0.2",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.0.2.tgz",
-      "integrity": "sha512-pozjHOOfm+sbv9kXCvTFVyDntWvuJztzkNFql/akD75hSMZ2jsbidVauOhBRImAopXohqcLtPK/NTTIS8Y49Ug==",
+      "version": "27.0.3",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.0.3.tgz",
+      "integrity": "sha512-U5rdMjnYam9Ucw+h0QvtNDbc5+88nxt7tbIvqaZUhFrfG4+SkWhMXjejCLVGcpILTPuV+H3W/GZDZrnZFpPeXw==",
       "dev": true,
       "dependencies": {
         "bs-logger": "0.x",
@@ -69388,9 +69388,9 @@
       }
     },
     "ts-jest": {
-      "version": "27.0.2",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.0.2.tgz",
-      "integrity": "sha512-pozjHOOfm+sbv9kXCvTFVyDntWvuJztzkNFql/akD75hSMZ2jsbidVauOhBRImAopXohqcLtPK/NTTIS8Y49Ug==",
+      "version": "27.0.3",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-27.0.3.tgz",
+      "integrity": "sha512-U5rdMjnYam9Ucw+h0QvtNDbc5+88nxt7tbIvqaZUhFrfG4+SkWhMXjejCLVGcpILTPuV+H3W/GZDZrnZFpPeXw==",
       "dev": true,
       "requires": {
         "bs-logger": "0.x",
diff --git a/package.json b/package.json
index be399676b..eb5bbbca0 100644
--- a/package.json
+++ b/package.json
@@ -91,7 +91,7 @@
     "stylelint": "^13.12.0",
     "stylelint-config-prettier": "^8.0.2",
     "stylelint-config-standard": "^22.0.0",
-    "ts-jest": "^27.0.2",
+    "ts-jest": "^27.0.3",
     "vue-jest": "^3.0.7",
     "worker-loader": "^3.0.8"
   }