feat(tf): add ui

api/projects/terraform_inventory.go

@@ -2,10 +2,13 @@
 
 package projects
 
-import "net/http"
+import (
+	"github.com/semaphoreui/semaphore/api/helpers"
+	"net/http"
+)
 
 func GetTerraformInventoryAliases(w http.ResponseWriter, r *http.Request) {
-	w.WriteHeader(http.StatusNotFound)
+	helpers.WriteJSON(w, http.StatusOK, []string{})
 }
 
 func AddTerraformInventoryAlias(w http.ResponseWriter, r *http.Request) {

api/router.go

@@ -504,7 +504,8 @@ func getSystemInfo(w http.ResponseWriter, r *http.Request) {
 		"use_remote_runner": util.Config.UseRemoteRunner,
 
 		"premium_features": map[string]bool{
-			"project_runners": false,
+			"project_runners":   false,
+			"terraform_backend": false,
 		},
 	}
 

web/src/views/project/TemplateView.vue

@@ -79,7 +79,7 @@
       </v-btn>
     </v-toolbar>
 
-    <v-tabs class="mb-4 ml-4">
+    <v-tabs class="ml-4">
       <v-tab
         :to="`/project/${item.project_id}${
           $route.params.viewId ? `/views/${$route.params.viewId}` : ''
@@ -103,6 +103,7 @@
       :inventory="inventory"
       :environment="environment"
       :repositories="repositories"
+      :premium-features="premiumFeatures"
     ></router-view>
   </div>
 </template>
@@ -133,6 +134,7 @@ export default {
   props: {
     projectId: Number,
     userPermissions: Number,
+    premiumFeatures: Object,
   },
 
   mixins: [PermissionsCheck],

web/src/views/project/template/TemplateTerraformState.vue

@@ -1,30 +1,103 @@
 <template>
-  <v-alert
-    type="info"
-    text
-    color="hsl(348deg, 86%, 61%)"
-    style="border-radius: 0;"
-  >
-    Terraform/OpenTofu HTTP backend available only in <b>PRO</b> version.
-    <v-btn
-      class="ml-2"
+  <div>
+    <v-alert
+      type="info"
+      text
       color="hsl(348deg, 86%, 61%)"
-      href="https://semaphoreui.com/pro"
-    >Upgrade</v-btn>
-  </v-alert>
+      style="border-radius: 0;"
+      v-if="!premiumFeatures.terraform_backend"
+    >
+      Terraform/OpenTofu HTTP backend available only in <b>PRO</b> version.
+      <v-btn
+        class="ml-2"
+        color="hsl(348deg, 86%, 61%)"
+        href="https://semaphoreui.com/pro"
+      >Upgrade</v-btn>
+    </v-alert>
+
+    <div class="px-4 py-3">
+      <div v-for="alias of (aliases || [])" :key="alias.id">
+        <code class="mr-2">{{ alias.url }}</code>
+        <v-btn icon
+               @click="copyToClipboard(alias.url, $t('aliasUrlCopied'))">
+          <v-icon>mdi-content-copy</v-icon>
+        </v-btn>
+        <v-btn icon @click="deleteAlias(alias.id)" :disabled="!premiumFeatures.terraform_backend">
+          <v-icon>mdi-delete</v-icon>
+        </v-btn>
+      </div>
+
+      <v-btn color="primary" @click="addAlias()" :disabled="(aliases || []).length === 0">
+        {{ aliases == null ? $t('LoadAlias') : $t('AddAlias') }}
+      </v-btn>
+    </div>
+
+  </div>
 </template>
 <script>
 
+import axios from 'axios';
+import EventBus from '@/event-bus';
+
 export default {
   props: {
     template: Object,
     repositories: Array,
     inventory: Array,
     environment: Array,
+    premiumFeatures: Object,
   },
+
   data() {
     return {
+      aliases: null,
     };
   },
+
+  async created() {
+    await this.loadAliases();
+  },
+
+  methods: {
+    async loadAliases() {
+      this.aliases = (await axios({
+        method: 'get',
+        url: `/api/project/${this.template.project_id}/inventory/${this.template.id}/terraform/aliases`,
+        responseType: 'json',
+      })).data;
+    },
+
+    async deleteAlias(alias) {
+      await axios({
+        method: 'delete',
+        url: `/api/project/${this.template.project_id}/inventory/${this.template.inventory_id}/terraform/aliases/${alias}`,
+      });
+      await this.loadAliases();
+    },
+
+    async copyToClipboard(text) {
+      try {
+        await window.navigator.clipboard.writeText(text);
+        EventBus.$emit('i-snackbar', {
+          color: 'success',
+          text: 'The command has been copied to the clipboard.',
+        });
+      } catch (e) {
+        EventBus.$emit('i-snackbar', {
+          color: 'error',
+          text: `Can't copy the command: ${e.message}`,
+        });
+      }
+    },
+
+    async addAlias() {
+      await axios({
+        method: 'post',
+        url: `/api/project/${this.template.project_id}/inventory/${this.template.inventory_id}/terraform/aliases`,
+        responseType: 'json',
+      });
+      await this.loadAliases();
+    },
+  },
 };
 </script>