[GEN-1613]: delete destination (#1672)

frontend/webapp/containers/main/overview/overview-drawer/index.tsx

@@ -10,7 +10,7 @@ import { DeleteEntityModal } from '@/components';
 import { ActionDrawer, type ActionDrawerHandle } from '../../actions';
 import { DestinationDrawer, type DestinationDrawerHandle } from '../../destinations';
 import { RuleDrawer, RuleDrawerHandle } from '../../instrumentation-rules/rule-drawer-container';
-import { useActionCRUD, useActualSources, useInstrumentationRuleCRUD, useUpdateDestination } from '@/hooks';
+import { useActionCRUD, useActualSources, useDestinationCRUD, useInstrumentationRuleCRUD } from '@/hooks';
 import { getMainContainerLanguageLogo, WORKLOAD_PROGRAMMING_LANGUAGES } from '@/utils/constants/programming-languages';
 import {
   WorkloadId,
@@ -40,7 +40,7 @@ const OverviewDrawer = () => {
   const [title, setTitle] = useState('');
 
   const { updateAction, deleteAction } = useActionCRUD();
-  const { updateExistingDestination } = useUpdateDestination();
+  const { updateDestination, deleteDestination } = useDestinationCRUD();
   const { updateActualSource, deleteSourcesForNamespace } = useActualSources();
   const { updateInstrumentationRule, deleteInstrumentationRule } = useInstrumentationRuleCRUD();
 
@@ -175,7 +175,7 @@ const OverviewDrawer = () => {
         };
 
         try {
-          await updateExistingDestination(id as string, payload);
+          await updateDestination(id as string, payload);
         } catch (error) {
           console.error('Error updating destination:', error);
         }
@@ -217,7 +217,9 @@ const OverviewDrawer = () => {
     }
 
     if (type === OVERVIEW_ENTITY_TYPES.DESTINATION) {
-      alert('TODO !');
+      const { id } = item as ActualDestination;
+
+      await deleteDestination(id);
     }
 
     handleClose();
@@ -256,7 +258,7 @@ const OverviewDrawer = () => {
         isModalOpen={isDeleteModalOpen}
         handleDelete={handleDelete}
         handleCloseModal={handleCloseDeleteModal}
-        description='Are you sure you want to delete this source?'
+        description='Are you sure you want to delete this?'
       />
     </>
   ) : null;

frontend/webapp/graphql/mutations/destination.ts

@@ -24,29 +24,12 @@ export const UPDATE_DESTINATION = gql`
   mutation UpdateDestination($id: ID!, $destination: DestinationInput!) {
     updateDestination(id: $id, destination: $destination) {
       id
-      name
-      exportedSignals {
-        traces
-        metrics
-        logs
-      }
-      fields
-      destinationType {
-        type
-        displayName
-        imageUrl
-        supportedSignals {
-          traces {
-            supported
-          }
-          metrics {
-            supported
-          }
-          logs {
-            supported
-          }
-        }
-      }
     }
   }
 `;
+
+export const DELETE_DESTINATION = gql`
+  mutation DeleteDestination($id: ID!) {
+    deleteDestination(id: $id)
+  }
+`;

frontend/webapp/hooks/actions/useActionCRUD.ts

@@ -31,15 +31,15 @@ export const useActionCRUD = (params?: UseActionCrudParams) => {
     params?.onSuccess?.();
   };
 
-  const [createAction, cState] = useMutation(CREATE_ACTION, {
+  const [createAction, cState] = useMutation<{ createAction: { id: string } }>(CREATE_ACTION, {
     onError: (error) => handleError('Create Action', error.message),
     onCompleted: () => handleComplete('Create Action', 'successfully created'),
   });
-  const [updateAction, uState] = useMutation(UPDATE_ACTION, {
+  const [updateAction, uState] = useMutation<{ updateAction: { id: string } }>(UPDATE_ACTION, {
     onError: (error) => handleError('Update Action', error.message),
     onCompleted: () => handleComplete('Update Action', 'successfully updated'),
   });
-  const [deleteAction, dState] = useMutation(DELETE_ACTION, {
+  const [deleteAction, dState] = useMutation<{ deleteAction: boolean }>(DELETE_ACTION, {
     onError: (error) => handleError('Delete Action', error.message),
     onCompleted: () => handleComplete('Delete Action', 'successfully deleted'),
   });

frontend/webapp/hooks/destinations/index.ts

@@ -1,10 +1,9 @@
 export * from './useDestinations';
 export * from './useTestConnection';
 export * from './useConnectDestinationForm';
-export * from './useCreateDestination';
 export * from './usePotentialDestinations';
 export * from './useActualDestinations';
-export * from './useUpdateDestination';
+export * from './useDestinationCRUD';
 export * from './useDestinationFormData';
 export * from './useEditDestinationFormHandlers';
 export * from './useDestinationTypes';

frontend/webapp/hooks/destinations/useDestinationCRUD.ts

@@ -0,0 +1,53 @@
+import { useDrawerStore } from '@/store';
+import { useNotify } from '../useNotify';
+import { useMutation } from '@apollo/client';
+import type { DestinationInput } from '@/types';
+import { useComputePlatform } from '../compute-platform';
+import { CREATE_DESTINATION, DELETE_DESTINATION, UPDATE_DESTINATION } from '@/graphql/mutations';
+
+interface Params {
+  onSuccess?: () => void;
+  onError?: () => void;
+}
+
+export const useDestinationCRUD = (params?: Params) => {
+  const { setSelectedItem: setDrawerItem } = useDrawerStore((store) => store);
+  const { refetch } = useComputePlatform();
+  const notify = useNotify();
+
+  const notifyUser = (title: string, message: string, type: 'error' | 'success') => {
+    notify({ title, message, type, target: 'notification', crdType: 'notification' });
+  };
+
+  const handleError = (title: string, message: string) => {
+    notifyUser(title, message, 'error');
+    params?.onError?.();
+  };
+
+  const handleComplete = (title: string, message: string) => {
+    notifyUser(title, message, 'success');
+    setDrawerItem(null);
+    refetch();
+    params?.onSuccess?.();
+  };
+
+  const [createDestination, cState] = useMutation<{ createNewDestination: { id: string } }>(CREATE_DESTINATION, {
+    onError: (error) => handleError('Create Destination', error.message),
+    onCompleted: () => handleComplete('Create Destination', 'successfully created'),
+  });
+  const [updateDestination, uState] = useMutation<{ updateDestination: { id: string } }>(UPDATE_DESTINATION, {
+    onError: (error) => handleError('Update Destination', error.message),
+    onCompleted: () => handleComplete('Update Destination', 'successfully updated'),
+  });
+  const [deleteDestination, dState] = useMutation<{ deleteDestination: boolean }>(DELETE_DESTINATION, {
+    onError: (error) => handleError('Delete Destination', error.message),
+    onCompleted: () => handleComplete('Delete Destination', 'successfully deleted'),
+  });
+
+  return {
+    loading: cState.loading || uState.loading || dState.loading,
+    createDestination: (destination: DestinationInput) => createDestination({ variables: { destination } }),
+    updateDestination: (id: string, destination: DestinationInput) => updateDestination({ variables: { id, destination } }),
+    deleteDestination: (id: string) => deleteDestination({ variables: { id } }),
+  };
+};

frontend/webapp/hooks/instrumentation-rules/useInstrumentationRuleCRUD.ts

@@ -31,15 +31,15 @@ export const useInstrumentationRuleCRUD = (params?: Params) => {
     params?.onSuccess?.();
   };
 
-  const [createInstrumentationRule, cState] = useMutation(CREATE_INSTRUMENTATION_RULE, {
+  const [createInstrumentationRule, cState] = useMutation<{ createInstrumentationRule: { ruleId: string } }>(CREATE_INSTRUMENTATION_RULE, {
     onError: (error) => handleError('Create Rule', error.message),
     onCompleted: () => handleComplete('Create Rule', 'successfully created'),
   });
-  const [updateInstrumentationRule, uState] = useMutation(UPDATE_INSTRUMENTATION_RULE, {
+  const [updateInstrumentationRule, uState] = useMutation<{ updateInstrumentationRule: { ruleId: string } }>(UPDATE_INSTRUMENTATION_RULE, {
     onError: (error) => handleError('Update Rule', error.message),
     onCompleted: () => handleComplete('Update Rule', 'successfully updated'),
   });
-  const [deleteInstrumentationRule, dState] = useMutation(DELETE_INSTRUMENTATION_RULE, {
+  const [deleteInstrumentationRule, dState] = useMutation<{ deleteInstrumentationRule: boolean }>(DELETE_INSTRUMENTATION_RULE, {
     onError: (error) => handleError('Delete Rule', error.message),
     onCompleted: () => handleComplete('Delete Rule', 'successfully deleted'),
   });

frontend/webapp/hooks/setup/useConnectEnv.ts

@@ -2,27 +2,24 @@ import { useAppStore } from '@/store';
 import { DestinationInput } from '@/types';
 import { useActualSources } from '../sources';
 import { useState, useCallback } from 'react';
-import { useCreateDestination } from '../destinations';
+import { useDestinationCRUD } from '../destinations';
 
 type ConnectEnvResult = {
   success: boolean;
   destinationId?: string;
 };
 
 export const useConnectEnv = () => {
-  const { createNewDestination } = useCreateDestination();
-  const { createSourcesForNamespace, persistNamespaceItems } =
-    useActualSources();
+  const { createDestination } = useDestinationCRUD();
+  const { createSourcesForNamespace, persistNamespaceItems } = useActualSources();
 
   const [result, setResult] = useState<ConnectEnvResult | null>(null);
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
 
   const sourcesList = useAppStore((state) => state.sources);
   const resetSources = useAppStore((state) => state.resetSources);
-  const namespaceFutureSelectAppsList = useAppStore(
-    (state) => state.namespaceFutureSelectAppsList
-  );
+  const namespaceFutureSelectAppsList = useAppStore((state) => state.namespaceFutureSelectAppsList);
 
   const connectEnv = useCallback(
     async (destination: DestinationInput, callback?: () => void) => {
@@ -32,9 +29,7 @@ export const useConnectEnv = () => {
 
       try {
         // Persist namespaces based on namespaceFutureSelectAppsList
-        const namespaceItems = Object.entries(
-          namespaceFutureSelectAppsList
-        ).map(([namespaceName, futureSelected]) => ({
+        const namespaceItems = Object.entries(namespaceFutureSelectAppsList).map(([namespaceName, futureSelected]) => ({
           name: namespaceName,
           futureSelected,
         }));
@@ -54,7 +49,8 @@ export const useConnectEnv = () => {
         resetSources();
 
         // Create destination
-        const destinationId = await createNewDestination(destination);
+        const { data } = await createDestination(destination);
+        const destinationId = data?.createNewDestination.id;
 
         if (!destinationId) {
           throw new Error('Error creating destination.');
@@ -73,13 +69,7 @@ export const useConnectEnv = () => {
         setLoading(false);
       }
     },
-    [
-      sourcesList,
-      createNewDestination,
-      persistNamespaceItems,
-      createSourcesForNamespace,
-      namespaceFutureSelectAppsList,
-    ]
+    [sourcesList, createDestination, persistNamespaceItems, createSourcesForNamespace, namespaceFutureSelectAppsList]
   );
 
   return {