From bea53994c435ace0461df6554278d66b43b62da3 Mon Sep 17 00:00:00 2001
From: axolotle <nchesnais@mailoo.org>
Date: Fri, 29 Sep 2023 19:49:28 +0200
Subject: [PATCH] domain: add third domain add choice for local/test domains

---
 app/src/i18n/locales/en.json           |  2 +
 app/src/views/_partials/DomainForm.vue | 53 +++++++++++++++++++++++---
 2 files changed, 50 insertions(+), 5 deletions(-)

diff --git a/app/src/i18n/locales/en.json b/app/src/i18n/locales/en.json
index 083c893c..78cb698b 100644
--- a/app/src/i18n/locales/en.json
+++ b/app/src/i18n/locales/en.json
@@ -247,6 +247,8 @@
             "from_registrar_desc": "You will need to manually configure DNS records on your registrar to finalize this domain's configuration. YunoHost's diagnosis will guide you about what DNS records to configure exactly.",
             "from_yunohost": "I don't own a domain, I want to register/use a free DynDNS domain provided by the YunoHost project",
             "from_yunohost_desc": "The YunoHost project maintains a free 'DynDNS' service. It is limited to one such domain per server (though you can also add sub-domains later using the other 'Add a domain I own, or a subdomain' option above). The DNS configuration will be automatically handled by YunoHost. This is ideal when starting up with self-hosting in general and you don't want to invest in a domain name yet. However, on the medium/long-term, we recommend buying your very own domain name to some registrar to have full ownership of your domain.",
+            "from_local": "I want a domain for local usage / test only",
+            "from_local_desc": "if you don't want an \"actual\" public domain name, you can use anything ending in <code>.local</code> or <code>.test</code>. Domain names ending in <code>.local</code> are special in the sense that they may automatically be resolved on the local network, assuming the clients support the Bonjour protocol. Alternatively, you may need to tweak the <code>/etc/hosts</code> file (or equivalent on Windows) on every client that you want to use this domain from, or to configure local DNS entries on your internet router.",
             "dyn_dns_password": "Domain recovery password",
             "dyn_dns_password_desc": "This password will allow you to later recover control of the domain if you reinstall your system. If you already registered this domain previously, use your recovery password here to reclaim it."
         },
diff --git a/app/src/views/_partials/DomainForm.vue b/app/src/views/_partials/DomainForm.vue
index c639db3b..54c719e3 100644
--- a/app/src/views/_partials/DomainForm.vue
+++ b/app/src/views/_partials/DomainForm.vue
@@ -13,6 +13,7 @@
       :class="domainIsVisible ? null : 'collapsed'"
       :aria-expanded="domainIsVisible ? 'true' : 'false'"
       aria-controls="collapse-domain"
+      class="mb-2"
     >
       {{ $t('domain.add.from_registrar') }}
     </b-form-radio>
@@ -35,13 +36,14 @@
       :class="dynDomainIsVisible ? null : 'collapsed'"
       :aria-expanded="dynDomainIsVisible ? 'true' : 'false'"
       aria-controls="collapse-dynDomain"
+      class="mb-2"
     >
       {{ $t('domain.add.from_yunohost') }}
     </b-form-radio>
 
     <b-collapse id="collapse-dynDomain" :visible.sync="dynDomainIsVisible">
       <p class="mt-2 alert alert-info">
-        <icon iname='info-circle' />
+        <icon iname="info-circle" />
         {{ $t('domain.add.from_yunohost_desc') }}
       </p>
 
@@ -64,6 +66,28 @@
       />
     </b-collapse>
     <div v-if="dynDnsForbiden" class="alert alert-warning mt-2" v-html="$t('domain_add_dyndns_forbidden')" />
+
+    <b-form-radio
+      v-model="selected" name="domain-type" value="localDomain"
+      :class="localDomainIsVisible ? null : 'collapsed'"
+      :aria-expanded="localDomainIsVisible ? 'true' : 'false'"
+      aria-controls="collapse-localDomain"
+    >
+      {{ $t('domain.add.from_local') }}
+    </b-form-radio>
+
+    <b-collapse id="collapse-localDomain" :visible.sync="localDomainIsVisible">
+      <p class="mt-2 alert alert-info">
+        <icon iname='info-circle' />
+        <span v-html="$t('domain.add.from_local_desc')" />
+      </p>
+
+      <form-field v-bind="fields.localDomain" :validation="$v.form.localDomain" class="mt-3">
+        <template #default="{ self }">
+          <adress-input-select v-bind="self" v-model="form.localDomain" />
+        </template>
+      </form-field>
+    </b-collapse>
   </card-form>
 </template>
 
@@ -92,7 +116,8 @@ export default {
         domain: '',
         dynDomain: { localPart: '', separator: '.', domain: 'nohost.me' },
         dynDomainPassword: '',
-        dynDomainPasswordConfirmation: ''
+        dynDomainPasswordConfirmation: '',
+        localDomain: { localPart: '', separator: '.', domain: 'local' },
       },
 
       fields: {
@@ -108,7 +133,7 @@ export default {
           label: this.$i18n.t('domain_name'),
           props: {
             id: 'dyn-domain',
-            placeholder: this.$i18n.t('myserver'),
+            placeholder: this.$i18n.t('placeholder.domain').split(".")[0],
             type: 'domain',
             choices: ['nohost.me', 'noho.st', 'ynh.fr']
           }
@@ -131,6 +156,16 @@ export default {
             placeholder: '••••••••',
             type: 'password'
           }
+        },
+
+        localDomain: {
+          label: this.$i18n.t('domain_name'),
+          props: {
+            id: 'dyn-domain',
+            placeholder: this.$i18n.t('placeholder.domain').split(".")[0],
+            type: 'domain',
+            choices: ['local', 'test']
+          }
         }
       }
     }
@@ -153,14 +188,22 @@ export default {
 
     dynDomainIsVisible () {
       return this.selected === 'dynDomain'
+    },
+
+    localDomainIsVisible () {
+      return this.selected === 'localDomain'
     }
   },
 
   validations () {
     return {
       selected: { required },
-      form: this.selected === 'domain'
-        ? { domain: { required, domain } }
+      form: ['domain', 'localDomain'].includes(this.selected)
+        ? {
+          [this.selected]: this.selected === 'domain'
+            ? { required, domain }
+            : { localPart: { required, dynDomain } }
+        }
         : {
           dynDomain: { localPart: { required, dynDomain } },
           dynDomainPassword: { passwordLenght: minLength(8) },