Merge pull request hoppscotch#1004 from liyasthomas/feat/doc

280185386 · Jul 18, 2020 · 1fbfa23 · 1fbfa23
2 parents f653901 + 193b7ae
commit 1fbfa23
Show file tree

Hide file tree

Showing 6 changed files with 325 additions and 279 deletions.
diff --git a/components/collections/collection.vue b/components/collections/collection.vue
@@ -1,39 +1,47 @@
 <template>
   <div>
     <div class="flex-wrap">
+      <button class="icon" @click="toggleShowChildren">
+        <i class="material-icons" v-show="!showChildren">arrow_right</i>
+        <i class="material-icons" v-show="showChildren">arrow_drop_down</i>
+        <i class="material-icons">folder</i>
+        <span>{{ collection.name }}</span>
+      </button>
       <div>
-        <button class="icon" @click="toggleShowChildren">
-          <i class="material-icons" v-show="!showChildren">arrow_right</i>
-          <i class="material-icons" v-show="showChildren">arrow_drop_down</i>
-          <i class="material-icons">folder</i>
-          <span>{{ collection.name }}</span>
+        <button
+          v-if="doc"
+          class="icon"
+          @click="$emit('select-collection')"
+          v-tooltip.left="$t('import')"
+        >
+          <i class="material-icons">topic</i>
         </button>
+        <v-popover>
+          <button class="tooltip-target icon" v-tooltip.left="$t('more')">
+            <i class="material-icons">more_vert</i>
+          </button>
+          <template slot="popover">
+            <div>
+              <button class="icon" @click="$emit('add-folder')" v-close-popover>
+                <i class="material-icons">create_new_folder</i>
+                <span>{{ $t("new_folder") }}</span>
+              </button>
+            </div>
+            <div>
+              <button class="icon" @click="$emit('edit-collection')" v-close-popover>
+                <i class="material-icons">create</i>
+                <span>{{ $t("edit") }}</span>
+              </button>
+            </div>
+            <div>
+              <button class="icon" @click="removeCollection" v-close-popover>
+                <i class="material-icons">delete</i>
+                <span>{{ $t("delete") }}</span>
+              </button>
+            </div>
+          </template>
+        </v-popover>
       </div>
-      <v-popover>
-        <button class="tooltip-target icon" v-tooltip.left="$t('more')">
-          <i class="material-icons">more_vert</i>
-        </button>
-        <template slot="popover">
-          <div>
-            <button class="icon" @click="$emit('add-folder')" v-close-popover>
-              <i class="material-icons">create_new_folder</i>
-              <span>{{ $t("new_folder") }}</span>
-            </button>
-          </div>
-          <div>
-            <button class="icon" @click="$emit('edit-collection')" v-close-popover>
-              <i class="material-icons">create</i>
-              <span>{{ $t("edit") }}</span>
-            </button>
-          </div>
-          <div>
-            <button class="icon" @click="removeCollection" v-close-popover>
-              <i class="material-icons">delete</i>
-              <span>{{ $t("delete") }}</span>
-            </button>
-          </div>
-        </template>
-      </v-popover>
     </div>
 
     <div v-show="showChildren">
@@ -43,6 +51,7 @@
             :folder="folder"
             :folderIndex="index"
             :collection-index="collectionIndex"
+            :doc="doc"
             @edit-folder="editFolder(collectionIndex, folder, index)"
             @edit-request="$emit('edit-request', $event)"
           />
@@ -58,6 +67,7 @@
             :collection-index="collectionIndex"
             :folder-index="-1"
             :request-index="index"
+            :doc="doc"
             @edit-request="
               $emit('edit-request', {
                 request,
@@ -97,6 +107,7 @@ export default {
   props: {
     collectionIndex: Number,
     collection: Object,
+    doc: Boolean,
   },
   data() {
     return {

diff --git a/components/collections/folder.vue b/components/collections/folder.vue
@@ -38,6 +38,7 @@
             :collection-index="collectionIndex"
             :folder-index="folderIndex"
             :request-index="index"
+            :doc="doc"
             @edit-request="
               $emit('edit-request', {
                 request,
@@ -77,6 +78,7 @@ export default {
     folder: Object,
     collectionIndex: Number,
     folderIndex: Number,
+    doc: Boolean,
   },
   components: {
     request: () => import("./request"),

diff --git a/components/collections/index.vue b/components/collections/index.vue
@@ -70,26 +70,22 @@ TODO:
           <collection
             :collection-index="index"
             :collection="collection"
+            :doc="doc"
             @edit-collection="editCollection(collection, index)"
             @add-folder="addFolder(collection, index)"
             @edit-folder="editFolder($event)"
             @edit-request="editRequest($event)"
+            @select-collection="$emit('use-collection', collection)"
           />
         </li>
       </ul>
     </div>
-    <nuxt-link :to="localePath('doc')" :aria-label="$t('documentation')">
-      <button class="icon">
-        <i class="material-icons">topic</i>
-        <span>{{ $t("generate_docs") }}</span>
-      </button>
-    </nuxt-link>
   </pw-section>
 </template>
 
 <style scoped lang="scss">
 .virtual-list {
-  max-height: calc(100vh - 290px);
+  max-height: calc(100vh - 245px);
 }
 
 ul {
@@ -113,6 +109,9 @@ export default {
     editRequest: () => import("./editRequest"),
     importExportCollections: () => import("./importExportCollections"),
   },
+  props: {
+    doc: Boolean,
+  },
   data() {
     return {
       showModalAdd: false,

diff --git a/components/collections/request.vue b/components/collections/request.vue
@@ -1,7 +1,11 @@
 <template>
   <div class="flex-wrap">
     <div>
-      <button class="icon" @click="selectRequest()" v-tooltip="$t('use_request')">
+      <button
+        class="icon"
+        @click="!doc ? selectRequest() : {}"
+        v-tooltip="!doc ? $t('use_request') : ''"
+      >
         <i class="material-icons">insert_drive_file</i>
         <span>{{ request.name }}</span>
       </button>
@@ -50,6 +54,7 @@ export default {
     collectionIndex: Number,
     folderIndex: Number,
     requestIndex: Number,
+    doc: Boolean,
   },
   methods: {
     syncCollections() {

diff --git a/components/layout/sidenav.vue b/components/layout/sidenav.vue
@@ -126,7 +126,7 @@
       <nav class="secondary-nav">
         <ul>
           <li>
-            <a href="#collections" v-tooltip.right="$t('collections')">
+            <a href="#import" v-tooltip.right="$t('import')">
               <i class="material-icons">folder</i>
             </a>
           </li>