From 69dc0d20706ed41e5ecdbb77515066d8a7d7703b Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Fri, 19 Jun 2020 22:12:03 +0200
Subject: viewer: code update (no functional change)

Types { [x: T]: R } updated to Record<T, R>
Methods in template updated to getters (computed in VueJS), which are reactive and cached
Code formatting
---
 viewer/src/components/LdProposition.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'viewer/src/components/LdProposition.vue')

diff --git a/viewer/src/components/LdProposition.vue b/viewer/src/components/LdProposition.vue
index fe3af07..1490689 100644
--- a/viewer/src/components/LdProposition.vue
+++ b/viewer/src/components/LdProposition.vue
@@ -66,7 +66,7 @@ export default class LdProposition extends Vue {
   }
 
   get proposedTags() {
-    let propositions: { [index: string]: number } = {};
+    let propositions: Record<string, number> = {};
     if (this.model.length > 0) {
       // Tags count from current search
       this.extractDistinctItems(this.model)
-- 
cgit v1.2.3


From 170d7a61f720ece9dc4b347b19f5a8213f1d8984 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Sat, 20 Jun 2020 16:50:49 +0200
Subject: viewer: prettier formatting based on eslint-prettier plugin

---
 viewer/src/components/LdProposition.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

(limited to 'viewer/src/components/LdProposition.vue')

diff --git a/viewer/src/components/LdProposition.vue b/viewer/src/components/LdProposition.vue
index 1490689..97f47da 100644
--- a/viewer/src/components/LdProposition.vue
+++ b/viewer/src/components/LdProposition.vue
@@ -20,7 +20,7 @@
 
 <template>
   <div class="proposition">
-    <h2 v-if="showCategory && proposedTags.length" class="subtitle category">{{title}}</h2>
+    <h2 v-if="showCategory && proposedTags.length" class="subtitle category">{{ title }}</h2>
     <div v-for="proposed in proposedTags" :key="proposed.rawTag">
       <a
         class="operation-btns link"
@@ -42,9 +42,10 @@
         class="operation-tag link"
         :title="$t('tag-propositions.intersection')"
         @click="add(Operation.INTERSECTION, proposed.rawTag)"
-      >{{proposed.rawTag}}</a>
+        >{{ proposed.rawTag }}</a
+      >
 
-      <div class="disabled" :title="$t('tag-propositions.item-count')">{{proposed.count}}</div>
+      <div class="disabled" :title="$t('tag-propositions.item-count')">{{ proposed.count }}</div>
     </div>
   </div>
 </template>
-- 
cgit v1.2.3


From d72e317896bcc2a675d21cec6f286e0b2730d77c Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Thu, 10 Sep 2020 19:58:41 +0200
Subject: viewer: limit + show more tags

github: resolves #184
---
 viewer/src/components/LdProposition.vue | 40 +++++++++++++++++++++++++++++----
 1 file changed, 36 insertions(+), 4 deletions(-)

(limited to 'viewer/src/components/LdProposition.vue')

diff --git a/viewer/src/components/LdProposition.vue b/viewer/src/components/LdProposition.vue
index 97f47da..e19e01a 100644
--- a/viewer/src/components/LdProposition.vue
+++ b/viewer/src/components/LdProposition.vue
@@ -47,11 +47,14 @@
 
       <div class="disabled" :title="$t('tag-propositions.item-count')">{{ proposed.count }}</div>
     </div>
+    <div v-if="showMore > 0" class="showmore" @click="limit += showMore">
+      {{ $t("tag-propositions.showmore", [showMore]) }}<fa-icon icon="angle-double-down" />
+    </div>
   </div>
 </template>
 
 <script lang="ts">
-import { Component, Vue, Prop, PropSync } from "vue-property-decorator";
+import { Component, Vue, Prop, PropSync, Watch } from "vue-property-decorator";
 import { Operation } from "@/@types/Operation";
 
 @Component
@@ -62,12 +65,21 @@ export default class LdProposition extends Vue {
   @Prop({ required: true }) readonly tagsIndex!: Tag.Index;
   @PropSync("searchFilters", { type: Array, required: true }) model!: Tag.Search[];
 
+  readonly INITIAL_TAG_DISPLAY_LIMIT = this.$galleryStore.config?.initialTagDisplayLimit ?? 10;
+
+  limit: number = this.INITIAL_TAG_DISPLAY_LIMIT;
+
+  @Watch("$route")
+  onRouteChange() {
+    this.limit = this.INITIAL_TAG_DISPLAY_LIMIT;
+  }
+
   get Operation() {
     return Operation;
   }
 
-  get proposedTags() {
-    let propositions: Record<string, number> = {};
+  get propositions(): Record<string, number> {
+    const propositions: Record<string, number> = {};
     if (this.model.length > 0) {
       // Tags count from current search
       this.extractDistinctItems(this.model)
@@ -83,12 +95,20 @@ export default class LdProposition extends Vue {
         .filter(Boolean)
         .forEach(tagindex => (propositions[tagindex.tag] = tagindex.items.length));
     }
+    return propositions;
+  }
 
-    return Object.entries(propositions)
+  get proposedTags() {
+    return Object.entries(this.propositions)
       .sort((a, b) => b[1] - a[1])
+      .slice(0, this.limit)
       .map(entry => ({ rawTag: entry[0], count: entry[1] }));
   }
 
+  get showMore(): number {
+    return Object.keys(this.propositions).length - Object.keys(this.proposedTags).length;
+  }
+
   get title() {
     return this.category?.tag ?? this.$t("panelLeft.propositions.other");
   }
@@ -138,5 +158,17 @@ export default class LdProposition extends Vue {
       cursor: pointer;
     }
   }
+  .showmore {
+    display: block;
+    text-align: right;
+    color: $palette-300;
+    cursor: pointer;
+    > svg {
+      margin-left: 10px;
+    }
+    &:hover {
+      color: $link-hover;
+    }
+  }
 }
 </style>
-- 
cgit v1.2.3


From f89ed0bd94ea570d9e6533301783d13b13033db0 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Fri, 11 Sep 2020 20:10:56 +0200
Subject: viewer: PR #238 code review changes

---
 viewer/src/components/LdProposition.vue | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

(limited to 'viewer/src/components/LdProposition.vue')

diff --git a/viewer/src/components/LdProposition.vue b/viewer/src/components/LdProposition.vue
index e19e01a..34ddf51 100644
--- a/viewer/src/components/LdProposition.vue
+++ b/viewer/src/components/LdProposition.vue
@@ -47,8 +47,8 @@
 
       <div class="disabled" :title="$t('tag-propositions.item-count')">{{ proposed.count }}</div>
     </div>
-    <div v-if="showMore > 0" class="showmore" @click="limit += showMore">
-      {{ $t("tag-propositions.showmore", [showMore]) }}<fa-icon icon="angle-double-down" />
+    <div v-if="showMoreCount > 0" class="showmore" @click="limit += showMoreCount">
+      {{ $t("tag-propositions.showmore", [showMoreCount]) }}<fa-icon icon="angle-double-down" />
     </div>
   </div>
 </template>
@@ -65,10 +65,15 @@ export default class LdProposition extends Vue {
   @Prop({ required: true }) readonly tagsIndex!: Tag.Index;
   @PropSync("searchFilters", { type: Array, required: true }) model!: Tag.Search[];
 
-  readonly INITIAL_TAG_DISPLAY_LIMIT = this.$galleryStore.config?.initialTagDisplayLimit ?? 10;
+  readonly INITIAL_TAG_DISPLAY_LIMIT = this.getInitialTagDisplayLimit();
 
   limit: number = this.INITIAL_TAG_DISPLAY_LIMIT;
 
+  getInitialTagDisplayLimit() {
+    const limit = this.$galleryStore.config?.initialTagDisplayLimit ?? 10;
+    return limit > 0 ? limit : 1000;
+  }
+
   @Watch("$route")
   onRouteChange() {
     this.limit = this.INITIAL_TAG_DISPLAY_LIMIT;
@@ -105,7 +110,7 @@ export default class LdProposition extends Vue {
       .map(entry => ({ rawTag: entry[0], count: entry[1] }));
   }
 
-  get showMore(): number {
+  get showMoreCount(): number {
     return Object.keys(this.propositions).length - Object.keys(this.proposedTags).length;
   }
 
-- 
cgit v1.2.3


From 1e5a1a51d21d78a4a717e9434932be9da20d3115 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Fri, 11 Sep 2020 21:10:09 +0200
Subject: viewer: PR #238 code review changes (2nd)

---
 viewer/src/components/LdProposition.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'viewer/src/components/LdProposition.vue')

diff --git a/viewer/src/components/LdProposition.vue b/viewer/src/components/LdProposition.vue
index 34ddf51..abca8cd 100644
--- a/viewer/src/components/LdProposition.vue
+++ b/viewer/src/components/LdProposition.vue
@@ -71,7 +71,7 @@ export default class LdProposition extends Vue {
 
   getInitialTagDisplayLimit() {
     const limit = this.$galleryStore.config?.initialTagDisplayLimit ?? 10;
-    return limit > 0 ? limit : 1000;
+    return limit >= 0 ? limit : 1000;
   }
 
   @Watch("$route")
-- 
cgit v1.2.3


From 4cb4b6fb60aae4dcfb7fdb778c674ec315efde38 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Fri, 11 Sep 2020 21:37:07 +0200
Subject: viewer: PR #238 code review changes (3rd)

---
 viewer/src/components/LdProposition.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'viewer/src/components/LdProposition.vue')

diff --git a/viewer/src/components/LdProposition.vue b/viewer/src/components/LdProposition.vue
index abca8cd..aa44943 100644
--- a/viewer/src/components/LdProposition.vue
+++ b/viewer/src/components/LdProposition.vue
@@ -20,7 +20,7 @@
 
 <template>
   <div class="proposition">
-    <h2 v-if="showCategory && proposedTags.length" class="subtitle category">{{ title }}</h2>
+    <h2 v-if="showCategory && Object.keys(propositions).length" class="subtitle category">{{ title }}</h2>
     <div v-for="proposed in proposedTags" :key="proposed.rawTag">
       <a
         class="operation-btns link"
-- 
cgit v1.2.3

