[Feat: GraphQL sidebar] GraphQL History (#1528)

* Create REQUIREMENTS.md

* graphql history UI

* rest history emit

* removed requirements file

* add, delete, clear, star history and sync with firstore

* use history

* empty schema

* remove other tabs

* computed query, setting headers

* binding props

Co-authored-by: Liyas Thomas <liyascthomas@gmail.com>

* remove print

Co-authored-by: Liyas Thomas <liyascthomas@gmail.com>

* remove dummy data

Co-authored-by: Liyas Thomas <liyascthomas@gmail.com>

* add docs tab

* date, time attribute --> updatedOn

* Removed margin from sidebar Tab

* removed v-bind

Co-authored-by: Liyas Thomas <liyascthomas@gmail.com>

* use shortcut for v-bind

* use shortcut for v-bind

* use unfold icons

* use template literals in :key

* history clear bug

* delete history bug

* minor translation

* remove console logs

* remove unused css

* add stared style

* remove absolute styles

* tests for graphql card

* tests for rest card

* tests for clear history added

* mount, clear, use, delete history tests added

* Rename card.vue to Card.vue

* Rename card.vue to Card.vue

* use computed

Co-authored-by: Isha Gupta <40794215+IshaGupta18@users.noreply.github.com>
Co-authored-by: Liyas Thomas <liyascthomas@gmail.com>

helpers/fb.js

@@ -30,6 +30,7 @@ export class FirebaseInstance {
     this.currentFeeds = []
     this.currentSettings = []
     this.currentHistory = []
+    this.currentGraphqlHistory = []
     this.currentCollections = []
     this.currentEnvironments = []
 
@@ -97,6 +98,19 @@ export class FirebaseInstance {
             this.currentHistory = history
           })
 
+        this.usersCollection
+          .doc(this.currentUser.uid)
+          .collection("graphqlHistory")
+          .onSnapshot((historyRef) => {
+            const history = []
+            historyRef.forEach((doc) => {
+              const entry = doc.data()
+              entry.id = doc.id
+              history.push(entry)
+            })
+            this.currentGraphqlHistory = history
+          })
+
         this.usersCollection
           .doc(this.currentUser.uid)
           .collection("collections")
@@ -215,6 +229,17 @@ export class FirebaseInstance {
     }
   }
 
+  async writeGraphqlHistory(entry) {
+    const hs = entry
+
+    try {
+      await this.usersCollection.doc(this.currentUser.uid).collection("graphqlHistory").add(hs)
+    } catch (e) {
+      console.error("error inserting", hs, e)
+      throw e
+    }
+  }
+
   async deleteHistory(entry) {
     try {
       await this.usersCollection
@@ -228,6 +253,19 @@ export class FirebaseInstance {
     }
   }
 
+  async deleteGraphqlHistory(entry) {
+    try {
+      await this.usersCollection
+        .doc(this.currentUser.uid)
+        .collection("graphqlHistory")
+        .doc(entry.id)
+        .delete()
+    } catch (e) {
+      console.error("error deleting", entry, e)
+      throw e
+    }
+  }
+
   async clearHistory() {
     const { docs } = await this.usersCollection
       .doc(this.currentUser.uid)
@@ -237,6 +275,15 @@ export class FirebaseInstance {
     await Promise.all(docs.map((e) => this.deleteHistory(e)))
   }
 
+  async clearGraphqlHistory() {
+    const { docs } = await this.usersCollection
+      .doc(this.currentUser.uid)
+      .collection("graphqlHistory")
+      .get()
+
+    await Promise.all(docs.map((e) => this.deleteGraphqlHistory(e)))
+  }
+
   async toggleStar(entry, value) {
     try {
       await this.usersCollection
@@ -251,6 +298,20 @@ export class FirebaseInstance {
     }
   }
 
+  async toggleGraphqlHistoryStar(entry, value) {
+    try {
+      await this.usersCollection
+        .doc(this.currentUser.uid)
+        .collection("graphqlHistory")
+        .doc(entry.id)
+        .update({ star: value })
+    } catch (e) {
+      console.error("error deleting", entry, e)
+
+      throw e
+    }
+  }
+
   async writeCollections(collection) {
     const cl = {
       updatedOn: new Date(),