refactor(project): update kong specific endpoints and add models to r…

…esponses

components/KeycloakAuth.vue

@@ -1,4 +1,4 @@
-<script setup>
+<script setup lang="ts">
 const { loggedIn, user, login, logout } = useOidcAuth();
 </script>
 

components/analysis/AnalysisControlButtons.vue

@@ -7,18 +7,34 @@ import {
 } from "~/composables/useAPIFetch";
 
 const props = defineProps({
-  // Have to use null since [String, null] gives an error: "No overload matches this call"
-  analysisStatus: { type: null },
+  analysisStatus: String,
   analysisId: String,
   projectId: String,
 });
 const toast = useToast();
 
-const analysisRunning = ref(isRunning());
+const playButtonActiveStates = [null, "stopped", "stopping"];
+const rerunButtonActiveStates = ["failed", "finished"];
+const stopButtonActiveStates = ["running", "starting", "started"];
+const deleteButtonActiveStates = [
+  "failed",
+  "finished",
+  "stopping",
+  "stopped",
+  "running",
+  "starting",
+  "started",
+];
 
-function isRunning(): boolean {
-  const analysisIsRunning = ["running", "starting", "started"];
-  return analysisIsRunning.includes(props.analysisStatus);
+const buttonStatuses = ref(setButtonStatuses(props.analysisStatus!));
+
+function setButtonStatuses(podStatus: string) {
+  return {
+    playActive: playButtonActiveStates.includes(podStatus),
+    rerunActive: rerunButtonActiveStates.includes(podStatus),
+    stopActive: stopButtonActiveStates.includes(podStatus),
+    deleteActive: deleteButtonActiveStates.includes(podStatus),
+  };
 }
 
 const showFailStart = () => {
@@ -36,21 +52,31 @@ async function onStartAnalysis() {
   analysisProps.project_id = props.projectId!;
   const { data: response, status } = await startAnalysis(analysisProps);
   if (status.value === "success") {
-    console.log(response.value!.run_status);
+    const currentRunStatus = response.value!.status;
+    console.log(currentRunStatus);
+    buttonStatuses.value = setButtonStatuses(currentRunStatus);
   } else {
     showFailStart();
   }
-  analysisRunning.value = !analysisRunning.value;
 }
 
-function onStopAnalysis() {
-  stopAnalysis(props.analysisId!);
-  analysisRunning.value = !analysisRunning;
+async function onStopAnalysis() {
+  const { data: response } = await stopAnalysis(props.analysisId!);
+  const podStatuses = response.value!.status;
+  for (const podName in podStatuses) {
+    setButtonStatuses(podStatuses[podName]);
+  }
 }
 
-function onDeleteAnalysis() {
-  deleteAnalysis(props.analysisId!);
-  analysisRunning.value = !analysisRunning;
+async function onDeleteAnalysis() {
+  const { data: response } = await deleteAnalysis(props.analysisId!);
+  const podStatuses = response.value!.status;
+  for (const podName in podStatuses) {
+    const pp = podStatuses[podName];
+    console.log(pp);
+    setButtonStatuses(pp);
+  }
+  console.log(buttonStatuses);
 }
 </script>
 
@@ -59,10 +85,21 @@ function onDeleteAnalysis() {
     <Button
       icon="pi pi-play"
       aria-label="Start"
+      v-if="buttonStatuses.rerunActive"
+      v-tooltip="'Start the analysis'"
+      severity="success"
+      style="margin-right: 10px"
+      :disabled="!buttonStatuses.playActive"
+      @click="onStartAnalysis()"
+    />
+    <Button
+      icon="pi pi-play"
+      aria-label="Start"
+      v-else
       v-tooltip="'Start the analysis'"
       severity="success"
       style="margin-right: 10px"
-      :disabled="analysisRunning"
+      :disabled="!buttonStatuses.playActive"
       @click="onStartAnalysis()"
     />
     <Button
@@ -71,15 +108,15 @@ function onDeleteAnalysis() {
       v-tooltip="'Stop the analysis'"
       severity="warn"
       style="margin-right: 10px"
-      :disabled="!analysisRunning"
+      :disabled="!buttonStatuses.stopActive"
       @click="onStopAnalysis()"
     />
     <Button
       icon="pi pi-trash"
       aria-label="Delete"
       v-tooltip="'Delete the analysis container'"
       severity="danger"
-      :disabled="!analysisRunning"
+      :disabled="!buttonStatuses.deleteActive"
       @click="onDeleteAnalysis()"
     />
   </div>

components/data-stores/AssociatedProjectTable.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { disconnectRoute } from "~/composables/useAPIFetch";
+import { disconnectProject } from "~/composables/useAPIFetch";
 import { useConfirm } from "primevue/useconfirm";
 
 const props = defineProps({
@@ -9,7 +9,7 @@ const props = defineProps({
 const confirm = useConfirm();
 
 function onConfirmDisconnectProject(foo: string) {
-  disconnectRoute(foo);
+  disconnectProject(foo);
   // window.location.reload();
 }
 

components/data-stores/ProjectBinder.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import Dropdown from "primevue/dropdown";
 import {
-  createRoute,
+  createProject,
   getDataStores,
   getProjects,
 } from "~/composables/useAPIFetch";
@@ -43,7 +43,7 @@ async function onSubmitBinding() {
     methods: selectedAllowedMethods.value,
     ds_type: selectedDataStoreType.value,
   };
-  const { status, error } = await createRoute(props);
+  const { status, error } = await createProject(props);
   if (error && error.value?.statusCode == 409) {
     created.value = "duplicate";
   } else {

composables/useAPIFetch.ts

@@ -2,7 +2,9 @@ import type {
   AllAnalyses,
   AllProjects,
   BodyCreateAnalysisPoPost,
-  BodyCreateRouteBetweenDatastoreAndProjectKongRoutePost,
+  BodyCreateAndConnectProjectToDatastoreKongProjectPost,
+  Disconnect,
+  LinkDataStoreProject,
   ListProjectNodes,
   ListServices,
   Service,
@@ -85,7 +87,7 @@ export const getDataStores = (includeProject: boolean) => {
 };
 
 export const createDataStore = (dataStoreProps: Service) => {
-  return useAPIFetch(`/kong/datastore`, {
+  return useAPIFetch<{ data: Service }>(`/kong/datastore`, {
     method: "POST",
     body: dataStoreProps,
   });
@@ -97,19 +99,22 @@ export const deleteDataStore = (dataStoreName: string) => {
   });
 };
 
-export const createRoute = (
-  routeProps: BodyCreateRouteBetweenDatastoreAndProjectKongRoutePost,
+export const createProject = (
+  routeProps: BodyCreateAndConnectProjectToDatastoreKongProjectPost,
 ) => {
-  return useAPIFetch(`/kong/route`, {
+  return useAPIFetch<{ data: LinkDataStoreProject }>(`/kong/project`, {
     method: "POST",
     body: routeProps,
   });
 };
 
-export const disconnectRoute = (projectId: string) => {
-  return useAPIFetch(`/kong/route/disconnect/${projectId}`, {
-    method: "PUT",
-  });
+export const disconnectProject = (projectId: string) => {
+  return useAPIFetch<{ data: Disconnect }>(
+    `/kong/project/disconnect/${projectId}`,
+    {
+      method: "PUT",
+    },
+  );
 };
 
 // PodOrc endpoints