diff --git a/dashboard/public/views/domains.html b/dashboard/public/views/domains.html
index ece0f69ce..92a8e6cf3 100644
--- a/dashboard/public/views/domains.html
+++ b/dashboard/public/views/domains.html
@@ -51,16 +51,17 @@
           </div>
 
           <!-- Google Cloud DNS -->
-          <div class="form-group" ng-class="{ 'has-error': false }" ng-show="domainConfigure.provider === 'gcdns'">
-            <label class="control-label">{{ 'domains.domainDialog.gcdnsServiceAccountKey' | tr }}</label>
+          <FormGroup v-if="domainConfigure.provider === 'gcdns'">
+            <label for="gcdnsKeyFileInput">{{ 'domains.domainDialog.gcdnsServiceAccountKey' | tr }}</label>
+            <!-- TODO replace with a pankow input group -->
             <div class="input-group">
               <input type="file" id="gcdnsKeyFileInput" style="display:none"/>
-              <input type="text" class="form-control" placeholder="Service Account Key" ng-model="domainConfigure.gcdnsKey.keyFileName" id="gcdnsKeyInput" name="cert" onclick="getElementById('gcdnsKeyFileInput').click();" style="cursor: pointer;" ng-disabled="domainConfigure.busy" ng-required="domainConfigure.provider === 'gcdns'">
+              <input type="text" class="form-control" placeholder="Service Account Key" v-model="gcdnsKeyFileName" id="gcdnsKeyInput" onclick="getElementById('gcdnsKeyFileInput').click();" style="cursor: pointer;" required>
               <span class="input-group-addon">
                 <i class="fa fa-upload" onclick="getElementById('gcdnsKeyFileInput').click();"></i>
               </span>
             </div>
-          </div>
+          </FormGroup>
 
           <!-- DigitalOcean -->
           <div class="form-group" ng-class="{ 'has-error': false }" ng-show="domainConfigure.provider === 'digitalocean'">
diff --git a/dashboard/src/components/DomainDialog.vue b/dashboard/src/components/DomainDialog.vue
index 67ff1b486..1b93306c0 100644
--- a/dashboard/src/components/DomainDialog.vue
+++ b/dashboard/src/components/DomainDialog.vue
@@ -63,10 +63,14 @@ const gandiTokenType = ref('ApiKey');
 const gandiApiKey = ref('');
 const godaddyApiKey = ref('');
 const godaddyApiSecret = ref('');
+// user just uploads a ServiceAccount.json which we then open and assign
+const gcdnsProjectId = ref('');
+const gcdnsClientEmail = ref('');
+const gcdnsPrivateKey = ref('');
 const netcupCustomerNumber = ref('');
 const netcupApiKey = ref('');
 const netcupApiPassword = ref('');
-const ovhEndpoint = ref('');
+const ovhEndpoint = ref(ENDPOINTS_OVH[0].value);
 const ovhConsumerKey = ref('');
 const ovhAppKey = ref('');
 const ovhAppSecret = ref('');
@@ -121,6 +125,12 @@ async function onSubmit() {
     config.accessKeyId = accessKeyId.value;
     config.secretAccessKey = secretAccessKey.value;
   } else if (provider.value === 'gcdns') {
+    config.projectId = gcdnsProjectId.value;
+    config.credentials = {
+      client_email: gcdnsClientEmail.value,
+      private_key: gcdnsPrivateKey.value
+    };
+
     // TODO
       // try {
       //     var serviceAccountKey = JSON.parse($scope.domainConfigure.gcdnsKey.content);
@@ -210,6 +220,20 @@ async function onSubmit() {
   busy.value = false;
 }
 
+function onGcdnsFileInputChange(event) {
+  const reader = new FileReader();
+  reader.onload = function (result) {
+    if (!result.target || !result.target.result) return console.error('Unable to read local file');
+    console.log(result.target.result);
+    const serviceAccount = JSON.parse(result.target.result);
+    console.log(serviceAccount)
+    gcdnsProjectId.value = serviceAccount.project_id;
+    gcdnsClientEmail.value = serviceAccount.client_email;
+    gcdnsPrivateKey.value = serviceAccount.private_key;
+  };
+  reader.readAsText(event.target.files[0]);
+}
+
 defineExpose({
   open(d) {
     console.log(d);
@@ -225,6 +249,10 @@ defineExpose({
     provider.value = d.provider || '';
     tlsProvider.value = d.tlsConfig.provider || 'letsencrypt-prod-wildcard';
 
+    gcdnsProjectId.value = (d.provider === 'gcdns' && d.config.projectId) || '';
+    gcdnsClientEmail.value = (d.provider === 'gcdns' && d.config?.credentials.client_email) || '';
+    gcdnsPrivateKey.value = (d.provider === 'gcdns' && d.config?.credentials.private_key) || '';
+
     // TODO
 // $scope.domainConfigure.gcdnsKey.keyFileName = '';
 // $scope.domainConfigure.gcdnsKey.content = '';
@@ -248,7 +276,7 @@ defineExpose({
     netcupCustomerNumber.value = (d.provider === 'netcup' && d.config.customerNumber) || '';
     netcupApiKey.value = (d.provider === 'netcup' && d.config.apiKey) || '';
     netcupApiPassword.value = (d.provider === 'netcup' && d.config.apiPassword) || '';
-    ovhEndpoint.value = (d.provider === 'ovh' && d.config.endpoint) || '';
+    ovhEndpoint.value = (d.provider === 'ovh' && d.config.endpoint) || ENDPOINTS_OVH[0].value;
     ovhConsumerKey.value = (d.provider === 'ovh' && d.config.consumerKey) || '';
     ovhAppKey.value = (d.provider === 'ovh' && d.config.appKey) || '';
     ovhAppSecret.value = (d.provider === 'ovh' && d.config.appSecret) || '';
@@ -322,8 +350,8 @@ defineExpose({
         <FormGroup v-if="provider === 'gcdns'">
           <label class="control-label">{{ $t('domains.domainDialog.gcdnsServiceAccountKey') }}</label>
           <div class="input-group">
-            <input type="file" id="gcdnsKeyFileInput" style="display:none"/>
-            <input type="text" class="form-control" placeholder="Service Account Key" ng-model="domainConfigure.gcdnsKey.keyFileName" id="gcdnsKeyInput" name="cert" onclick="getElementById('gcdnsKeyFileInput').click();" style="cursor: pointer;" ng-disabled="domainConfigure.busy" ng-required="domainConfigure.provider === 'gcdns'">
+            <input type="file" id="gcdnsKeyFileInput" style="display:none" @change="onGcdnsFileInputChange"/>
+            <input type="text" class="form-control" placeholder="Service Account Key" v-model="gcdnsProjectId" onclick="getElementById('gcdnsKeyFileInput').click();" style="cursor: pointer;" ng-disabled="domainConfigure.busy" ng-required="domainConfigure.provider === 'gcdns'">
             <span class="input-group-addon">
               <i class="fa fa-upload" onclick="getElementById('gcdnsKeyFileInput').click();"></i>
             </span>
diff --git a/dashboard/src/views/DomainsView.vue b/dashboard/src/views/DomainsView.vue
index 67d622377..4aa5582ba 100644
--- a/dashboard/src/views/DomainsView.vue
+++ b/dashboard/src/views/DomainsView.vue
@@ -138,7 +138,7 @@ onMounted(async () => {
 
       <p>{{ $t('domains.domainDialog.addDescription') }}</p>
 
-      <TableView :model="filteredDomains" :columns="columns" style="max-height: 900px;" @row-click="onEdit">
+      <TableView :model="filteredDomains" :columns="columns" style="max-height: 400px;" @row-click="onEdit">
         <template #provider="domain">
           {{ prettyProviderName(domain) }}
         </template>