Update VPN client and gateway behavior

src/web/features/devices/DevicesFeature.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useRef, useState } from 'react';
+import { RailAction } from '../../ui/RailAction.js';
 import {
   formatByteString,
   formatLastSeen,
@@ -191,13 +192,13 @@ export function useDevicesFeature({
 export type DevicesFeature = ReturnType<typeof useDevicesFeature>;
 
 export function DevicesToggle({ feature, onToggle }: { feature: DevicesFeature; onToggle: () => void }) {
-  return <button
-    ref={feature.toggleRef}
-    className={`client-instructions-toggle client-devices-toggle${feature.isOpen ? ' is-open' : ''}`}
-    type="button"
-    aria-expanded={feature.isOpen}
-    aria-controls="client-devices"
-    aria-label={feature.isOpen ? 'Закрыть устройства' : 'Устройства Gateway'}
+  return <RailAction
+    buttonRef={feature.toggleRef}
+    className="client-instructions-toggle client-devices-toggle"
+    open={feature.isOpen}
+    controls="client-devices"
+    ariaLabel={feature.isOpen ? 'Закрыть устройства' : 'Устройства Gateway'}
+    label="Устройства"
     onClick={onToggle}
   >
     <svg viewBox="0 0 24 24" aria-hidden="true">
@@ -205,8 +206,7 @@ export function DevicesToggle({ feature, onToggle }: { feature: DevicesFeature;
       <rect className="client-rail-device-secondary" x="13.5" y="8" width="7" height="7" rx="1.5" />
       <path className="client-rail-device-link" d="M6 19h12M7 15v4M17 15v4" />
     </svg>
-    <span>Устройства</span>
-  </button>;
+  </RailAction>;
 }
 
 export function GatewayTrafficSummary({ feature, now }: { feature: DevicesFeature; now: number }) {