Fix server ping race condition before protocol version is available (#6935)

* fix race condition with server ping lookup before protocol resolved

* fix refresh button on worlds page

apps/app-frontend/src/pages/instance/Worlds.vue

@@ -75,7 +75,11 @@
 				<ButtonStyled type="transparent" hover-color-fill="none">
 					<button :disabled="refreshingAll" @click="refreshAllWorlds">
 						<RefreshCwIcon :class="refreshingAll ? 'animate-spin' : ''" />
-						{{ formatMessage(commonMessages.refreshButton) }}
+						{{
+							formatMessage(
+								refreshingAll ? messages.refreshingButton : commonMessages.refreshButton,
+							)
+						}}
 					</button>
 				</ButtonStyled>
 			</div>
@@ -242,6 +246,10 @@ const messages = defineMessages({
 		id: 'app.instance.worlds.filter-offline',
 		defaultMessage: 'Offline',
 	},
+	refreshingButton: {
+		id: 'app.instance.worlds.refreshing',
+		defaultMessage: 'Refreshing...',
+	},
 })
 
 const { formatMessage } = useVIntl()
@@ -328,7 +336,7 @@ const isLinux = platform() === 'linux'
 const linuxRefreshCount = ref(0)
 
 const protocolVersion = ref<ProtocolVersion | null>(null)
-
+const protocolVersionReady = ref(false)
 const gameVersions = ref<GameVersion[]>([])
 const supportsServerQuickPlay = computed(() =>
 	hasServerQuickPlaySupport(gameVersions.value, instance.value.game_version),
@@ -342,8 +350,16 @@ watch(
 	(data) => {
 		if (data) {
 			worlds.value = [...data]
-			refreshServers(worlds.value, serverData.value, protocolVersion.value)
 			hadNoWorlds.value = worlds.value.length === 0
+			// Manual refresh handles its own server pings to avoid double-pinging
+			if (!refreshingAll.value) {
+				void refreshServers(
+					worlds.value,
+					serverData.value,
+					protocolVersion.value,
+					protocolVersionReady.value,
+				)
+			}
 		}
 	},
 	{ immediate: true },
@@ -443,9 +459,14 @@ async function initWorldsTab() {
 	unlistenInstance = _unlistenInstance
 	protocolVersion.value = resolvedProtocolVersion
 	gameVersions.value = resolvedGameVersions
+	protocolVersionReady.value = true
+
+	if (worlds.value.length > 0) {
+		refreshServers(worlds.value, serverData.value, protocolVersion.value)
+	}
 }
 
-await initWorldsTab()
+void initWorldsTab()
 
 async function refreshServer(address: string) {
 	if (!serverData.value[address]) {
@@ -453,6 +474,7 @@ async function refreshServer(address: string) {
 			refreshing: true,
 		}
 	}
+	if (!protocolVersionReady.value) return
 	await refreshServerData(serverData.value[address], protocolVersion.value, address)
 }
 
@@ -463,8 +485,28 @@ async function refreshAllWorlds() {
 	}
 
 	refreshingAll.value = true
-	await queryClient.invalidateQueries({ queryKey: ['worlds', instance.value.id] })
-	refreshingAll.value = false
+	try {
+		// Show loading on server rows immediately while the list refreshes
+		for (const world of worlds.value) {
+			if (world.type === 'server') {
+				if (!serverData.value[world.address]) {
+					serverData.value[world.address] = { refreshing: true }
+				} else {
+					serverData.value[world.address].refreshing = true
+				}
+			}
+		}
+
+		await queryClient.invalidateQueries({ queryKey: ['worlds', instance.value.id] })
+		await refreshServers(
+			worlds.value,
+			serverData.value,
+			protocolVersion.value,
+			protocolVersionReady.value,
+		)
+	} finally {
+		refreshingAll.value = false
+	}
 }
 
 async function addServer(server: ServerWorld) {