Simplify device status display and bump client versions

src/web/components/DevicesPanel.jsx

@@ -6,11 +6,6 @@ import {
   sortDevicesByTraffic,
 } from '../utils/format.js';
 
-const STATUS_LABELS = {
-  online: 'В сети',
-  recent: 'Недавно',
-  offline: 'Не в сети',
-};
 const AUTO_REFRESH_MS = 15_000;
 const DEVICE_MOVE_MS = 520;
 
@@ -250,7 +245,7 @@ export function DevicesPanel({ open, panelRef, closeRef, onClose }) {
             const editing = editingId === device.id;
             const saving = savingId === device.id;
             const seen = formatLastSeen(device.lastSeenAt);
-            const uncertainIdentity = device.confidence !== 'high';
+            const online = device.status === 'online';
             const download = formatByteString(device.downloadBytes);
             const upload = formatByteString(device.uploadBytes);
             const policyBusy = device.policyStatus === 'applying';
@@ -285,7 +280,6 @@ export function DevicesPanel({ open, panelRef, closeRef, onClose }) {
               key={device.id}
             >
               <div className="client-device-heading">
-                <span className="client-device-status">{STATUS_LABELS[device.status]}</span>
                 {editing ? (
                   <form className="client-device-alias" onSubmit={(event) => saveAlias(event, device)}>
                     <input
@@ -350,14 +344,6 @@ export function DevicesPanel({ open, panelRef, closeRef, onClose }) {
                 <div className="client-device-addresses">
                   {title !== device.ip && device.ip && <span>{device.ip}</span>}
                   {device.manufacturer && <span className="client-device-manufacturer">{device.manufacturer}</span>}
-                  {uncertainIdentity && <span className="client-device-identity client-tooltip-anchor" tabIndex="0" aria-label="Пояснение идентификации устройства">
-                      ⓘ
-                      <Tooltip>{device.confidence === 'medium'
-                        ? 'Устройство использует приватный MAC, производитель может не определиться'
-                        : device.confidence === 'ambiguous'
-                          ? 'Gateway видит это устройство с несколькими IP или интерфейсами, поэтому индивидуальное правило небезопасно'
-                          : 'Устройство определено приблизительно'}</Tooltip>
-                    </span>}
                 </div>
                 <span className="client-device-policy-wrap client-tooltip-anchor">
                   <button
@@ -373,9 +359,12 @@ export function DevicesPanel({ open, panelRef, closeRef, onClose }) {
                   </button>
                   <Tooltip>{policyTooltip}</Tooltip>
                 </span>
-                <span className="client-device-last-seen" tabIndex="0">
-                  <time dateTime={device.lastSeenAt} aria-label={seen.tooltip}>
-                    <TextMorph from={seen.label} to={seen.relative} />
+                <span className={`client-device-last-seen${online ? ' is-online' : ''}`} tabIndex="0">
+                  <time
+                    dateTime={device.lastSeenAt}
+                    aria-label={`${online ? 'В сети' : 'Не в сети'}. Последний контакт: ${seen.tooltip}`}
+                  >
+                    {online ? 'В сети' : <TextMorph from={seen.label} to={seen.relative} />}
                   </time>
                 </span>
               </div>