diff --git a/frontend/src/components/InterfaceEditModal.vue b/frontend/src/components/InterfaceEditModal.vue index 74e7e4e..97dcf7d 100644 --- a/frontend/src/components/InterfaceEditModal.vue +++ b/frontend/src/components/InterfaceEditModal.vue @@ -51,6 +51,23 @@ const currentTags = ref({ }) const formData = ref(freshInterface()) +const isBackendValid = computed(() => { + if (!props.visible || !selectedInterface.value) { + return true // if modal is not visible or no interface is selected, we don't care about backend validity + } + + let backendId = selectedInterface.value.Backend + + let valid = false + let availableBackends = settings.Setting('AvailableBackends') || [] + availableBackends.forEach(backend => { + if (backend.Id === backendId) { + valid = true + } + }) + return valid +}) + // functions watch(() => props.visible, async (newValue, oldValue) => { @@ -326,10 +343,11 @@ async function del() {
- - + {{ $t('modals.interface-edit.backend.invalid-label') }}
diff --git a/frontend/src/lang/translations/de.json b/frontend/src/lang/translations/de.json index 6008161..3e55497 100644 --- a/frontend/src/lang/translations/de.json +++ b/frontend/src/lang/translations/de.json @@ -103,6 +103,8 @@ "interface": { "headline": "Schnittstellenstatus für", "backend": "Backend", + "unknown-backend": "Unbekannt", + "wrong-backend": "Ungültiges Backend, das lokale WireGuard Backend wird stattdessen verwendet!", "key": "Öffentlicher Schlüssel", "endpoint": "Öffentlicher Endpunkt", "port": "Port", @@ -357,6 +359,11 @@ "client": "Client-Modus", "any": "Unbekannter Modus" }, + "backend": { + "label": "Schnittstellenbackend", + "invalid-label": "Ursprüngliches Backend ist ungültig, das lokale WireGuard Backend wird stattdessen verwendet!", + "local": "Lokales WireGuard Backend" + }, "display-name": { "label": "Anzeigename", "placeholder": "Der beschreibende Name für die Schnittstelle" diff --git a/frontend/src/lang/translations/en.json b/frontend/src/lang/translations/en.json index d410661..e59092b 100644 --- a/frontend/src/lang/translations/en.json +++ b/frontend/src/lang/translations/en.json @@ -103,6 +103,8 @@ "interface": { "headline": "Interface status for", "backend": "Backend", + "unknown-backend": "Unknown", + "wrong-backend": "Invalid backend, using local WireGuard backend instead!", "key": "Public Key", "endpoint": "Public Endpoint", "port": "Listening Port", @@ -359,6 +361,7 @@ }, "backend": { "label": "Interface Backend", + "invalid-label": "Original backend is no longer available, using local WireGuard backend instead!", "local": "Local WireGuard Backend" }, "display-name": { diff --git a/frontend/src/views/InterfaceView.vue b/frontend/src/views/InterfaceView.vue index b45443b..56ef34d 100644 --- a/frontend/src/views/InterfaceView.vue +++ b/frontend/src/views/InterfaceView.vue @@ -51,7 +51,7 @@ function calculateInterfaceName(id, name) { const calculateBackendName = computed(() => { let backendId = interfaces.GetSelected.Backend - let backendName = "Unknown" + let backendName = t('interfaces.interface.unknown-backend') let availableBackends = settings.Setting('AvailableBackends') || [] availableBackends.forEach(backend => { if (backend.Id === backendId) { @@ -61,6 +61,19 @@ const calculateBackendName = computed(() => { return backendName }) +const isBackendValid = computed(() => { + let backendId = interfaces.GetSelected.Backend + + let valid = false + let availableBackends = settings.Setting('AvailableBackends') || [] + availableBackends.forEach(backend => { + if (backend.Id === backendId) { + valid = true + } + }) + return valid +}) + async function download() { await interfaces.LoadInterfaceConfig(interfaces.GetSelected.Identifier) @@ -158,7 +171,7 @@ onMounted(async () => {
- {{ $t('interfaces.interface.headline') }} {{interfaces.GetSelected.Identifier}} ({{ $t('modals.interface-edit.mode.' + interfaces.GetSelected.Mode )}} | {{ $t('interfaces.interface.backend') + ": " + calculateBackendName }}) + {{ $t('interfaces.interface.headline') }} {{interfaces.GetSelected.Identifier}} ({{ $t('modals.interface-edit.mode.' + interfaces.GetSelected.Mode )}} | {{ $t('interfaces.interface.backend') + ": " + calculateBackendName }})