Refactor configuration deletion queries

Co-authored-by: Brad Harris <[email protected]>

components/dashboard/src/configurations/detail/RemoveConfigurationModal.tsx

@@ -6,8 +6,8 @@
 
 import { FunctionComponent, useCallback, useState } from "react";
 import ConfirmationModal from "../../components/ConfirmationModal";
-import { useDeleteConfiguration } from "../../data/configurations/delete-configuration-mutation";
 import type { Configuration } from "@gitpod/public-api/lib/gitpod/v1/configuration_pb";
+import { useDeleteConfiguration } from "../../data/configurations/configuration-queries";
 
 type RemoveProjectModalProps = {
     configuration: Configuration;

components/dashboard/src/data/configurations/configuration-queries.ts

@@ -4,7 +4,7 @@
  * See License.AGPL.txt in the project root for license information.
  */
 
-import { useQuery } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { useCurrentOrg } from "../organizations/orgs-query";
 import { configurationClient } from "../../service/public-api";
 import type { Configuration } from "@gitpod/public-api/lib/gitpod/v1/configuration_pb";
@@ -60,6 +60,23 @@ export const useConfiguration = (configurationId: string) => {
     });
 };
 
+export const useDeleteConfiguration = (configurationId: string) => {
+    const queryClient = useQueryClient();
+
+    return useMutation<void, Error>({
+        mutationKey: getConfigurationQueryKey(configurationId),
+        mutationFn: async () => {
+            await configurationClient.deleteConfiguration({
+                configurationId,
+            });
+        },
+        onSuccess: () => {
+            queryClient.invalidateQueries({ queryKey: ["configurations", "list"] });
+            queryClient.invalidateQueries({ queryKey: getConfigurationQueryKey(configurationId) });
+        },
+    });
+};
+
 export const getConfigurationQueryKey = (configurationId: string) => {
     const key: any[] = [BASE_KEY, { configurationId }];