Merge branch 'main' into feature/refactor-maven-profiles

Author: KliminV

README.md

@@ -50,7 +50,7 @@ We extend our gratitude to Provectus for their past support in groundbreaking wo
 * **View Consumer Groups** — view per-partition parked offsets, combined and per-partition lag
 * **Browse Messages** — browse messages with JSON, plain text, and Avro encoding
 * **Dynamic Topic Configuration** — create and configure new topics with dynamic configuration
-* **Configurable Authentification** — [secure](https://ui.docs.kafbat.io/configuration/authentication) your installation with optional Github/Gitlab/Google OAuth 2.0
+* **Configurable Authentication** — [secure](https://ui.docs.kafbat.io/configuration/authentication) your installation with optional Github/Gitlab/Google OAuth 2.0
 * **Custom serialization/deserialization plugins** - [use](https://ui.docs.kafbat.io/configuration/serialization-serde) a ready-to-go serde for your data like AWS Glue or Smile, or code your own!
 * **Role based access control** - [manage permissions](https://ui.docs.kafbat.io/configuration/rbac-role-based-access-control) to access the UI with granular precision
 * **Data masking** - [obfuscate](https://ui.docs.kafbat.io/configuration/data-masking) sensitive data in topic messages

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"

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;

frontend/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', () => {