refactor(gui): collapse public server and standalone into initial peer list (#2017)

The GUI exposed three networking modes: public server, manual, and standalone. In practice EasyTier does not have a server/client role distinction here. Those options only mapped to different peer bootstrap shapes, which made the product model misleading and pushed users toward a non-existent "public server" concept.

This change rewrites the shared configuration UX around initial nodes. Users now add or remove one or more initial node URLs directly, and the UI explains that EasyTier networking works like plugging in a cable: once a node connects to one or more existing nodes, it can join the mesh. Initial nodes may be self-hosted or shared by others.

To preserve compatibility, the frontend keeps the legacy fields and adds normalization helpers in the shared NetworkConfig layer. Old configs are read as initial_node_urls, while saves, runs, validation, config generation, and persisted GUI config sync still denormalize back into the current backend shape: zero initial nodes -> Standalone, one -> PublicServer, many -> Manual. This avoids any proto or backend API change while making old saved configs and imported TOML files load cleanly in the new UI.

Code changes:

- add initial_node_urls plus normalize/denormalize helpers in the shared frontend NetworkConfig model

- remove the mode switch and public-server/manual specific inputs from the shared Config component and replace them with a single initial-node list plus explanatory copy

- update Chinese and English locale strings for the new terminology

- normalize configs received from GUI/web backends and denormalize them before outbound API calls

- normalize GUI save-config events before storing them in localStorage so legacy payloads remain editable under the new model
This commit is contained in:
KKRainbow
2026-03-27 11:37:09 +08:00
committed by GitHub
parent e000636d83
commit 0aeea39fbe
8 changed files with 104 additions and 39 deletions
@@ -1,17 +1,16 @@
<script setup lang="ts">
import InputGroup from 'primevue/inputgroup'
import InputGroupAddon from 'primevue/inputgroupaddon'
import { SelectButton, Checkbox, InputText, InputNumber, AutoComplete, Panel, Divider, ToggleButton, Button, Password, Dialog } from 'primevue'
import { Checkbox, InputText, InputNumber, AutoComplete, Panel, Divider, ToggleButton, Button, Password, Dialog } from 'primevue'
import {
addRow,
DEFAULT_NETWORK_CONFIG,
NetworkConfig,
NetworkingMethod,
normalizeNetworkConfig,
removeRow
} from '../types/network'
import { ref, onMounted, onUnmounted } from 'vue'
import { ref, onMounted, onUnmounted, watch } from 'vue'
import { useI18n } from 'vue-i18n'
import UrlInput from './UrlInput.vue'
import UrlListInput from './UrlListInput.vue'
const props = defineProps<{
@@ -28,12 +27,6 @@ const curNetwork = defineModel('curNetwork', {
const { t } = useI18n()
const networking_methods = ref([
{ value: NetworkingMethod.PublicServer, label: () => t('public_server') },
{ value: NetworkingMethod.Manual, label: () => t('manual') },
{ value: NetworkingMethod.Standalone, label: () => t('standalone') },
])
const protos: { [proto: string]: number } = {
tcp: 11010,
udp: 11010,
@@ -154,6 +147,16 @@ onMounted(() => {
});
}
});
function syncNormalizedNetwork(network: NetworkConfig | undefined): void {
if (!network) {
return
}
Object.assign(network, normalizeNetworkConfig(network))
}
watch(() => curNetwork.value, syncNormalizedNetwork, { immediate: true, deep: false })
</script>
<template>
@@ -200,15 +203,13 @@ onMounted(() => {
<div class="flex flex-row gap-x-9 flex-wrap">
<div class="flex flex-col gap-2 basis-5/12 grow">
<label for="nm">{{ t('networking_method') }}</label>
<SelectButton v-model="curNetwork.networking_method" :options="networking_methods"
:option-label="(v) => v.label()" option-value="value" />
<div class="flex items-center">
<label for="initial_nodes">{{ t('initial_nodes') }}</label>
<span class="pi pi-question-circle ml-2 self-center" v-tooltip="t('initial_nodes_help')"></span>
</div>
<div class="items-center flex flex-col p-fluid gap-y-2">
<UrlListInput v-if="curNetwork.networking_method === NetworkingMethod.Manual"
v-model="curNetwork.peer_urls" :protos="protos" :add-label="t('add_peer_url')" />
<UrlInput v-if="curNetwork.networking_method === NetworkingMethod.PublicServer"
v-model="curNetwork.public_server_url" :protos="protos" />
<UrlListInput id="initial_nodes" v-model="curNetwork.peer_urls" :protos="protos"
:add-label="t('add_initial_node')" :placeholder="t('initial_node_placeholder')" />
</div>
</div>
</div>