refactor: gql docs

components/collections/graphql/Request.vue

@@ -41,6 +41,13 @@
       >
         <span class="truncate"> {{ request.name }} </span>
       </span>
+      <ButtonSecondary
+        v-tippy="{ theme: 'tooltip' }"
+        icon="replay"
+        :title="$t('restore')"
+        class="group-hover:inline-flex hidden"
+        @click.native="!doc ? selectRequest() : {}"
+      />
       <tippy
         ref="options"
         interactive

components/collections/graphql/index.vue

@@ -16,41 +16,6 @@
           focus:outline-none
         "
       />
-      <CollectionsGraphqlAdd
-        :show="showModalAdd"
-        @hide-modal="displayModalAdd(false)"
-      />
-      <CollectionsGraphqlEdit
-        :show="showModalEdit"
-        :editing-collection="editingCollection"
-        :editing-collection-index="editingCollectionIndex"
-        @hide-modal="displayModalEdit(false)"
-      />
-      <CollectionsGraphqlAddFolder
-        :show="showModalAddFolder"
-        :folder-path="editingFolderPath"
-        @add-folder="onAddFolder($event)"
-        @hide-modal="displayModalAddFolder(false)"
-      />
-      <CollectionsGraphqlEditFolder
-        :show="showModalEditFolder"
-        :collection-index="editingCollectionIndex"
-        :folder="editingFolder"
-        :folder-index="editingFolderIndex"
-        :folder-path="editingFolderPath"
-        @hide-modal="displayModalEditFolder(false)"
-      />
-      <CollectionsGraphqlEditRequest
-        :show="showModalEditRequest"
-        :folder-path="editingFolderPath"
-        :request="editingRequest"
-        :request-index="editingRequestIndex"
-        @hide-modal="displayModalEditRequest(false)"
-      />
-      <CollectionsGraphqlImportExport
-        :show="showModalImportExport"
-        @hide-modal="displayModalImportExport(false)"
-      />
       <div class="border-b flex justify-between flex-1 border-dividerLight">
         <ButtonSecondary
           icon="add"
@@ -66,15 +31,6 @@
         />
       </div>
     </div>
-    <div
-      v-if="collections.length === 0"
-      class="flex items-center text-secondaryLight flex-col p-4 justify-center"
-    >
-      <i class="material-icons opacity-50 pb-2">create_new_folder</i>
-      <span class="text-xs">
-        {{ $t("create_new_collection") }}
-      </span>
-    </div>
     <div class="flex-col">
       <CollectionsGraphqlCollection
         v-for="(collection, index) in filteredCollections"
@@ -94,6 +50,15 @@
         @select="$emit('select', $event)"
       />
     </div>
+    <div
+      v-if="collections.length === 0"
+      class="flex items-center text-secondaryLight flex-col p-4 justify-center"
+    >
+      <i class="material-icons opacity-50 pb-2">create_new_folder</i>
+      <span class="text-xs">
+        {{ $t("create_new_collection") }}
+      </span>
+    </div>
     <div
       v-if="!(filteredCollections.length !== 0 || collections.length === 0)"
       class="flex items-center text-secondaryLight flex-col p-4 justify-center"
@@ -103,6 +68,41 @@
         {{ $t("nothing_found") }} "{{ filterText }}"
       </span>
     </div>
+    <CollectionsGraphqlAdd
+      :show="showModalAdd"
+      @hide-modal="displayModalAdd(false)"
+    />
+    <CollectionsGraphqlEdit
+      :show="showModalEdit"
+      :editing-collection="editingCollection"
+      :editing-collection-index="editingCollectionIndex"
+      @hide-modal="displayModalEdit(false)"
+    />
+    <CollectionsGraphqlAddFolder
+      :show="showModalAddFolder"
+      :folder-path="editingFolderPath"
+      @add-folder="onAddFolder($event)"
+      @hide-modal="displayModalAddFolder(false)"
+    />
+    <CollectionsGraphqlEditFolder
+      :show="showModalEditFolder"
+      :collection-index="editingCollectionIndex"
+      :folder="editingFolder"
+      :folder-index="editingFolderIndex"
+      :folder-path="editingFolderPath"
+      @hide-modal="displayModalEditFolder(false)"
+    />
+    <CollectionsGraphqlEditRequest
+      :show="showModalEditRequest"
+      :folder-path="editingFolderPath"
+      :request="editingRequest"
+      :request-index="editingRequestIndex"
+      @hide-modal="displayModalEditRequest(false)"
+    />
+    <CollectionsGraphqlImportExport
+      :show="showModalImportExport"
+      @hide-modal="displayModalImportExport(false)"
+    />
   </AppSection>
 </template>
 

components/collections/index.vue

@@ -35,7 +35,6 @@
           icon="add"
           :title="$t('disable_new_collection')"
           :label="$t('new')"
-          @click.native="displayModalAdd(true)"
         />
         <ButtonSecondary
           v-else
@@ -56,6 +55,55 @@
         />
       </div>
     </div>
+    <div class="flex flex-col">
+      <component
+        :is="
+          collectionsType.type == 'my-collections'
+            ? 'CollectionsMyCollection'
+            : 'CollectionsTeamsCollection'
+        "
+        v-for="(collection, index) in filteredCollections"
+        :key="collection.name"
+        :name="collection.name"
+        :collection-index="index"
+        :collection="collection"
+        :doc="doc"
+        :is-filtered="filterText.length > 0"
+        :selected="selected.some((coll) => coll == collection)"
+        :save-request="saveRequest"
+        :collections-type="collectionsType"
+        :picked="picked"
+        @edit-collection="editCollection(collection, index)"
+        @add-folder="addFolder($event)"
+        @edit-folder="editFolder($event)"
+        @edit-request="editRequest($event)"
+        @update-team-collections="updateTeamCollections"
+        @select-collection="$emit('use-collection', collection)"
+        @unselect-collection="$emit('remove-collection', collection)"
+        @select="$emit('select', $event)"
+        @expand-collection="expandCollection"
+        @remove-collection="removeCollection"
+        @remove-request="removeRequest"
+      />
+    </div>
+    <div
+      v-if="collections.length === 0"
+      class="flex items-center text-secondaryLight flex-col p-4 justify-center"
+    >
+      <i class="material-icons opacity-50 pb-2">create_new_folder</i>
+      <span class="text-xs">
+        {{ $t("create_new_collection") }}
+      </span>
+    </div>
+    <div
+      v-if="!(filteredCollections.length !== 0 || collections.length === 0)"
+      class="flex items-center text-secondaryLight flex-col p-4 justify-center"
+    >
+      <i class="material-icons opacity-50 pb-2">manage_search</i>
+      <span class="text-xs">
+        {{ $t("nothing_found") }} "{{ filterText }}"
+      </span>
+    </div>
     <CollectionsAdd
       :show="showModalAdd"
       @submit="addNewRootCollection"
@@ -92,55 +140,6 @@
       @hide-modal="displayModalImportExport(false)"
       @update-team-collections="updateTeamCollections"
     />
-    <div
-      v-if="collections.length === 0"
-      class="flex items-center text-secondaryLight flex-col p-4 justify-center"
-    >
-      <i class="material-icons opacity-50 pb-2">create_new_folder</i>
-      <span class="text-xs">
-        {{ $t("create_new_collection") }}
-      </span>
-    </div>
-    <div class="flex flex-col">
-      <component
-        :is="
-          collectionsType.type == 'my-collections'
-            ? 'CollectionsMyCollection'
-            : 'CollectionsTeamsCollection'
-        "
-        v-for="(collection, index) in filteredCollections"
-        :key="collection.name"
-        :name="collection.name"
-        :collection-index="index"
-        :collection="collection"
-        :doc="doc"
-        :is-filtered="filterText.length > 0"
-        :selected="selected.some((coll) => coll == collection)"
-        :save-request="saveRequest"
-        :collections-type="collectionsType"
-        :picked="picked"
-        @edit-collection="editCollection(collection, index)"
-        @add-folder="addFolder($event)"
-        @edit-folder="editFolder($event)"
-        @edit-request="editRequest($event)"
-        @update-team-collections="updateTeamCollections"
-        @select-collection="$emit('use-collection', collection)"
-        @unselect-collection="$emit('remove-collection', collection)"
-        @select="$emit('select', $event)"
-        @expand-collection="expandCollection"
-        @remove-collection="removeCollection"
-        @remove-request="removeRequest"
-      />
-    </div>
-    <div
-      v-if="!(filteredCollections.length !== 0 || collections.length === 0)"
-      class="flex items-center text-secondaryLight flex-col p-4 justify-center"
-    >
-      <i class="material-icons opacity-50 pb-2">manage_search</i>
-      <span class="text-xs">
-        {{ $t("nothing_found") }} "{{ filterText }}"
-      </span>
-    </div>
   </AppSection>
 </template>
 

components/collections/my/Request.vue

@@ -49,6 +49,13 @@
       >
         <span class="truncate"> {{ request.name }} </span>
       </span>
+      <ButtonSecondary
+        v-tippy="{ theme: 'tooltip' }"
+        icon="replay"
+        :title="$t('restore')"
+        class="group-hover:inline-flex hidden"
+        @click.native="!doc ? selectRequest() : {}"
+      />
       <tippy
         ref="options"
         interactive

components/collections/teams/Request.vue

@@ -42,6 +42,13 @@
       >
         <span class="truncate"> {{ request.name }} </span>
       </span>
+      <ButtonSecondary
+        v-tippy="{ theme: 'tooltip' }"
+        icon="replay"
+        :title="$t('restore')"
+        class="group-hover:inline-flex hidden"
+        @click.native="!doc ? selectRequest() : {}"
+      />
       <tippy
         v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
         ref="options"