Do not share relay provider setting with view and form

Fixes #866

dashboard/src/components/MailRelaySettingsItem.vue

@@ -7,7 +7,9 @@ import MailModel from '../models/MailModel.js';
 import { RELAY_PROVIDERS } from '../constants.js';
 import { prettyRelayProviderName } from '../utils';
 
-const props = defineProps(['domain']);
+const props = defineProps({
+  domain: { type: String, required: true }
+});
 
 const mailModel = MailModel.create();
 
@@ -21,6 +23,7 @@ const dialog = useTemplateRef('dialog');
 const busy = ref(false);
 const formError = ref('');
 const adminDomain = ref('');
+const currentProvider = ref('cloudron-smtp');
 const provider = ref('cloudron-smtp');
 const host = ref('');
 const port = ref(1);
@@ -130,6 +133,8 @@ async function onSubmit() {
     return console.error(error);
   }
 
+  currentProvider.value = provider.value;
+
   dialog.value.close();
 
   busy.value = false;
@@ -140,6 +145,7 @@ onMounted(async () => {
   if (error) return console.error(error);
 
   provider.value = result.relay.provider;
+  currentProvider.value = result.relay.provider;
 });
 
 </script>
@@ -207,7 +213,7 @@ onMounted(async () => {
       <FormGroup>
         <label>{{ $t('email.outbound.title') }} <sup><a href="https://docs.cloudron.io/email/#relay-outbound-mails" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
         <div>
-          <b>{{ prettyRelayProviderName(provider) }}</b> - <span v-html="$t('email.outbound.description')"></span>
+          <b>{{ prettyRelayProviderName(currentProvider) }}</b> - <span v-html="$t('email.outbound.description')"></span>
         </div>
       </FormGroup>
       <div style="display: flex; align-items: center;">