Skip to content

Commit

Permalink
feat: add IPsec tunnel page (#77)
Browse files Browse the repository at this point in the history
  • Loading branch information
kevincela authored Nov 9, 2023
1 parent 96d504e commit fb3bfaf
Show file tree
Hide file tree
Showing 14 changed files with 1,242 additions and 28 deletions.
8 changes: 4 additions & 4 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"@nethesis/nethesis-brands-svg-icons": "github:nethesis/Font-Awesome#ns-brands",
"@nethesis/nethesis-light-svg-icons": "github:nethesis/Font-Awesome#ns-light",
"@nethesis/nethesis-solid-svg-icons": "github:nethesis/Font-Awesome#ns-solid",
"@nethserver/vue-tailwind-lib": "^0.0.89",
"@nethserver/vue-tailwind-lib": "^0.0.90",
"@types/lodash": "^4.14.195",
"@vueuse/core": "^10.5.0",
"axios": "^1.4.0",
Expand Down
55 changes: 54 additions & 1 deletion public/i18n/en/translation.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,9 @@
"disable": "Disable",
"enabled": "Enabled",
"disabled": "Disabled",
"step": "Step",
"previous": "Previous",
"next": "Next",
"page_under_construction": "Page under construction"
},
"error": {
Expand Down Expand Up @@ -138,7 +141,10 @@
"cannot_disable_tunnel": "Cannot disable tunnel",
"cannot_retrieve_tunnel_options": "Cannot retrieve tunnel options",
"cannot_retrieve_tunnel_defaults": "Cannot retrieve tunnel defaults",
"cannot_import_configuration": "Cannot import configuration"
"cannot_import_configuration": "Cannot import configuration",
"cannot_retrieve_ipsec_tunnels": "Cannot retrieve IPsec tunnels",
"cannot_retrieve_ipsec_algorithms": "Cannot retrieve IPsec algorithms",
"cannot_retrieve_tunnel_data": "Cannot retrieve tunnel data"
},
"ne_text_input": {
"show_password": "Show password",
Expand Down Expand Up @@ -907,6 +913,53 @@
"topology_tooltip_subnet_description": "This method offers a straightforward configuration approach. Instead of using a point-to-point setup, utilize a subnet configuration by specifying a local IP address and subnet mask for the tun interface. In this mode, each connected client is assigned a unique IP address, and it is compatible with Windows systems as well.",
"topology_tooltip_p2p_description": "Implement a point-to-point topology where the client's tun interface remote endpoint consistently points to the server's tun interface local endpoint. This configuration assigns a single IP address to each connected client. Utilize this mode exclusively when none of the connected clients operate on Windows systems."
},
"ipsec_tunnel": {
"title": "IPsec tunnel",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse gravida, nibh vel finibus suscipit, mauris erat porta",
"add_ipsec_tunnel": "Add IPsec tunnel",
"no_tunnel_found": "No tunnel found",
"name": "Name",
"local_networks": "Local networks",
"remote_networks": "Remote networks",
"received": "Received",
"sent": "Sent",
"started": "Started",
"status": "Status",
"connection": "Connection",
"connected": "Connected",
"not_connected": "Not connected",
"enable": "Enable",
"disable": "Disable",
"enabled": "Enabled",
"disabled": "Disabled",
"delete_tunnel": "Delete tunnel",
"delete_tunnel_message": "You are about to delete tunnel '{name}'",
"add_tunnel": "Add tunnel",
"edit_tunnel": "Edit tunnel",
"tunnel_name": "Tunnel name",
"wan_ip_address": "WAN IP address",
"remote_ip_address": "Remote IP address",
"local_identifier": "Local identifier",
"remote_identifier": "Remote identifier",
"choose_wan": "Choose WAN",
"add_network": "Add network",
"pre_shared_key": "Pre-shared key",
"generate_key": "Generate key",
"import_key": "Import key",
"dpd_dead_peer_detection": "DPD (dead peer detection)",
"pfs_perfect_forward_secrecy_disabled": "PFS (Perfect Forward Secrecy) disabled",
"compression": "Compression",
"phase_one_ike": "Phase 1 (IKE)",
"phase_two_esp": "Phase 2 (ESP)",
"ike_version": "IKE version",
"encryption_algorithm": "Encryption algorithm",
"integrity_algorithm": "Integrity algorithm",
"diffie_hellman_group": "Diffie-Hellman group",
"key_life_time_seconds": "Key life time (seconds)",
"remote_ip_address_tooltip": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse gravida, nibh vel finibus suscipit, mauris erat porta",
"local_identifier_tooltip": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse gravida, nibh vel finibus suscipit, mauris erat porta",
"edit_ipsec_tunnel": "Edit IPsec tunnel"
},
"logs": {
"title": "Logs",
"limit_rows": "Lines limit",
Expand Down
48 changes: 48 additions & 0 deletions src/components/standalone/NeCopyField.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
<script setup lang="ts">
const props = defineProps<{
value: string
label?: string
copyValueLabel?: string
}>()
function copyValue() {
navigator.clipboard.writeText(props.value)
}
</script>

<template>
<div>
<p class="mb-2 text-sm font-medium leading-6 text-gray-700 dark:text-gray-200" v-if="label">
{{ label }}
</p>
<div
class="text-md flex flex-row rounded-md border border-gray-300 bg-white text-gray-700 transition-colors duration-200 dark:border-gray-600 dark:bg-gray-950 dark:text-gray-200 sm:text-sm sm:leading-6"
>
<div class="no-scrollbar mt-0 max-w-full flex-grow overflow-x-scroll px-3 py-1.5">
{{ value }}
</div>
<button
class="rounded-r-md bg-gray-50 px-3 py-1.5 duration-200 hover:bg-gray-200 focus:ring-2 focus:ring-primary-500 focus:ring-offset-2 focus:ring-offset-white focus:duration-0 dark:bg-gray-950 dark:hover:bg-gray-800 dark:focus:ring-primary-300 dark:focus:ring-offset-primary-950"
@click="copyValue()"
>
<font-awesome-icon
:icon="['fas', 'clone']"
aria-hidden="true"
:class="['h-4', 'w-4', copyValueLabel ? 'mr-2' : '']"
/>
{{ copyValueLabel }}
</button>
</div>
</div>
</template>

<style>
.no-scrollbar::-webkit-scrollbar {
display: none;
}
.no-scrollbar {
-ms-overflow-style: none;
scrollbar-width: none;
}
</style>
8 changes: 7 additions & 1 deletion src/components/standalone/NeMultiTextInput.vue
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ const props = withDefaults(
modelValue: string[] | KeyValueItem[]
addItemLabel: string
invalidMessages?: string[]
generalInvalidMessage?: string
invalidKeyMessages?: string[]
keyOptions?: NeComboboxOption[]
title?: string
Expand Down Expand Up @@ -106,7 +107,9 @@ onMounted(() => {
<div>
<div
v-if="title"
:class="`${items.length > 0 ? 'mb-2' : 'mb-4'} flex items-center justify-between`"
:class="`${
items.length > 0 || generalInvalidMessage ? 'mb-2' : 'mb-4'
} flex items-center justify-between`"
>
<div>
<span class="mr-2 text-sm font-medium leading-6 text-gray-700 dark:text-gray-200">
Expand Down Expand Up @@ -140,6 +143,9 @@ onMounted(() => {
<font-awesome-icon :icon="['fas', 'trash']" class="h-4 w-4 py-1" aria-hidden="true" />
</NeButton>
</div>
<p v-if="generalInvalidMessage" :class="'mt-2 text-sm text-rose-700 dark:text-rose-400'">
{{ generalInvalidMessage }}
</p>
<NeButton size="md" @click="addItem" :disabled="disableAddButton">
<template #prefix>
<font-awesome-icon :icon="['fas', 'plus']" class="h-4 w-4" aria-hidden="true" />
Expand Down
23 changes: 23 additions & 0 deletions src/components/standalone/NeStepper.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
<script setup lang="ts">
import { NeProgressBar } from '@nethserver/vue-tailwind-lib'
import { range } from 'lodash'
const props = defineProps<{
totalSteps: number
currentStep: number
stepLabel: string
}>()
</script>

<template>
<div>
<NeProgressBar :progress="(currentStep / totalSteps) * 100" size="sm" />
<div class="mt-2 flex flex-row">
<div v-for="i in range(1, totalSteps + 1)" :key="i" class="flex grow basis-0 justify-center">
<p class="text-xs font-semibold text-primary-400" v-if="i == currentStep">
Step {{ currentStep }}/{{ totalSteps }}
</p>
</div>
</div>
</div>
</template>
4 changes: 4 additions & 0 deletions src/components/standalone/SideMenu.vue
Original file line number Diff line number Diff line change
Expand Up @@ -129,6 +129,10 @@ const navigation: Ref<MenuItem[]> = ref([
{
name: t('standalone.openvpn_tunnel.title'),
to: 'vpn/openvpn-tunnel'
},
{
name: t('standalone.ipsec_tunnel.title'),
to: 'vpn/ipsec-tunnel'
}
]
},
Expand Down
Loading

0 comments on commit fb3bfaf

Please sign in to comment.