Closes kafbat/kafka-ui #622

kafbat · Nov 5, 2024 · b1dc56e · b1dc56e
1 parent 0ad8695
commit b1dc56e
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 2 deletions.
diff --git a/frontend/src/components/Topics/Topic/Messages/Filters/AddEditFilterContainer.tsx b/frontend/src/components/Topics/Topic/Messages/Filters/AddEditFilterContainer.tsx
@@ -196,7 +196,7 @@ const AddEditFilterContainer: React.FC<AddEditFilterContainerProps> = ({
           </FormError>
         </div>
         <S.FilterButtonWrapper isEdit={isEdit}>
-          {!isEdit && <QuestionInfo />}
+          <QuestionInfo />
           <Flexbox gap="10px">
             <Button
               buttonSize="M"

diff --git a/frontend/src/components/Topics/Topic/Messages/Filters/Filters.styled.ts b/frontend/src/components/Topics/Topic/Messages/Filters/Filters.styled.ts
@@ -142,7 +142,7 @@ export const SavedFilterName = styled.div`
 
 export const FilterButtonWrapper = styled.div<{ isEdit: boolean }>`
   display: flex;
-  justify-content: ${(props) => (props.isEdit ? 'flex-end' : 'space-between')};
+  justify-content: space-between;
   margin-top: 10px;
   gap: 10px;
   padding-top: 16px;

diff --git a/...nd/src/components/Topics/Topic/Messages/Filters/__tests__/AddEditFilterContainer.spec.tsx b/...nd/src/components/Topics/Topic/Messages/Filters/__tests__/AddEditFilterContainer.spec.tsx
@@ -73,6 +73,12 @@ describe('AddEditFilterContainer component', () => {
       expect(submitButtonElem).toBeEnabled();
     });
 
+    it('should display the CEL syntax help icon', async () => {
+      const celHelpIcon = screen.queryByLabelText('info');
+      expect(celHelpIcon).toBeVisible();
+      expect(celHelpIcon).toBeEnabled();
+    });
+
     // TODO needs a rethink
     // it('should view the error message after typing and clearing the input', async () => {
     //   const inputs = screen.getAllByRole('textbox');
@@ -115,6 +121,12 @@ describe('AddEditFilterContainer component', () => {
       const checkbox = screen.queryByRole('checkbox');
       expect(checkbox).not.toBeInTheDocument();
     });
+
+    it('should display the CEL syntax help icon', async () => {
+      const celHelpIcon = screen.queryByLabelText('info');
+      expect(celHelpIcon).toBeVisible();
+      expect(celHelpIcon).toBeEnabled();
+    });
   });
 
   describe('Cancel and Submit button functionality', () => {