diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3aaf29c848..d3fc347ee3 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -39,6 +39,7 @@ All notable changes to the Wazuh app project will be documented in this file.
 - Fixed repeated requests in inventory data and configurations of an agent. [#5460](https://github.com/wazuh/wazuh-kibana-app/pull/5460)
 - Fixed repeated requests in the group table when adding a group or refreshing the table [#5465](https://github.com/wazuh/wazuh-kibana-app/pull/5465)
 - Fixed an error in the request body suggestions of API Console [#5521](https://github.com/wazuh/wazuh-kibana-app/pull/5521)
+- Fixed some errors related to relative dirname of rule and decoder files [#5734](https://github.com/wazuh/wazuh-kibana-app/pull/5734)
 
 ### Removed
 
diff --git a/plugins/main/public/controllers/management/components/management/common/actions-buttons.tsx b/plugins/main/public/controllers/management/components/management/common/actions-buttons.tsx
index 7d26f871f6..2d24df0bd9 100644
--- a/plugins/main/public/controllers/management/components/management/common/actions-buttons.tsx
+++ b/plugins/main/public/controllers/management/components/management/common/actions-buttons.tsx
@@ -34,7 +34,12 @@ async function uploadFiles(files, resource, overwrite) {
     for (let idx in files) {
       const { file, content } = files[idx];
       try {
-        await resourcesHandler.updateFile(file, content, overwrite);
+        await resourcesHandler.updateFile(
+          file,
+          content,
+          overwrite,
+          `etc/${resource}`, // upload files to `etc/{resource}` directory. Currently is not possible to select the target directory so it is set by default.
+        );
         results.push({
           index: idx,
           uploaded: true,
@@ -58,7 +63,7 @@ async function uploadFiles(files, resource, overwrite) {
   }
 }
 
-const getUpdatePermissionsFiles = (section) => {
+const getUpdatePermissionsFiles = section => {
   const { permissionResource } = resourceDictionary[section];
   return [
     {
@@ -74,32 +79,34 @@ const getUpdatePermissionsFiles = (section) => {
 
 // Add new rule button
 export const AddNewFileButton = ({ section, updateAddingFile }) => (
-  <>{
-    section !== SECTION_CDBLIST_SECTION &&
-    <WzButtonPermissions
-      permissions={getUpdatePermissionsFiles(section)}
-      buttonType="empty"
-      iconType="plusInCircle"
-      onClick={() =>
-        updateAddingFile({
-          name: '',
-          content: '<!-- Modify it at your will. -->',
-          path: `etc/${section}`,
-        })
-      }
-    >
-      {`Add new ${section} file`}
-    </WzButtonPermissions>
-  }</>
-)
+  <>
+    {section !== SECTION_CDBLIST_SECTION && (
+      <WzButtonPermissions
+        permissions={getUpdatePermissionsFiles(section)}
+        buttonType='empty'
+        iconType='plusInCircle'
+        onClick={() =>
+          updateAddingFile({
+            name: '',
+            content: '<!-- Modify it at your will. -->',
+            path: `etc/${section}`,
+          })
+        }
+      >
+        {`Add new ${section} file`}
+      </WzButtonPermissions>
+    )}
+  </>
+);
 
 //Add new CDB list button
-export const AddNewCdbListButton = (({ section, updateListContent }) => {
-  return <>
+export const AddNewCdbListButton = ({ section, updateListContent }) => {
+  return (
+    <>
       <WzButtonPermissions
-        buttonType="empty"
+        buttonType='empty'
         permissions={getUpdatePermissionsFiles(section)}
-        iconType="plusInCircle"
+        iconType='plusInCircle'
         onClick={() =>
           updateListContent({
             name: false,
@@ -110,15 +117,15 @@ export const AddNewCdbListButton = (({ section, updateListContent }) => {
       >
         {`Add new ${section} file`}
       </WzButtonPermissions>
-  </>
-});
+    </>
+  );
+};
 
 // Manage files
-export const ManageFiles = (({ section, showingFiles, ...props }) => {
-
+export const ManageFiles = ({ section, showingFiles, ...props }) => {
   /**
- * Toggle between files and rules or decoders
- */
+   * Toggle between files and rules or decoders
+   */
   const toggleFiles = async () => {
     try {
       props.toggleShowFiles(!showingFiles);
@@ -136,21 +143,22 @@ export const ManageFiles = (({ section, showingFiles, ...props }) => {
       };
       getErrorOrchestrator().handleError(options);
     }
-  }
+  };
   return (
     <>
-      {section !== SECTION_CDBLIST_SECTION &&
+      {section !== SECTION_CDBLIST_SECTION && (
         <WzButtonPermissions
-          buttonType="empty"
+          buttonType='empty'
           permissions={getUpdatePermissionsFiles(section)}
           iconType={showingFiles ? 'apmTrace' : 'folderClosed'}
           onClick={async () => await toggleFiles()}
         >
           {showingFiles ? `Manage ${section}` : `Manage ${section} files`}
-        </WzButtonPermissions>}
+        </WzButtonPermissions>
+      )}
     </>
-  )
-});
+  );
+};
 
 const uploadFile = async (files, resource, overwrite) => {
   try {
@@ -161,16 +169,20 @@ const uploadFile = async (files, resource, overwrite) => {
   }
 };
 
-export const UploadFilesButton = (({ section, showingFiles, onSuccess, ...props }) => {
-
+export const UploadFilesButton = ({
+  section,
+  showingFiles,
+  onSuccess,
+  ...props
+}) => {
   return (
-        <UploadFiles
-          resource={section}
-          path={`etc/${section}`}
-          upload={uploadFile}
-          onSuccess={() => {
-            onSuccess && onSuccess(true)
-          }}
-        />
-  )
-});
+    <UploadFiles
+      resource={section}
+      path={`etc/${section}`}
+      upload={uploadFile}
+      onSuccess={() => {
+        onSuccess && onSuccess(true);
+      }}
+    />
+  );
+};
diff --git a/plugins/main/public/controllers/management/components/management/common/file-editor.tsx b/plugins/main/public/controllers/management/components/management/common/file-editor.tsx
index 17b3f0de05..f38df59189 100644
--- a/plugins/main/public/controllers/management/components/management/common/file-editor.tsx
+++ b/plugins/main/public/controllers/management/components/management/common/file-editor.tsx
@@ -42,7 +42,7 @@ import 'brace/theme/textmate';
 import 'brace/mode/xml';
 import 'brace/snippets/xml';
 import 'brace/ext/language_tools';
-import "brace/ext/searchbox";
+import 'brace/ext/searchbox';
 import _ from 'lodash';
 
 import { UI_ERROR_SEVERITIES } from '../../../../../react-services/error-orchestrator/types';
@@ -95,27 +95,40 @@ class WzFileEditor extends Component {
    * Check if the file content has changed and is not empty
    */
   contentHasChanged() {
-    return !!this.state.content.trim() && (this.state.content.trim() !== this.state.initContent.trim());
-  } 
+    return (
+      !!this.state.content.trim() &&
+      this.state.content.trim() !== this.state.initContent.trim()
+    );
+  }
 
   /**
    * Save the new content
    * @param {String} name
    * @param {Boolean} overwrite
    */
-  async save(name, overwrite = true) {
+  async save(name, overwrite = true, relativeDirname = '') {
     if (!this._isMounted) {
       return;
-    }else if(/\s/.test(name)) {
-      this.showToast('warning', 'Warning', `The ${this.props.section} name must not contain spaces.`, 3000);
+    } else if (/\s/.test(name)) {
+      this.showToast(
+        'warning',
+        'Warning',
+        `The ${this.props.section} name must not contain spaces.`,
+        3000,
+      );
       return;
-    }  
+    }
     try {
       const { content } = this.state;
 
       this.setState({ isSaving: true, error: false });
 
-      await this.resourcesHandler.updateFile(name, content, overwrite);
+      await this.resourcesHandler.updateFile(
+        name,
+        content,
+        overwrite,
+        relativeDirname,
+      );
       try {
         await validateConfigAfterSent();
       } catch (error) {
@@ -125,7 +138,9 @@ class WzFileEditor extends Component {
           severity: UI_ERROR_SEVERITIES.BUSINESS,
           error: {
             error: error,
-            message:`The content of the file ${name} is incorrect. There were found several errors while validating the configuration: ${error.message || error}`,
+            message: `The content of the file ${name} is incorrect. There were found several errors while validating the configuration: ${
+              error.message || error
+            }`,
             title: `Error file content is incorrect: ${error.message || error}`,
           },
         };
@@ -137,11 +152,16 @@ class WzFileEditor extends Component {
 
         if (this.props.addingFile != false) {
           //remove current invalid file if the file is new.
-          await this.resourcesHandler.deleteFile(name);
+          await this.resourcesHandler.deleteFile(name, relativeDirname);
           toastMessage = 'The new file was deleted.';
         } else {
           //restore file to previous version
-          await this.resourcesHandler.updateFile(name, this.state.initContent, overwrite);
+          await this.resourcesHandler.updateFile(
+            name,
+            this.state.initContent,
+            overwrite,
+            relativeDirname,
+          );
           toastMessage = 'The content file was restored to previous state.';
         }
 
@@ -155,13 +175,10 @@ class WzFileEditor extends Component {
         initialInputValue: this.state.inputValue,
         initContent: content,
       });
-
     } catch (error) {
       let errorMessage;
       if (error instanceof Error) {
-        errorMessage = error.details
-          ? error.details
-          : String(error);
+        errorMessage = error.details ? error.details : String(error);
       }
       this.setState({ error, isSaving: false });
       const options = {
@@ -187,7 +204,7 @@ class WzFileEditor extends Component {
     });
   };
 
-  goToEdit = (name) => {
+  goToEdit = name => {
     const { content, path } = this.state;
     const file = { name: name, content: content, path: path };
     this.props.updateFileContent(file);
@@ -196,7 +213,7 @@ class WzFileEditor extends Component {
   /**
    * onChange the input value in case adding new file
    */
-  onChange = (e) => {
+  onChange = e => {
     this.setState({
       inputValue: e.target.value,
     });
@@ -212,7 +229,9 @@ class WzFileEditor extends Component {
       ? true
       : path !== 'ruleset/rules' && path !== 'ruleset/decoders';
     let nameForSaving = addingFile ? this.state.inputValue : name;
-    nameForSaving = nameForSaving.endsWith('.xml') ? nameForSaving : `${nameForSaving}.xml`;
+    nameForSaving = nameForSaving.endsWith('.xml')
+      ? nameForSaving
+      : `${nameForSaving}.xml`;
     const overwrite = fileContent ? true : false;
 
     const xmlError = validateXML(content);
@@ -224,10 +243,10 @@ class WzFileEditor extends Component {
     const buildLogtestButton = () => {
       return (
         <WzButtonPermissions
-          buttonType="empty"
+          buttonType='empty'
           permissions={[{ action: 'logtest:run', resource: `*:*:*` }]}
-          color="primary"
-          iconType="documentEdit"
+          color='primary'
+          iconType='documentEdit'
           style={{ margin: '0px 8px', cursor: 'pointer' }}
           onClick={onClickOpenLogtest}
         >
@@ -243,14 +262,19 @@ class WzFileEditor extends Component {
           permissions={[
             {
               action: `${section}:update`,
-              resource: resourceDictionary[section].permissionResource(nameForSaving),
+              resource:
+                resourceDictionary[section].permissionResource(nameForSaving),
             },
           ]}
           fill
           iconType={isEditable && xmlError ? 'alert' : 'save'}
           isLoading={this.state.isSaving}
-          isDisabled={nameForSaving.length <= 4 || !!(isEditable && xmlError) || !this.contentHasChanged()}
-          onClick={() => this.save(nameForSaving, overwrite)}
+          isDisabled={
+            nameForSaving.length <= 4 ||
+            !!(isEditable && xmlError) ||
+            !this.contentHasChanged()
+          }
+          onClick={() => this.save(nameForSaving, overwrite, path)}
         >
           {isEditable && xmlError ? 'XML format error' : 'Save'}
         </WzButtonPermissions>
@@ -265,14 +289,14 @@ class WzFileEditor extends Component {
       modal = (
         <EuiOverlayMask>
           <EuiConfirmModal
-            title="Unsubmitted changes"
+            title='Unsubmitted changes'
             onConfirm={() => {
               closeModal;
               this.props.cleanEditState();
             }}
             onCancel={closeModal}
             cancelButtonText="No, don't do it"
-            confirmButtonText="Yes, do it"
+            confirmButtonText='Yes, do it'
           >
             <p style={{ textAlign: 'center' }}>
               There are unsaved changes. Are you sure you want to proceed?
@@ -293,16 +317,21 @@ class WzFileEditor extends Component {
                     {(!fileContent && (
                       <EuiFlexGroup>
                         <EuiFlexItem grow={false}>
-                          <EuiToolTip position="right" content={`Back to ${section}`}>
+                          <EuiToolTip
+                            position='right'
+                            content={`Back to ${section}`}
+                          >
                             <EuiButtonIcon
-                              aria-label="Back"
-                              color="primary"
-                              iconSize="l"
-                              iconType="arrowLeft"
+                              aria-label='Back'
+                              color='primary'
+                              iconSize='l'
+                              iconType='arrowLeft'
                               onClick={() => {
                                 if (
-                                  this.state.content !== this.state.initContent ||
-                                  this.state.inputValue !== this.state.initialInputValue
+                                  this.state.content !==
+                                    this.state.initContent ||
+                                  this.state.inputValue !==
+                                    this.state.initialInputValue
                                 ) {
                                   showModal();
                                 } else {
@@ -318,23 +347,28 @@ class WzFileEditor extends Component {
                             placeholder={`Type your new ${section} file name here`}
                             value={this.state.inputValue}
                             onChange={this.onChange}
-                            aria-label="aria-label to prevent react warning"
+                            aria-label='aria-label to prevent react warning'
                           />
                         </EuiFlexItem>
                       </EuiFlexGroup>
                     )) || (
                       <EuiTitle>
                         <span style={{ fontSize: '22px' }}>
-                          <EuiToolTip position="right" content={`Back to ${section}`}>
+                          <EuiToolTip
+                            position='right'
+                            content={`Back to ${section}`}
+                          >
                             <EuiButtonIcon
-                              aria-label="Back"
-                              color="primary"
-                              iconSize="l"
-                              iconType="arrowLeft"
+                              aria-label='Back'
+                              color='primary'
+                              iconSize='l'
+                              iconType='arrowLeft'
                               onClick={() => {
                                 if (
-                                  this.state.content !== this.state.initContent ||
-                                  this.state.inputValue !== this.state.initialInputValue
+                                  this.state.content !==
+                                    this.state.initContent ||
+                                  this.state.inputValue !==
+                                    this.state.initialInputValue
                                 ) {
                                   showModal();
                                 } else {
@@ -356,31 +390,36 @@ class WzFileEditor extends Component {
                     </EuiFlexItem>
                   )}
                 </EuiFlexGroup>
-                <EuiSpacer size="m" />
+                <EuiSpacer size='m' />
                 {this.state.showWarningRestart && (
                   <Fragment>
                     <WzRestartClusterManagerCallout
-                      onRestarted={() => this.setState({ showWarningRestart: false })}
-                      onRestartedError={() => this.setState({ showWarningRestart: true })}
+                      onRestarted={() =>
+                        this.setState({ showWarningRestart: false })
+                      }
+                      onRestartedError={() =>
+                        this.setState({ showWarningRestart: true })
+                      }
                     />
-                    <EuiSpacer size="s" />
+                    <EuiSpacer size='s' />
                   </Fragment>
                 )}
                 {xmlError && (
                   <Fragment>
                     <span style={{ color: 'red' }}> {xmlError}</span>
-                    <EuiSpacer size="s" />
+                    <EuiSpacer size='s' />
                   </Fragment>
                 )}
                 <EuiFlexGroup>
                   <EuiFlexItem>
                     <EuiFlexGroup>
-                      <EuiFlexItem className="codeEditorWrapper">
+                      <EuiFlexItem className='codeEditorWrapper'>
                         <EuiCodeEditor
-                          theme="textmate"
-                          width="100%"
+                          theme='textmate'
+                          width='100%'
                           height={`calc(100vh - ${
-                            (showWarningRestart && !xmlError) || wazuhNotReadyYet
+                            (showWarningRestart && !xmlError) ||
+                            wazuhNotReadyYet
                               ? 300
                               : xmlError
                               ? !showWarningRestart
@@ -389,14 +428,14 @@ class WzFileEditor extends Component {
                               : 230
                           }px)`}
                           value={content}
-                          onChange={(newContent) => {
+                          onChange={newContent => {
                             this.setState({ content: newContent });
                           }}
-                          mode="xml"
+                          mode='xml'
                           isReadOnly={!isEditable}
                           wrapEnabled
                           setOptions={this.codeEditorOptions}
-                          aria-label="Code Editor"
+                          aria-label='Code Editor'
                         />
                       </EuiFlexItem>
                     </EuiFlexGroup>
@@ -421,11 +460,9 @@ const mapStateToProps = state => {
 
 const mapDispatchToProps = dispatch => {
   return {
-    updateWazuhNotReadyYet: wazuhNotReadyYet => dispatch(updateWazuhNotReadyYet(wazuhNotReadyYet)),
+    updateWazuhNotReadyYet: wazuhNotReadyYet =>
+      dispatch(updateWazuhNotReadyYet(wazuhNotReadyYet)),
   };
 };
 
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(WzFileEditor);
+export default connect(mapStateToProps, mapDispatchToProps)(WzFileEditor);
diff --git a/plugins/main/public/controllers/management/components/management/common/resources-handler.ts b/plugins/main/public/controllers/management/components/management/common/resources-handler.ts
index 293db983b8..de4583b4f0 100644
--- a/plugins/main/public/controllers/management/components/management/common/resources-handler.ts
+++ b/plugins/main/public/controllers/management/components/management/common/resources-handler.ts
@@ -2,7 +2,7 @@ import { WzRequest } from '../../../../../react-services';
 import {
   SECTION_DECODERS_SECTION,
   SECTION_RULES_SECTION,
-  SECTION_CDBLIST_SECTION
+  SECTION_CDBLIST_SECTION,
 } from './constants';
 
 type DECODERS = 'decoders';
@@ -16,17 +16,17 @@ export const ResourcesConstants = {
 };
 
 export const resourceDictionary = {
-  [ResourcesConstants.DECODERS]: {    
-    resourcePath: '/decoders',    
-    permissionResource: (value) => `decoder:file:${value}`
+  [ResourcesConstants.DECODERS]: {
+    resourcePath: '/decoders',
+    permissionResource: value => `decoder:file:${value}`,
   },
-  [ResourcesConstants.LISTS]: {    
+  [ResourcesConstants.LISTS]: {
     resourcePath: '/lists',
-    permissionResource: (value) => `list:file:${value}`
+    permissionResource: value => `list:file:${value}`,
   },
-  [ResourcesConstants.RULES]: {    
+  [ResourcesConstants.RULES]: {
     resourcePath: '/rules',
-    permissionResource: (value) => `rule:file:${value}`
+    permissionResource: value => `rule:file:${value}`,
   },
 };
 
@@ -42,34 +42,42 @@ export class ResourcesHandler {
 
   private getResourceFilesPath = (fileName?: string) => {
     const basePath = `${this.getResourcePath()}/files`;
-    return `${basePath}${ fileName? `/${fileName}`: ''}`;
+    return `${basePath}${fileName ? `/${fileName}` : ''}`;
   };
 
   /**
    * Get info of any type of resource Rules, Decoders, CDB lists...
    */
   async getResource(filters = {}) {
-    try {      
-      const result: any = await WzRequest.apiReq('GET', this.getResourcePath(), filters);
-      return (result || {}).data || false ;
+    try {
+      const result: any = await WzRequest.apiReq(
+        'GET',
+        this.getResourcePath(),
+        filters,
+      );
+      return (result || {}).data || false;
     } catch (error) {
-      throw error
+      throw error;
     }
   }
-  
 
   /**
    * Get the content of any type of file Rules, Decoders, CDB lists...
    * @param {String} fileName
    */
-  async getFileContent(fileName) {
+  async getFileContent(fileName, relativeDirname) {
     try {
-      const result: any = await WzRequest.apiReq('GET', this.getResourceFilesPath(fileName), {
-        params:{
-          raw: true
-        }
-      });
-      return ((result || {}).data || '');      
+      const result: any = await WzRequest.apiReq(
+        'GET',
+        this.getResourceFilesPath(fileName),
+        {
+          params: {
+            raw: true,
+            relative_dirname: relativeDirname,
+          },
+        },
+      );
+      return (result || {}).data || '';
     } catch (error) {
       throw error;
     }
@@ -81,35 +89,50 @@ export class ResourcesHandler {
    * @param {String} content
    * @param {Boolean} overwrite
    */
-  async updateFile(fileName: string, content: string, overwrite: boolean) {    
+  async updateFile(
+    fileName: string,
+    content: string,
+    overwrite: boolean,
+    relativeDirname: string,
+  ) {
     try {
-      const result = await WzRequest.apiReq('PUT', this.getResourceFilesPath(fileName), {
-        params: {
-          overwrite: overwrite
+      const result = await WzRequest.apiReq(
+        'PUT',
+        this.getResourceFilesPath(fileName),
+        {
+          params: {
+            overwrite: overwrite,
+            relative_dirname: relativeDirname,
+          },
+          body: content.toString(),
+          origin: 'raw',
         },
-        body: content.toString(),
-        origin: 'raw'
-      });
+      );
       return result;
     } catch (error) {
       throw error;
     }
   }
-  
 
   /**
    * Delete any type of file Rules, Decoders, CDB lists...
    * @param {Resource} resource
    * @param {String} fileName
    */
-  async deleteFile(fileName: string) {
-    let fullPath = `${resourceDictionary[this.resource].resourcePath}/files/${fileName}`;
+  async deleteFile(fileName: string, relativeDirname: string = '') {
     try {
-      const result = await WzRequest.apiReq('DELETE', fullPath, {});
+      const result = await WzRequest.apiReq(
+        'DELETE',
+        this.getResourceFilesPath(fileName),
+        {
+          params: {
+            relative_dirname: relativeDirname,
+          },
+        },
+      );
       return result;
     } catch (error) {
       throw error;
     }
   }
-
 }
diff --git a/plugins/main/public/controllers/management/components/management/decoders/components/columns.tsx b/plugins/main/public/controllers/management/components/management/decoders/components/columns.tsx
index a8b24717c2..727dc9b4fb 100644
--- a/plugins/main/public/controllers/management/components/management/decoders/components/columns.tsx
+++ b/plugins/main/public/controllers/management/components/management/decoders/components/columns.tsx
@@ -57,7 +57,10 @@ export default class DecodersColumns {
                     const resourcesHandler = new ResourcesHandler(
                       ResourcesConstants.DECODERS,
                     );
-                    const result = await resourcesHandler.getFileContent(value);
+                    const result = await resourcesHandler.getFileContent(
+                      value,
+                      item.relative_dirname,
+                    );
                     const file = {
                       name: value,
                       content: result,
@@ -121,6 +124,7 @@ export default class DecodersColumns {
                       );
                       const result = await resourcesHandler.getFileContent(
                         item.filename,
+                        item.relative_dirname,
                       );
                       const file = {
                         name: item.filename,
@@ -159,6 +163,7 @@ export default class DecodersColumns {
                         );
                         const result = await resourcesHandler.getFileContent(
                           item.filename,
+                          item.relative_dirname,
                         );
                         const file = {
                           name: item.filename,
diff --git a/plugins/main/public/controllers/management/components/management/decoders/components/decoders-table.tsx b/plugins/main/public/controllers/management/components/management/decoders/components/decoders-table.tsx
index f626e875d1..1cb105449b 100644
--- a/plugins/main/public/controllers/management/components/management/decoders/components/decoders-table.tsx
+++ b/plugins/main/public/controllers/management/components/management/decoders/components/decoders-table.tsx
@@ -227,7 +227,10 @@ export default compose(withUserPermissions)(function DecodersTable({
   const removeItems = async items => {
     try {
       const results = items.map(async (item, i) => {
-        await resourcesHandler.deleteFile(item.filename || item.name);
+        await resourcesHandler.deleteFile(
+          item.filename || item.name,
+          item.relative_dirname,
+        );
       });
 
       Promise.all(results).then(completed => {
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 bc5e6a39ac..51c7cb5d2d 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';
@@ -26,15 +29,22 @@ export default class WzDecoderInfo extends Component {
     super(props);
     this.onClickRow = this.onClickRow.bind(this);
     this.state = {
-      currentInfo: {}
+      currentInfo: {},
     };
 
     this.resourcesHandler = new ResourcesHandler(ResourcesConstants.DECODERS);
 
     const handleFileClick = async (value, item) => {
       try {
-        const result = await this.resourcesHandler.getFileContent(value);
-        const file = { name: value, content: result, path: item.relative_dirname };
+        const result = await this.resourcesHandler.getFileContent(
+          value,
+          item.relative_dirname,
+        );
+        const file = {
+          name: value,
+          content: result,
+          path: item.relative_dirname,
+        };
         this.props.updateFileContent(file);
       } catch (error) {
         const options = {
@@ -77,8 +87,10 @@ 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 () => handleFileClick(value, item)}>
+                {value}
+              </EuiLink>
             </EuiToolTip>
           );
         },
@@ -97,7 +109,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 +131,17 @@ 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({q: `filename=${file}`})
+                  this.setNewFiltersAndBack({ q: `filename=${file}` })
                 }
               >
                 &nbsp;{file}
@@ -137,13 +149,13 @@ 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({q: `relative_dirname=${path}`})
+                  this.setNewFiltersAndBack({ q: `relative_dirname=${path}` })
                 }
               >
                 &nbsp;{path}
@@ -151,7 +163,7 @@ export default class WzDecoderInfo extends Component {
             </EuiToolTip>
           </span>
         </EuiFlexItem>
-        <EuiSpacer size="s" />
+        <EuiSpacer size='s' />
       </EuiFlexGrid>
     );
   }
@@ -162,17 +174,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 +197,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 +207,7 @@ export default class WzDecoderInfo extends Component {
         >
           <b style={{ paddingBottom: 6 }}>{capitalize(key)}</b>
           <div>{content}</div>
-        </EuiFlexItem>
+        </EuiFlexItem>,
       );
     });
 
@@ -208,8 +224,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 +245,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 +253,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 +265,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 +321,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 +340,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 +360,7 @@ export default class WzDecoderInfo extends Component {
                           tableProps={{ rowProps: this.onClickRow }}
                           tablePageSizeOptions={[10, 25]}
                         />
-                      }
+                      )}
                     </EuiFlexItem>
                   </EuiFlexGroup>
                 </div>
diff --git a/plugins/main/public/controllers/management/components/management/ruleset/components/columns.tsx b/plugins/main/public/controllers/management/components/management/ruleset/components/columns.tsx
index 2f1e5fd712..8b0d25e718 100644
--- a/plugins/main/public/controllers/management/components/management/ruleset/components/columns.tsx
+++ b/plugins/main/public/controllers/management/components/management/ruleset/components/columns.tsx
@@ -103,7 +103,10 @@ export default class RulesetColumns {
                     const resourcesHandler = new ResourcesHandler(
                       ResourcesConstants.RULES,
                     );
-                    const result = await resourcesHandler.getFileContent(value);
+                    const result = await resourcesHandler.getFileContent(
+                      value,
+                      item.relative_dirname,
+                    );
                     const file = {
                       name: value,
                       content: result,
@@ -169,6 +172,7 @@ export default class RulesetColumns {
                       );
                       const result = await resourcesHandler.getFileContent(
                         item.filename,
+                        item.relative_dirname,
                       );
                       const file = {
                         name: item.filename,
@@ -207,6 +211,7 @@ export default class RulesetColumns {
                         );
                         const result = await resourcesHandler.getFileContent(
                           item.filename,
+                          item.relative_dirname,
                         );
                         const file = {
                           name: item.filename,
diff --git a/plugins/main/public/controllers/management/components/management/ruleset/components/ruleset-table.tsx b/plugins/main/public/controllers/management/components/management/ruleset/components/ruleset-table.tsx
index 2358773423..6ebfa3980a 100644
--- a/plugins/main/public/controllers/management/components/management/ruleset/components/ruleset-table.tsx
+++ b/plugins/main/public/controllers/management/components/management/ruleset/components/ruleset-table.tsx
@@ -205,7 +205,10 @@ function RulesetTable({ setShowingFiles, showingFiles, ...props }) {
   const removeItems = async items => {
     try {
       const results = items.map(async (item, i) => {
-        await resourcesHandler.deleteFile(item.filename || item.name);
+        await resourcesHandler.deleteFile(
+          item.filename || item.name,
+          item.relative_dirname,
+        );
       });
 
       Promise.all(results).then(completed => {
diff --git a/plugins/main/public/controllers/management/components/management/ruleset/views/rule-info.tsx b/plugins/main/public/controllers/management/components/management/ruleset/views/rule-info.tsx
index c2c70e3084..a95208846b 100644
--- a/plugins/main/public/controllers/management/components/management/ruleset/views/rule-info.tsx
+++ b/plugins/main/public/controllers/management/components/management/ruleset/views/rule-info.tsx
@@ -56,7 +56,10 @@ export default class WzRuleInfo extends Component {
     const handleFileClick = async (event, { filename, relative_dirname }) => {
       event.stopPropagation();
       try {
-        const result = await this.resourcesHandler.getFileContent(filename);
+        const result = await this.resourcesHandler.getFileContent(
+          filename,
+          relative_dirname,
+        );
         const file = {
           name: filename,
           content: result,