Abbreviating counts in filters.

components/filters/actor.vue

@@ -36,14 +36,17 @@
 
 				<span
 					v-if="actor.count"
+					:title="actor.count"
 					class="filter-count"
-				>{{ actor.count }}</span>
+				>{{ abbreviateNumber(actor.count) }}</span>
 			</span>
 		</span>
 	</li>
 </template>
 
 <script setup>
+import abbreviateNumber from '#/src/utils/abbreviate-number.js';
+
 import Gender from '#/components/actors/gender.vue';
 
 defineProps({

components/filters/channels.vue

@@ -63,8 +63,9 @@
 						<span class="filter-details">
 							<span
 								v-if="entity.count"
+								:title="entity.count"
 								class="filter-count"
-							>{{ entity.count }}</span>
+							>{{ abbreviateNumber(entity.count) }}</span>
 
 							<Icon
 								v-if="filters.entity?.id === entity.id"
@@ -83,6 +84,8 @@
 <script setup>
 import { ref, computed, inject } from 'vue';
 
+import abbreviateNumber from '#/src/utils/abbreviate-number.js';
+
 const props = defineProps({
 	filters: {
 		type: Object,

components/filters/tags.vue

@@ -86,8 +86,9 @@
 						<span class="tag-details">
 							<span
 								v-if="tag.count"
+								:title="tag.count"
 								class="filter-count"
-							>{{ tag.count }}</span>
+							>{{ abbreviateNumber(tag.count) }}</span>
 						</span>
 					</span>
 				</li>
@@ -99,6 +100,8 @@
 <script setup>
 import { ref, computed, inject } from 'vue';
 
+import abbreviateNumber from '#/src/utils/abbreviate-number.js';
+
 const props = defineProps({
 	filters: {
 		type: Object,

components/stashes/tile.vue

@@ -126,6 +126,7 @@
 import { ref, inject } from 'vue';
 
 import { del, patch } from '#/src/api.js';
+import abbreviateNumber from '#/src/utils/abbreviate-number.js';
 
 import Dialog from '#/components/dialog/dialog.vue';
 
@@ -150,10 +151,6 @@ const stashNameInput = ref(null);
 const showRenameDialog = ref(false);
 const done = ref(true);
 
-function abbreviateNumber(number) {
-	return number?.toLocaleString('en-US', { notation: 'compact' }) || 0;
-}
-
 async function setPublic(isPublic) {
 	if (done.value === false) {
 		return;

src/utils/abbreviate-number.js

@@ -0,0 +1,3 @@
+export default function abbreviateNumber(number) {
+	return number?.toLocaleString('en-US', { notation: 'compact' }) || 0;
+}