diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0d54066a41..0f69bb0440 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,7 @@ All notable changes to the Wazuh app project will be documented in this file.
 
 ### Fixed
 
+- Fixed the propagation event so that the flyout data, in the decoders, does not change when the button is pressed. [#5597](https://github.com/wazuh/wazuh-kibana-app/pull/5597)
 - Fixed the color of the agent name in the groups section in dark mode. [#5676](https://github.com/wazuh/wazuh-kibana-app/pull/5676)
 
 ## Wazuh v4.6.0 - OpenSearch Dashboards 2.6.0 - Revision 01
diff --git a/plugins/main/public/controllers/management/components/management/decoders/views/decoder-info.tsx b/plugins/main/public/controllers/management/components/management/decoders/views/decoder-info.tsx
index 5e9446c259..04a7705ac9 100644
--- a/plugins/main/public/controllers/management/components/management/decoders/views/decoder-info.tsx
+++ b/plugins/main/public/controllers/management/components/management/decoders/views/decoder-info.tsx
@@ -14,7 +14,10 @@ import {
   EuiFlexGrid,
 } from '@elastic/eui';
 
-import { ResourcesHandler, ResourcesConstants } from '../../common/resources-handler';
+import {
+  ResourcesHandler,
+  ResourcesConstants,
+} from '../../common/resources-handler';
 import { colors } from '../../common/colors';
 import { TableWzAPI } from '../../../../../../components/common/tables';
 import { UI_ERROR_SEVERITIES } from '../../../../../../react-services/error-orchestrator/types';
@@ -22,19 +25,27 @@ import { UI_LOGGER_LEVELS } from '../../../../../../../common/constants';
 import { getErrorOrchestrator } from '../../../../../../react-services/common-services';
 
 export default class WzDecoderInfo extends Component {
+  columns: object[];
+  resourcesHandler;
+
   constructor(props) {
     super(props);
     this.onClickRow = this.onClickRow.bind(this);
     this.state = {
-      currentInfo: {}
+      currentInfo: {},
     };
 
     this.resourcesHandler = new ResourcesHandler(ResourcesConstants.DECODERS);
 
-    const handleFileClick = async (value, item) => {
+    const handleFileClick = async (event, value, item) => {
+      event.stopPropagation();
       try {
         const result = await this.resourcesHandler.getFileContent(value);
-        const file = { name: value, content: result, path: item.relative_dirname };
+        const file = {
+          name: value,
+          content: result,
+          path: item.relative_dirname,
+        };
         this.props.updateFileContent(file);
       } catch (error) {
         const options = {
@@ -77,8 +88,12 @@ export default class WzDecoderInfo extends Component {
         sortable: true,
         render: (value, item) => {
           return (
-            <EuiToolTip position="top" content={`Show ${value} content`}>
-              <EuiLink onClick={async () => handleFileClick(value, item)}>{value}</EuiLink>
+            <EuiToolTip position='top' content={`Show ${value} content`}>
+              <EuiLink
+                onClick={async event => handleFileClick(event, value, item)}
+              >
+                {value}
+              </EuiLink>
             </EuiToolTip>
           );
         },
@@ -97,7 +112,7 @@ export default class WzDecoderInfo extends Component {
     document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
 
     this.setState({
-      currentId: this.props.item
+      currentId: this.props.item,
     });
   }
 
@@ -119,17 +134,19 @@ export default class WzDecoderInfo extends Component {
   renderInfo(position, file, path) {
     return (
       <EuiFlexGrid columns={4}>
-        <EuiFlexItem key="position">
+        <EuiFlexItem key='position'>
           <b style={{ paddingBottom: 6 }}>Position</b>
           {position}
         </EuiFlexItem>
-        <EuiFlexItem key="file">
+        <EuiFlexItem key='file'>
           <b style={{ paddingBottom: 6 }}>File</b>
           <span>
-            <EuiToolTip position="top" content={`Filter by this file: ${file}`}>
+            <EuiToolTip position='top' content={`Filter by this file: ${file}`}>
               <EuiLink
                 onClick={async () =>
-                  this.setNewFiltersAndBack([{ field: 'filename', value: file }])
+                  this.setNewFiltersAndBack([
+                    { field: 'filename', value: file },
+                  ])
                 }
               >
                 &nbsp;{file}
@@ -137,13 +154,15 @@ export default class WzDecoderInfo extends Component {
             </EuiToolTip>
           </span>
         </EuiFlexItem>
-        <EuiFlexItem key="path">
+        <EuiFlexItem key='path'>
           <b style={{ paddingBottom: 6 }}>Path</b>
           <span>
-            <EuiToolTip position="top" content={`Filter by this path: ${path}`}>
+            <EuiToolTip position='top' content={`Filter by this path: ${path}`}>
               <EuiLink
                 onClick={async () =>
-                  this.setNewFiltersAndBack([{ field: 'relative_dirname', value: path }])
+                  this.setNewFiltersAndBack([
+                    { field: 'relative_dirname', value: path },
+                  ])
                 }
               >
                 &nbsp;{path}
@@ -151,7 +170,7 @@ export default class WzDecoderInfo extends Component {
             </EuiToolTip>
           </span>
         </EuiFlexItem>
-        <EuiSpacer size="s" />
+        <EuiSpacer size='s' />
       </EuiFlexGrid>
     );
   }
@@ -162,17 +181,21 @@ export default class WzDecoderInfo extends Component {
    */
   renderDetails(details) {
     const detailsToRender = [];
-    const capitalize = (str) => str[0].toUpperCase() + str.slice(1);
+    const capitalize = str => str[0].toUpperCase() + str.slice(1);
 
-    Object.keys(details).forEach((key) => {
+    Object.keys(details).forEach(key => {
       let content = details[key];
       if (key === 'order') {
         content = this.colorOrder(content);
       } else if (typeof details[key] === 'object') {
         content = (
           <ul>
-            {Object.keys(details[key]).map((k) => (
-              <li key={k} style={{ marginBottom: '4px', wordBreak: 'break-word' }} className="subdued-color">
+            {Object.keys(details[key]).map(k => (
+              <li
+                key={k}
+                style={{ marginBottom: '4px', wordBreak: 'break-word' }}
+                className='subdued-color'
+              >
                 {k}:&nbsp;
                 {details[key][k]}
                 <br />
@@ -181,7 +204,7 @@ export default class WzDecoderInfo extends Component {
           </ul>
         );
       } else {
-        content = <span className="subdued-color">{details[key]}</span>;
+        content = <span className='subdued-color'>{details[key]}</span>;
       }
       detailsToRender.push(
         <EuiFlexItem
@@ -191,7 +214,7 @@ export default class WzDecoderInfo extends Component {
         >
           <b style={{ paddingBottom: 6 }}>{capitalize(key)}</b>
           <div>{content}</div>
-        </EuiFlexItem>
+        </EuiFlexItem>,
       );
     });
 
@@ -208,8 +231,13 @@ export default class WzDecoderInfo extends Component {
     const result = [];
     for (let i = 0, len = valuesArray.length; i < len; i++) {
       const coloredString = (
-        <span key={`decoder-info-color-order-${i}`} style={{ color: colors[i] }}>
-          {valuesArray[i].startsWith(' ') ? valuesArray[i] : ` ${valuesArray[i]}`}
+        <span
+          key={`decoder-info-color-order-${i}`}
+          style={{ color: colors[i] }}
+        >
+          {valuesArray[i].startsWith(' ')
+            ? valuesArray[i]
+            : ` ${valuesArray[i]}`}
         </span>
       );
       result.push(coloredString);
@@ -224,7 +252,7 @@ export default class WzDecoderInfo extends Component {
   colorRegex(regex) {
     regex = regex.toString();
     const starts = (
-      <span key={`decoder-info-color-regex-start`} className="subdued-color">
+      <span key={'decoder-info-color-regex-start'} className='subdued-color'>
         {regex.split('(')[0]}
       </span>
     );
@@ -232,7 +260,10 @@ export default class WzDecoderInfo extends Component {
     const result = [starts];
     for (let i = 0, len = valuesArray.length; i < len; i++) {
       const coloredString = (
-        <span key={`decoder-info-color-regex-${i}`} style={{ color: colors[i] }}>
+        <span
+          key={`decoder-info-color-regex-${i}`}
+          style={{ color: colors[i] }}
+        >
           {valuesArray[i]}
         </span>
       );
@@ -241,53 +272,54 @@ export default class WzDecoderInfo extends Component {
     return result;
   }
 
-/**
- * Update decoder details with the selected detail row
- * @param decoder 
- */
+  /**
+   * Update decoder details with the selected detail row
+   * @param decoder
+   */
   onClickRow(decoder) {
     return {
       onClick: () => {
         this.setState({ currentDecoder: decoder });
       },
     };
-  };
+  }
 
   render() {
     const currentDecoder =
-      this.state && this.state.currentDecoder ? this.state.currentDecoder : this.props.item;
-    const { position, details, filename, name, relative_dirname } = currentDecoder;
+      this.state && this.state.currentDecoder
+        ? this.state.currentDecoder
+        : this.props.item;
+    const { position, details, filename, name, relative_dirname } =
+      currentDecoder;
 
     return (
       <>
-        <EuiFlyoutHeader hasBorder className="flyout-header">
+        <EuiFlyoutHeader hasBorder className='flyout-header'>
           {/* Decoder description name */}
           <EuiFlexGroup>
             <EuiFlexItem grow={false}>
               <EuiTitle>
-                <span style={{ fontSize: '22px' }}>
-                  {name}
-                </span>
+                <span style={{ fontSize: '22px' }}>{name}</span>
               </EuiTitle>
             </EuiFlexItem>
           </EuiFlexGroup>
         </EuiFlyoutHeader>
-        <EuiFlyoutBody className="flyout-body">
-        {/* Cards */}
+        <EuiFlyoutBody className='flyout-body'>
+          {/* Cards */}
           <EuiFlexGroup>
             {/* General info */}
             <EuiFlexItem style={{ marginBottom: 16, marginTop: 8 }}>
               <EuiAccordion
-                id="Info"
+                id='Info'
                 buttonContent={
-                  <EuiTitle size="s">
+                  <EuiTitle size='s'>
                     <h3>Information</h3>
                   </EuiTitle>
                 }
-                paddingSize="none"
+                paddingSize='none'
                 initialIsOpen={true}
               >
-                <div className="flyout-row details-row">
+                <div className='flyout-row details-row'>
                   {this.renderInfo(position, filename, relative_dirname)}
                 </div>
               </EuiAccordion>
@@ -296,16 +328,18 @@ export default class WzDecoderInfo extends Component {
           <EuiFlexGroup>
             <EuiFlexItem style={{ marginTop: 8 }}>
               <EuiAccordion
-                id="Details"
+                id='Details'
                 buttonContent={
-                  <EuiTitle size="s">
+                  <EuiTitle size='s'>
                     <h3>Details</h3>
                   </EuiTitle>
                 }
-                paddingSize="none"
+                paddingSize='none'
                 initialIsOpen={true}
               >
-                <div className="flyout-row details-row">{this.renderDetails(details)}</div>
+                <div className='flyout-row details-row'>
+                  {this.renderDetails(details)}
+                </div>
               </EuiAccordion>
             </EuiFlexItem>
           </EuiFlexGroup>
@@ -313,19 +347,19 @@ export default class WzDecoderInfo extends Component {
           <EuiFlexGroup>
             <EuiFlexItem style={{ marginTop: 8 }}>
               <EuiAccordion
-                id="Related"
+                id='Related'
                 buttonContent={
-                  <EuiTitle size="s">
+                  <EuiTitle size='s'>
                     <h3>Related decoders</h3>
                   </EuiTitle>
                 }
-                paddingSize="none"
+                paddingSize='none'
                 initialIsOpen={true}
               >
-                <div className="flyout-row related-rules-row">
+                <div className='flyout-row related-rules-row'>
                   <EuiFlexGroup>
                     <EuiFlexItem>
-                      {currentDecoder?.filename &&
+                      {currentDecoder?.filename && (
                         <TableWzAPI
                           tableColumns={this.columns}
                           tableInitialSortingField={'name'}
@@ -333,7 +367,7 @@ export default class WzDecoderInfo extends Component {
                           tableProps={{ rowProps: this.onClickRow }}
                           tablePageSizeOptions={[10, 25]}
                         />
-                      }
+                      )}
                     </EuiFlexItem>
                   </EuiFlexGroup>
                 </div>