diff --git a/packages/main/src/components/AnalyticalTable/ColumnHeader/ColumnHeaderModal.tsx b/packages/main/src/components/AnalyticalTable/ColumnHeader/ColumnHeaderModal.tsx
index 384c813369f..b835d0fb908 100644
--- a/packages/main/src/components/AnalyticalTable/ColumnHeader/ColumnHeaderModal.tsx
+++ b/packages/main/src/components/AnalyticalTable/ColumnHeader/ColumnHeaderModal.tsx
@@ -1,7 +1,7 @@
 import '@ui5/webcomponents-icons/dist/icons/decline';
 import { enrichEventWithDetails } from '@ui5/webcomponents-react-base/lib/Utils';
-import { CustomListItem } from '@ui5/webcomponents-react/lib/CustomListItem';
 import { FlexBox } from '@ui5/webcomponents-react/lib/FlexBox';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/lib/ThemingParameters';
 import { FlexBoxAlignItems } from '@ui5/webcomponents-react/lib/FlexBoxAlignItems';
 import { Icon } from '@ui5/webcomponents-react/lib/Icon';
 import { List } from '@ui5/webcomponents-react/lib/List';
@@ -121,12 +121,17 @@ export const ColumnHeaderModal = forwardRef((props: ColumnHeaderModalProperties,
           </StandardListItem>
         )}
         {showFilter && !column.isGrouped && (
-          <CustomListItem type={ListItemTypes.Inactive}>
-            <FlexBox alignItems={FlexBoxAlignItems.Center} style={{ padding: '0px 1rem' }}>
-              <Icon name="filter" style={{ paddingRight: '0.5rem', minWidth: '1rem', minHeight: '1rem' }} />
-              <Filter column={column} popoverRef={ref} />
-            </FlexBox>
-          </CustomListItem>
+          <FlexBox
+            alignItems={FlexBoxAlignItems.Center}
+            style={{
+              padding: '0px 1rem',
+              height: 'var(--_ui5_custom_list_item_height)',
+              borderBottom: `1px solid ${ThemingParameters.sapList_BorderColor}`
+            }}
+          >
+            <Icon name="filter" style={{ paddingRight: '0.5rem', minWidth: '1rem', minHeight: '1rem' }} />
+            <Filter column={column} popoverRef={ref} />
+          </FlexBox>
         )}
         {showGroup && (
           <StandardListItem type={ListItemTypes.Active} icon="group-2" data-sort={'group'}>
diff --git a/packages/main/src/components/AnalyticalTable/__snapshots__/AnalyticalTable.test.tsx.snap b/packages/main/src/components/AnalyticalTable/__snapshots__/AnalyticalTable.test.tsx.snap
index 8e34828fc77..a357acbc78b 100644
--- a/packages/main/src/components/AnalyticalTable/__snapshots__/AnalyticalTable.test.tsx.snap
+++ b/packages/main/src/components/AnalyticalTable/__snapshots__/AnalyticalTable.test.tsx.snap
@@ -1655,27 +1655,23 @@ exports[`AnalyticalTable Tree Table 1`] = `
               >
                 Sort Descending
               </ui5-li>
-              <ui5-li-custom
-                type="Inactive"
-              >
-                <div
-                  class="FlexBox-flexBox-0 FlexBox-flexBoxDirectionRow-0 FlexBox-justifyContentStart-0 FlexBox-alignItemsCenter-0 FlexBox-flexWrapNoWrap-0"
-                  style="padding: 0px 1rem;"
-                >
-                  <ui5-icon
-                    accessible-name=""
-                    name="filter"
-                    style="padding-right: 0.5rem; min-width: 1rem; min-height: 1rem;"
-                  />
-                  <ui5-input
-                    name=""
-                    placeholder=""
-                    type="Text"
-                    value=""
-                    value-state="None"
-                  />
-                </div>
-              </ui5-li-custom>
+              <div
+                class="FlexBox-flexBox-0 FlexBox-flexBoxDirectionRow-0 FlexBox-justifyContentStart-0 FlexBox-alignItemsCenter-0 FlexBox-flexWrapNoWrap-0"
+                style="padding: 0px 1rem;"
+              >
+                <ui5-icon
+                  accessible-name=""
+                  name="filter"
+                  style="padding-right: 0.5rem; min-width: 1rem; min-height: 1rem;"
+                />
+                <ui5-input
+                  name=""
+                  placeholder=""
+                  type="Text"
+                  value=""
+                  value-state="None"
+                />
+              </div>
             </ui5-list>
           </ui5-popover>
           <div
@@ -1736,27 +1732,23 @@ exports[`AnalyticalTable Tree Table 1`] = `
               >
                 Sort Descending
               </ui5-li>
-              <ui5-li-custom
-                type="Inactive"
-              >
-                <div
-                  class="FlexBox-flexBox-0 FlexBox-flexBoxDirectionRow-0 FlexBox-justifyContentStart-0 FlexBox-alignItemsCenter-0 FlexBox-flexWrapNoWrap-0"
-                  style="padding: 0px 1rem;"
-                >
-                  <ui5-icon
-                    accessible-name=""
-                    name="filter"
-                    style="padding-right: 0.5rem; min-width: 1rem; min-height: 1rem;"
-                  />
-                  <ui5-input
-                    name=""
-                    placeholder=""
-                    type="Text"
-                    value=""
-                    value-state="None"
-                  />
-                </div>
-              </ui5-li-custom>
+              <div
+                class="FlexBox-flexBox-0 FlexBox-flexBoxDirectionRow-0 FlexBox-justifyContentStart-0 FlexBox-alignItemsCenter-0 FlexBox-flexWrapNoWrap-0"
+                style="padding: 0px 1rem;"
+              >
+                <ui5-icon
+                  accessible-name=""
+                  name="filter"
+                  style="padding-right: 0.5rem; min-width: 1rem; min-height: 1rem;"
+                />
+                <ui5-input
+                  name=""
+                  placeholder=""
+                  type="Text"
+                  value=""
+                  value-state="None"
+                />
+              </div>
             </ui5-list>
           </ui5-popover>
           <div
@@ -1817,27 +1809,23 @@ exports[`AnalyticalTable Tree Table 1`] = `
               >
                 Sort Descending
               </ui5-li>
-              <ui5-li-custom
-                type="Inactive"
-              >
-                <div
-                  class="FlexBox-flexBox-0 FlexBox-flexBoxDirectionRow-0 FlexBox-justifyContentStart-0 FlexBox-alignItemsCenter-0 FlexBox-flexWrapNoWrap-0"
-                  style="padding: 0px 1rem;"
-                >
-                  <ui5-icon
-                    accessible-name=""
-                    name="filter"
-                    style="padding-right: 0.5rem; min-width: 1rem; min-height: 1rem;"
-                  />
-                  <ui5-input
-                    name=""
-                    placeholder=""
-                    type="Text"
-                    value=""
-                    value-state="None"
-                  />
-                </div>
-              </ui5-li-custom>
+              <div
+                class="FlexBox-flexBox-0 FlexBox-flexBoxDirectionRow-0 FlexBox-justifyContentStart-0 FlexBox-alignItemsCenter-0 FlexBox-flexWrapNoWrap-0"
+                style="padding: 0px 1rem;"
+              >
+                <ui5-icon
+                  accessible-name=""
+                  name="filter"
+                  style="padding-right: 0.5rem; min-width: 1rem; min-height: 1rem;"
+                />
+                <ui5-input
+                  name=""
+                  placeholder=""
+                  type="Text"
+                  value=""
+                  value-state="None"
+                />
+              </div>
             </ui5-list>
           </ui5-popover>
           <div
@@ -1899,27 +1887,23 @@ exports[`AnalyticalTable Tree Table 1`] = `
               >
                 Sort Descending
               </ui5-li>
-              <ui5-li-custom
-                type="Inactive"
-              >
-                <div
-                  class="FlexBox-flexBox-0 FlexBox-flexBoxDirectionRow-0 FlexBox-justifyContentStart-0 FlexBox-alignItemsCenter-0 FlexBox-flexWrapNoWrap-0"
-                  style="padding: 0px 1rem;"
-                >
-                  <ui5-icon
-                    accessible-name=""
-                    name="filter"
-                    style="padding-right: 0.5rem; min-width: 1rem; min-height: 1rem;"
-                  />
-                  <ui5-input
-                    name=""
-                    placeholder=""
-                    type="Text"
-                    value=""
-                    value-state="None"
-                  />
-                </div>
-              </ui5-li-custom>
+              <div
+                class="FlexBox-flexBox-0 FlexBox-flexBoxDirectionRow-0 FlexBox-justifyContentStart-0 FlexBox-alignItemsCenter-0 FlexBox-flexWrapNoWrap-0"
+                style="padding: 0px 1rem;"
+              >
+                <ui5-icon
+                  accessible-name=""
+                  name="filter"
+                  style="padding-right: 0.5rem; min-width: 1rem; min-height: 1rem;"
+                />
+                <ui5-input
+                  name=""
+                  placeholder=""
+                  type="Text"
+                  value=""
+                  value-state="None"
+                />
+              </div>
             </ui5-list>
           </ui5-popover>
           <div
diff --git a/packages/main/src/components/AnalyticalTable/defaults/FilterComponent/index.tsx b/packages/main/src/components/AnalyticalTable/defaults/FilterComponent/index.tsx
index c097942c8f9..9eac57caaf6 100644
--- a/packages/main/src/components/AnalyticalTable/defaults/FilterComponent/index.tsx
+++ b/packages/main/src/components/AnalyticalTable/defaults/FilterComponent/index.tsx
@@ -7,7 +7,7 @@ export /**
 const DefaultFilterComponent: FC<any> = ({ column }) => {
   const handleChange = useCallback(
     (e) => {
-      column.setFilter(e.detail.value);
+      column.setFilter(e.target.value);
     },
     [column.setFilter]
   );
diff --git a/yarn.lock b/yarn.lock
index 9510d07dbba..4467cc5566b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3262,7 +3262,7 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react@*", "@types/react@^16.9.2":
+"@types/react@*", "@types/react@16.9.2", "@types/react@^16.9.2":
   version "16.9.2"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.2.tgz#6d1765431a1ad1877979013906731aae373de268"
   integrity sha512-jYP2LWwlh+FTqGd9v7ynUKZzjj98T8x7Yclz479QdRhHfuW9yQ+0jjnD31eXSXutmBpppj5PYNLYLRfnZJvcfg==