diff --git a/src/components/modals/DeleteSchemaModal.tsx b/src/components/modals/DeleteSchemaModal.tsx
new file mode 100644
index 0000000..4c83e8d
--- /dev/null
+++ b/src/components/modals/DeleteSchemaModal.tsx
@@ -0,0 +1,64 @@
+import { Modal, Typography } from 'antd';
+import React, { useCallback } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useNotification } from '../../utils/NotificationContext';
+import { useDeleteSchema } from '../../hooks/schemas';
+
+interface DeleteSchemaModalProps {
+ open: boolean;
+ closeModal: () => void;
+ catalog: string;
+ schema: string;
+}
+
+export function DeleteSchemaModal({
+ open,
+ closeModal,
+ catalog,
+ schema,
+}: DeleteSchemaModalProps) {
+ const navigate = useNavigate();
+ const { setNotification } = useNotification();
+ const mutation = useDeleteSchema({
+ onSuccessCallback: () => {
+ setNotification(`${schema} schema successfully deleted`, 'success');
+ navigate(`/data/${catalog}`);
+ },
+ catalog,
+ });
+
+ const handleSubmit = useCallback(() => {
+ mutation.mutate(
+ { catalog_name: catalog, name: schema },
+ {
+ onError: (error: Error) => {
+ setNotification(error.message, 'error');
+ },
+ },
+ );
+ }, [mutation, catalog, schema, setNotification]);
+
+ return (
+
+ Delete schema
+
+ }
+ okText="Delete"
+ okType="danger"
+ cancelText="Cancel"
+ open={open}
+ destroyOnClose
+ onCancel={closeModal}
+ onOk={handleSubmit}
+ okButtonProps={{ loading: mutation.isPending }}
+ >
+
+ Are you sure you want to delete the schema
+
+ {` ${schema}`}
+ ? This operation cannot be undone.
+
+ );
+}
diff --git a/src/components/schemas/SchemaActionDropdown.tsx b/src/components/schemas/SchemaActionDropdown.tsx
new file mode 100644
index 0000000..83ae2e1
--- /dev/null
+++ b/src/components/schemas/SchemaActionDropdown.tsx
@@ -0,0 +1,60 @@
+import { DeleteOutlined, MoreOutlined } from '@ant-design/icons';
+import { Button, Dropdown, MenuProps } from 'antd';
+import { useMemo, useState } from 'react';
+import { DeleteSchemaModal } from '../modals/DeleteSchemaModal';
+
+interface SchemaActionDropdownProps {
+ catalog: string;
+ schema: string;
+}
+
+enum SchemaActionsEnum {
+ Delete,
+}
+
+export default function SchemaActionsDropdown({
+ catalog,
+ schema,
+}: SchemaActionDropdownProps) {
+ const [dropdownVisible, setDropdownVisible] = useState(false);
+ const [action, setAction] = useState(null);
+
+ const menuItems = useMemo(
+ (): MenuProps['items'] => [
+ {
+ key: 'deleteSchema',
+ label: 'Delete Schema',
+ onClick: () => setAction(SchemaActionsEnum.Delete),
+ icon: ,
+ danger: true,
+ },
+ ],
+ [],
+ );
+
+ return (
+ <>
+ setDropdownVisible(!dropdownVisible)}
+ >
+
+ }
+ />
+
+ setAction(null)}
+ catalog={catalog}
+ schema={schema}
+ />
+ >
+ );
+}
diff --git a/src/hooks/schemas.tsx b/src/hooks/schemas.tsx
index 583adda..0e768f2 100644
--- a/src/hooks/schemas.tsx
+++ b/src/hooks/schemas.tsx
@@ -90,3 +90,39 @@ export function useCreateSchema({
},
});
}
+
+export interface DeleteSchemaMutationParams
+ extends Pick {}
+
+interface DeleteSchemaParams {
+ onSuccessCallback?: () => void;
+ catalog: string;
+}
+
+export function useDeleteSchema({
+ onSuccessCallback,
+ catalog,
+}: DeleteSchemaParams) {
+ const queryClient = useQueryClient();
+
+ return useMutation({
+ mutationFn: async (params: DeleteSchemaMutationParams) => {
+ const response = await fetch(
+ `${UC_API_PREFIX}/schemas/${params.catalog_name}.${params.name}`,
+ {
+ method: 'DELETE',
+ },
+ );
+ if (!response.ok) {
+ const errorData = await response.json();
+ throw new Error(errorData.message || 'Failed to delete schema');
+ }
+ },
+ onSuccess: () => {
+ queryClient.invalidateQueries({
+ queryKey: ['listSchemas', catalog],
+ });
+ onSuccessCallback?.();
+ },
+ });
+}
diff --git a/src/pages/SchemaDetails.tsx b/src/pages/SchemaDetails.tsx
index 9e38103..255636a 100644
--- a/src/pages/SchemaDetails.tsx
+++ b/src/pages/SchemaDetails.tsx
@@ -10,6 +10,7 @@ import VolumesList from '../components/volumes/VolumesList';
import FunctionsList from '../components/functions/FunctionsList';
import { DatabaseOutlined } from '@ant-design/icons';
import CreateAssetsDropdown from '../components/schemas/CreateAssetsDropdown';
+import SchemaActionsDropdown from '../components/schemas/SchemaActionDropdown';
export default function SchemaDetails() {
const { catalog, schema } = useParams();
@@ -28,7 +29,10 @@ export default function SchemaDetails() {
{schemaFullName}
-
+
+
+
+
}
breadcrumbs={[