Add actions to the resource admin view

#88

src/components/parameter-schema/form-mode/ParameterGroupForm.vue

@@ -65,7 +65,6 @@ function parameterRequired(
 watch(
   formInput,
   (newVal) => {
-    //console.log("Group", props.parameterGroupName, newVal);
     emit("update:modelValue", newVal);
   },
   {

src/components/resources/modals/CreateResourceModal.vue

@@ -60,7 +60,6 @@ function createResource() {
           error.body["detail"] ===
             `Resource with name '${resource.name}' already exists`
         ) {
-          console.log(`Resource with name ${resource.name} already exists`);
           formState.resourceNameTaken = true;
           resourceNameElement.value?.setCustomValidity(
             "Resource name is already taken",

src/stores/resources.ts

@@ -37,6 +37,25 @@ export const useResourceStore = defineStore({
     },
   },
   actions: {
+    fetchResource(
+      resource_id: string,
+      versionStatus?: Status[],
+    ): Promise<ResourceOut> {
+      return ResourceService.resourceGetResource(
+        resource_id,
+        versionStatus,
+      ).then((resource) => {
+        const nameStore = useNameStore();
+        nameStore.addNameToMapping(resource.resource_id, resource.name);
+        for (const version of resource.versions) {
+          nameStore.addNameToMapping(
+            version.resource_version_id,
+            version.release,
+          );
+        }
+        return resource;
+      });
+    },
     fetchResources(
       maintainerId?: string,
       versionStatus?: Status[],
@@ -100,20 +119,9 @@ export const useResourceStore = defineStore({
       if (this.ownResourceMapping[resource_id]) {
         onFinally?.();
       }
-      return ResourceService.resourceGetResource(
-        resource_id,
-        Object.values(Status),
-      )
+      return this.fetchResource(resource_id, Object.values(Status))
         .then((resource) => {
           this.ownResourceMapping[resource.resource_id] = resource;
-          const nameStore = useNameStore();
-          nameStore.addNameToMapping(resource.resource_id, resource.name);
-          for (const version of resource.versions) {
-            nameStore.addNameToMapping(
-              version.resource_version_id,
-              version.release,
-            );
-          }
           return resource;
         })
         .finally(onFinally);
@@ -236,5 +244,29 @@ export const useResourceStore = defineStore({
         return changedVersion;
       });
     },
+    setLatestResource(
+      resourceVersion: ResourceVersionOut,
+    ): Promise<ResourceVersionOut> {
+      return ResourceVersionService.resourceVersionResourceVersionLatest(
+        resourceVersion.resource_id,
+        resourceVersion.resource_version_id,
+      );
+    },
+    deleteOnCluster(
+      resourceVersion: ResourceVersionOut,
+    ): Promise<ResourceVersionOut> {
+      return ResourceVersionService.resourceVersionDeleteResourceVersionCluster(
+        resourceVersion.resource_id,
+        resourceVersion.resource_version_id,
+      );
+    },
+    deleteInS3(
+      resourceVersion: ResourceVersionOut,
+    ): Promise<ResourceVersionOut> {
+      return ResourceVersionService.resourceVersionDeleteResourceVersionS3(
+        resourceVersion.resource_id,
+        resourceVersion.resource_version_id,
+      );
+    },
   },
 });

src/views/admin/AdminResourcesView.vue

@@ -3,6 +3,7 @@ import { useResourceStore } from "@/stores/resources";
 import { reactive } from "vue";
 import {
   type ResourceOut,
+  type ResourceVersionOut,
   Status,
 } from "@/client/resource";
 import SearchUserModal from "@/components/modals/SearchUserModal.vue";
@@ -53,6 +54,66 @@ function searchResources() {
     });
 }
 
+function replaceResourceVersion(
+  resourceVersion: ResourceVersionOut,
+): ResourceVersionOut {
+  const resourceIndex = resourceState.resources.findIndex(
+    (r) => r.resource_id == resourceVersion.resource_id,
+  );
+  if (resourceIndex > -1) {
+    const versionIndex = resourceState.resources[
+      resourceIndex
+    ].versions.findIndex(
+      (r) => r.resource_version_id == resourceVersion.resource_version_id,
+    );
+    if (versionIndex > -1) {
+      resourceState.resources[resourceIndex].versions[versionIndex] =
+        resourceVersion;
+    }
+  }
+  return resourceVersion;
+}
+
+function setLatest(resourceVersion: ResourceVersionOut) {
+  resourceState.loading = true;
+  resourceRepository
+    .setLatestResource(resourceVersion)
+    .then(replaceResourceVersion)
+    .finally(() => {
+      resourceState.loading = false;
+    });
+}
+
+function deleteOnCluster(resourceVersion: ResourceVersionOut) {
+  resourceState.loading = true;
+  resourceRepository
+    .deleteOnCluster(resourceVersion)
+    .then(replaceResourceVersion)
+    .finally(() => {
+      resourceState.loading = false;
+    });
+}
+
+function deleteInS3(resourceVersion: ResourceVersionOut) {
+  resourceState.loading = true;
+  resourceRepository
+    .deleteInS3(resourceVersion)
+    .then(replaceResourceVersion)
+    .finally(() => {
+      resourceState.loading = false;
+    });
+}
+
+function syncToCluster(resourceVersion: ResourceVersionOut) {
+  resourceState.loading = true;
+  resourceRepository
+    .syncResource(resourceVersion)
+    .then(replaceResourceVersion)
+    .finally(() => {
+      resourceState.loading = false;
+    });
+}
+
 function resetForm() {
   resourceState.maintainerId = "";
   resourceState.searchString = "";
@@ -136,7 +197,12 @@ function resetForm() {
     >
       Search
     </button>
-    <button type="button" class="btn-primary btn w-fit ms-4" @click="resetForm">
+    <button
+      type="button"
+      class="btn-primary btn w-fit ms-4"
+      :disabled="resourceState.loading"
+      @click="resetForm"
+    >
       Reset
     </button>
   </form>
@@ -213,21 +279,61 @@ function resetForm() {
                         class="btn btn-secondary dropdown-toggle dropdown-toggle-split"
                         data-bs-toggle="dropdown"
                         aria-expanded="false"
+                        :disabled="resourceState.loading"
                       >
                         <span class="visually-hidden">Toggle Dropdown</span>
                       </button>
                       <ul class="dropdown-menu">
-                        <li><a class="dropdown-item" href="#">Action</a></li>
-                        <li>
-                          <a class="dropdown-item" href="#">Another action</a>
+                        <li v-if="version.status === Status.SYNCHRONIZED">
+                          <button
+                            class="dropdown-item"
+                            type="button"
+                            @click="setLatest(version)"
+                          >
+                            Set to Latest
+                          </button>
+                        </li>
+                        <li
+                          v-if="
+                            version.status === Status.CLUSTER_DELETED ||
+                            version.status === Status.SYNC_REQUESTED
+                          "
+                        >
+                          <button
+                            class="dropdown-item"
+                            type="button"
+                            @click="syncToCluster(version)"
+                          >
+                            <font-awesome-icon
+                              icon="fa-solid fa-cloud-arrow-down"
+                            />
+                            <span class="ms-1">Sync to Cluster</span>
+                          </button>
                         </li>
-                        <li>
-                          <a class="dropdown-item" href="#"
-                            >Something else here</a
+                        <li
+                          v-if="
+                            version.status === Status.SYNCHRONIZED ||
+                            version.status === Status.LATEST
+                          "
+                        >
+                          <button
+                            class="dropdown-item text-danger align-middle"
+                            type="button"
+                            @click="deleteOnCluster(version)"
                           >
+                            <font-awesome-icon icon="fa-solid fa-trash" />
+                            <span class="ms-1">Delete on Cluster</span>
+                          </button>
                         </li>
-                        <li>
-                          <a class="dropdown-item" href="#">Separated link</a>
+                        <li v-if="version.status === Status.CLUSTER_DELETED">
+                          <button
+                            class="dropdown-item text-danger align-middle"
+                            type="button"
+                            @click="deleteInS3(version)"
+                          >
+                            <font-awesome-icon icon="fa-solid fa-trash" />
+                            <span class="ms-1">Delete in S3</span>
+                          </button>
                         </li>
                       </ul>
                     </div>

src/views/resources/ReviewResourceView.vue

@@ -161,8 +161,8 @@ onMounted(() => {
       </template>
     </tbody>
   </table>
-  <div v-else>
-    <p>Hello</p>
+  <div v-else class="text-center mt-5 fs-4">
+    There are currently no Resources to review
   </div>
 </template>