Add ability to install one of the available frontends

src/api/settings.js

@@ -77,13 +77,13 @@ export async function fetchFrontends(authHost, token) {
   })
 }
 
-export async function installFrontend(name, ref, file, buildUrl, buildDir, authHost, token) {
+export async function installFrontend(data, authHost, token) {
   return await request({
     baseURL: baseName(authHost),
     url: `/api/pleroma/admin/frontends/install`,
     method: 'post',
     headers: authHeaders(token),
-    data: { name, ref, file, build_url: buildUrl, build_dir: buildDir }
+    data
   })
 }
 

src/store/modules/settings.js

@@ -4,6 +4,7 @@ import {
   fetchFrontends,
   fetchSettings,
   getInstanceDocument,
+  installFrontend,
   removeSettings,
   updateInstanceDocument,
   updateSettings } from '@/api/settings'
@@ -121,6 +122,12 @@ const settings = {
       commit('TOGGLE_TABS', false)
       commit('SET_LOADING', false)
     },
+    async InstallFrontend({ commit, getters }, { name, _ref, _file, _buildUrl, _buildDir }) {
+      const { data } = _ref
+        ? await installFrontend({ name, ref: _ref, file: _file, build_url: _buildUrl, build_dir: _buildDir }, getters.authHost, getters.token)
+        : await installFrontend({ name }, getters.authHost, getters.token)
+      commit('SET_FRONTENDS', data)
+    },
     async RemoveInstanceDocument({ dispatch, getters }, name) {
       await deleteInstanceDocument(name, getters.authHost, getters.token)
       await dispatch('FetchInstanceDocument', name)

src/views/settings/components/Frontend.vue

@@ -21,7 +21,7 @@
             prop="installed">
             <template slot-scope="scope">
               <el-button
-                v-if="!scope.row.installed"
+                v-if="scope.row.installed"
                 disabled
                 type="text"
                 size="small">
@@ -169,6 +169,9 @@ export default {
     await this.$store.dispatch('FetchFrontends')
   },
   methods: {
+    installFrontend({ name }) {
+      this.$store.dispatch('InstallFrontend', { name })
+    },
     async onSubmit() {
       try {
         await this.$store.dispatch('SubmitChanges')