fix(hosts): advertise Hosts in every WireGuard, AmneziaWG and TUIC config

Invariant: an inbound's enabled Hosts are the endpoints every client config
for it advertises, whichever surface renders that config.

WireGuard and AmneziaWG broke it. Their raw generators ignored the
externalProxy entries Hosts are injected as and always emitted
resolveInboundAddress, so the raw subscription, the sub page .conf, the
clients links API and "export all links" gave out the panel address while
the JSON and Clash formats of the same inbound used the Host.
advertisedEndpoints now states the fan-out once for mtproto, wireguard and
amneziawg.

The browser-built configs had the same gap. The Clients page WireGuard and
AmneziaWG config blocks and QR panels, and its TUIC Clash config, used the
panel hostname next to server links that already used Hosts; the Inbounds
page peer configs, QR and export ignored them too. withMtprotoHostEndpoints
becomes withHostEndpoints over a shared hostEndpointsFor mirror of the
backend, the tunnel fan-outs render one config per Host, and the clients
page waits for the hosts list the way the inbounds page does, so an empty
list means "no hosts" rather than "not loaded yet".

frontend/src/pages/inbounds/InboundsPage.tsx

@@ -39,7 +39,7 @@ import { useMediaQuery } from '@/hooks/useMediaQuery';
 import { useWebSocket } from '@/hooks/useWebSocket';
 import { useNodesQuery } from '@/api/queries/useNodesQuery';
 import { useHostsQuery } from '@/api/queries/useHostsQuery';
-import { withMtprotoHostEndpoints } from '@/lib/hosts/host-link';
+import { withHostEndpoints } from '@/lib/hosts/host-link';
 import AppSidebar from '@/layouts/AppSidebar';
 const TextModal = lazy(() => import('@/components/feedback/TextModal'));
 import type { TextModalTab } from '@/components/feedback/TextModal';
@@ -340,7 +340,7 @@ export default function InboundsPage() {
       const hostOverride = hostOverrideFor(dbInbound);
       const fallbackHostname = preferPublicHost(window.location.hostname, subSettings.publicHost);
       const genInput = {
-        inbound: withMtprotoHostEndpoints(
+        inbound: withHostEndpoints(
           inboundFromDb(projected),
           dbInbound.id,
           hosts,

frontend/src/pages/inbounds/info/InboundInfoModal.tsx

@@ -10,14 +10,14 @@ import { InfinityIcon } from '@/components/ui';
 import { useDatepicker } from '@/hooks/useDatepicker';
 import {
   genAllLinks,
-  genAmneziaWGConfigs,
-  genAmneziaWGLinks,
-  genWireguardConfigs,
-  genWireguardLinks,
+  genAmneziaWGPeerConfigs,
+  genAmneziaWGPeerLinks,
+  genWireguardPeerConfigs,
+  genWireguardPeerLinks,
   preferPublicHost,
 } from '@/lib/xray/inbound-link';
 import { inboundFromDb } from '@/lib/xray/inbound-from-db';
-import { withMtprotoHostEndpoints } from '@/lib/hosts/host-link';
+import { withHostEndpoints } from '@/lib/hosts/host-link';
 
 import {
   buildInboundInfo,
@@ -25,6 +25,7 @@ import {
   downloadText,
   formatIpInfo,
   hasShareLink,
+  peerConfFileName,
   statsColor,
 } from './helpers';
 import type { ClientSetting, ClientStats, InboundInfo, InboundInfoModalProps } from './types';
@@ -53,10 +54,10 @@ export default function InboundInfoModal({
   const [clientSettings, setClientSettings] = useState<ClientSetting | null>(null);
   const [clientStats, setClientStats] = useState<ClientStats | null>(null);
   const [links, setLinks] = useState<{ remark?: string; link: string }[]>([]);
-  const [wireguardConfigs, setWireguardConfigs] = useState<string[]>([]);
-  const [wireguardLinks, setWireguardLinks] = useState<string[]>([]);
-  const [amneziawgConfigs, setAmneziawgConfigs] = useState<string[]>([]);
-  const [amneziawgLinks, setAmneziawgLinks] = useState<string[]>([]);
+  const [wireguardConfigs, setWireguardConfigs] = useState<string[][]>([]);
+  const [wireguardLinks, setWireguardLinks] = useState<string[][]>([]);
+  const [amneziawgConfigs, setAmneziawgConfigs] = useState<string[][]>([]);
+  const [amneziawgLinks, setAmneziawgLinks] = useState<string[][]>([]);
   const [subLink, setSubLink] = useState('');
   const [subJsonLink, setSubJsonLink] = useState('');
   const [refreshing, setRefreshing] = useState(false);
@@ -145,7 +146,7 @@ export default function InboundInfoModal({
       window.location.hostname,
       subSettings?.publicHost ?? '',
     );
-    const inboundForLinks = withMtprotoHostEndpoints(
+    const inboundForLinks = withHostEndpoints(
       inboundFromDb(dbInbound),
       dbInbound.id,
       hosts,
@@ -154,40 +155,40 @@ export default function InboundInfoModal({
     );
     if (info.protocol === Protocols.WIREGUARD) {
       setWireguardConfigs(
-        genWireguardConfigs({
+        genWireguardPeerConfigs({
           inbound: inboundForLinks,
           remark: dbInbound.remark,
           hostOverride: nodeAddress,
           fallbackHostname,
-        }).split('\r\n'),
+        }),
       );
       setWireguardLinks(
-        genWireguardLinks({
+        genWireguardPeerLinks({
           inbound: inboundForLinks,
           remark: dbInbound.remark,
           hostOverride: nodeAddress,
           fallbackHostname,
-        }).split('\r\n'),
+        }),
       );
       setAmneziawgConfigs([]);
       setAmneziawgLinks([]);
       setLinks([]);
     } else if (info.protocol === Protocols.AMNEZIAWG) {
       setAmneziawgConfigs(
-        genAmneziaWGConfigs({
+        genAmneziaWGPeerConfigs({
           inbound: inboundForLinks,
           remark: dbInbound.remark,
           hostOverride: nodeAddress,
           fallbackHostname,
-        }).split('\r\n'),
+        }),
       );
       setAmneziawgLinks(
-        genAmneziaWGLinks({
+        genAmneziaWGPeerLinks({
           inbound: inboundForLinks,
           remark: dbInbound.remark,
           hostOverride: nodeAddress,
           fallbackHostname,
-        }).split('\r\n'),
+        }),
       );
       setWireguardConfigs([]);
       setWireguardLinks([]);
@@ -1189,49 +1190,55 @@ export default function InboundInfoModal({
                     </dd>
                   </div>
                 </dl>
-                {wireguardConfigs[idx] && (
-                  <div className="link-panel">
-                    <div className="link-panel-header">
-                      <Tag color="green">
-                        {t('pages.inbounds.info.peerNumberConfig', { n: idx + 1 })}
-                      </Tag>
-                      <Tooltip title={t('copy')}>
-                        <Button
-                          size="small"
-                          icon={<CopyOutlined />}
-                          aria-label={t('copy')}
-                          onClick={() => copyText(wireguardConfigs[idx], t)}
-                        />
-                      </Tooltip>
-                      <Tooltip title={t('download')}>
-                        <Button
-                          size="small"
-                          icon={<DownloadOutlined />}
-                          aria-label={t('download')}
-                          onClick={() =>
-                            downloadText(wireguardConfigs[idx], `peer-${idx + 1}.conf`)
-                          }
-                        />
-                      </Tooltip>
-                    </div>
-                    <code className="link-panel-text">{wireguardConfigs[idx]}</code>
-                  </div>
+                {(wireguardConfigs[idx] ?? []).map(
+                  (cfg, j, all) =>
+                    cfg && (
+                      <div key={`wg-cfg-${j}`} className="link-panel">
+                        <div className="link-panel-header">
+                          <Tag color="green">
+                            {t('pages.inbounds.info.peerNumberConfig', { n: idx + 1 })}
+                          </Tag>
+                          <Tooltip title={t('copy')}>
+                            <Button
+                              size="small"
+                              icon={<CopyOutlined />}
+                              aria-label={t('copy')}
+                              onClick={() => copyText(cfg, t)}
+                            />
+                          </Tooltip>
+                          <Tooltip title={t('download')}>
+                            <Button
+                              size="small"
+                              icon={<DownloadOutlined />}
+                              aria-label={t('download')}
+                              onClick={() =>
+                                downloadText(cfg, peerConfFileName(idx, j, all.length))
+                              }
+                            />
+                          </Tooltip>
+                        </div>
+                        <code className="link-panel-text">{cfg}</code>
+                      </div>
+                    ),
                 )}
-                {wireguardLinks[idx] && (
-                  <div className="link-panel">
-                    <div className="link-panel-header">
-                      <Tag color="green">Peer {idx + 1} link</Tag>
-                      <Tooltip title={t('copy')}>
-                        <Button
-                          size="small"
-                          icon={<CopyOutlined />}
-                          aria-label={t('copy')}
-                          onClick={() => copyText(wireguardLinks[idx], t)}
-                        />
-                      </Tooltip>
-                    </div>
-                    <code className="link-panel-text">{wireguardLinks[idx]}</code>
-                  </div>
+                {(wireguardLinks[idx] ?? []).map(
+                  (link, j) =>
+                    link && (
+                      <div key={`wg-link-${j}`} className="link-panel">
+                        <div className="link-panel-header">
+                          <Tag color="green">Peer {idx + 1} link</Tag>
+                          <Tooltip title={t('copy')}>
+                            <Button
+                              size="small"
+                              icon={<CopyOutlined />}
+                              aria-label={t('copy')}
+                              onClick={() => copyText(link, t)}
+                            />
+                          </Tooltip>
+                        </div>
+                        <code className="link-panel-text">{link}</code>
+                      </div>
+                    ),
                 )}
               </Fragment>
             ))}
@@ -1241,49 +1248,55 @@ export default function InboundInfoModal({
       {inbound?.protocol === Protocols.AMNEZIAWG && amneziawgConfigs.length > 0 && (
         <>
           <Divider>{t('pages.inbounds.copyLink')}</Divider>
-          {amneziawgConfigs.map((cfg, idx) => (
+          {amneziawgConfigs.map((peerConfigs, idx) => (
             <Fragment key={idx}>
-              {cfg && (
-                <div className="link-panel">
-                  <div className="link-panel-header">
-                    <Tag color="green">
-                      {t('pages.inbounds.info.peerNumberConfig', { n: idx + 1 })}
-                    </Tag>
-                    <Tooltip title={t('copy')}>
-                      <Button
-                        size="small"
-                        icon={<CopyOutlined />}
-                        aria-label={t('copy')}
-                        onClick={() => copyText(cfg, t)}
-                      />
-                    </Tooltip>
-                    <Tooltip title={t('download')}>
-                      <Button
-                        size="small"
-                        icon={<DownloadOutlined />}
-                        aria-label={t('download')}
-                        onClick={() => downloadText(cfg, `peer-${idx + 1}.conf`)}
-                      />
-                    </Tooltip>
-                  </div>
-                  <code className="link-panel-text">{cfg}</code>
-                </div>
+              {peerConfigs.map(
+                (cfg, j, all) =>
+                  cfg && (
+                    <div key={`awg-cfg-${j}`} className="link-panel">
+                      <div className="link-panel-header">
+                        <Tag color="green">
+                          {t('pages.inbounds.info.peerNumberConfig', { n: idx + 1 })}
+                        </Tag>
+                        <Tooltip title={t('copy')}>
+                          <Button
+                            size="small"
+                            icon={<CopyOutlined />}
+                            aria-label={t('copy')}
+                            onClick={() => copyText(cfg, t)}
+                          />
+                        </Tooltip>
+                        <Tooltip title={t('download')}>
+                          <Button
+                            size="small"
+                            icon={<DownloadOutlined />}
+                            aria-label={t('download')}
+                            onClick={() => downloadText(cfg, peerConfFileName(idx, j, all.length))}
+                          />
+                        </Tooltip>
+                      </div>
+                      <code className="link-panel-text">{cfg}</code>
+                    </div>
+                  ),
               )}
-              {amneziawgLinks[idx] && (
-                <div className="link-panel">
-                  <div className="link-panel-header">
-                    <Tag color="green">Peer {idx + 1} link</Tag>
-                    <Tooltip title={t('copy')}>
-                      <Button
-                        size="small"
-                        icon={<CopyOutlined />}
-                        aria-label={t('copy')}
-                        onClick={() => copyText(amneziawgLinks[idx], t)}
-                      />
-                    </Tooltip>
-                  </div>
-                  <code className="link-panel-text">{amneziawgLinks[idx]}</code>
-                </div>
+              {(amneziawgLinks[idx] ?? []).map(
+                (link, j) =>
+                  link && (
+                    <div key={`awg-link-${j}`} className="link-panel">
+                      <div className="link-panel-header">
+                        <Tag color="green">Peer {idx + 1} link</Tag>
+                        <Tooltip title={t('copy')}>
+                          <Button
+                            size="small"
+                            icon={<CopyOutlined />}
+                            aria-label={t('copy')}
+                            onClick={() => copyText(link, t)}
+                          />
+                        </Tooltip>
+                      </div>
+                      <code className="link-panel-text">{link}</code>
+                    </div>
+                  ),
               )}
             </Fragment>
           ))}

frontend/src/pages/inbounds/info/helpers.ts

@@ -162,6 +162,12 @@ export function downloadText(content: string, filename: string) {
   FileManager.downloadTextFile(content, filename);
 }
 
+// One file per advertised Host, so a peer behind two Hosts gets two names.
+export function peerConfFileName(peerIndex: number, endpointIndex: number, endpointCount: number) {
+  const suffix = endpointCount > 1 ? `-${endpointIndex + 1}` : '';
+  return `peer-${peerIndex + 1}${suffix}.conf`;
+}
+
 export function statsColor(stats: ClientStats, trafficDiff: number) {
   return ColorUtils.usageColor(stats.up + stats.down, trafficDiff, stats.total);
 }

frontend/src/pages/inbounds/qr/QrCodeModal.tsx

@@ -6,17 +6,18 @@ import type { CollapseProps } from 'antd';
 import { Protocols } from '@/schemas/primitives';
 import {
   genAllLinks,
-  genAmneziaWGConfigs,
-  genAmneziaWGLinks,
-  genWireguardConfigs,
-  genWireguardLinks,
+  genAmneziaWGPeerConfigs,
+  genAmneziaWGPeerLinks,
+  genWireguardPeerConfigs,
+  genWireguardPeerLinks,
   isPostQuantumLink,
   preferPublicHost,
 } from '@/lib/xray/inbound-link';
 import { inboundFromDb, type DbInboundLike } from '@/lib/xray/inbound-from-db';
-import { withMtprotoHostEndpoints } from '@/lib/hosts/host-link';
+import { withHostEndpoints } from '@/lib/hosts/host-link';
 import type { HostRecord } from '@/schemas/api/host';
 import QrPanel from './QrPanel';
+import { peerConfFileName } from '../info/helpers';
 import type { SubSettings } from '../useInbounds';
 
 interface ClientSetting {
@@ -56,10 +57,10 @@ export default function QrCodeModal({
 }: QrCodeModalProps) {
   const { t } = useTranslation();
   const [links, setLinks] = useState<{ remark?: string; link: string }[]>([]);
-  const [wireguardConfigs, setWireguardConfigs] = useState<string[]>([]);
-  const [wireguardLinks, setWireguardLinks] = useState<string[]>([]);
-  const [amneziawgConfigs, setAmneziawgConfigs] = useState<string[]>([]);
-  const [amneziawgLinks, setAmneziawgLinks] = useState<string[]>([]);
+  const [wireguardConfigs, setWireguardConfigs] = useState<string[][]>([]);
+  const [wireguardLinks, setWireguardLinks] = useState<string[][]>([]);
+  const [amneziawgConfigs, setAmneziawgConfigs] = useState<string[][]>([]);
+  const [amneziawgLinks, setAmneziawgLinks] = useState<string[][]>([]);
   const [subLink, setSubLink] = useState('');
   const [subJsonLink, setSubJsonLink] = useState('');
   const [activeKey, setActiveKey] = useState<string[]>([]);
@@ -88,7 +89,7 @@ export default function QrCodeModal({
       window.location.hostname,
       subSettings?.publicHost ?? '',
     );
-    const inbound = withMtprotoHostEndpoints(
+    const inbound = withHostEndpoints(
       inboundFromDb(dbInbound),
       dbInbound.id,
       hosts,
@@ -100,20 +101,20 @@ export default function QrCodeModal({
         ? `${dbInbound.remark}-${client.email}`
         : dbInbound.remark || '';
       setWireguardConfigs(
-        genWireguardConfigs({
+        genWireguardPeerConfigs({
           inbound,
           remark: peerRemark,
           hostOverride: nodeAddress,
           fallbackHostname,
-        }).split('\r\n'),
+        }),
       );
       setWireguardLinks(
-        genWireguardLinks({
+        genWireguardPeerLinks({
           inbound,
           remark: peerRemark,
           hostOverride: nodeAddress,
           fallbackHostname,
-        }).split('\r\n'),
+        }),
       );
       setAmneziawgConfigs([]);
       setAmneziawgLinks([]);
@@ -123,20 +124,20 @@ export default function QrCodeModal({
         ? `${dbInbound.remark}-${client.email}`
         : dbInbound.remark || '';
       setAmneziawgConfigs(
-        genAmneziaWGConfigs({
+        genAmneziaWGPeerConfigs({
           inbound,
           remark: peerRemark,
           hostOverride: nodeAddress,
           fallbackHostname,
-        }).split('\r\n'),
+        }),
       );
       setAmneziawgLinks(
-        genAmneziaWGLinks({
+        genAmneziaWGPeerLinks({
           inbound,
           remark: peerRemark,
           hostOverride: nodeAddress,
           fallbackHostname,
-        }).split('\r\n'),
+        }),
       );
       setWireguardConfigs([]);
       setWireguardLinks([]);
@@ -183,38 +184,30 @@ export default function QrCodeModal({
     links.forEach((link, idx) => {
       items.push({ key: `l${idx}`, header: link.remark || `Link ${idx + 1}`, value: link.link });
     });
-    wireguardConfigs.forEach((cfg, idx) => {
-      items.push({
-        key: `wc${idx}`,
-        header: `Peer ${idx + 1} config`,
-        value: cfg,
-        downloadName: `peer-${idx + 1}.conf`,
-      });
-      if (wireguardLinks[idx]) {
-        items.push({
-          key: `wl${idx}`,
-          header: `Peer ${idx + 1} link`,
-          value: wireguardLinks[idx],
-          showQr: false,
+    const pushTunnelPeers = (prefix: string, configs: string[][], peerLinks: string[][]) => {
+      configs.forEach((peerConfigs, idx) => {
+        peerConfigs.forEach((cfg, j) => {
+          const multi = peerConfigs.length > 1 ? ` #${j + 1}` : '';
+          items.push({
+            key: `${prefix}c${idx}-${j}`,
+            header: `Peer ${idx + 1} config${multi}`,
+            value: cfg,
+            downloadName: peerConfFileName(idx, j, peerConfigs.length),
+          });
+          const link = peerLinks[idx]?.[j];
+          if (link) {
+            items.push({
+              key: `${prefix}l${idx}-${j}`,
+              header: `Peer ${idx + 1} link${multi}`,
+              value: link,
+              showQr: false,
+            });
+          }
         });
-      }
-    });
-    amneziawgConfigs.forEach((cfg, idx) => {
-      items.push({
-        key: `ac${idx}`,
-        header: `Peer ${idx + 1} config`,
-        value: cfg,
-        downloadName: `peer-${idx + 1}.conf`,
       });
-      if (amneziawgLinks[idx]) {
-        items.push({
-          key: `al${idx}`,
-          header: `Peer ${idx + 1} link`,
-          value: amneziawgLinks[idx],
-          showQr: false,
-        });
-      }
-    });
+    };
+    pushTunnelPeers('w', wireguardConfigs, wireguardLinks);
+    pushTunnelPeers('a', amneziawgConfigs, amneziawgLinks);
     return items;
   }, [
     subLink,