queries: Support countable terms

Signed-off-by: Kai Blin <[email protected]>

src/components/QueryTerm.vue

@@ -32,6 +32,12 @@ const hasFilters = computed(() => {
 const showFilters = computed(() => {
     return (hasFilters.value && wantShowFilters.value) || (term.value?.filters ?? []).length > 0;
 });
+const isCountable = computed(() => {
+    if (!term.value || !term.value.category) {
+        return false;
+    }
+    return store.categories.isCountable(term.value.category);
+});
 
 function getTermKind() {
     if (!term.value) {
@@ -72,6 +78,9 @@ function updateFilter(idx: number, filter: QueryFilter) {
                     />
                 </optgroup>
             </select>
+            <span v-if="isCountable">
+                <input class="count" type="number" v-model="term.count" /> x
+            </span>
             <AutoComplete
                 v-if="
                     getTermKind() == 'text' &&
@@ -177,6 +186,9 @@ function updateFilter(idx: number, filter: QueryFilter) {
 </template>
 
 <style scoped>
+.count {
+    width: 4rem;
+}
 .expression {
     width: 40%;
 }

src/models/__tests__/queries.spec.ts

@@ -100,6 +100,10 @@ describe("QueryTerm", () => {
             term.left = undefined;
             expect(term.toString()).toBe("{[charlie|eve]}");
         });
+        it("stringifies counts > 1 correctly", () => {
+            const term = createExpr(2);
+            expect(term.toString()).toBe("2*{[alice|bob]}");
+        });
     });
 
     describe("addTerm", () => {

src/models/queries.ts

@@ -323,14 +323,21 @@ export class QueryTerm {
         if (!this.category) {
             return "";
         }
+
+        let ret = "";
+
+        if (this.count > 1) {
+            ret = `${this.count}*`;
+        }
+
         if (!this.value) {
-            return `{[${this.category}]}`;
+            return `${ret}{[${this.category}]}`;
         }
         if (this.filters.length < 1) {
-            return `{[${this.category}|${this.value}]}`;
+            return `${ret}{[${this.category}|${this.value}]}`;
         }
 
-        return `{[${this.category}|${this.value}]${this.filters.map((filter) =>
+        return `${ret}{[${this.category}|${this.value}]${this.filters.map((filter) =>
             filter.toString()
         )}}`;
     }