Display discoverUrl as copyable input

dashboard/src/views/UserDirectoryOpenIdProviderView.vue

@@ -41,7 +41,7 @@ const inputDialog = useTemplateRef('inputDialog');
 const editDialog = useTemplateRef('editDialog');
 
 const clients = ref([]);
-const adminFqdn = ref('');
+const discoveryUrl = ref('');
 
 // edit or add
 const submitBusy = ref(false);
@@ -129,7 +129,7 @@ onMounted(async () => {
   const [error, result] = await dashboardModel.config();
   if (error) return console.error(error);
 
-  adminFqdn.value = result.adminFqdn;
+  discoveryUrl.value = `https://${result.adminFqdn}/.well-known/openid-configuration`;
 
   await refresh();
 });
@@ -195,10 +195,13 @@ onMounted(async () => {
         <Button @click="onAdd()" icon="fa-solid fa-plus">{{ $t('oidc.clients.newClient') }}</Button>
       </template>
 
-      <div class="info-row">
-        <div class="info-label">{{ $t('oidc.env.discoveryUrl') }} <sup><a href="https://docs.cloudron.io/user-directory/#endpoints" target="_blank"><i class="fa fa-question-circle"></i></a></sup></div>
-        <div class="info-value">https://{{ adminFqdn }}/.well-known/openid-configuration</div>
-      </div>
+      <FormGroup>
+        <label for="discoverUrlInput">{{ $t('oidc.env.discoveryUrl') }} <sup><a href="https://docs.cloudron.io/user-directory/#endpoints" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
+        <InputGroup>
+          <TextInput id="discoveryUrlInput" v-model="discoveryUrl" readonly style="flex-grow: 1;"/>
+          <Button tool @click="onCopyToClipboard(discoveryUrl)" icon="fa fa-clipboard" />
+        </InputGroup>
+      </FormGroup>
 
       <br/>