diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue index 23fbc23..a117237 100644 --- a/src/components/Sidebar.vue +++ b/src/components/Sidebar.vue @@ -74,7 +74,7 @@ export default defineComponent({ following = computed(() => store.state.followTarget), messageWorlds = computed(() => store.state.messages.worldsHeading), - messagePlayers = computed(() => store.state.messages.playersHeading), + messagePlayers = computed(() => store.getters.playersHeading), playerMakersEnabled = computed(() => !!store.state.components.playerMarkers), diff --git a/src/components/sidebar/PlayerList.vue b/src/components/sidebar/PlayerList.vue index 6aea61d..1fc36be 100644 --- a/src/components/sidebar/PlayerList.vue +++ b/src/components/sidebar/PlayerList.vue @@ -49,11 +49,7 @@ export default defineComponent({ setup() { const store = useStore(), - messageHeading = computed(() => { - return store.state.messages.playersHeading - .replace('{cur}', players.value.length.toString()) - .replace('{max}', maxPlayers.value.toString()); - }), + messageHeading = computed(() => store.getters.playersHeading), messageSkeletonPlayers = computed(() => store.state.messages.playersSkeleton), messageSkeletonPlayersSearch = computed(() => store.state.messages.playersSearchSkeleton), messagePlayersSearchPlaceholder = computed(() => store.state.messages.playersSearchPlaceholder), diff --git a/src/store/getters.ts b/src/store/getters.ts index feb0b75..189efba 100644 --- a/src/store/getters.ts +++ b/src/store/getters.ts @@ -25,6 +25,7 @@ export type Getters = { night(state: State): boolean; mapBackground(state: State, getters: GetterTree & Getters): string; url(state: State, getters: GetterTree & Getters): string; + playersHeading(state: State, getters: GetterTree & Getters): string; } export const getters: GetterTree & Getters = { @@ -72,4 +73,10 @@ export const getters: GetterTree & Getters = { return getUrlForLocation(state.currentMap, {x,y,z}, zoom); }, + + playersHeading(state: State): string { + return state.messages.playersHeading + .replace('{cur}', state.players.size.toString()) + .replace('{max}', state.maxPlayers.toString()); + } }