diff --git a/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx b/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx index 4f3ea02566b..6b34dc9b15f 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx +++ b/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx @@ -3,6 +3,7 @@ import { SchemaSubject } from 'generated-sources'; import { ClusterName, SchemaName } from 'redux/interfaces'; import { clusterSchemasPath } from 'lib/paths'; import ClusterContext from 'components/contexts/ClusterContext'; +import { useHistory } from 'react-router'; import Breadcrumb from '../../common/Breadcrumb/Breadcrumb'; import SchemaVersion from './SchemaVersion'; import LatestVersionItem from './LatestVersionItem'; @@ -18,6 +19,7 @@ export interface DetailsProps { clusterName: ClusterName, schemaName: SchemaName ) => void; + deleteSchema: (clusterName: ClusterName, subject: string) => Promise; } const Details: React.FC = ({ @@ -25,6 +27,7 @@ const Details: React.FC = ({ schema, clusterName, fetchSchemaVersions, + deleteSchema, versions, isFetched, }) => { @@ -33,6 +36,12 @@ const Details: React.FC = ({ fetchSchemaVersions(clusterName, subject); }, [fetchSchemaVersions, clusterName]); + const history = useHistory(); + const onDelete = async () => { + await deleteSchema(clusterName, subject); + history.push(clusterSchemasPath(clusterName)); + }; + return (
@@ -75,7 +84,7 @@ const Details: React.FC = ({ className="button is-danger is-small level-item" type="button" title="in development" - disabled + onClick={onDelete} > Delete diff --git a/kafka-ui-react-app/src/components/Schemas/Details/DetailsContainer.ts b/kafka-ui-react-app/src/components/Schemas/Details/DetailsContainer.ts index dbfec5314ca..16d20b274dc 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/DetailsContainer.ts +++ b/kafka-ui-react-app/src/components/Schemas/Details/DetailsContainer.ts @@ -6,7 +6,7 @@ import { getSchema, getSortedSchemaVersions, } from 'redux/reducers/schemas/selectors'; -import { fetchSchemaVersions } from 'redux/actions'; +import { fetchSchemaVersions, deleteSchema } from 'redux/actions'; import Details from './Details'; interface RouteProps { @@ -33,6 +33,7 @@ const mapStateToProps = ( const mapDispatchToProps = { fetchSchemaVersions, + deleteSchema, }; export default withRouter( diff --git a/kafka-ui-react-app/src/components/Schemas/Details/__test__/Details.spec.tsx b/kafka-ui-react-app/src/components/Schemas/Details/__test__/Details.spec.tsx index 498146a12b8..be1f73f60cf 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/__test__/Details.spec.tsx +++ b/kafka-ui-react-app/src/components/Schemas/Details/__test__/Details.spec.tsx @@ -30,6 +30,7 @@ describe('Details', () => { schema={schema} clusterName="Test cluster" fetchSchemaVersions={jest.fn()} + deleteSchema={jest.fn()} isFetched versions={[]} {...props} @@ -100,6 +101,17 @@ describe('Details', () => { expect(wrapper.find('SchemaVersion').length).toEqual(2); }); + it('calls deleteSchema on button click', () => { + const mockDelete = jest.fn(); + const component = mount( + + {setupWrapper({ versions, deleteSchema: mockDelete })} + + ); + component.find('button').at(1).simulate('click'); + expect(mockDelete).toHaveBeenCalledTimes(1); + }); + it('matches snapshot', () => { expect(shallow(setupWrapper({ versions }))).toMatchSnapshot(); }); diff --git a/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/Details.spec.tsx.snap b/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/Details.spec.tsx.snap index f2fe399d365..67d44e58e67 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/Details.spec.tsx.snap +++ b/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/Details.spec.tsx.snap @@ -61,7 +61,7 @@ exports[`Details View Initial state matches snapshot 1`] = `