use a invisible target

x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/view/details/endpoint_activity_log.tsx

@@ -6,9 +6,9 @@
  */
 
 import React, { memo, useCallback, useEffect, useRef } from 'react';
+import styled from 'styled-components';
 
 import {
-  EuiCallOut,
   EuiFlexGroup,
   EuiFlexItem,
   EuiLoadingContent,
@@ -32,6 +32,11 @@ import {
   getActivityLogRequestLoading,
 } from '../../store/selectors';
 
+const Sentinel = styled.div`
+  height: 6px;
+  width: 100%;
+`;
+
 export const EndpointActivityLog = memo(
   ({ activityLog }: { activityLog: AsyncResourceState<Immutable<ActivityLog>> }) => {
     const activityLogLoading = useEndpointSelector(getActivityLogRequestLoading);
@@ -115,12 +120,7 @@ export const EndpointActivityLog = memo(
               </EuiFlexItem>
               <EuiFlexItem>
                 {activityLogLoading && <EuiLoadingContent lines={3} />}
-                {!activityLogLoading && (
-                  <EuiCallOut
-                    ref={fetchMoreCallOut}
-                    size="s"
-                    title={i18.ACTIVITY_LOG.callOutTitle}
-                  />
+                {!activityLogLoading && !isPagingDisabled && <Sentinel ref={fetchMoreCallOut} />}
                 )}
               </EuiFlexItem>
             </EuiFlexGroup>