Raise Harbor versions and move secondary menus to the right rail

src/web/components/ClientOverviewPage.jsx

@@ -1068,46 +1068,47 @@ export function ClientOverviewPage({
         blocked={gatewayAutoBlocked}
         onSetGatewayAuto={onSetGatewayAuto}
       />
-      {hasSubscription && subscriptionContentReady && <button
-        ref={instructionsToggleRef}
-        className={`client-instructions-toggle${instructionsOpen ? ' is-open' : ''}`}
-        type="button"
-        aria-expanded={instructionsOpen}
-        aria-controls="client-instructions"
-        aria-label={instructionsOpen ? 'Закрыть инструкции' : 'Как использовать'}
-        onClick={() => {
-          if (localRulesOpen && !requestCloseLocalRules()) return;
-          setInstructionsOpen((open) => !open);
-        }}
-      >
-        <svg viewBox="0 0 24 24" aria-hidden="true">
-          <path d="m3 5 7 7-7 7" />
-          <path d="m7 5 7 7-7 7" />
-          <path d="m11 5 7 7-7 7" />
-        </svg>
-        <span>Как использовать</span>
-      </button>}
-      {hasSubscription && subscriptionContentReady && <button
-        ref={localRulesToggleRef}
-        className={`client-local-rules-toggle${localRulesOpen ? ' is-open' : ''}${localRulesPendingRestart ? ' has-pending' : ''}`}
-        type="button"
-        disabled={gatewayDirect}
-        aria-expanded={localRulesOpen}
-        aria-controls="client-local-rules"
-        aria-label={gatewayDirect
-          ? 'Сейчас работают правила Harbor Gateway'
-          : localRulesOpen ? 'Закрыть локальные правила' : 'Настроить локальные правила'}
-        onClick={() => localRulesOpen ? requestCloseLocalRules() : openLocalRules()}
-      >
-        <svg viewBox="0 0 24 24" aria-hidden="true">
-          <path d="M4 7h9M17 7h3M4 17h3M11 17h9" />
-          <circle cx="15" cy="7" r="2" />
-          <circle cx="9" cy="17" r="2" />
-        </svg>
-        <span>{gatewayDirect
-          ? 'Сейчас работают правила Gateway'
-          : localRulesPendingRestart ? 'Правила ждут перезапуска' : 'Локальные правила'}</span>
-      </button>}
+      {hasSubscription && subscriptionContentReady && <nav className="client-secondary-menu" aria-label="Дополнительные меню">
+        <button
+          ref={instructionsToggleRef}
+          className={`client-instructions-toggle${instructionsOpen ? ' is-open' : ''}`}
+          type="button"
+          aria-expanded={instructionsOpen}
+          aria-controls="client-instructions"
+          aria-label={instructionsOpen ? 'Закрыть инструкции' : 'Как использовать'}
+          onClick={() => {
+            if (localRulesOpen && !requestCloseLocalRules()) return;
+            setInstructionsOpen((open) => !open);
+          }}
+        >
+          <svg viewBox="0 0 24 24" aria-hidden="true">
+            <circle cx="12" cy="12" r="8.5" />
+            <path d="M12 11v5M12 8h.01" />
+          </svg>
+          <span>Как использовать</span>
+        </button>
+        <button
+          ref={localRulesToggleRef}
+          className={`client-local-rules-toggle${localRulesOpen ? ' is-open' : ''}${localRulesPendingRestart ? ' has-pending' : ''}`}
+          type="button"
+          disabled={gatewayDirect}
+          aria-expanded={localRulesOpen}
+          aria-controls="client-local-rules"
+          aria-label={gatewayDirect
+            ? 'Сейчас работают правила Harbor Gateway'
+            : localRulesOpen ? 'Закрыть локальные правила' : 'Настроить локальные правила'}
+          onClick={() => localRulesOpen ? requestCloseLocalRules() : openLocalRules()}
+        >
+          <svg viewBox="0 0 24 24" aria-hidden="true">
+            <path d="M4 7h9M17 7h3M4 17h3M11 17h9" />
+            <circle cx="15" cy="7" r="2" />
+            <circle cx="9" cy="17" r="2" />
+          </svg>
+          <span>{gatewayDirect
+            ? 'Сейчас работают правила Gateway'
+            : localRulesPendingRestart ? 'Правила ждут перезапуска' : 'Локальные правила'}</span>
+        </button>
+      </nav>}
       <main className={`client-panel${showPower ? '' : ' is-setup'}${hasSubscription ? ' has-subscription' : ''}`}>
         {showPower && (
         <section className="client-power-section" aria-labelledby="connection-title">