diff --git a/frontend/src/component/integrations/IntegrationForm/IntegrationDeleteDialog/IntegrationDeleteDialog.tsx b/frontend/src/component/integrations/IntegrationForm/IntegrationDeleteDialog/IntegrationDeleteDialog.tsx
new file mode 100644
index 0000000000..e2c4c40611
--- /dev/null
+++ b/frontend/src/component/integrations/IntegrationForm/IntegrationDeleteDialog/IntegrationDeleteDialog.tsx
@@ -0,0 +1,51 @@
+import { type VFC } from 'react';
+import { Dialogue } from 'component/common/Dialogue/Dialogue';
+import type { AddonSchema } from 'openapi';
+import useAddonsApi from 'hooks/api/actions/useAddonsApi/useAddonsApi';
+import useAddons from 'hooks/api/getters/useAddons/useAddons';
+import useToast from 'hooks/useToast';
+import { formatUnknownError } from 'utils/formatUnknownError';
+import { useNavigate } from 'react-router-dom';
+
+interface IIntegrationDeleteDialogProps {
+    id: AddonSchema['id'];
+    isOpen: boolean;
+    onClose: () => void;
+}
+
+export const IntegrationDeleteDialog: VFC<IIntegrationDeleteDialogProps> = ({
+    id,
+    isOpen,
+    onClose,
+}) => {
+    const { removeAddon } = useAddonsApi();
+    const { refetchAddons } = useAddons();
+    const { setToastData, setToastApiError } = useToast();
+    const navigate = useNavigate();
+    const onSubmit = async () => {
+        try {
+            await removeAddon(id);
+            refetchAddons();
+            setToastData({
+                type: 'success',
+                title: 'Success',
+                text: 'Deleted addon successfully',
+            });
+        } catch (error: unknown) {
+            setToastApiError(formatUnknownError(error));
+        }
+        onClose();
+        navigate('/integrations');
+    };
+
+    return (
+        <Dialogue
+            open={isOpen}
+            onClick={onSubmit}
+            onClose={onClose}
+            title="Confirm deletion"
+        >
+            <div>Are you sure you want to delete this Addon?</div>
+        </Dialogue>
+    );
+};
diff --git a/frontend/src/component/integrations/IntegrationForm/IntegrationForm.styles.tsx b/frontend/src/component/integrations/IntegrationForm/IntegrationForm.styles.tsx
index c55f022500..85828fd8d0 100644
--- a/frontend/src/component/integrations/IntegrationForm/IntegrationForm.styles.tsx
+++ b/frontend/src/component/integrations/IntegrationForm/IntegrationForm.styles.tsx
@@ -33,10 +33,10 @@ export const StyledButtonContainer = styled('div')({
 });
 
 export const StyledButtonSection = styled('section')(({ theme }) => ({
+    display: 'flex',
+    justifyContent: 'flex-end',
     paddingTop: theme.spacing(2),
-    '& > *': {
-        marginRight: theme.spacing(1),
-    },
+    gap: theme.spacing(1),
 }));
 
 export const StyledTextField = styled(TextField)({
diff --git a/frontend/src/component/integrations/IntegrationForm/IntegrationForm.tsx b/frontend/src/component/integrations/IntegrationForm/IntegrationForm.tsx
index 3f34ad407b..9765535c58 100644
--- a/frontend/src/component/integrations/IntegrationForm/IntegrationForm.tsx
+++ b/frontend/src/component/integrations/IntegrationForm/IntegrationForm.tsx
@@ -31,6 +31,7 @@ import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
 import PermissionButton from 'component/common/PermissionButton/PermissionButton';
 import {
     CREATE_ADDON,
+    DELETE_ADDON,
     UPDATE_ADDON,
 } from '../../providers/AccessProvider/permissions';
 import {
@@ -46,6 +47,7 @@ import {
 import { useTheme } from '@mui/system';
 import { GO_BACK } from 'constants/navigate';
 import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
+import { IntegrationDeleteDialog } from './IntegrationDeleteDialog/IntegrationDeleteDialog';
 
 interface IAddonFormProps {
     provider?: IAddonProvider;
@@ -64,6 +66,7 @@ export const IntegrationForm: VFC<IAddonFormProps> = ({
     const { setToastData, setToastApiError } = useToast();
     const navigate = useNavigate();
     const theme = useTheme();
+    const [isDeleteOpen, setDeleteOpen] = useState(false);
     const { projects: availableProjects } = useProjects();
     const selectableProjects = availableProjects.map(project => ({
         value: project.id,
@@ -374,6 +377,34 @@ export const IntegrationForm: VFC<IAddonFormProps> = ({
                         <Button type="button" onClick={onCancel}>
                             Cancel
                         </Button>
+                        <ConditionallyRender
+                            condition={Boolean(
+                                uiConfig?.flags?.integrationsRework && editMode
+                            )}
+                            show={() => (
+                                <>
+                                    <PermissionButton
+                                        type="button"
+                                        variant="text"
+                                        color="error"
+                                        permission={DELETE_ADDON}
+                                        onClick={e => {
+                                            e.preventDefault();
+                                            setDeleteOpen(true);
+                                        }}
+                                    >
+                                        Delete
+                                    </PermissionButton>
+                                    <IntegrationDeleteDialog
+                                        id={formValues.id}
+                                        isOpen={isDeleteOpen}
+                                        onClose={() => {
+                                            setDeleteOpen(false);
+                                        }}
+                                    />
+                                </>
+                            )}
+                        />
                     </StyledButtonSection>
                 </StyledButtonContainer>
             </StyledForm>