Integrate codeSnippet component with new filter array, lower case the…

… menu button
PavlidisLab · Aug 3, 2023 · 8fca824 · 8fca824
1 parent c8be664
commit 8fca824
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 9 deletions.
diff --git a/src/components/CodeSnippet.vue b/src/components/CodeSnippet.vue
@@ -20,7 +20,7 @@
 
 <script>
 
-import { compressArg } from "@/utils";
+import { compressFilter } from "@/utils";
 
 export default {
   name: "CodeSnippet",
@@ -47,7 +47,7 @@ export default {
       // Modify the content based on the searchSettings prop
       let query = this.browsingOptions.query;
       let filter = this.browsingOptions.filter;
-      let sort = this.browsingOptions.sort;
+      let sort = this.browsingOptions.sort
 
       // Gemmapy snippet
       let queryGemmapy = [];
@@ -71,7 +71,7 @@ export default {
       // Gemma.R snippet
       let queryGemmaR = [];
       if (query !== undefined){ queryGemmaR.push(`query = '` + query + `', `) }; 
-      if (filter !== undefined && filter.length > 0){ queryGemmaR.push(`filter = '` + filter + `', `) };
+      if (filter !== undefined && filter.length > 0){ queryGemmaR.push(`filter = '` + filter.map(subClauses => subClauses.join(" or ")).join(" and ") + `', `) };
       if (queryGemmaR.length > 0) {
         if (sort !== undefined){ queryGemmaR.push(`sort = '` + sort + `', `) };
         queryGemmaR.unshift(`library(gemma.R)\n` +
@@ -83,7 +83,6 @@ export default {
       tabs[1].content = queryGemmaR.join("").replace(/\,\s*\)/, ')');
 
       // curl snippet
-      // USE URLSearchParams to encode here
       const params = new URLSearchParams();
       if (query !== undefined) {
         params.append('query', query);
@@ -107,10 +106,15 @@ export default {
       return tabs;
     }
   },
+  created() {
+    compressFilter(this.browsingOptions.filter).then((result) => {
+      this.compressedFilter = result;
+      });
+  },
   watch: {
-    'browsingOptions': function(newVal) {
-      compressArg(newVal.filter).then((result) => {
-        this.compressedFilter = result;
+  'browsingOptions': function(newVal) {
+    compressFilter(newVal.filter).then((result) => {
+      this.compressedFilter = result;
       });
     },
     selectedTab() {

diff --git a/src/views/Browser.vue b/src/views/Browser.vue
@@ -62,9 +62,10 @@
                 </template>
                 <template v-slot:footer.prepend>
                   <v-spacer/>
-                    <v-menu v-if="browsingOptions.filter !== '' || searchSettings.query !== ''" ref="codeSnippetMenu">
+                    <v-menu v-if="browsingOptions.filter.length > 0 || searchSettings.query !== ''" ref="codeSnippetMenu">
                       <template v-slot:activator = "{ on, attrs }">
-                        <v-btn plain v-on="on" v-bind="attrs">Dataset Download Code
+                        <v-btn plain v-on="on" v-bind="attrs">
+                          <span style="text-transform: none;">Dataset Download Code</span>
                           <v-icon>mdi-chevron-up</v-icon>
                         </v-btn>
                       </template>