[Issue-1535] Hide 'Clear Messages' button on Topic whithout Delete Clean Up Policy (#1542)

Co-authored-by: Anton Zorin <zorii4@Antons-MacBook-Pro.local>
This commit is contained in:
Zorii4 2022-02-04 16:22:02 +03:00 committed by GitHub
parent 00bac4eded
commit 6d7817ffa7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 29 additions and 11 deletions

View file

@ -25,7 +25,14 @@ export interface ListItemProps {
} }
const ListItem: React.FC<ListItemProps> = ({ const ListItem: React.FC<ListItemProps> = ({
topic: { name, internal, partitions, segmentSize, replicationFactor }, topic: {
name,
internal,
partitions,
segmentSize,
replicationFactor,
cleanUpPolicy,
},
selected, selected,
toggleTopicSelected, toggleTopicSelected,
deleteTopic, deleteTopic,
@ -105,9 +112,11 @@ const ListItem: React.FC<ListItemProps> = ({
{!internal && !isReadOnly && vElipsisVisble ? ( {!internal && !isReadOnly && vElipsisVisble ? (
<div className="has-text-right"> <div className="has-text-right">
<Dropdown label={<VerticalElipsisIcon />} right> <Dropdown label={<VerticalElipsisIcon />} right>
<DropdownItem onClick={clearTopicMessagesHandler} danger> {cleanUpPolicy === 'DELETE' && (
Clear Messages <DropdownItem onClick={clearTopicMessagesHandler} danger>
</DropdownItem> Clear Messages
</DropdownItem>
)}
{isTopicDeletionAllowed && ( {isTopicDeletionAllowed && (
<DropdownItem <DropdownItem
onClick={() => setDeleteTopicConfirmationVisible(true)} onClick={() => setDeleteTopicConfirmationVisible(true)}

View file

@ -33,6 +33,7 @@ interface Props extends Topic, TopicDetails {
topicName: TopicName; topicName: TopicName;
isInternal: boolean; isInternal: boolean;
isDeleted: boolean; isDeleted: boolean;
isDeletePolicy: boolean;
deleteTopic: (clusterName: ClusterName, topicName: TopicName) => void; deleteTopic: (clusterName: ClusterName, topicName: TopicName) => void;
clearTopicMessages(clusterName: ClusterName, topicName: TopicName): void; clearTopicMessages(clusterName: ClusterName, topicName: TopicName): void;
} }
@ -49,6 +50,7 @@ const Details: React.FC<Props> = ({
topicName, topicName,
isInternal, isInternal,
isDeleted, isDeleted,
isDeletePolicy,
deleteTopic, deleteTopic,
clearTopicMessages, clearTopicMessages,
}) => { }) => {
@ -103,12 +105,14 @@ const Details: React.FC<Props> = ({
> >
Edit settings Edit settings
</DropdownItem> </DropdownItem>
<DropdownItem {isDeletePolicy && (
onClick={() => setClearTopicConfirmationVisible(true)} <DropdownItem
danger onClick={() => setClearTopicConfirmationVisible(true)}
> danger
Clear messages >
</DropdownItem> Clear messages
</DropdownItem>
)}
{isTopicDeletionAllowed && ( {isTopicDeletionAllowed && (
<DropdownItem <DropdownItem
onClick={() => setDeleteTopicConfirmationVisible(true)} onClick={() => setDeleteTopicConfirmationVisible(true)}

View file

@ -102,7 +102,7 @@ const Overview: React.FC<Props> = ({
<td>{offsetMin}</td> <td>{offsetMin}</td>
<td>{offsetMax}</td> <td>{offsetMax}</td>
<td style={{ width: '5%' }}> <td style={{ width: '5%' }}>
{!internal && !isReadOnly ? ( {!internal && !isReadOnly && cleanUpPolicy === 'DELETE' ? (
<Dropdown label={<VerticalElipsisIcon />} right> <Dropdown label={<VerticalElipsisIcon />} right>
<DropdownItem <DropdownItem
onClick={() => onClick={() =>

View file

@ -5,6 +5,7 @@ import Overview, {
Props as OverviewProps, Props as OverviewProps,
} from 'components/Topics/Topic/Details/Overview/Overview'; } from 'components/Topics/Topic/Details/Overview/Overview';
import theme from 'theme/theme'; import theme from 'theme/theme';
import { CleanUpPolicy } from 'generated-sources';
describe('Overview', () => { describe('Overview', () => {
const mockClusterName = 'local'; const mockClusterName = 'local';
@ -49,6 +50,7 @@ describe('Overview', () => {
internal: false, internal: false,
clusterName: mockClusterName, clusterName: mockClusterName,
topicName: mockTopicName, topicName: mockTopicName,
cleanUpPolicy: CleanUpPolicy.DELETE,
clearTopicMessages: mockClearTopicMessages, clearTopicMessages: mockClearTopicMessages,
}); });
expect(screen.getByRole('menu')).toBeInTheDocument(); expect(screen.getByRole('menu')).toBeInTheDocument();

View file

@ -37,6 +37,7 @@ describe('Details', () => {
deleteTopic={mockDelete} deleteTopic={mockDelete}
clearTopicMessages={mockClearTopicMessages} clearTopicMessages={mockClearTopicMessages}
isDeleted={false} isDeleted={false}
isDeletePolicy
/> />
</ClusterContext.Provider>, </ClusterContext.Provider>,
{ pathname } { pathname }
@ -64,6 +65,7 @@ describe('Details', () => {
deleteTopic={mockDelete} deleteTopic={mockDelete}
clearTopicMessages={mockClearTopicMessages} clearTopicMessages={mockClearTopicMessages}
isDeleted={false} isDeleted={false}
isDeletePolicy
/> />
</ClusterContext.Provider> </ClusterContext.Provider>
</StaticRouter> </StaticRouter>

View file

@ -482,6 +482,7 @@ exports[`Details when it has readonly flag does not render the Action button a T
clearTopicMessages={[MockFunction]} clearTopicMessages={[MockFunction]}
clusterName="local" clusterName="local"
deleteTopic={[MockFunction]} deleteTopic={[MockFunction]}
isDeletePolicy={true}
isDeleted={false} isDeleted={false}
isInternal={true} isInternal={true}
name="__internal.topic" name="__internal.topic"