From f7724ab7636949c368a49ece674a50605b122a95 Mon Sep 17 00:00:00 2001
From: Pablo Aragon <pablo.aragon@pandorafms.com>
Date: Tue, 23 Apr 2024 15:15:15 +0200
Subject: [PATCH] 13188-Move filter module in custom graph

---
 pandora_console/include/functions_html.php | 104 +++++++++++----------
 pandora_console/include/styles/pandora.css |  23 ++++-
 2 files changed, 78 insertions(+), 49 deletions(-)

diff --git a/pandora_console/include/functions_html.php b/pandora_console/include/functions_html.php
index 003ba7483a..620ec19d4f 100644
--- a/pandora_console/include/functions_html.php
+++ b/pandora_console/include/functions_html.php
@@ -1686,6 +1686,60 @@ function html_print_select_multiple_modules_filtered(array $data):string
     );
     $output .= '</div>';
 
+    $agent_class = '';
+    if (empty($data['searchBar']) === false && $data['searchBar'] === true) {
+        $output .= '<div class="agents-modules-multiple-search-bar">';
+
+        if (isset($data['searchBarAgents']) === false) {
+            $data['searchBarAgents'] = true;
+        }
+
+        if (isset($data['searchBarModules']) === false) {
+            $data['searchBarModules'] = true;
+        }
+
+        if ($data['searchBarAgents'] === true) {
+            $output .= '<div>';
+            $output .= html_print_input(
+                [
+                    'type'        => 'text',
+                    'label_class' => 'font-title-font',
+                    'label'       => __('Filter agent'),
+                    'name'        => 'agent-searchBar-'.$uniqId,
+                    'onKeyUp'     => 'searchAgent(\''.$uniqId.'\')',
+                    'placeholder' => __('Type to search agents'),
+                    'return'      => true,
+                ]
+            );
+
+            $output .= '</div>';
+        } else {
+            $agent_class = 'custom-graph-editor-agents-module-filter';
+            $output .= '<div></div>';
+        }
+
+        if ($data['searchBarModules'] === true) {
+            $output .= '<div>';
+            $output .= html_print_input(
+                [
+                    'type'        => 'text',
+                    'label_class' => 'font-title-font',
+                    'label'       => __('Filter module'),
+                    'name'        => 'module-searchBar-'.$uniqId,
+                    'onKeyUp'     => 'searchModule(\''.$uniqId.'\')',
+                    'return'      => true,
+                    'placeholder' => __('Type to search modules'),
+                ]
+            );
+
+            $output .= '</div>';
+        } else {
+            $output .= '<div></div>';
+        }
+
+        $output .= '</div>';
+    }
+
     $output .= '<div>';
     // Agent.
     $agents = agents_get_group_agents(
@@ -1738,6 +1792,7 @@ function html_print_select_multiple_modules_filtered(array $data):string
                 'style'       => 'min-width: 200px;max-width:200px;',
                 'script'      => 'fmModuleChange(\''.$uniqId.'\', '.(int) is_metaconsole().')',
                 'placeholder' => (isset($data['placeholderAgents']) === true) ? $data['placeholderAgents'] : '',
+                'input_class' => $agent_class,
             ]
         );
     } else {
@@ -1754,6 +1809,7 @@ function html_print_select_multiple_modules_filtered(array $data):string
                 'style'       => 'min-width: 200px;max-width:200px;',
                 'script'      => 'fmModuleChange(\''.$uniqId.'\', '.(int) is_metaconsole().')',
                 'placeholder' => (isset($data['placeholderAgents']) === true) ? $data['placeholderAgents'] : '',
+                'input_class' => $agent_class,
             ]
         );
     }
@@ -1821,54 +1877,6 @@ function html_print_select_multiple_modules_filtered(array $data):string
 
     $output .= '</div>';
 
-    if (empty($data['searchBar']) === false && $data['searchBar'] === true) {
-        $output .= '<div class="agents-modules-multiple-search-bar">';
-
-        if (isset($data['searchBarAgents']) === false) {
-            $data['searchBarAgents'] = true;
-        }
-
-        if (isset($data['searchBarModules']) === false) {
-            $data['searchBarModules'] = true;
-        }
-
-        if ($data['searchBarAgents'] === true) {
-            $output .= '<div>';
-            $output .= html_print_input(
-                [
-                    'type'        => 'text',
-                    'name'        => 'agent-searchBar-'.$uniqId,
-                    'onKeyUp'     => 'searchAgent(\''.$uniqId.'\')',
-                    'placeholder' => __('Type to search agents'),
-                    'return'      => true,
-                ]
-            );
-
-            $output .= '</div>';
-        } else {
-            $output .= '<div></div>';
-        }
-
-        if ($data['searchBarModules'] === true) {
-            $output .= '<div>';
-            $output .= html_print_input(
-                [
-                    'type'        => 'text',
-                    'name'        => 'module-searchBar-'.$uniqId,
-                    'onKeyUp'     => 'searchModule(\''.$uniqId.'\')',
-                    'return'      => true,
-                    'placeholder' => __('Type to search modules'),
-                ]
-            );
-
-            $output .= '</div>';
-        } else {
-            $output .= '<div></div>';
-        }
-
-        $output .= '</div>';
-    }
-
     if ($data['return'] === false) {
         echo $output;
     }
diff --git a/pandora_console/include/styles/pandora.css b/pandora_console/include/styles/pandora.css
index f787c7db25..0dce777841 100644
--- a/pandora_console/include/styles/pandora.css
+++ b/pandora_console/include/styles/pandora.css
@@ -14272,8 +14272,29 @@ table.filter-table-adv td > div.row-flex input {
   #select_multiple_modules_filtered
   > div.agents-modules-multiple-search-bar
   > div
+  > div
   > input {
   width: 100%;
   max-width: 100%;
-  height: 30px;
+}
+
+.custom-graph-editor
+  #select_multiple_modules_filtered
+  > div.agents-modules-multiple-search-bar
+  > div
+  > div {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  flex-wrap: wrap;
+  width: 100%;
+}
+
+.custom-graph-editor-agents-module-filter {
+  margin-top: -69px;
+}
+
+.custom-graph-editor-agents-module-filter > span.select2.select2-container {
+  height: 189px;
 }