REplace service queries for react Query (Issue #5975, PR #6172)

# Description

Replace v1 queries related to services for React-Query

closes #5975

# Self Check:

Strike through any lines that are not applicable (`~~line~~`) then check the box

- [ ] Attached issue to pull request
- [ ] Changelog entry
- [ ] Code is clear and sufficiently documented
- [ ] Sufficient test cases (reproduces the bug/tests the requested feature)
- [ ] Correct, in line with design
- [ ] End user documentation is included or an issue is created for end-user documentation (add ref to issue here: )

changelogs/unreleased/5975-replace-service-queries.yml

@@ -0,0 +1,6 @@
+description: REplace service queries for react Query
+issue-nr: 5975
+change-type: patch
+destination-branches: [master, iso8]
+sections:
+  minor-improvement: "{{description}}"

cypress/e2e/scenario-3-service-details.cy.js

@@ -154,7 +154,7 @@ if (Cypress.env("edition") === "iso") {
       cy.get("button").contains("Config").click();
 
       // Expect it to have setting in the config
-      cy.get('[aria-label="ServiceConfig"]').should("be.visible");
+      cy.get('[aria-label="ServiceConfig-Success"]').should("be.visible");
       cy.get('[aria-label="SettingsList"]').should("have.length", 1);
 
       // Go to Callback tab

src/Data/Managers/V2/DELETE/DeleteService/index.ts

@@ -0,0 +1 @@
+export * from "./useDeleteService";

src/Data/Managers/V2/DELETE/DeleteService/useDeleteService.ts

@@ -0,0 +1,56 @@
+import {
+  UseMutationResult,
+  useMutation,
+  useQueryClient,
+} from "@tanstack/react-query";
+import { PrimaryBaseUrlManager } from "@/UI";
+import { useFetchHelpers } from "../../helpers";
+
+/**
+ * React Query hook for Deleting an Service.
+ *
+ * @returns {Mutation} - The mutation object provided by `useMutation` hook.
+ */
+export const useDeleteService = (
+  environment: string,
+  service_entity: string,
+): UseMutationResult<void, Error, void, unknown> => {
+  const client = useQueryClient();
+  const { createHeaders, handleErrors } = useFetchHelpers();
+  const headers = createHeaders(environment);
+
+  const baseUrlManager = new PrimaryBaseUrlManager(
+    globalThis.location.origin,
+    globalThis.location.pathname,
+  );
+
+  const baseUrl = baseUrlManager.getBaseUrl(process.env.API_BASEURL);
+
+  /**
+   * Delete an Service.
+   *
+   * @returns {Promise<void>} - A promise that resolves when the Service is successfully deleted
+   */
+  const deleteService = async (): Promise<void> => {
+    const response = await fetch(
+      baseUrl + `/lsm/v1/service_catalog/${service_entity}`,
+      {
+        method: "DELETE",
+        headers: headers,
+      },
+    );
+
+    await handleErrors(response);
+  };
+
+  return useMutation({
+    mutationFn: deleteService,
+    mutationKey: ["delete_service"],
+    onSuccess: () => {
+      client.refetchQueries({ queryKey: ["get_service_models-continuous"] });
+      client.refetchQueries({ queryKey: ["get_service_models-one_time"] });
+      client.refetchQueries({ queryKey: ["get_service_model-one_time"] });
+      client.refetchQueries({ queryKey: ["get_service_model-continuous"] });
+    },
+  });
+};

src/Data/Managers/V2/GETTERS/GetServiceConfig/index.ts

@@ -0,0 +1 @@
+export * from "./useGetServiceConfig";

src/Data/Managers/V2/GETTERS/GetServiceConfig/useGetServiceConfig.ts

@@ -0,0 +1,60 @@
+import { UseQueryResult, useQuery } from "@tanstack/react-query";
+import { Config } from "@/Core";
+import { PrimaryBaseUrlManager } from "@/UI";
+import { useFetchHelpers } from "../../helpers";
+
+/**
+ * Return Signature of the useGetServiceConfig React Query
+ */
+interface GetServiceConfig {
+  useOneTime: () => UseQueryResult<Config, Error>;
+}
+
+/**
+ * React Query hook to fetch the service config
+ *
+ * @param service {string} - the service entity
+ * @param environment {string} - the environment in which the instance belongs
+ *
+ * @returns {GetServiceConfig} An object containing the different available queries.
+ * @returns {UseQueryResult<Config, Error>} returns.useOneTime - Fetch the service config with a single query.
+ */
+export const useGetServiceConfig = (
+  service: string,
+  environment: string,
+): GetServiceConfig => {
+  const { createHeaders, handleErrors } = useFetchHelpers();
+  const headers = createHeaders(environment);
+
+  const baseUrlManager = new PrimaryBaseUrlManager(
+    globalThis.location.origin,
+    globalThis.location.pathname,
+  );
+  const baseUrl = baseUrlManager.getBaseUrl(process.env.API_BASEURL);
+
+  const fetchInstance = async (): Promise<{ data: Config }> => {
+    const response = await fetch(
+      `${baseUrl}/lsm/v1/service_catalog/${service}/config`,
+      {
+        headers,
+      },
+    );
+
+    await handleErrors(
+      response,
+      `Failed to fetch Service Config for: ${service}`,
+    );
+
+    return response.json();
+  };
+
+  return {
+    useOneTime: (): UseQueryResult<Config, Error> =>
+      useQuery({
+        queryKey: ["get_service_config-one_time", service],
+        queryFn: fetchInstance,
+        retry: false,
+        select: (data) => data.data,
+      }),
+  };
+};

src/Data/Managers/V2/GETTERS/GetServiceModel/index.ts

@@ -1 +1 @@
-export * from "./UseGetServiceModel";
+export * from "./useGetServiceModel";

src/Data/Managers/V2/GETTERS/GetServiceModel/UseGetServiceModel.ts → src/Data/Managers/V2/GETTERS/GetServiceModel/useGetServiceModel.ts

@@ -15,7 +15,6 @@ interface GetServiceModel {
  * React Query hook to fetch the service model
  *
  * @param service {string} - the service entity
- * @param instanceId {string} - the instance ID for which the data needs to be fetched.
  * @param environment {string} - the environment in which the instance belongs
  *
  * @returns {GetServiceModel} An object containing the different available queries.
@@ -37,7 +36,7 @@ export const useGetServiceModel = (
 
   const fetchInstance = async (): Promise<{ data: ServiceModel }> => {
     const response = await fetch(
-      `${baseUrl}/lsm/v1/service_catalog/${service}`,
+      `${baseUrl}/lsm/v1/service_catalog/${service}?instance_summary=True`,
       {
         headers,
       },

src/Data/Managers/V2/GETTERS/GetServiceModels/index.ts

@@ -0,0 +1 @@
+export * from "./useGetServiceModels";

src/Data/Managers/V2/GETTERS/GetAllServiceModels/useGetAllServiceModels.ts → src/Data/Managers/V2/GETTERS/GetServiceModels/useGetServiceModels.ts

@@ -4,25 +4,23 @@ import { PrimaryBaseUrlManager } from "@/UI";
 import { useFetchHelpers } from "../../helpers";
 
 /**
- * Return Signature of the useGetAllServiceModels React Query
+ * Return Signature of the useGetServiceModel React Query
  */
-interface useGetAllServiceModels {
+interface GetServiceModels {
   useOneTime: () => UseQueryResult<ServiceModel[], Error>;
   useContinuous: () => UseQueryResult<ServiceModel[], Error>;
 }
 
 /**
- * React Query hook to fetch all the service models available in the given environment.
+ * React Query hook to fetch the service models
  *
- * @param environment {string} - the environment in which the instance belongs
+ * @param environment {string} - the environment in which the services belongs
  *
- * @returns {useGetAllServiceModels} An object containing the different available queries.
+ * @returns {GetServiceModels} An object containing the different available queries.
  * @returns {UseQueryResult<ServiceModel[], Error>} returns.useOneTime - Fetch the service models with a single query.
- * @returns {UseQueryResult<ServiceModel[], Error>} returns.useContinuous - Fetch the service models with a recursive query with an interval of 5s.
+ * @returns {UseQueryResult<ServiceModel[], Error>} returns.useContinuous - Fetch the service models with an interval of 5s.
  */
-export const useGetAllServiceModels = (
-  environment: string,
-): useGetAllServiceModels => {
+export const useGetServiceModels = (environment: string): GetServiceModels => {
   const { createHeaders, handleErrors } = useFetchHelpers();
   const headers = createHeaders(environment);
 
@@ -32,16 +30,13 @@ export const useGetAllServiceModels = (
   );
   const baseUrl = baseUrlManager.getBaseUrl(process.env.API_BASEURL);
 
-  /**
-   * Fetches all service models from the service catalog.
-   *
-   * @returns {Promise<{ data: ServiceModel[] }>} A promise that resolves to an object containing an array of service models.
-   * @throws Will throw an error if the fetch operation fails.
-   */
   const fetchServices = async (): Promise<{ data: ServiceModel[] }> => {
-    const response = await fetch(`${baseUrl}/lsm/v1/service_catalog`, {
-      headers,
-    });
+    const response = await fetch(
+      `${baseUrl}/lsm/v1/service_catalog?instance_summary=True`,
+      {
+        headers,
+      },
+    );
 
     await handleErrors(response, `Failed to fetch Service Models`);
 
@@ -51,14 +46,14 @@ export const useGetAllServiceModels = (
   return {
     useOneTime: (): UseQueryResult<ServiceModel[], Error> =>
       useQuery({
-        queryKey: ["get_all_service_models-one_time"],
+        queryKey: ["get_service_models-one_time"],
         queryFn: fetchServices,
         retry: false,
         select: (data) => data.data,
       }),
     useContinuous: (): UseQueryResult<ServiceModel[], Error> =>
       useQuery({
-        queryKey: ["get_all_service_models-continuous"],
+        queryKey: ["get_service_models-continuous"],
         queryFn: fetchServices,
         refetchInterval: 5000,
         select: (data) => data.data,

src/Data/Managers/V2/POST/ExportCatalog/index.ts

@@ -0,0 +1 @@
+export * from "./useExportCatalog";

src/Data/Managers/V2/POST/ExportCatalog/useExportCatalog.ts

@@ -0,0 +1,53 @@
+import {
+  UseMutationResult,
+  useMutation,
+  useQueryClient,
+} from "@tanstack/react-query";
+import { PrimaryBaseUrlManager } from "@/UI";
+import { useFetchHelpers } from "../../helpers";
+
+/**
+ * React Query hook for updating environment catalog.
+ *
+ * @param {string} environment  - The environment to use for creating headers.
+ * @returns {UseMutationResult<void, Error, void, unknown>}- The mutation object from `useMutation` hook.
+ */
+export const useExportCatalog = (
+  environment: string,
+): UseMutationResult<void, Error, void, unknown> => {
+  const client = useQueryClient();
+  const baseUrlManager = new PrimaryBaseUrlManager(
+    globalThis.location.origin,
+    globalThis.location.pathname,
+  );
+  const { createHeaders, handleErrors } = useFetchHelpers();
+  const headers = createHeaders(environment);
+  const baseUrl = baseUrlManager.getBaseUrl(process.env.API_BASEURL);
+
+  /**
+   * Update the environment catalog.
+   *
+   * @returns {Promise<void>} - The promise object of the fetch request.
+   * @throws {Error} If the response is not successful, an error with the error message is thrown.
+   */
+  const updateCatalog = async (): Promise<void> => {
+    const response = await fetch(
+      baseUrl + `/lsm/v1/exporter/export_service_definition`,
+      {
+        method: "POST",
+        headers,
+      },
+    );
+
+    await handleErrors(response);
+  };
+
+  return useMutation({
+    mutationFn: updateCatalog,
+    mutationKey: ["update_catalog"],
+    onSuccess: () => {
+      client.invalidateQueries({ queryKey: ["get_service_models-one_time"] });
+      client.invalidateQueries({ queryKey: ["get_service_models-continuous"] });
+    },
+  });
+};