Merge pull request #2681 from threefoldtech/development_enable_ipvs_smtp

Enable SMTP only with public ipv4

packages/playground/src/components/smtp_server.vue

@@ -5,6 +5,9 @@
       <p v-else>Configure your SMTP Server.</p>
     </v-alert>
 
+    <v-alert variant="tonal" type="warning" class="mt-3">
+      SMTP functionality requires IPv4. Enabling SMTP will automatically activate IPv4.
+    </v-alert>
     <input-tooltip
       v-if="!persistent"
       inline
@@ -31,6 +34,7 @@
             v-model="$props.modelValue.username"
             v-bind="props"
             autofocus
+            class="mt-3"
           />
         </input-tooltip>
       </input-validator>

packages/playground/src/weblets/tf_discourse.vue

@@ -58,7 +58,7 @@
           :medium="{ cpu: 2, memory: 4, disk: 50 }"
           :large="{ cpu: 4, memory: 16, disk: 100 }"
         />
-        <Networks v-model:mycelium="mycelium" />
+        <Networks v-model:mycelium="mycelium" v-model:ipv4="ipv4" />
 
         <input-tooltip inline tooltip="Click to know more about dedicated machines." :href="manual.dedicated_machines">
           <v-switch color="primary" inset label="Dedicated" v-model="dedicated" hide-details />
@@ -101,7 +101,7 @@
 import type { GridClient } from "@threefold/grid_client";
 import { Buffer } from "buffer";
 import TweetNACL from "tweetnacl";
-import { computed, type Ref, ref } from "vue";
+import { computed, type Ref, ref, watch } from "vue";
 
 import { manual } from "@/utils/manual";
 
@@ -236,6 +236,23 @@ function generatePubKey(): string {
 function updateSSHkeyEnv(selectedKeys: string) {
   selectedSSHKeys.value = selectedKeys;
 }
+
+watch(
+  () => smtp.value.enabled,
+  newValue => {
+    if (newValue) {
+      ipv4.value = true;
+    }
+  },
+);
+watch(
+  () => ipv4.value,
+  newValue => {
+    if (!newValue && smtp.value.enabled) {
+      smtp.value.enabled = false;
+    }
+  },
+);
 </script>
 
 <script lang="ts">

packages/playground/src/weblets/tf_mattermost.vue

@@ -42,7 +42,7 @@
           :medium="{ cpu: 2, memory: 4, disk: 50 }"
           :large="{ cpu: 4, memory: 16, disk: 100 }"
         />
-        <Networks v-model:mycelium="mycelium" />
+        <Networks v-model:mycelium="mycelium" v-model:ipv4="ipv4" />
 
         <input-tooltip inline tooltip="Click to know more about dedicated machines." :href="manual.dedicated_machines">
           <v-switch color="primary" inset label="Dedicated" v-model="dedicated" hide-details />
@@ -68,7 +68,6 @@
 
         <manage-ssh-deployemnt @selected-keys="updateSSHkeyEnv($event)" />
       </template>
-
       <template #smtp>
         <SmtpServer v-model="smtp" />
       </template>
@@ -82,7 +81,7 @@
 
 <script lang="ts" setup>
 import type { GridClient } from "@threefold/grid_client";
-import { computed, type Ref, ref } from "vue";
+import { computed, type Ref, ref, watch } from "vue";
 
 import { manual } from "@/utils/manual";
 
@@ -218,6 +217,23 @@ async function deploy() {
 function updateSSHkeyEnv(selectedKeys: string) {
   selectedSSHKeys.value = selectedKeys;
 }
+
+watch(
+  () => smtp.value.enabled,
+  newValue => {
+    if (newValue) {
+      ipv4.value = true;
+    }
+  },
+);
+watch(
+  () => ipv4.value,
+  newValue => {
+    if (!newValue && smtp.value.enabled) {
+      smtp.value.enabled = false;
+    }
+  },
+);
 </script>
 
 <script lang="ts">

packages/playground/src/weblets/tf_owncloud.vue

@@ -121,7 +121,7 @@
 
 <script lang="ts" setup>
 import type { GridClient } from "@threefold/grid_client";
-import { computed, type Ref, ref } from "vue";
+import { computed, type Ref, ref, watch } from "vue";
 
 import { manual } from "@/utils/manual";
 
@@ -264,6 +264,22 @@ async function deploy() {
 function updateSSHkeyEnv(selectedKeys: string) {
   selectedSSHKeys.value = selectedKeys;
 }
+watch(
+  () => smtp.value.enabled,
+  newValue => {
+    if (newValue) {
+      ipv4.value = true;
+    }
+  },
+);
+watch(
+  () => ipv4.value,
+  newValue => {
+    if (!newValue && smtp.value.enabled) {
+      smtp.value.enabled = false;
+    }
+  },
+);
 </script>
 
 <script lang="ts">

packages/playground/src/weblets/tf_taiga.vue

@@ -90,7 +90,7 @@
           :small="{ cpu: 2, memory: 4, disk: 100 }"
           :medium="{ cpu: 4, memory: 8, disk: 150 }"
         />
-        <Networks v-model:mycelium="mycelium" />
+        <Networks v-model:mycelium="mycelium" v-model:ipv4="ipv4" />
 
         <input-tooltip inline tooltip="Click to know more about dedicated machines." :href="manual.dedicated_machines">
           <v-switch color="primary" inset label="Dedicated" v-model="dedicated" hide-details />
@@ -132,7 +132,7 @@
 
 <script lang="ts" setup>
 import type { GridClient } from "@threefold/grid_client";
-import { computed, type Ref, ref } from "vue";
+import { computed, type Ref, ref, watch } from "vue";
 
 import { manual } from "@/utils/manual";
 
@@ -274,6 +274,23 @@ async function deploy() {
 function updateSSHkeyEnv(selectedKeys: string) {
   selectedSSHKeys.value = selectedKeys;
 }
+
+watch(
+  () => smtp.value.enabled,
+  newValue => {
+    if (newValue) {
+      ipv4.value = true;
+    }
+  },
+);
+watch(
+  () => ipv4.value,
+  newValue => {
+    if (!newValue && smtp.value.enabled) {
+      smtp.value.enabled = false;
+    }
+  },
+);
 </script>
 
 <script lang="ts">