Repository: provectus/kafka-ui
Issue: Button "clear all messages" shouldn't be present for some cleanup policies
Labels: type/bug
good first issue
scope/frontend
status/accepted
status/confirmed
type/regression

**Describe the bug**
(A clear and concise description of what the bug is.)
https://github.com/provectus/kafka-ui/issues/992

**Set up**
(How do you run the app? 
Which version of the app are you running? Provide either docker image version or check commit hash at the top left corner. We won't be able to help you without this information.)
https://www.kafka-ui.provectus.io/ui

**Steps to Reproduce**
Steps to reproduce the behavior:
as in the original issue

**Expected behavior**
(A clear and concise description of what you expected to happen)

**Screenshots**
(If applicable, add screenshots to help explain your problem)


**Additional context**
(Add any other context about the problem here)


Issue comments:

Pull request review comments:
It's just styling thing - i prefer this
```suggestion
              {cleanUpPolicy === CleanUpPolicy.DELETE && (
```
Same thing, if we have enums - i prefer to use them

I don't really like to use booleans like this
Just exposing `cleanUpPolicy` seems fine 
If we need something with other policies - we have to rewrite this or add new `isSomethingPolicy`

Again, it's just a stylistic thing 

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/components/Topics/List/ListItem.tsx b/kafka-ui-react-app/src/components/Topics/List/ListItem.tsx
index fa59db34050..7b065401a09 100644
--- a/kafka-ui-react-app/src/components/Topics/List/ListItem.tsx
+++ b/kafka-ui-react-app/src/components/Topics/List/ListItem.tsx
@@ -25,7 +25,14 @@ export interface ListItemProps {
 }
 
 const ListItem: React.FC<ListItemProps> = ({
-  topic: { name, internal, partitions, segmentSize, replicationFactor },
+  topic: {
+    name,
+    internal,
+    partitions,
+    segmentSize,
+    replicationFactor,
+    cleanUpPolicy,
+  },
   selected,
   toggleTopicSelected,
   deleteTopic,
@@ -105,9 +112,11 @@ const ListItem: React.FC<ListItemProps> = ({
         {!internal && !isReadOnly && vElipsisVisble ? (
           <div className="has-text-right">
             <Dropdown label={<VerticalElipsisIcon />} right>
-              <DropdownItem onClick={clearTopicMessagesHandler} danger>
-                Clear Messages
-              </DropdownItem>
+              {cleanUpPolicy === 'DELETE' && (
+                <DropdownItem onClick={clearTopicMessagesHandler} danger>
+                  Clear Messages
+                </DropdownItem>
+              )}
               {isTopicDeletionAllowed && (
                 <DropdownItem
                   onClick={() => setDeleteTopicConfirmationVisible(true)}
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Details.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Details.tsx
index fe98bcf0003..f83c6627624 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Details.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Details.tsx
@@ -33,6 +33,7 @@ interface Props extends Topic, TopicDetails {
   topicName: TopicName;
   isInternal: boolean;
   isDeleted: boolean;
+  isDeletePolicy: boolean;
   deleteTopic: (clusterName: ClusterName, topicName: TopicName) => void;
   clearTopicMessages(clusterName: ClusterName, topicName: TopicName): void;
 }
@@ -49,6 +50,7 @@ const Details: React.FC<Props> = ({
   topicName,
   isInternal,
   isDeleted,
+  isDeletePolicy,
   deleteTopic,
   clearTopicMessages,
 }) => {
@@ -103,12 +105,14 @@ const Details: React.FC<Props> = ({
                 >
                   Edit settings
                 </DropdownItem>
-                <DropdownItem
-                  onClick={() => setClearTopicConfirmationVisible(true)}
-                  danger
-                >
-                  Clear messages
-                </DropdownItem>
+                {isDeletePolicy && (
+                  <DropdownItem
+                    onClick={() => setClearTopicConfirmationVisible(true)}
+                    danger
+                  >
+                    Clear messages
+                  </DropdownItem>
+                )}
                 {isTopicDeletionAllowed && (
                   <DropdownItem
                     onClick={() => setDeleteTopicConfirmationVisible(true)}
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/Overview.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/Overview.tsx
index 7a967cc4878..e6d11e30f0a 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/Overview.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/Overview.tsx
@@ -102,7 +102,7 @@ const Overview: React.FC<Props> = ({
                 <td>{offsetMin}</td>
                 <td>{offsetMax}</td>
                 <td style={{ width: '5%' }}>
-                  {!internal && !isReadOnly ? (
+                  {!internal && !isReadOnly && cleanUpPolicy === 'DELETE' ? (
                     <Dropdown label={<VerticalElipsisIcon />} right>
                       <DropdownItem
                         onClick={() =>
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/__test__/Overview.spec.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/__test__/Overview.spec.tsx
index 1373e4880fb..226f59b0ccc 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/__test__/Overview.spec.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/__test__/Overview.spec.tsx
@@ -5,6 +5,7 @@ import Overview, {
   Props as OverviewProps,
 } from 'components/Topics/Topic/Details/Overview/Overview';
 import theme from 'theme/theme';
+import { CleanUpPolicy } from 'generated-sources';
 
 describe('Overview', () => {
   const mockClusterName = 'local';
@@ -49,6 +50,7 @@ describe('Overview', () => {
         internal: false,
         clusterName: mockClusterName,
         topicName: mockTopicName,
+        cleanUpPolicy: CleanUpPolicy.DELETE,
         clearTopicMessages: mockClearTopicMessages,
       });
       expect(screen.getByRole('menu')).toBeInTheDocument();
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/Details.spec.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/Details.spec.tsx
index 11fa6ab30dc..a175b5c0b3c 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/Details.spec.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/Details.spec.tsx
@@ -37,6 +37,7 @@ describe('Details', () => {
           deleteTopic={mockDelete}
           clearTopicMessages={mockClearTopicMessages}
           isDeleted={false}
+          isDeletePolicy
         />
       </ClusterContext.Provider>,
       { pathname }
@@ -64,6 +65,7 @@ describe('Details', () => {
                   deleteTopic={mockDelete}
                   clearTopicMessages={mockClearTopicMessages}
                   isDeleted={false}
+                  isDeletePolicy
                 />
               </ClusterContext.Provider>
             </StaticRouter>
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/__snapshots__/Details.spec.tsx.snap b/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/__snapshots__/Details.spec.tsx.snap
index 84e17d8d92c..386777843e9 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/__snapshots__/Details.spec.tsx.snap
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/__snapshots__/Details.spec.tsx.snap
@@ -482,6 +482,7 @@ exports[`Details when it has readonly flag does not render the Action button a T
           clearTopicMessages={[MockFunction]}
           clusterName="local"
           deleteTopic={[MockFunction]}
+          isDeletePolicy={true}
           isDeleted={false}
           isInternal={true}
           name="__internal.topic"


Test patch: