diff --git a/src/components/NFTPage/CollectorMessageList/Identity.vue b/src/components/NFTPage/CollectorMessageList/Identity.vue
index 1d789922f..18cca1434 100644
--- a/src/components/NFTPage/CollectorMessageList/Identity.vue
+++ b/src/components/NFTPage/CollectorMessageList/Identity.vue
@@ -31,7 +31,7 @@
/>
- {{ userDisplayNameFull | ellipsisCollectorAddress }}
+ {{ formattedUserDisplayNameFull }}
@@ -41,15 +41,12 @@
import { mapActions } from 'vuex';
import { createUserInfoMixin } from '~/mixins/user-info';
-import { ellipsisCollectorAddress } from '~/util/ui';
+import { ellipsis } from '~/util/ui';
const userInfoMixin = createUserInfoMixin({ walletKey: 'walletAddress' });
export default {
name: 'NFTPageCollectorMessageListIdentity',
- filters: {
- ellipsisCollectorAddress,
- },
mixins: [userInfoMixin],
props: {
walletAddress: {
@@ -85,6 +82,9 @@ export default {
query: { tab: this.isCreatedTab ? 'created' : 'collected' },
});
},
+ formattedUserDisplayNameFull() {
+ return ellipsis(this.userDisplayNameFull, 13, 0);
+ },
},
watch: {
walletAddress() {
diff --git a/src/util/ui.js b/src/util/ui.js
index cb0e5a8aa..eb07f4e21 100644
--- a/src/util/ui.js
+++ b/src/util/ui.js
@@ -9,29 +9,15 @@ const largeNumFormatter = new Intl.NumberFormat('en-US', {
maximumFractionDigits: 2,
});
-export function ellipsis(value) {
- if (value) {
- const len = value.length;
- const dots = '...';
- if (!value) return '';
- if (value.length > 20) {
- return value.substring(0, 8) + dots + value.substring(len - 6, len);
- }
- return value;
- }
- return value;
-}
+export function ellipsis(value, maxLength = 20, endLength = 6) {
+ if (!value) return '';
+ const len = value.length;
+ const dots = '...';
-export function ellipsisCollectorAddress(value) {
- if (value) {
- const len = value.length;
- const dots = '...';
- if (!value) return '';
- if (value.length > 10) {
- return value.substring(0, 8) + dots;
- }
- return value;
+ if (len > maxLength) {
+ return value.substring(0, 8) + dots + value.substring(len - endLength, len);
}
+
return value;
}