Remove legacy vpn proxy code and simplify the client

src/web/components/ClientOverviewPage.jsx

@@ -13,6 +13,7 @@ import { formatBytes } from '../utils/format.js';
 export function ClientOverviewPage({
   state,
   busy,
+  error,
   subscriptionUrl,
   setSubscriptionUrl,
   servers,
@@ -25,6 +26,7 @@ export function ClientOverviewPage({
   onRestart,
   onStop,
 }) {
+  const isGateway = state?.mode === 'gateway';
   const connected = Boolean(state?.singboxRunning);
   const hasSubscription = Boolean(state?.hasSubscription);
   const selectedTag = pendingTag || state?.selectedTag || '';
@@ -41,7 +43,8 @@ export function ClientOverviewPage({
   const subscriptionInputRef = useRef(null);
   const subscriptionRef = useRef(null);
   const serverKey = servers.map((server) => `${server.tag}:${server.server}:${server.server_port}`).join('|');
-  const proxyUrls = localProxyUrls(state?.proxyPort);
+  const gatewayAddress = isGateway ? window.location.hostname : '127.0.0.1';
+  const proxyUrls = localProxyUrls(state?.proxyPort, gatewayAddress);
   const usage = subscriptionUsage(state?.userInfo);
   const [displayedUsed, setDisplayedUsed] = useState(usage.used);
   const hasUsage = Boolean(
@@ -152,7 +155,7 @@ export function ClientOverviewPage({
 
   async function copyProxy(kind) {
     try {
-      await navigator.clipboard.writeText(proxyUrls[kind]);
+      await navigator.clipboard.writeText(kind === 'gateway' ? gatewayAddress : proxyUrls[kind]);
       setCopiedProxy(kind);
       setTimeout(() => setCopiedProxy(''), 800);
     } catch {
@@ -191,7 +194,7 @@ export function ClientOverviewPage({
             type="button"
             role="switch"
             aria-checked={connected}
-            aria-label={connected ? 'Выключить VPN' : 'Включить VPN'}
+            aria-label={connected ? `Выключить ${isGateway ? 'Gateway' : 'VPN'}` : `Включить ${isGateway ? 'Gateway' : 'VPN'}`}
             disabled={busy || (!connected && !canStart)}
             onClick={toggleConnection}
           >
@@ -201,7 +204,9 @@ export function ClientOverviewPage({
           </button>
           <div className="client-state-copy" aria-live="polite">
             <h2 key={connected ? 'connected' : 'disconnected'} id="connection-title">
-              {connected ? 'VPN включён' : 'VPN выключен'}
+              {isGateway
+                ? connected ? 'Gateway включён' : 'Gateway выключен'
+                : connected ? 'VPN включён' : 'VPN выключен'}
             </h2>
             <div className="client-state-detail">
               {connected ? (
@@ -216,12 +221,28 @@ export function ClientOverviewPage({
             </div>
           </div>
 
-          <section className="client-proxies" aria-label="Локальный прокси">
-            <span className="client-proxy-label">Адрес</span>
-            <strong className="client-proxy-address">
-              {proxyUrls.http.replace(/^https?:\/\//, '')}
-            </strong>
-            <div>
+          <section className="client-proxies" aria-label={isGateway ? 'Адреса Gateway и Proxy' : 'Локальный прокси'}>
+            {isGateway && (
+              <div className="client-access-point">
+                <span className="client-proxy-label">Gateway</span>
+                <strong className="client-proxy-address">{gatewayAddress}</strong>
+                <button
+                  className={copiedProxy === 'gateway' ? 'is-copied' : ''}
+                  type="button"
+                  aria-label={`Скопировать Gateway: ${gatewayAddress}`}
+                  onClick={() => copyProxy('gateway')}
+                >
+                  <span className="client-copy-label">КОПИРОВАТЬ</span>
+                  {copiedProxy === 'gateway' && <span className="client-copy-feedback">Copied</span>}
+                </button>
+              </div>
+            )}
+            <div className="client-access-point">
+              <span className="client-proxy-label">{isGateway ? 'Proxy' : 'Адрес'}</span>
+              <strong className="client-proxy-address">
+                {proxyUrls.http.replace(/^https?:\/\//, '')}
+              </strong>
+              <div className="client-proxy-actions">
               {[
                 ['socks5', 'SOCKS5'],
                 ['http', 'HTTP'],
@@ -237,11 +258,14 @@ export function ClientOverviewPage({
                   {copiedProxy === kind && <span className="client-copy-feedback">Copied</span>}
                 </button>
               ))}
+              </div>
             </div>
           </section>
         </section>
         )}
 
+        {error && <p className="client-error" role="alert">{error}</p>}
+
         <div className="client-form">
           <div
             ref={subscriptionRef}