Add stop confirmation to client power action

src/web/components/ClientOverviewPage.jsx

@@ -644,6 +644,7 @@ export function ClientOverviewPage({
   const [localRulesRevision, setLocalRulesRevision] = useState(state?.route?.localRulesRevision || 0);
   const [confirmingLocalRulesClose, setConfirmingLocalRulesClose] = useState(false);
   const [confirmingDelete, setConfirmingDelete] = useState(false);
+  const [confirmingStop, setConfirmingStop] = useState(false);
   const [openInstructionId, setOpenInstructionId] = useState('');
   const subscriptionInputRef = useRef(null);
   const subscriptionRef = useRef(null);
@@ -899,13 +900,21 @@ export function ClientOverviewPage({
     return () => document.removeEventListener('pointerdown', closeInstructionsOutside);
   }, [instructionsOpen]);
 
-  async function toggleConnection() {
+  function toggleConnection() {
     const action = connectionAction({ connected, selectedServerId, configExists: state?.configExists });
-    if (action?.type === 'stop') return onStop();
+    if (action?.type === 'stop') {
+      setConfirmingStop(true);
+      return;
+    }
     if (action?.type === 'apply') return onApply(action.serverId);
     if (action?.type === 'restart') return onRestart();
   }
 
+  async function stopConnection() {
+    if (!await onStop()) return;
+    setConfirmingStop(false);
+  }
+
   function selectServer(serverId) {
     setPendingServerId(serverId);
     if (connected && serverId) onApply(serverId);
@@ -1443,6 +1452,18 @@ export function ClientOverviewPage({
         onClose={requestCloseLocalRules}
         onSave={saveLocalRules}
       />}
+      <ConfirmationPopup
+        open={confirmingStop}
+        id="stop-connection"
+        kicker="Защита от случайного отключения"
+        title="Отключить VPN?"
+        description="Harbor остановит текущее VPN-подключение. Локальный прокси перестанет передавать трафик до повторного включения."
+        cancelLabel="Оставить включённым"
+        confirmLabel="Отключить VPN"
+        busy={connectionBlocked}
+        onCancel={() => setConfirmingStop(false)}
+        onConfirm={stopConnection}
+      />
       <ConfirmationPopup
         open={confirmingLocalRulesClose}
         id="discard-local-rules"