diff --git a/src/shared/versions.js b/src/shared/versions.js index 807808e..fcc137d 100644 --- a/src/shared/versions.js +++ b/src/shared/versions.js @@ -1,6 +1,6 @@ export const HARBOR_VERSIONS = Object.freeze({ - macClient: '0.8.4', - gatewayClient: '0.8.4', + macClient: '0.8.5', + gatewayClient: '0.8.5', gatewayBackend: '0.8.0', }); diff --git a/src/web/components/ServerPicker.jsx b/src/web/components/ServerPicker.jsx index b96123f..df1e5b2 100644 --- a/src/web/components/ServerPicker.jsx +++ b/src/web/components/ServerPicker.jsx @@ -39,19 +39,21 @@ function readAuto() { function serverHealthText(ping) { if (ping?.error) return 'Проверка недоступна'; - if (ping?.ok) return `TCP ${ping.latency} мс`; - return ping ? 'TCP недоступен' : 'Не проверен'; + if (ping?.ok) return `${ping.latency} мс`; + return ping ? 'Недоступен' : null; } function ServerHealth({ ping, fallback }) { const health = fallback || serverHealthText(ping); + if (!health && !ping?.checking) return null; + return {health} - Проверяем TCP… + Проверяем… ; } @@ -59,11 +61,11 @@ function ServerCheckButton({ checking, disabled, onClick }) { return - TCP + Проверить пинг @@ -71,7 +73,7 @@ function ServerCheckButton({ checking, disabled, onClick }) { } function ServerRow({ server, selected, favorite, ping, disabled, index, onSelect, onFavorite }) { - const health = ping?.checking ? 'Проверяем TCP' : serverHealthText(ping); + const health = ping?.checking ? 'Проверяем пинг' : serverHealthText(ping); return onSelect(server.id)} > diff --git a/src/web/styles.css b/src/web/styles.css index 5de27c4..f34f126 100644 --- a/src/web/styles.css +++ b/src/web/styles.css @@ -2598,18 +2598,18 @@ p { display: grid; grid-template-columns: 1fr; gap: 8px; - width: min(100%, 150px); + width: min(100%, 220px); margin-inline: auto; } .client-server { min-width: 0; - min-height: 50px; + min-height: 44px; display: flex; - flex-direction: column; + align-items: baseline; justify-content: center; - gap: 3px; - padding: 7px 4px 8px; + gap: 9px; + padding: 6px 4px 7px; border: 0; border-bottom: 1px solid var(--client-border); border-radius: 0; @@ -2679,9 +2679,9 @@ p { } .client-server-health { - min-height: 14px; display: grid; place-items: center; + white-space: nowrap; } .client-server-health > span { @@ -2749,7 +2749,7 @@ p { .client-server-check { grid-column: 3; justify-self: start; - width: 88px; + width: 116px; min-height: 32px; padding: 5px 7px; border: 0; diff --git a/test/web/responsive-layout-contract.test.js b/test/web/responsive-layout-contract.test.js index ef01b2a..d450eb0 100644 --- a/test/web/responsive-layout-contract.test.js +++ b/test/web/responsive-layout-contract.test.js @@ -41,7 +41,7 @@ test('server rows scroll without moving the subscription column or showing a scr assert.match(styles, /\.client-server-scroll::-webkit-scrollbar\s*\{[\s\S]*display:\s*none/); assert.match(simpleScroll, /max-height:\s*none/); assert.match(simpleScroll, /overflow:\s*visible/); - assert.match(grid, /width:\s*min\(100%, 150px\)/); + assert.match(grid, /width:\s*min\(100%, 220px\)/); assert.doesNotMatch(rule('.client-servers.is-scalable .client-server-grid'), /width:/); }); diff --git a/test/web/server-picker.test.js b/test/web/server-picker.test.js index 5a994b9..30961f9 100644 --- a/test/web/server-picker.test.js +++ b/test/web/server-picker.test.js @@ -13,6 +13,7 @@ import { const root = path.resolve(import.meta.dirname, '../..'); const picker = fs.readFileSync(path.join(root, 'src/web/components/ServerPicker.jsx'), 'utf8'); const overview = fs.readFileSync(path.join(root, 'src/web/components/ClientOverviewPage.jsx'), 'utf8'); +const styles = fs.readFileSync(path.join(root, 'src/web/styles.css'), 'utf8'); const fixtures = (count) => Array.from({ length: count }, (_, index) => ({ id: `srv-${String(count - index).padStart(3, '0')}`, @@ -52,10 +53,14 @@ test('server picker checks health only on manual refresh and bounds the result w assert.match(picker, /aria-expanded={!isCollapsed}/); }); -test('manual health remains visible for Auto and simple rows', () => { +test('manual ping uses plain language and keeps results beside server names', () => { assert.match(picker, /function ServerHealth/); assert.match(picker, /client-server-health-checking/); assert.match(picker, /function ServerCheckButton/); + assert.match(picker, /Проверить пинг<\/span>/); + assert.doesNotMatch(picker, /TCP|Не проверен/); + assert.match(styles, /\.client-server \{[\s\S]*?align-items: baseline;[\s\S]*?justify-content: center;/); + assert.match(styles, /\.client-server-grid \{[\s\S]*?width: min\(100%, 220px\);/); assert.match(picker, /server={servers\[0\]}[\s\S]*?ping={pings\[servers\[0\]\.id\]}/); assert.match(picker, /simpleServers\.map[\s\S]*?ping={pings\[server\.id\]}/); });