diff --git a/spec/support/application/app/Config/toolbar.php b/spec/support/application/app/Config/toolbar.php
index 2122a9f8..1ee59934 100644
--- a/spec/support/application/app/Config/toolbar.php
+++ b/spec/support/application/app/Config/toolbar.php
@@ -10,10 +10,12 @@
  */
 
 return [
-    'collectors'       => [],
-    'collect_var_data' => true,
-    'max_history'      => 20,
-    'view_path'        => SYST_PATH . 'Debug' . DS . 'Toolbar' . DS . 'Views',
-    'max_queries'      => 100,
-    'show_debugbar'    => true,
+    'collectors'          => [],
+    'collect_var_data'    => true,
+    'max_history'         => 20,
+    'view_path'           => SYST_PATH . 'Debug' . DS . 'Toolbar' . DS . 'Views',
+    'max_queries'         => 100,
+    'show_debugbar'       => true,
+    'watched_directories' => ['app'],
+    'watched_extensions'  => ['php', 'css', 'js', 'html', 'svg', 'json', 'env'],
 ];
diff --git a/spec/system/framework/HotReloader/DirectoryHasher.spec.php b/spec/system/framework/HotReloader/DirectoryHasher.spec.php
new file mode 100644
index 00000000..f67939c6
--- /dev/null
+++ b/spec/system/framework/HotReloader/DirectoryHasher.spec.php
@@ -0,0 +1,55 @@
+<?php
+
+/**
+ * This file is part of Blitz PHP framework.
+ *
+ * (c) 2022 Dimitri Sitchet Tomkeu <devcode.dst@gmail.com>
+ *
+ * For the full copyright and license information, please view
+ * the LICENSE file that was distributed with this source code.
+ */
+
+use BlitzPHP\Exceptions\FrameworkException;
+use BlitzPHP\HotReloader\DirectoryHasher;
+
+use function Kahlan\expect;
+
+describe('HotReloader / DirectoryHasher', function (): void {
+    beforeAll(function (): void {
+		$this->hasher = new DirectoryHasher();
+	});
+    
+    it('hashApp', function (): void {
+        $results = $this->hasher->hashApp();
+
+        expect($results)->toBeA('array');
+        expect($results)->toContainKey('app');
+    });
+
+    it('Leve une exception si on essai de hasher un dossier invalide', function (): void {
+        $path = $path = APP_PATH . 'Foo';
+
+        expect(fn() => $this->hasher->hashDirectory($path))
+            ->toThrow(FrameworkException::invalidDirectory($path));
+    });
+
+    it('Chaque dossier a un hash unique', function (): void {
+        $hash1 = $this->hasher->hashDirectory(APP_PATH);
+        $hash2 = $this->hasher->hashDirectory(SYST_PATH);
+
+        expect($hash1)->not->toBe($hash2);
+    });
+
+    it('Un meme dossier produira le meme hash', function (): void {
+        $hash1 = $this->hasher->hashDirectory(APP_PATH);
+        $hash2 = $this->hasher->hashDirectory(APP_PATH);
+
+        expect($hash1)->toBe($hash2);
+    });
+
+    it ('hash', function (): void {
+        $expected = md5(implode('', $this->hasher->hashApp()));
+
+        expect($expected)->toBe($this->hasher->hash());
+    });
+});
diff --git a/src/Debug/Toolbar.php b/src/Debug/Toolbar.php
index 64ba82c4..b422a35b 100644
--- a/src/Debug/Toolbar.php
+++ b/src/Debug/Toolbar.php
@@ -18,12 +18,12 @@
 use BlitzPHP\Formatter\JsonFormatter;
 use BlitzPHP\Formatter\XmlFormatter;
 use BlitzPHP\Http\Request;
+use BlitzPHP\Http\Response;
 use BlitzPHP\Utilities\Date;
 use BlitzPHP\View\Parser;
 use Exception;
 use GuzzleHttp\Psr7\Utils;
 use Kint\Kint;
-use Psr\Http\Message\RequestInterface;
 use Psr\Http\Message\ResponseInterface;
 use Psr\Http\Message\ServerRequestInterface;
 use stdClass;
@@ -66,8 +66,8 @@ public function __construct(?stdClass $config = null)
         foreach ($this->config->collectors as $collector) {
             if (! class_exists($collector)) {
                 logger()->critical(
-                    'Toolbar collector does not exist (' . $collector . ').'
-                    . ' Please check $collectors in the app/Config/toolbar.php file.'
+                    'Le collecteur de la barre d\'outils n\'existe pas (' . $collector . ').'
+                    . ' Veuillez vérifier $collectors dans le fichier app/Config/toolbar.php.'
                 );
 
                 continue;
@@ -80,7 +80,8 @@ public function __construct(?stdClass $config = null)
     /**
      * Renvoie toutes les données requises par la barre de débogage
      *
-     * @param float $startTime Heure de début de l'application
+     * @param float   $startTime Heure de début de l'application
+     * @param Request $request
      *
      * @return string Données encodées en JSON
      */
@@ -88,8 +89,8 @@ public function run(float $startTime, float $totalTime, ServerRequestInterface $
     {
         // Éléments de données utilisés dans la vue.
         $data['url']             = current_url();
-        $data['method']          = strtoupper($request->getMethod());
-        $data['isAJAX']          = service('request')->ajax();
+        $data['method']          = $request->getMethod();
+        $data['isAJAX']          = $request->ajax();
         $data['startTime']       = $startTime;
         $data['totalTime']       = $totalTime * 1000;
         $data['totalMemory']     = number_format(memory_get_peak_usage() / 1024 / 1024, 3);
@@ -134,7 +135,7 @@ public function run(float $startTime, float $totalTime, ServerRequestInterface $
             foreach ($_SESSION as $key => $value) {
                 // Remplacez les données binaires par une chaîne pour éviter l'échec de json_encode.
                 if (is_string($value) && preg_match('~[^\x20-\x7E\t\r\n]~', $value)) {
-                    $value = 'binary data';
+                    $value = 'donnée binaire';
                 }
 
                 $data['vars']['session'][esc($key)] = is_string($value) ? esc($value) : '<pre>' . esc(print_r($value, true)) . '</pre>';
@@ -160,7 +161,7 @@ public function run(float $startTime, float $totalTime, ServerRequestInterface $
             $data['vars']['cookies'][esc($name)] = esc($value);
         }
 
-        $data['vars']['request'] = (service('request')->is('ssl') ? 'HTTPS' : 'HTTP') . '/' . $request->getProtocolVersion();
+        $data['vars']['request'] = ($request->is('ssl') ? 'HTTPS' : 'HTTP') . '/' . $request->getProtocolVersion();
 
         $data['vars']['response'] = [
             'statusCode'  => $response->getStatusCode(),
@@ -210,12 +211,12 @@ protected function renderTimelineRecursive(array $rows, float $startTime, int $s
             $open = $row['name'] === 'Controller';
 
             if ($hasChildren || $isQuery) {
-                $output .= '<tr class="timeline-parent' . ($open ? ' timeline-parent-open' : '') . '" id="timeline-' . $styleCount . '_parent" onclick="blitzphpDebugBar.toggleChildRows(\'timeline-' . $styleCount . '\');">';
+                $output .= '<tr class="timeline-parent' . ($open ? ' timeline-parent-open' : '') . '" id="timeline-' . $styleCount . '_parent" data-toggle="childrows" data-child="timeline-' . $styleCount . '">';
             } else {
                 $output .= '<tr>';
             }
 
-            $output .= '<td class="' . ($isChild ? 'debug-bar-width30' : '') . '" style="--level: ' . $level . ';">' . ($hasChildren || $isQuery ? '<nav></nav>' : '') . $row['name'] . '</td>';
+            $output .= '<td class="' . ($isChild ? 'debug-bar-width30' : '') . ' debug-bar-level-' . $level . '" >' . ($hasChildren || $isQuery ? '<nav></nav>' : '') . $row['name'] . '</td>';
             $output .= '<td class="' . ($isChild ? 'debug-bar-width10' : '') . '">' . $row['component'] . '</td>';
             $output .= '<td class="' . ($isChild ? 'debug-bar-width10 ' : '') . 'debug-bar-alignRight">' . number_format($row['duration'] * 1000, 2) . ' ms</td>';
             $output .= "<td class='debug-bar-noverflow' colspan='{$segmentCount}'>";
@@ -233,7 +234,7 @@ protected function renderTimelineRecursive(array $rows, float $startTime, int $s
 
             // Ajouter des enfants le cas échéant
             if ($hasChildren || $isQuery) {
-                $output .= '<tr class="child-row" id="timeline-' . ($styleCount - 1) . '_children" style="' . ($open ? '' : 'display: none;') . '">';
+                $output .= '<tr class="child-row ' . ($open ? '' : ' debug-bar-ndisplay') . '" id="timeline-' . ($styleCount - 1) . '_children" >';
                 $output .= '<td colspan="' . ($segmentCount + 3) . '" class="child-container">';
                 $output .= '<table class="timeline">';
                 $output .= '<tbody>';
@@ -241,7 +242,7 @@ protected function renderTimelineRecursive(array $rows, float $startTime, int $s
                 if ($isQuery) {
                     // Sortie de la chaîne de requête si requête
                     $output .= '<tr>';
-                    $output .= '<td class="query-container" style="--level: ' . ($level + 1) . ';">' . $row['query'] . '</td>';
+                    $output .= '<td class="query-container debug-bar-level-' . ($level + 1) . '" >' . $row['query'] . '</td>';
                     $output .= '</tr>';
                 } else {
                     // Rendre récursivement les enfants
@@ -356,13 +357,34 @@ protected function roundTo(float $number, int $increments = 5): float
         return ceil($number * $increments) / $increments;
     }
 
+    /**
+     * Traite la barre d'outils de débogage pour la requête en cours.
+     *
+     * Cette méthode détermine s'il faut afficher la barre d'outils de débogage ou la préparer pour une utilisation ultérieure.
+     *
+     * @param array             $stats    Un tableau contenant des statistiques de performances.
+     * @param Request           $request  La requête serveur en cours.
+     * @param ResponseInterface $response La réponse en cours.
+     *
+     * @return ResponseInterface La réponse traitée, avec la barre d'outils de débogage injectée ou préparée pour une utilisation ultérieure.
+     */
+    public function process(array $stats, ServerRequestInterface $request, ResponseInterface $response): ResponseInterface
+    {
+        if ($request->hasAny('blitzphp-debugbar', 'debugbar_time')) {
+            return $this->respond($request);
+        }
+
+        return $this->prepare($stats, $request, $response);
+    }
+
     /**
      * Préparez-vous au débogage..
      */
-    public function prepare(array $stats, ?RequestInterface $request = null, ?ResponseInterface $response = null): ResponseInterface
+    public function prepare(array $stats, ?ServerRequestInterface $request = null, ?ResponseInterface $response = null): ResponseInterface
     {
         /** @var Request $request */
         $request ??= service('request');
+        /** @var Response $response */
         $response ??= service('response');
 
         // Si on est en CLI ou en prod, pas la peine de continuer car la debugbar n'est pas utilisable dans ces environnements
@@ -402,95 +424,88 @@ public function prepare(array $stats, ?RequestInterface $request = null, ?Respon
                 ->withHeader('Debugbar-Link', site_url("?debugbar_time={$time}"));
         }
 
-        $_SESSION['_blitz_debugbar_'] = array_merge($_SESSION['_blitz_debugbar_'] ?? [], compact('time'));
-
-        $debugRenderer = $this->respond();
-
-        // Extract css
-        preg_match('/<style (?:.+)>(.+)<\/style>/', $debugRenderer, $matches);
-        $style         = $matches[0] ?? '';
-        $debugRenderer = str_replace($style, '', $debugRenderer);
-
-        // Extract js
-        preg_match('/<script (?:.+)>(.+)<\/script>/', $debugRenderer, $matches);
-        $js            = $matches[0] ?? '';
-        $debugRenderer = str_replace($js, '', $debugRenderer);
-
-        $responseContent = $response->getBody()->getContents();
-
-        if (str_contains($responseContent, '<head>')) {
-            $responseContent = preg_replace('/<head>/', '<head>' . $style, $responseContent, 1);
-        } else {
-            $responseContent .= $style;
-        }
-
-        if (str_contains($responseContent, '</body>')) {
-            $responseContent = preg_replace('/<\/body>/', '<div id="toolbarContainer">' . trim(preg_replace('/\s+/', ' ', $debugRenderer)) . '</div>' . $js . '<script>blitzphpDebugBar.init();</script></body>', $responseContent, 1);
+        $oldKintMode        = Kint::$mode_default;
+        Kint::$mode_default = Kint::MODE_RICH;
+        $kintScript         = @Kint::dump('');
+        Kint::$mode_default = $oldKintMode;
+        $kintScript         = substr($kintScript, 0, strpos($kintScript, '</style>') + 8);
+        $kintScript         = ($kintScript === '0') ? '' : $kintScript;
+
+        $script = PHP_EOL
+            . '<script id="debugbar_loader" '
+            . 'data-time="' . $time . '" '
+            . 'src="' . site_url() . '?blitzphp-debugbar"></script>'
+            . '<script id="debugbar_dynamic_script"></script>'
+            . '<style id="debugbar_dynamic_style"></style>'
+            . $kintScript
+            . PHP_EOL;
+
+        if (str_contains($responseContent = (string) $response->getBody(), '<head>')) {
+            $responseContent = preg_replace(
+                '/<head>/',
+                '<head>' . $script,
+                $responseContent,
+                1,
+            );
         } else {
-            $responseContent .= '<div id="toolbarContainer">' . trim(preg_replace('/\s+/', ' ', $debugRenderer)) . '</div>' . $js . '<script>blitzphpDebugBar.init();</script>';
+            $responseContent .= $script;
         }
 
-        return $response->withBody(
-            Utils::streamFor($responseContent)
-        );
+        return $response->withBody(Utils::streamFor($responseContent));
     }
 
     /**
      * Injectez la barre d'outils de débogage dans la réponse.
      *
-     * @return string
+     * @param Request $request
      *
      * @codeCoverageIgnore
      */
-    public function respond()
+    public function respond(ServerRequestInterface $request): Response
     {
+        $response = new Response();
+
         if (on_test()) {
-            return '';
+            return $response;
         }
 
-        $request = service('request');
-
-        // Si la requête contient '?debugbar alors nous sommes
+        // Si la requête contient '?blitzphp-debugbar alors nous sommes
         // renvoie simplement le script de chargement
-        if ($request->getQuery('debugbar') !== null) {
-            header('Content-Type: application/javascript');
+        if ($request->getQuery('blitzphp-debugbar') !== null) {
+            $response = $response->withType('application/javascript');
 
             ob_start();
-            include $this->config->view_path . 'toolbarloader.js';
+            include $this->config->view_path . DS . 'toolbarloader.js';
             $output = ob_get_clean();
 
-            return str_replace('{url}', rtrim(site_url(), '/'), $output);
+            return $response->withStringBody(str_replace('{url}', rtrim(site_url(), '/'), $output));
         }
 
         // Sinon, s'il inclut ?debugbar_time, alors
         // nous devrions retourner la barre de débogage entière.
-        $debugbarTime = $_SESSION['_blitz_debugbar_']['time'] ?? $request->getQuery('debugbar_time');
-        if ($debugbarTime) {
+        if (null !== $debugbarTime = $request->getQuery('debugbar_time')) {
             // Négociation du type de contenu pour formater la sortie
-            $format = $request->negotiate('media', ['text/html', 'application/json', 'application/xml']);
-            $format = explode('/', $format)[1];
+            $format   = $request->negotiate('media', ['text/html', 'application/json', 'application/xml']);
+            $response = $response->withType($format);
+            $format   = explode('/', $format)[1];
 
             $filename = 'debugbar_' . $debugbarTime;
             $filename = $this->debugPath . DS . $filename . '.json';
 
             if (is_file($filename)) {
                 // Affiche la barre d'outils si elle existe
-                return $this->format($debugbarTime, file_get_contents($filename), $format);
+                return $response->withStringBody($this->format($debugbarTime, file_get_contents($filename), $format));
             }
-
-            // Nom de fichier introuvable
-            http_response_code(404);
-
-            exit; // Quitter ici est nécessaire pour éviter de charger la page d'index
         }
 
-        return '';
+        // Nom de fichier introuvable
+        return $response->withStatus(404);
     }
 
     /**
      * Formatte la sortie
      *
-     * @param float $debugbar_time
+     * @param mixed $debugbar_time
      */
     protected function format($debugbar_time, string $data, string $format = 'html'): string
     {
diff --git a/src/Debug/Toolbar/Collectors/RoutesCollector.php b/src/Debug/Toolbar/Collectors/RoutesCollector.php
index 9e483b56..c4cd23b3 100644
--- a/src/Debug/Toolbar/Collectors/RoutesCollector.php
+++ b/src/Debug/Toolbar/Collectors/RoutesCollector.php
@@ -54,6 +54,25 @@ public function __construct()
     /**
      * {@inheritDoc}
      *
+     * @return array{
+     *      matchedRoute: array<array{
+     *          directory: string,
+     *          controller: string,
+     *          method: string,
+     *          paramCount: int,
+     *          truePCount: int,
+     *          params: list<array{
+     *              name: string,
+     *              value: mixed
+     *          }>
+     *      }>,
+     *      routes: list<array{
+     *          method: string,
+     *          route: string,
+     *          handler: string
+     *      }>
+     * }
+     *
      * @throws ReflectionException
      */
     public function display(): array
@@ -91,8 +110,8 @@ public function display(): array
         $matchedRoute = [
             [
                 'directory'  => $this->router->directory(),
-                'controller' => $this->router->controllerName(),
-                'method'     => $this->router->methodName(),
+                'controller' => is_string($controller = $this->router->controllerName()) ? $controller : 'Non défini',
+                'method'     => is_string($controller) ? $this->router->methodName() : 'Non définie',
                 'paramCount' => count($this->router->params()),
                 'truePCount' => count($params),
                 'params'     => $params,
diff --git a/src/Debug/Toolbar/Views/_database.tpl b/src/Debug/Toolbar/Views/_database.tpl
index 0b556125..e2dbc95f 100644
--- a/src/Debug/Toolbar/Views/_database.tpl
+++ b/src/Debug/Toolbar/Views/_database.tpl
@@ -8,10 +8,20 @@
     </thead>
     <tbody>
     {queries}
-        <tr>
+        <tr class="{class}" title="{hover}" data-toggle="{qid}-trace">
             <td class="narrow">{duration}</td>
             <td>{! sql !}</td>
             <td>{affected_rows}</td>
+            <td class="debug-bar-alignRight"><strong>{trace-file}</strong></td>
+        </tr>
+        <tr class="muted debug-bar-ndisplay" id="{qid}-trace">
+            <td></td>
+            <td colspan="3">
+            {trace}
+                {index}<strong>{file}</strong><br/>
+                {function}<br/><br/>
+            {/trace}
+            </td>
         </tr>
     {/queries}
     </tbody>
diff --git a/src/Debug/Toolbar/Views/_history.tpl b/src/Debug/Toolbar/Views/_history.tpl
index a2fee0b0..c658c0af 100644
--- a/src/Debug/Toolbar/Views/_history.tpl
+++ b/src/Debug/Toolbar/Views/_history.tpl
@@ -13,8 +13,8 @@
     <tbody>
     {files}
         <tr data-active="{active}">
-        	<td class="debug-bar-width70p">
-            	<button class="ci-history-load" data-time="{time}">Chargé</button>
+            <td class="debug-bar-width70p">
+            	<button class="blitzphp-history-load" data-time="{time}">Chargé</button>
             </td>
             <td class="debug-bar-width190p">{datetime}</td>
             <td>{status}</td>
diff --git a/src/Debug/Toolbar/Views/_routes.tpl b/src/Debug/Toolbar/Views/_routes.tpl
index f7f63e41..f5cf2266 100644
--- a/src/Debug/Toolbar/Views/_routes.tpl
+++ b/src/Debug/Toolbar/Views/_routes.tpl
@@ -9,7 +9,7 @@
     </tbody>
 </table>
 
-<h3>Route assortis</h3>
+<h3>Route adaptée</h3>
 
 <table>
     <tbody>
diff --git a/src/Debug/Toolbar/Views/toolbar-min.js b/src/Debug/Toolbar/Views/toolbar-min.js
index 1b4156e3..83116a47 100644
--- a/src/Debug/Toolbar/Views/toolbar-min.js
+++ b/src/Debug/Toolbar/Views/toolbar-min.js
@@ -1 +1 @@
-var blitzphpDebugBar={toolbarContainer:null,toolbar:null,icon:null,init:function(){this.toolbarContainer=document.getElementById("toolbarContainer"),this.toolbar=document.getElementById("debug-bar"),this.icon=document.getElementById("debug-icon"),blitzphpDebugBar.createListeners(),blitzphpDebugBar.setToolbarState(),blitzphpDebugBar.setToolbarPosition(),blitzphpDebugBar.setToolbarTheme(),blitzphpDebugBar.toggleViewsHints(),blitzphpDebugBar.routerLink(),document.getElementById("debug-bar-link").addEventListener("click",blitzphpDebugBar.toggleToolbar,!0),document.getElementById("debug-icon-link").addEventListener("click",blitzphpDebugBar.toggleToolbar,!0);var e=this.toolbar.querySelector('button[data-time="'+localStorage.getItem("debugbar-time")+'"]');blitzphpDebugBar.addClass(e.parentNode.parentNode,"current"),historyLoad=this.toolbar.getElementsByClassName("blitzphp-history-load");for(var t=0;t<historyLoad.length;t++)historyLoad[t].addEventListener("click",(function(){loadDoc(this.getAttribute("data-time"))}),!0);var a=blitzphpDebugBar.readCookie("debug-bar-tab");if(document.getElementById(a)){var r=document.getElementById(a);r.style.display="block",blitzphpDebugBar.addClass(r,"active"),(a=document.querySelector("[data-tab="+a+"]"))&&blitzphpDebugBar.addClass(a.parentNode,"active")}},createListeners:function(){for(var e=[].slice.call(this.toolbar.querySelectorAll(".blitzphp-label a")),t=0;t<e.length;t++)e[t].addEventListener("click",blitzphpDebugBar.showTab,!0);var a=this.toolbar.querySelectorAll("[data-toggle]");for(t=0;t<a.length;t++)a[t].addEventListener("click",blitzphpDebugBar.toggleRows,!0)},showTab:function(){var e=document.getElementById(this.getAttribute("data-tab"));if(e){blitzphpDebugBar.createCookie("debug-bar-tab","",-1);for(var t=e.style.display,a=document.querySelectorAll("#debug-bar .tab"),r=0;r<a.length;r++)a[r].style.display="none";var l=document.querySelectorAll("#debug-bar .blitzphp-label");for(r=0;r<l.length;r++)blitzphpDebugBar.removeClass(l[r],"active");"block"!=t&&(e.style.display="block",blitzphpDebugBar.addClass(this.parentNode,"active"),blitzphpDebugBar.createCookie("debug-bar-tab",this.getAttribute("data-tab"),365))}},addClass:function(e,t){e.classList?e.classList.add(t):e.className+=" "+t},removeClass:function(e,t){e.classList?e.classList.remove(t):e.className=e.className.replace(new RegExp("(^|\\b)"+t.split(" ").join("|")+"(\\b|$)","gi")," ")},toggleRows:function(e){if(e.target){let t=e.target.closest("tr"),a=document.getElementById(t.getAttribute("data-toggle"));a.style.display="none"===a.style.display?"table-row":"none"}},toggleDataTable:function(e){"string"==typeof e&&(e=document.getElementById(e+"_table")),e&&(e.style.display="none"===e.style.display?"block":"none")},toggleChildRows:function(e){"string"==typeof e&&(par=document.getElementById(e+"_parent"),e=document.getElementById(e+"_children")),par&&e&&(e.style.display="none"===e.style.display?"":"none",par.classList.toggle("timeline-parent-open"))},toggleToolbar:function(){var e="none"!=blitzphpDebugBar.toolbar.style.display;blitzphpDebugBar.icon.style.display=1==e?"inline-block":"none",blitzphpDebugBar.toolbar.style.display=0==e?"inline-block":"none",blitzphpDebugBar.createCookie("debug-bar-state","",-1),blitzphpDebugBar.createCookie("debug-bar-state",1==e?"minimized":"open",365)},setToolbarState:function(){var e=blitzphpDebugBar.readCookie("debug-bar-state");blitzphpDebugBar.icon.style.display="open"!=e?"inline-block":"none",blitzphpDebugBar.toolbar.style.display="open"==e?"inline-block":"none"},toggleViewsHints:function(){if(localStorage.getItem("debugbar-time")!=localStorage.getItem("debugbar-time-new"))return void(document.querySelector('a[data-tab="blitzphp-views"]').href="#");var e=[],t=[],a=function(e,t){return null===e.parentNode?null:e.parentNode!==t?a(e.parentNode,t):e};const r=["NOSCRIPT","SCRIPT","STYLE"],l=["HTML","BODY","HEAD"];var o=function(e,t){if(-1!==l.indexOf(e.nodeName)){for(var a=0;a<document.body.children.length;++a){var o=t?document.body.children.length-(a+1):a,i=document.body.children[o];if(-1===r.indexOf(i.nodeName))return[i,t]}return null}for(;null!==e&&-1!==r.indexOf(e.nodeName);)e=t?e.previousElementSibling:e.nextElementSibling;return null===e?null:[e,t]},i=function(e){if(e){if(null!==e.nextElementSibling)return o(e.nextElementSibling,!1)||o(e.previousElementSibling,!0);if(null!==e.previousElementSibling)return o(e.previousElementSibling,!0)}return null};function n(){for(var l in t=function(){for(var e=[],t=[],a=document.evaluate("//comment()[starts-with(., ' DEBUG-VIEW')]",document,null,XPathResult.ANY_TYPE,null),r=a.iterateNext();r;)e.push(r),r=a.iterateNext();for(var l=0;l<e.length;++l){var o=e[l].nodeValue.substring(18,e[l].nodeValue.length-1);"S"===e[l].nodeValue[12]?t[o]=[e[l],null]:t[o]&&(t[o][1]=e[l])}return t}(),t){var o=i(t[l][0]),n=i(t[l][1]);if(null!==o&&null!==n){var d=a(n[0],o[0].parentNode);if(null===d){if(null===(d=a(o[0],n[0].parentNode)))continue;o[0]=d}else n[0]=d;var p,u,s=document.createElement("div"),g=document.createElement("div"),c=o[0].parentNode.childNodes,h=o[0].parentNode;s.classList.add("debug-view"),s.classList.add("show-view"),g.classList.add("debug-view-path"),g.innerText=l,s.appendChild(g);for(var m=0;m<c.length;++m)if(c[m]===t[l][1]||c[m]===t[l][0]||c[m]===o[0]){p=m,c[m]===t[l][0]&&p++;break}o[1]&&p++;for(m=p;m<c.length;++m)if(c[m]===n[0])u=m;else if(c[m]===t[l][1]){u=m;break}var f=u-p;n[1]&&f++;for(m=0;m<f;++m)-1===r.indexOf(c[p])?s.appendChild(c[p]):p++;e.push(h.insertBefore(s,c[p]))}}blitzphpDebugBar.createCookie("debug-view","show",365),blitzphpDebugBar.addClass(b,"active")}var b=document.querySelector("[data-tab=blitzphp-views]");b&&(b.parentNode.onclick=function(){blitzphpDebugBar.readCookie("debug-view")?function(){for(var t=0;t<e.length;++t){for(var a,r=0;r<e[t].parentNode.childNodes.length;++r)if(e[t].parentNode.childNodes[r]===e[t]){a=r;break}for(;1!==e[t].childNodes.length;)e[t].parentNode.insertBefore(e[t].childNodes[1],e[t].parentNode.childNodes[a].nextSibling),a++;e[t].parentNode.removeChild(e[t])}e.length=0,blitzphpDebugBar.createCookie("debug-view","",-1),blitzphpDebugBar.removeClass(b,"active")}():n()},blitzphpDebugBar.readCookie("debug-view")&&n())},setToolbarPosition:function(){var e=this.toolbar.querySelector("#toolbar-position");"top"===blitzphpDebugBar.readCookie("debug-bar-position")&&(blitzphpDebugBar.addClass(blitzphpDebugBar.icon,"fixed-top"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbar,"fixed-top")),e.addEventListener("click",(function(){var e=blitzphpDebugBar.readCookie("debug-bar-position");blitzphpDebugBar.createCookie("debug-bar-position","",-1),e&&"bottom"!==e?(blitzphpDebugBar.createCookie("debug-bar-position","bottom",365),blitzphpDebugBar.removeClass(blitzphpDebugBar.icon,"fixed-top"),blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbar,"fixed-top")):(blitzphpDebugBar.createCookie("debug-bar-position","top",365),blitzphpDebugBar.addClass(blitzphpDebugBar.icon,"fixed-top"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbar,"fixed-top"))}),!0)},setToolbarTheme:function(){var e=this.toolbar.querySelector("#toolbar-theme");window.matchMedia("(prefers-color-scheme: dark)").matches,window.matchMedia("(prefers-color-scheme: light)").matches;"dark"===blitzphpDebugBar.readCookie("debug-bar-theme")?(blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer,"light"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer,"dark")):"light"===blitzphpDebugBar.readCookie("debug-bar-theme")&&(blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer,"dark"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer,"light")),e.addEventListener("click",(function(){var e=blitzphpDebugBar.readCookie("debug-bar-theme");!e&&window.matchMedia("(prefers-color-scheme: dark)").matches||"dark"===e?(blitzphpDebugBar.createCookie("debug-bar-theme","light",365),blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer,"dark"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer,"light")):(blitzphpDebugBar.createCookie("debug-bar-theme","dark",365),blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer,"light"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer,"dark"))}),!0)},createCookie:function(e,t,a){if(a){var r=new Date;r.setTime(r.getTime()+24*a*60*60*1e3);var l="; expires="+r.toGMTString()}else l="";document.cookie=e+"="+t+l+"; path=/; samesite=Lax"},readCookie:function(e){for(var t=e+"=",a=document.cookie.split(";"),r=0;r<a.length;r++){for(var l=a[r];" "==l.charAt(0);)l=l.substring(1,l.length);if(0==l.indexOf(t))return l.substring(t.length,l.length)}return null},trimSlash:function(e){return e.replace(/^\/|\/$/g,"")},routerLink:function(){for(var e,t,a=this.toolbar.querySelectorAll('td[data-debugbar-route="GET"]'),r=/\((?:[^)(]+|\((?:[^)(]+|\([^)(]*\))*\))*\)/,l=0;l<a.length;l++)e=a[l],/\/\(.+?\)/.test(a[l].innerText)?e.innerHTML="<div>"+e.innerText+'</div><form data-debugbar-route-tpl="'+blitzphpDebugBar.trimSlash(e.innerText.replace(r,"?"))+'">'+e.innerText.replace(r,'<input type="text" placeholder="$1">')+'<input type="submit" value="Go" style="margin-left: 4px;"></form>':(e.style="cursor: pointer;",e.setAttribute("title",location.origin+"/"+blitzphpDebugBar.trimSlash(e.innerText)),e.addEventListener("click",(function(e){t=location.origin+"/"+blitzphpDebugBar.trimSlash(e.target.innerText),window.open(t,"_blank").location})));a=this.toolbar.querySelectorAll('td[data-debugbar-route="GET"] form');for(l=0;l<a.length;l++)(e=a[l]).addEventListener("submit",(function(e){e.preventDefault();for(var a=[],r=0,l=e.target.querySelectorAll("input[type=text]"),o=e.target.getAttribute("data-debugbar-route-tpl"),i=0;i<l.length;i++)l[i].value.length>0&&a.push(l[i].value);a.length>0&&(t=location.origin+"/"+o.replace(/\?/g,(function(){return a[r++]})),window.open(t,"_blank").location)}))}};
\ No newline at end of file
+var blitzphpDebugBar={toolbarContainer:null,toolbar:null,icon:null,init:function(){this.toolbarContainer=document.getElementById("toolbarContainer"),this.toolbar=document.getElementById("debug-bar"),this.icon=document.getElementById("debug-icon"),blitzphpDebugBar.createListeners(),blitzphpDebugBar.setToolbarState(),blitzphpDebugBar.setToolbarPosition(),blitzphpDebugBar.setToolbarTheme(),blitzphpDebugBar.toggleViewsHints(),blitzphpDebugBar.routerLink(),blitzphpDebugBar.setHotReloadState(),document.getElementById("debug-bar-link").addEventListener("click",blitzphpDebugBar.toggleToolbar,!0),document.getElementById("debug-icon-link").addEventListener("click",blitzphpDebugBar.toggleToolbar,!0);var e=this.toolbar.querySelector('button[data-time="'+localStorage.getItem("debugbar-time")+'"]');blitzphpDebugBar.addClass(e.parentNode.parentNode,"current"),historyLoad=this.toolbar.getElementsByClassName("blitzphp-history-load");for(var t=0;t<historyLoad.length;t++)historyLoad[t].addEventListener("click",(function(){loadDoc(this.getAttribute("data-time"))}),!0);var a=blitzphpDebugBar.readCookie("debug-bar-tab");if(document.getElementById(a)){var r=document.getElementById(a);blitzphpDebugBar.switchClass(r,"debug-bar-ndisplay","debug-bar-dblock"),blitzphpDebugBar.addClass(r,"active"),(a=document.querySelector("[data-tab="+a+"]"))&&blitzphpDebugBar.addClass(a.parentNode,"active")}},createListeners:function(){for(var e=[].slice.call(this.toolbar.querySelectorAll(".blitzphp-label a")),t=0;t<e.length;t++)e[t].addEventListener("click",blitzphpDebugBar.showTab,!0);var a=this.toolbar.querySelectorAll("[data-toggle]");for(t=0;t<a.length;t++){let e=a[t].getAttribute("data-toggle");if("datatable"===e){let e=a[t].getAttribute("data-table");a[t].addEventListener("click",(function(){blitzphpDebugBar.toggleDataTable(e)}),!0)}else if("childrows"===e){let e=a[t].getAttribute("data-child");a[t].addEventListener("click",(function(){blitzphpDebugBar.toggleChildRows(e)}),!0)}else a[t].addEventListener("click",blitzphpDebugBar.toggleRows,!0)}},showTab:function(){var e=document.getElementById(this.getAttribute("data-tab"));if(e){blitzphpDebugBar.createCookie("debug-bar-tab","",-1);for(var t=e.classList.contains("debug-bar-dblock"),a=document.querySelectorAll("#debug-bar .tab"),r=0;r<a.length;r++)blitzphpDebugBar.switchClass(a[r],"debug-bar-dblock","debug-bar-ndisplay");var i=document.querySelectorAll("#debug-bar .blitzphp-label");for(r=0;r<i.length;r++)blitzphpDebugBar.removeClass(i[r],"active");t||(blitzphpDebugBar.switchClass(e,"debug-bar-ndisplay","debug-bar-dblock"),blitzphpDebugBar.addClass(this.parentNode,"active"),blitzphpDebugBar.createCookie("debug-bar-tab",this.getAttribute("data-tab"),365))}},addClass:function(e,t){e.classList?e.classList.add(t):e.className+=" "+t},removeClass:function(e,t){e.classList?e.classList.remove(t):e.className=e.className.replace(new RegExp("(^|\\b)"+t.split(" ").join("|")+"(\\b|$)","gi")," ")},switchClass:function(e,t,a){blitzphpDebugBar.removeClass(e,t),blitzphpDebugBar.addClass(e,a)},toggleRows:function(e){if(e.target){let t=e.target.closest("tr"),a=document.getElementById(t.getAttribute("data-toggle"));a.classList.contains("debug-bar-ndisplay")?blitzphpDebugBar.switchClass(a,"debug-bar-ndisplay","debug-bar-dtableRow"):blitzphpDebugBar.switchClass(a,"debug-bar-dtableRow","debug-bar-ndisplay")}},toggleDataTable:function(e){"string"==typeof e&&(e=document.getElementById(e+"_table")),e&&(e.classList.contains("debug-bar-ndisplay")?blitzphpDebugBar.switchClass(e,"debug-bar-ndisplay","debug-bar-dblock"):blitzphpDebugBar.switchClass(e,"debug-bar-dblock","debug-bar-ndisplay"))},toggleChildRows:function(e){"string"==typeof e&&(par=document.getElementById(e+"_parent"),e=document.getElementById(e+"_children")),par&&e&&(e.classList.contains("debug-bar-ndisplay")?blitzphpDebugBar.removeClass(e,"debug-bar-ndisplay"):blitzphpDebugBar.addClass(e,"debug-bar-ndisplay"),par.classList.toggle("timeline-parent-open"))},toggleToolbar:function(){var e=!blitzphpDebugBar.toolbar.classList.contains("debug-bar-ndisplay");e?(blitzphpDebugBar.switchClass(blitzphpDebugBar.icon,"debug-bar-ndisplay","debug-bar-dinlineBlock"),blitzphpDebugBar.switchClass(blitzphpDebugBar.toolbar,"debug-bar-dinlineBlock","debug-bar-ndisplay")):(blitzphpDebugBar.switchClass(blitzphpDebugBar.icon,"debug-bar-dinlineBlock","debug-bar-ndisplay"),blitzphpDebugBar.switchClass(blitzphpDebugBar.toolbar,"debug-bar-ndisplay","debug-bar-dinlineBlock")),blitzphpDebugBar.createCookie("debug-bar-state","",-1),blitzphpDebugBar.createCookie("debug-bar-state",1==e?"minimized":"open",365)},setToolbarState:function(){"open"!=blitzphpDebugBar.readCookie("debug-bar-state")?(blitzphpDebugBar.switchClass(blitzphpDebugBar.icon,"debug-bar-ndisplay","debug-bar-dinlineBlock"),blitzphpDebugBar.switchClass(blitzphpDebugBar.toolbar,"debug-bar-dinlineBlock","debug-bar-ndisplay")):(blitzphpDebugBar.switchClass(blitzphpDebugBar.icon,"debug-bar-dinlineBlock","debug-bar-ndisplay"),blitzphpDebugBar.switchClass(blitzphpDebugBar.toolbar,"debug-bar-ndisplay","debug-bar-dinlineBlock"))},toggleViewsHints:function(){if(localStorage.getItem("debugbar-time")!=localStorage.getItem("debugbar-time-new"))return void(document.querySelector('a[data-tab="blitzphp-views"]').href="#");var e=[],t=[],a=function(e,t){return null===e.parentNode?null:e.parentNode!==t?a(e.parentNode,t):e};const r=["NOSCRIPT","SCRIPT","STYLE"],i=["HTML","BODY","HEAD"];var l=function(e,t){if(-1!==i.indexOf(e.nodeName)){for(var a=0;a<document.body.children.length;++a){var l=t?document.body.children.length-(a+1):a,o=document.body.children[l];if(-1===r.indexOf(o.nodeName))return[o,t]}return null}for(;null!==e&&-1!==r.indexOf(e.nodeName);)e=t?e.previousElementSibling:e.nextElementSibling;return null===e?null:[e,t]},o=function(e){if(e){if(null!==e.nextElementSibling)return l(e.nextElementSibling,!1)||l(e.previousElementSibling,!0);if(null!==e.previousElementSibling)return l(e.previousElementSibling,!0)}return null};function b(){for(var i in t=function(){for(var e=[],t=[],a=document.evaluate("//comment()[starts-with(., ' DEBUG-VIEW')]",document,null,XPathResult.ANY_TYPE,null),r=a.iterateNext();r;)e.push(r),r=a.iterateNext();for(var i=0;i<e.length;++i){var l=e[i].nodeValue.substring(18,e[i].nodeValue.length-1);"S"===e[i].nodeValue[12]?t[l]=[e[i],null]:t[l]&&(t[l][1]=e[i])}return t}(),t){var l=o(t[i][0]),b=o(t[i][1]);if(null!==l&&null!==b){var d=a(b[0],l[0].parentNode);if(null===d){if(null===(d=a(l[0],b[0].parentNode)))continue;l[0]=d}else b[0]=d;var u,p,s=document.createElement("div"),g=document.createElement("div"),c=l[0].parentNode.childNodes,h=l[0].parentNode;s.classList.add("debug-view"),s.classList.add("show-view"),g.classList.add("debug-view-path"),g.innerText=i,s.appendChild(g);for(var B=0;B<c.length;++B)if(c[B]===t[i][1]||c[B]===t[i][0]||c[B]===l[0]){u=B,c[B]===t[i][0]&&u++;break}l[1]&&u++;for(B=u;B<c.length;++B)if(c[B]===b[0])p=B;else if(c[B]===t[i][1]){p=B;break}var D=p-u;b[1]&&D++;for(B=0;B<D;++B)-1===r.indexOf(c[u])?s.appendChild(c[u]):u++;e.push(h.insertBefore(s,c[u]))}}blitzphpDebugBar.createCookie("debug-view","show",365),blitzphpDebugBar.addClass(n,"active")}var n=document.querySelector("[data-tab=blitzphp-views]");n&&(n.parentNode.onclick=function(){blitzphpDebugBar.readCookie("debug-view")?function(){for(var t=0;t<e.length;++t){for(var a,r=0;r<e[t].parentNode.childNodes.length;++r)if(e[t].parentNode.childNodes[r]===e[t]){a=r;break}for(;1!==e[t].childNodes.length;)e[t].parentNode.insertBefore(e[t].childNodes[1],e[t].parentNode.childNodes[a].nextSibling),a++;e[t].parentNode.removeChild(e[t])}e.length=0,blitzphpDebugBar.createCookie("debug-view","",-1),blitzphpDebugBar.removeClass(n,"active")}():b()},blitzphpDebugBar.readCookie("debug-view")&&b())},setToolbarPosition:function(){var e=this.toolbar.querySelector("#toolbar-position");"top"===blitzphpDebugBar.readCookie("debug-bar-position")&&(blitzphpDebugBar.addClass(blitzphpDebugBar.icon,"fixed-top"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbar,"fixed-top")),e.addEventListener("click",(function(){var e=blitzphpDebugBar.readCookie("debug-bar-position");blitzphpDebugBar.createCookie("debug-bar-position","",-1),e&&"bottom"!==e?(blitzphpDebugBar.createCookie("debug-bar-position","bottom",365),blitzphpDebugBar.removeClass(blitzphpDebugBar.icon,"fixed-top"),blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbar,"fixed-top")):(blitzphpDebugBar.createCookie("debug-bar-position","top",365),blitzphpDebugBar.addClass(blitzphpDebugBar.icon,"fixed-top"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbar,"fixed-top"))}),!0)},setToolbarTheme:function(){var e=this.toolbar.querySelector("#toolbar-theme");window.matchMedia("(prefers-color-scheme: dark)").matches,window.matchMedia("(prefers-color-scheme: light)").matches;"dark"===blitzphpDebugBar.readCookie("debug-bar-theme")?(blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer,"light"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer,"dark")):"light"===blitzphpDebugBar.readCookie("debug-bar-theme")&&(blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer,"dark"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer,"light")),e.addEventListener("click",(function(){var e=blitzphpDebugBar.readCookie("debug-bar-theme");!e&&window.matchMedia("(prefers-color-scheme: dark)").matches||"dark"===e?(blitzphpDebugBar.createCookie("debug-bar-theme","light",365),blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer,"dark"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer,"light")):(blitzphpDebugBar.createCookie("debug-bar-theme","dark",365),blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer,"light"),blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer,"dark"))}),!0)},setHotReloadState:function(){var e,t=document.getElementById("debug-hot-reload").parentNode,a=t.getElementsByTagName("img")[0];t&&(t.onclick=function(){blitzphpDebugBar.readCookie("debug-hot-reload")?(blitzphpDebugBar.createCookie("debug-hot-reload","",-1),blitzphpDebugBar.removeClass(t,"active"),blitzphpDebugBar.removeClass(a,"rotate"),void 0!==e&&(e.close(),e=void 0)):(blitzphpDebugBar.createCookie("debug-hot-reload","show",365),blitzphpDebugBar.addClass(t,"active"),blitzphpDebugBar.addClass(a,"rotate"),e=blitzphpDebugBar.hotReloadConnect())},blitzphpDebugBar.readCookie("debug-hot-reload")&&(blitzphpDebugBar.addClass(t,"active"),blitzphpDebugBar.addClass(a,"rotate"),e=blitzphpDebugBar.hotReloadConnect()))},hotReloadConnect:function(){const e=new EventSource(blitzSiteURL+"/__hot-reload");return e.addEventListener("reload",(function(e){window.location.reload()})),e.onerror=e=>{},e},createCookie:function(e,t,a){if(a){var r=new Date;r.setTime(r.getTime()+24*a*60*60*1e3);var i="; expires="+r.toGMTString()}else i="";document.cookie=e+"="+t+i+"; path=/; samesite=Lax"},readCookie:function(e){for(var t=e+"=",a=document.cookie.split(";"),r=0;r<a.length;r++){for(var i=a[r];" "==i.charAt(0);)i=i.substring(1,i.length);if(0==i.indexOf(t))return i.substring(t.length,i.length)}return null},trimSlash:function(e){return e.replace(/^\/|\/$/g,"")},routerLink:function(){for(var e,t,a=this.toolbar.querySelectorAll('td[data-debugbar-route="GET"]'),r=/\((?:[^)(]+|\((?:[^)(]+|\([^)(]*\))*\))*\)/,i=0;i<a.length;i++)e=a[i],/\/\(.+?\)/.test(a[i].innerText)?e.innerHTML="<div>"+e.innerText+'</div><form data-debugbar-route-tpl="'+blitzphpDebugBar.trimSlash(e.innerText.replace(r,"?"))+'">'+e.innerText.replace(r,'<input type="text" placeholder="$1">')+'<input type="submit" value="Go" class="debug-bar-mleft4"></form>':(blitzphpDebugBar.addClass(e,"debug-bar-pointer"),e.setAttribute("title",location.origin+"/"+blitzphpDebugBar.trimSlash(e.innerText)),e.addEventListener("click",(function(e){t=location.origin+"/"+blitzphpDebugBar.trimSlash(e.target.innerText),window.open(t,"_blank").location})));a=this.toolbar.querySelectorAll('td[data-debugbar-route="GET"] form');for(i=0;i<a.length;i++)(e=a[i]).addEventListener("submit",(function(e){e.preventDefault();for(var a=[],r=0,i=e.target.querySelectorAll("input[type=text]"),l=e.target.getAttribute("data-debugbar-route-tpl"),o=0;o<i.length;o++)i[o].value.length>0&&a.push(i[o].value);a.length>0&&(t=location.origin+"/"+l.replace(/\?/g,(function(){return a[r++]})),window.open(t,"_blank").location)}))}};
\ No newline at end of file
diff --git a/src/Debug/Toolbar/Views/toolbar.css b/src/Debug/Toolbar/Views/toolbar.css
index 92f261fe..bf68e7b3 100644
--- a/src/Debug/Toolbar/Views/toolbar.css
+++ b/src/Debug/Toolbar/Views/toolbar.css
@@ -5,10 +5,11 @@
     z-index: 10000;
     height: 36px;
     width: 36px;
-    margin: 0px;
-    padding: 0px;
+    margin: 0;
+    padding: 0;
     clear: both;
     text-align: center;
+    cursor: pointer;
   }
   #debug-icon a svg {
     margin: 8px;
@@ -23,6 +24,10 @@
     display: none;
   }
   
+  #debug-bar .debug-bar-vars {
+    cursor: pointer;
+  }
+  
   #debug-bar {
     bottom: 0;
     left: 0;
@@ -39,12 +44,15 @@
     display: flex;
     font-weight: normal;
     margin: 0 0 0 auto;
+    padding: 0;
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
   }
   #debug-bar h1 svg {
     width: 16px;
     margin-right: 5px;
   }
   #debug-bar h2 {
+    font-weight: bold;
     font-size: 16px;
     margin: 0;
     padding: 5px 0 10px 0;
@@ -87,6 +95,7 @@
     line-height: normal;
     margin: 5px 10px 15px 10px;
     width: calc(100% - 10px);
+    overflow-y: auto;
   }
   #debug-bar table strong {
     font-weight: 500;
@@ -148,19 +157,21 @@
     bottom: auto;
     top: 36px;
   }
-  #debug-bar #toolbar-position a,
-  #debug-bar #toolbar-theme a {
+  #debug-bar #toolbar-position,
+  #debug-bar #toolbar-theme {
     padding: 0 6px;
     display: inline-flex;
     vertical-align: top;
+    cursor: pointer;
   }
-  #debug-bar #toolbar-position a:hover,
-  #debug-bar #toolbar-theme a:hover {
+  #debug-bar #toolbar-position:hover,
+  #debug-bar #toolbar-theme:hover {
     text-decoration: none;
   }
   #debug-bar #debug-bar-link {
     display: flex;
     padding: 6px;
+    cursor: pointer;
   }
   #debug-bar .blitzphp-label {
     display: inline-flex;
@@ -196,6 +207,8 @@
     white-space: nowrap;
   }
   #debug-bar .tab {
+    height: fit-content;
+    text-align: left;
     bottom: 35px;
     display: none;
     left: 0;
@@ -208,6 +221,8 @@
     z-index: 9999;
   }
   #debug-bar .timeline {
+    position: static;
+    display: table;
     margin-left: 0;
     width: 100%;
   }
@@ -280,6 +295,9 @@
     padding-left: 1em;
     text-align: right;
   }
+  #debug-bar > .debug-bar-dblock {
+    display: block;
+  }
   
   .debug-view.show-view {
     border: 1px solid;
@@ -307,6 +325,25 @@
       display: none !important;
     }
   }
+  @media screen and (max-width: 768px) {
+    #debug-bar table {
+      display: block;
+      font-size: 12px;
+      margin: 5px 5px 10px 5px;
+    }
+    #debug-bar table td,
+    #debug-bar table th {
+      padding: 4px 6px;
+    }
+    #debug-bar .timeline {
+      display: block;
+      white-space: nowrap;
+      font-size: 12px;
+    }
+    #debug-bar .toolbar {
+      overflow-x: auto;
+    }
+  }
   #debug-icon {
     background-color: #FFFFFF;
     box-shadow: 0 0 4px #DFDFDF;
@@ -524,9 +561,6 @@
     #debug-bar .timeline .timer {
       background-color: #c2bb44;
     }
-    #debug-bar .timeline .timeline-parent-open td {
-      color: #252525;
-    }
     .debug-view.show-view {
       border-color: #c2bb44;
     }
@@ -639,9 +673,6 @@
   #toolbarContainer.dark #debug-bar .timeline .timer {
     background-color: #c2bb44;
   }
-  #toolbarContainer.dark #debug-bar .timeline .timeline-parent-open td {
-    color: #252525;
-  }
   #toolbarContainer.dark .debug-view.show-view {
     border-color: #c2bb44;
   }
@@ -802,4 +833,47 @@
   .debug-bar-noverflow {
     overflow: hidden;
   }
-  
\ No newline at end of file
+  
+  .debug-bar-dtableRow {
+    display: table-row;
+  }
+  
+  .debug-bar-dinlineBlock {
+    display: inline-block;
+  }
+  
+  .debug-bar-pointer {
+    cursor: pointer;
+  }
+  
+  .debug-bar-mleft4 {
+    margin-left: 4px;
+  }
+  
+  .debug-bar-level-0 {
+    --level: 0;
+  }
+  
+  .debug-bar-level-1 {
+    --level: 1;
+  }
+  
+  .debug-bar-level-2 {
+    --level: 2;
+  }
+  
+  .debug-bar-level-3 {
+    --level: 3;
+  }
+  
+  .debug-bar-level-4 {
+    --level: 4;
+  }
+  
+  .debug-bar-level-5 {
+    --level: 5;
+  }
+  
+  .debug-bar-level-6 {
+    --level: 6;
+  }
\ No newline at end of file
diff --git a/src/Debug/Toolbar/Views/toolbar.js b/src/Debug/Toolbar/Views/toolbar.js
new file mode 100644
index 00000000..6f1d4f44
--- /dev/null
+++ b/src/Debug/Toolbar/Views/toolbar.js
@@ -0,0 +1,824 @@
+/*
+ * Fonctionnalité de la barre d'outils de débogage BlitzPHP.
+ */
+
+var blitzphpDebugBar = {
+    toolbarContainer: null,
+    toolbar: null,
+    icon: null,
+
+    init: function () {
+        this.toolbarContainer = document.getElementById("toolbarContainer");
+        this.toolbar = document.getElementById("debug-bar");
+        this.icon = document.getElementById("debug-icon");
+
+        blitzphpDebugBar.createListeners();
+        blitzphpDebugBar.setToolbarState();
+        blitzphpDebugBar.setToolbarPosition();
+        blitzphpDebugBar.setToolbarTheme();
+        blitzphpDebugBar.toggleViewsHints();
+        blitzphpDebugBar.routerLink();
+        blitzphpDebugBar.setHotReloadState();
+
+        document
+            .getElementById("debug-bar-link")
+            .addEventListener("click", blitzphpDebugBar.toggleToolbar, true);
+        document
+            .getElementById("debug-icon-link")
+            .addEventListener("click", blitzphpDebugBar.toggleToolbar, true);
+
+        // Permet de mettre en évidence la ligne d'historique de la requete en cours
+        var btn = this.toolbar.querySelector(
+            'button[data-time="' + localStorage.getItem("debugbar-time") + '"]'
+        );
+        blitzphpDebugBar.addClass(btn.parentNode.parentNode, "current");
+
+        historyLoad = this.toolbar.getElementsByClassName("blitzphp-history-load");
+
+        for (var i = 0; i < historyLoad.length; i++) {
+            historyLoad[i].addEventListener(
+                "click",
+                function () {
+                    loadDoc(this.getAttribute("data-time"));
+                },
+                true
+            );
+        }
+
+        // Afficher l'onglet actif au chargement de la page
+        var tab = blitzphpDebugBar.readCookie("debug-bar-tab");
+        if (document.getElementById(tab)) {
+            var el = document.getElementById(tab);
+            blitzphpDebugBar.switchClass(el, "debug-bar-ndisplay", "debug-bar-dblock");
+            blitzphpDebugBar.addClass(el, "active");
+            tab = document.querySelector("[data-tab=" + tab + "]");
+            if (tab) {
+                blitzphpDebugBar.addClass(tab.parentNode, "active");
+            }
+        }
+    },
+
+    createListeners: function () {
+        var buttons = [].slice.call(
+            this.toolbar.querySelectorAll(".blitzphp-label a")
+        );
+
+        for (var i = 0; i < buttons.length; i++) {
+            buttons[i].addEventListener("click", blitzphpDebugBar.showTab, true);
+        }
+
+        // Connecter une bascule générique via les attributs de données `data-toggle="foo"`
+        var links = this.toolbar.querySelectorAll("[data-toggle]");
+        for (var i = 0; i < links.length; i++) {
+            let toggleData = links[i].getAttribute("data-toggle");
+            if (toggleData === "datatable") {
+
+                let datatable = links[i].getAttribute("data-table");
+                links[i].addEventListener("click", function() {
+                    blitzphpDebugBar.toggleDataTable(datatable)
+                }, true);
+               
+            } else if (toggleData === "childrows") {
+
+                let child = links[i].getAttribute("data-child");
+                links[i].addEventListener("click", function() {
+                    blitzphpDebugBar.toggleChildRows(child)
+                }, true);
+                
+            } else {
+                links[i].addEventListener("click", blitzphpDebugBar.toggleRows, true);
+            }
+        }
+    },
+
+    showTab: function () {
+        // Obtenir l'onglet cible, le cas échéant
+        var tab = document.getElementById(this.getAttribute("data-tab"));
+
+        // Si l'étiquette n'a pas de tabulation, arrêtez-vous ici
+        if (! tab) {
+            return;
+        }
+
+        // Supprimer le cookie de la barre de débogage
+        blitzphpDebugBar.createCookie("debug-bar-tab", "", -1);
+
+        // Vérifiez notre état actuel.
+        var state = tab.classList.contains("debug-bar-dblock");
+
+        // Masquer tous les onglets
+        var tabs = document.querySelectorAll("#debug-bar .tab");
+
+        for (var i = 0; i < tabs.length; i++) {
+            blitzphpDebugBar.switchClass(tabs[i], "debug-bar-dblock", "debug-bar-ndisplay");
+        }
+
+        // Marquer toutes les étiquettes comme inactives
+        var labels = document.querySelectorAll("#debug-bar .blitzphp-label");
+
+        for (var i = 0; i < labels.length; i++) {
+            blitzphpDebugBar.removeClass(labels[i], "active");
+        }
+
+        // Afficher/masquer l'onglet sélectionné
+        if (! state) {
+            blitzphpDebugBar.switchClass(tab, "debug-bar-ndisplay", "debug-bar-dblock");
+            blitzphpDebugBar.addClass(this.parentNode, "active");
+            // Créer un cookie de débogage-barre-onglet à l'état persistant
+            blitzphpDebugBar.createCookie(
+                "debug-bar-tab",
+                this.getAttribute("data-tab"),
+                365
+            );
+        }
+    },
+
+    addClass: function (el, className) {
+        if (el.classList) {
+            el.classList.add(className);
+        } else {
+            el.className += " " + className;
+        }
+    },
+
+    removeClass: function (el, className) {
+        if (el.classList) {
+            el.classList.remove(className);
+        } else {
+            el.className = el.className.replace(
+                new RegExp(
+                    "(^|\\b)" + className.split(" ").join("|") + "(\\b|$)",
+                    "gi"
+                ),
+                " "
+            );
+        }
+    },
+
+    switchClass  : function(el, classFrom, classTo) {
+        blitzphpDebugBar.removeClass(el, classFrom);
+        blitzphpDebugBar.addClass(el, classTo);
+    },
+
+    /**
+     * Basculer l'affichage d'un autre objet en fonction de la valeur de basculement des données de cet objet
+     *
+     * @param event
+     */
+    toggleRows: function (event) {
+        if (event.target) {
+            let row = event.target.closest("tr");
+            let target = document.getElementById(
+                row.getAttribute("data-toggle")
+            );
+
+            if (target.classList.contains("debug-bar-ndisplay")) {
+                blitzphpDebugBar.switchClass(target, "debug-bar-ndisplay", "debug-bar-dtableRow");   
+            } else {
+                blitzphpDebugBar.switchClass(target, "debug-bar-dtableRow", "debug-bar-ndisplay");
+            } 
+        }
+    },
+
+    /**
+     * Basculer l'affichage d'un tableau de données
+     *
+     * @param obj
+     */
+    toggleDataTable: function (obj) {
+        if (typeof obj == "string") {
+            obj = document.getElementById(obj + "_table");
+        }
+
+        if (obj) {
+            if (obj.classList.contains("debug-bar-ndisplay")) {
+                blitzphpDebugBar.switchClass(obj, "debug-bar-ndisplay", "debug-bar-dblock");
+            } else {
+                blitzphpDebugBar.switchClass(obj, "debug-bar-dblock", "debug-bar-ndisplay");
+            }
+        }
+    },
+
+    /**
+     * Activer/désactiver l'affichage des éléments enfants de la chronologie
+     *
+     * @param obj
+     */
+    toggleChildRows: function (obj) {
+        if (typeof obj == "string") {
+            par = document.getElementById(obj + "_parent");
+            obj = document.getElementById(obj + "_children");
+        }
+
+        if (par && obj) {
+
+            if (obj.classList.contains("debug-bar-ndisplay")) {
+                blitzphpDebugBar.removeClass(obj, "debug-bar-ndisplay");
+            } else {
+                blitzphpDebugBar.addClass(obj, "debug-bar-ndisplay");
+            }
+
+            par.classList.toggle("timeline-parent-open");
+        }
+    },
+
+    //--------------------------------------------------------------------
+
+    /**
+     *   Basculer la barre d'outils de pleine à icône et de l'icône à pleine (aggrandir/reduire)
+     */
+    toggleToolbar: function () {
+        var open = ! blitzphpDebugBar.toolbar.classList.contains("debug-bar-ndisplay");
+
+        if (open) {
+            blitzphpDebugBar.switchClass(blitzphpDebugBar.icon, "debug-bar-ndisplay", "debug-bar-dinlineBlock");
+            blitzphpDebugBar.switchClass(blitzphpDebugBar.toolbar, "debug-bar-dinlineBlock", "debug-bar-ndisplay");
+        } else {
+            blitzphpDebugBar.switchClass(blitzphpDebugBar.icon, "debug-bar-dinlineBlock", "debug-bar-ndisplay");
+            blitzphpDebugBar.switchClass(blitzphpDebugBar.toolbar, "debug-bar-ndisplay", "debug-bar-dinlineBlock");
+        }
+
+        // Remember it for other page loads on this site
+        blitzphpDebugBar.createCookie("debug-bar-state", "", -1);
+        blitzphpDebugBar.createCookie(
+            "debug-bar-state",
+            open == true ? "minimized" : "open",
+            365
+        );
+    },
+
+    /**
+     * Définit l'état initial de la barre d'outils (ouverte ou réduite) lorsque la page est chargée 
+     * pour la première fois pour lui permettre de mémoriser l'état entre les actualisations.
+     */
+    setToolbarState: function () {
+        var open = blitzphpDebugBar.readCookie("debug-bar-state");
+
+        if (open != "open") {
+            blitzphpDebugBar.switchClass(blitzphpDebugBar.icon, "debug-bar-ndisplay", "debug-bar-dinlineBlock");
+            blitzphpDebugBar.switchClass(blitzphpDebugBar.toolbar, "debug-bar-dinlineBlock", "debug-bar-ndisplay");
+        } else {
+            blitzphpDebugBar.switchClass(blitzphpDebugBar.icon, "debug-bar-dinlineBlock", "debug-bar-ndisplay");
+            blitzphpDebugBar.switchClass(blitzphpDebugBar.toolbar, "debug-bar-ndisplay", "debug-bar-dinlineBlock");
+        } 
+    },
+
+    toggleViewsHints: function () {
+        // Évitez les astuces de basculement sur les demandes d'historique qui ne sont pas les initiales
+        if (
+            localStorage.getItem("debugbar-time") !=
+            localStorage.getItem("debugbar-time-new")
+        ) {
+            var a = document.querySelector('a[data-tab="blitzphp-views"]');
+            a.href = "#";
+            return;
+        }
+
+        var nodeList = []; // [ Element, NewElement( 1 )/OldElement( 0 ) ]
+        var sortedComments = [];
+        var comments = [];
+
+        var getComments = function () {
+            var nodes = [];
+            var result = [];
+            var xpathResults = document.evaluate(
+                "//comment()[starts-with(., ' DEBUG-VIEW')]",
+                document,
+                null,
+                XPathResult.ANY_TYPE,
+                null
+            );
+            var nextNode = xpathResults.iterateNext();
+            while (nextNode) {
+                nodes.push(nextNode);
+                nextNode = xpathResults.iterateNext();
+            }
+
+            // trier les commentaires par balises d'ouverture et de fermeture
+            for (var i = 0; i < nodes.length; ++i) {
+                // obtenir le chemin du fichier + le nom à utiliser comme clé
+                var path = nodes[i].nodeValue.substring(
+                    18,
+                    nodes[i].nodeValue.length - 1
+                );
+
+                if (nodes[i].nodeValue[12] === "S") {
+                    // vérification simple pour démarrer le commentaire
+                    // créer une nouvelle entrée
+                    result[path] = [nodes[i], null];
+                } else if (result[path]) {
+                    // ajouter à l'entrée existante
+                    result[path][1] = nodes[i];
+                }
+            }
+
+            return result;
+        };
+
+        // trouver le nœud qui a TargetNode comme parentNode
+        var getParentNode = function (node, targetNode) {
+            if (node.parentNode === null) {
+                return null;
+            }
+
+            if (node.parentNode !== targetNode) {
+                return getParentNode(node.parentNode, targetNode);
+            }
+
+            return node;
+        };
+
+        // définir les éléments invalides et externes (également invalides)
+        const INVALID_ELEMENTS = ["NOSCRIPT", "SCRIPT", "STYLE"];
+        const OUTER_ELEMENTS = ["HTML", "BODY", "HEAD"];
+
+        var getValidElementInner = function (node, reverse) {
+            // gérer les balises invalides
+            if (OUTER_ELEMENTS.indexOf(node.nodeName) !== -1) {
+                for (var i = 0; i < document.body.children.length; ++i) {
+                    var index = reverse
+                        ? document.body.children.length - (i + 1)
+                        : i;
+                    var element = document.body.children[index];
+
+                    // ignorer les balises invalides
+                    if (INVALID_ELEMENTS.indexOf(element.nodeName) !== -1) {
+                        continue;
+                    }
+
+                    return [element, reverse];
+                }
+
+                return null;
+            }
+
+            // passer à l'élément valide suivant
+            while (
+                node !== null &&
+                INVALID_ELEMENTS.indexOf(node.nodeName) !== -1
+            ) {
+                node = reverse
+                    ? node.previousElementSibling
+                    : node.nextElementSibling;
+            }
+
+            // renvoyer un element non-tableau (null) si nous n'avons pas trouvé quelque chose
+            if (node === null) {
+                return null;
+            }
+
+            return [node, reverse];
+        };
+
+        // Obtenir l'élément valide suivant (pour ajouter des divs en toute sécurité)
+        // @return [élément, élément ignoré] ou null si nous n'avons pas trouvé d'emplacement valide
+        var getValidElement = function (nodeElement) {
+            if (nodeElement) {
+                if (nodeElement.nextElementSibling !== null) {
+                    return (
+                        getValidElementInner(
+                            nodeElement.nextElementSibling,
+                            false
+                        ) ||
+                        getValidElementInner(
+                            nodeElement.previousElementSibling,
+                            true
+                        )
+                    );
+                }
+                if (nodeElement.previousElementSibling !== null) {
+                    return getValidElementInner(
+                        nodeElement.previousElementSibling,
+                        true
+                    );
+                }
+            }
+
+            // quelque chose s'est mal passé ! -> l'élément n'est pas dans le DOM
+            return null;
+        };
+
+        function showHints() {
+            // Vous aviez AJAX ? Réinitialiser les blocs de vue
+            sortedComments = getComments();
+
+            for (var key in sortedComments) {
+                var startElement = getValidElement(sortedComments[key][0]);
+                var endElement = getValidElement(sortedComments[key][1]);
+
+                // ignorer si nous ne pouvons pas obtenir un élément valide
+                if (startElement === null || endElement === null) {
+                    continue;
+                }
+
+                // trouver l'élément qui a le même parent que l'élément de départ
+                var jointParent = getParentNode(
+                    endElement[0],
+                    startElement[0].parentNode
+                );
+                if (jointParent === null) {
+                    // trouver l'élément qui a le même parent que l'élément final
+                    jointParent = getParentNode(
+                        startElement[0],
+                        endElement[0].parentNode
+                    );
+                    if (jointParent === null) {
+                        // les deux tentatives ont échoué
+                        continue;
+                    } else {
+                        startElement[0] = jointParent;
+                    }
+                } else {
+                    endElement[0] = jointParent;
+                }
+
+                var debugDiv = document.createElement("div"); // titulaire
+                var debugPath = document.createElement("div"); // chemein
+                var childArray = startElement[0].parentNode.childNodes; // tableau des enfants cibles
+                var parent = startElement[0].parentNode;
+                var start, end;
+
+                // configuration du container
+                debugDiv.classList.add("debug-view");
+                debugDiv.classList.add("show-view");
+                debugPath.classList.add("debug-view-path");
+                debugPath.innerText = key;
+                debugDiv.appendChild(debugPath);
+
+                // calculer la distance entre eux
+                // debut
+                for (var i = 0; i < childArray.length; ++i) {
+                    // vérifier le commentaire (début et fin) -> s'il est antérieur à un élément de départ valide
+                    if (
+                        childArray[i] === sortedComments[key][1] ||
+                        childArray[i] === sortedComments[key][0] ||
+                        childArray[i] === startElement[0]
+                    ) {
+                        start = i;
+                        if (childArray[i] === sortedComments[key][0]) {
+                            start++; // augmenter pour ignorer le commentaire de départ
+                        }
+                        break;
+                    }
+                }
+                // ajuster si nous voulons ignorer l'élément de départ
+                if (startElement[1]) {
+                    start++;
+                }
+
+                // fin
+                for (var i = start; i < childArray.length; ++i) {
+                    if (childArray[i] === endElement[0]) {
+                        end = i;
+                        // ne pas interrompre pour vérifier le commentaire de fin après l'élément valide de fin
+                    } else if (childArray[i] === sortedComments[key][1]) {
+                        // si nous trouvons le commentaire final, nous pouvons casser
+                        end = i;
+                        break;
+                    }
+                }
+
+                // déplacer des éléments
+                var number = end - start;
+                if (endElement[1]) {
+                    number++;
+                }
+                for (var i = 0; i < number; ++i) {
+                    if (INVALID_ELEMENTS.indexOf(childArray[start]) !== -1) {
+                        // ignorer les enfants invalides qui peuvent causer des problèmes s'ils sont déplacés
+                        start++;
+                        continue;
+                    }
+                    debugDiv.appendChild(childArray[start]);
+                }
+
+                // ajouter le conteneur au DOM
+                nodeList.push(parent.insertBefore(debugDiv, childArray[start]));
+            }
+
+            blitzphpDebugBar.createCookie("debug-view", "show", 365);
+            blitzphpDebugBar.addClass(btn, "active");
+        }
+
+        function hideHints() {
+            for (var i = 0; i < nodeList.length; ++i) {
+                var index;
+
+                // trouver l'index
+                for (
+                    var j = 0;
+                    j < nodeList[i].parentNode.childNodes.length;
+                    ++j
+                ) {
+                    if (nodeList[i].parentNode.childNodes[j] === nodeList[i]) {
+                        index = j;
+                        break;
+                    }
+                }
+
+                // déplacer l'enfant vers l'arrière
+                while (nodeList[i].childNodes.length !== 1) {
+                    nodeList[i].parentNode.insertBefore(
+                        nodeList[i].childNodes[1],
+                        nodeList[i].parentNode.childNodes[index].nextSibling
+                    );
+                    index++;
+                }
+
+                nodeList[i].parentNode.removeChild(nodeList[i]);
+            }
+            nodeList.length = 0;
+
+            blitzphpDebugBar.createCookie("debug-view", "", -1);
+            blitzphpDebugBar.removeClass(btn, "active");
+        }
+
+        var btn = document.querySelector("[data-tab=blitzphp-views]");
+
+        // Si le collecteur de vues est inactif, il s'arrête ici
+        if (! btn) {
+            return;
+        }
+
+        btn.parentNode.onclick = function () {
+            if (blitzphpDebugBar.readCookie("debug-view")) {
+                hideHints();
+            } else {
+                showHints();
+            }
+        };
+
+        // Déterminer l'état des indices lors du chargement de la page
+        if (blitzphpDebugBar.readCookie("debug-view")) {
+            showHints();
+        }
+    },
+
+    setToolbarPosition: function () {
+        var btnPosition = this.toolbar.querySelector("#toolbar-position");
+
+        if (blitzphpDebugBar.readCookie("debug-bar-position") === "top") {
+            blitzphpDebugBar.addClass(blitzphpDebugBar.icon, "fixed-top");
+            blitzphpDebugBar.addClass(blitzphpDebugBar.toolbar, "fixed-top");
+        }
+
+        btnPosition.addEventListener(
+            "click",
+            function () {
+                var position = blitzphpDebugBar.readCookie("debug-bar-position");
+
+                blitzphpDebugBar.createCookie("debug-bar-position", "", -1);
+
+                if (! position || position === "bottom") {
+                    blitzphpDebugBar.createCookie("debug-bar-position", "top", 365);
+                    blitzphpDebugBar.addClass(blitzphpDebugBar.icon, "fixed-top");
+                    blitzphpDebugBar.addClass(blitzphpDebugBar.toolbar, "fixed-top");
+                } else {
+                    blitzphpDebugBar.createCookie(
+                        "debug-bar-position",
+                        "bottom",
+                        365
+                    );
+                    blitzphpDebugBar.removeClass(blitzphpDebugBar.icon, "fixed-top");
+                    blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbar, "fixed-top");
+                }
+            },
+            true
+        );
+    },
+
+    setToolbarTheme: function () {
+        var btnTheme = this.toolbar.querySelector("#toolbar-theme");
+        var isDarkMode = window.matchMedia(
+            "(prefers-color-scheme: dark)"
+        ).matches;
+        var isLightMode = window.matchMedia(
+            "(prefers-color-scheme: light)"
+        ).matches;
+
+        // Si un cookie est défini avec une valeur, nous forçons le schéma de couleurs
+        if (blitzphpDebugBar.readCookie("debug-bar-theme") === "dark") {
+            blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer, "light");
+            blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer, "dark");
+        } else if (blitzphpDebugBar.readCookie("debug-bar-theme") === "light") {
+            blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer, "dark");
+            blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer, "light");
+        }
+
+        btnTheme.addEventListener(
+            "click",
+            function () {
+                var theme = blitzphpDebugBar.readCookie("debug-bar-theme");
+
+                if (
+                    ! theme &&
+                    window.matchMedia("(prefers-color-scheme: dark)").matches
+                ) {
+                    // S'il n'y a pas de cookie et que « prefers-color-scheme » est défini sur « dark », 
+                    // cela signifie que l'utilisateur souhaite passer en mode clair.
+                    blitzphpDebugBar.createCookie("debug-bar-theme", "light", 365);
+                    blitzphpDebugBar.removeClass(blitzphpDebugBar.toolbarContainer, "dark");
+                    blitzphpDebugBar.addClass(blitzphpDebugBar.toolbarContainer, "light");
+                } else {
+                    if (theme === "dark") {
+                        blitzphpDebugBar.createCookie(
+                            "debug-bar-theme",
+                            "light",
+                            365
+                        );
+                        blitzphpDebugBar.removeClass(
+                            blitzphpDebugBar.toolbarContainer,
+                            "dark"
+                        );
+                        blitzphpDebugBar.addClass(
+                            blitzphpDebugBar.toolbarContainer,
+                            "light"
+                        );
+                    } else {
+                        // Dans tous les autres cas : s'il n'y a pas de cookie, ou si le cookie est réglé sur 
+                        // « light », ou si le « prefers-color-scheme » est « light »...
+                        blitzphpDebugBar.createCookie("debug-bar-theme", "dark", 365);
+                        blitzphpDebugBar.removeClass(
+                            blitzphpDebugBar.toolbarContainer,
+                            "light"
+                        );
+                        blitzphpDebugBar.addClass(
+                            blitzphpDebugBar.toolbarContainer,
+                            "dark"
+                        );
+                    }
+                }
+            },
+            true
+        );
+    },
+
+    setHotReloadState: function () {
+        var btn = document.getElementById("debug-hot-reload").parentNode;
+        var btnImg = btn.getElementsByTagName("img")[0];
+        var eventSource;
+
+        // Si le collecteur de rechargement à chaud est inactif, il s'arrête ici
+        if (! btn) {
+            return;
+        }
+
+        btn.onclick = function () {
+            if (blitzphpDebugBar.readCookie("debug-hot-reload")) {
+                blitzphpDebugBar.createCookie("debug-hot-reload", "", -1);
+                blitzphpDebugBar.removeClass(btn, "active");
+                blitzphpDebugBar.removeClass(btnImg, "rotate");
+
+                // Fermez la connexion EventSource si elle existe
+                if (typeof eventSource !== "undefined") {
+                    eventSource.close();
+                    eventSource = void 0; // Indéfinir la variable
+                }
+            } else {
+                blitzphpDebugBar.createCookie("debug-hot-reload", "show", 365);
+                blitzphpDebugBar.addClass(btn, "active");
+                blitzphpDebugBar.addClass(btnImg, "rotate");
+
+                eventSource = blitzphpDebugBar.hotReloadConnect();
+            }
+        };
+
+        // Déterminer l'état de rechargement à chaud lors du chargement de la page
+        if (blitzphpDebugBar.readCookie("debug-hot-reload")) {
+            blitzphpDebugBar.addClass(btn, "active");
+            blitzphpDebugBar.addClass(btnImg, "rotate");
+            eventSource = blitzphpDebugBar.hotReloadConnect();
+        }
+    },
+
+    hotReloadConnect: function () {
+        const eventSource = new EventSource(blitzSiteURL  + "/__hot-reload");
+
+        eventSource.addEventListener("reload", function (e) {
+            console.log("reload", e);
+            window.location.reload();
+        });
+
+        eventSource.onerror = (err) => {
+            console.error("EventSource failed:", err);
+        };
+
+        return eventSource;
+    },
+
+    /**
+     * Aide à la création d'un cookie.
+     *
+     * @param name
+     * @param value
+     * @param days
+     */
+    createCookie: function (name, value, days) {
+        if (days) {
+            var date = new Date();
+
+            date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
+
+            var expires = "; expires=" + date.toGMTString();
+        } else {
+            var expires = "";
+        }
+
+        document.cookie =
+            name + "=" + value + expires + "; path=/; samesite=Lax";
+    },
+
+    readCookie: function (name) {
+        var nameEQ = name + "=";
+        var ca = document.cookie.split(";");
+
+        for (var i = 0; i < ca.length; i++) {
+            var c = ca[i];
+            while (c.charAt(0) == " ") {
+                c = c.substring(1, c.length);
+            }
+            if (c.indexOf(nameEQ) == 0) {
+                return c.substring(nameEQ.length, c.length);
+            }
+        }
+        return null;
+    },
+
+    trimSlash: function (text) {
+        return text.replace(/^\/|\/$/g, "");
+    },
+
+    routerLink: function () {
+        var row, _location;
+        var rowGet = this.toolbar.querySelectorAll(
+            'td[data-debugbar-route="GET"]'
+        );
+        var patt = /\((?:[^)(]+|\((?:[^)(]+|\([^)(]*\))*\))*\)/;
+
+        for (var i = 0; i < rowGet.length; i++) {
+            row = rowGet[i];
+            if (!/\/\(.+?\)/.test(rowGet[i].innerText)) {
+                blitzphpDebugBar.addClass(row, "debug-bar-pointer");
+                row.setAttribute(
+                    "title",
+                    location.origin + "/" + blitzphpDebugBar.trimSlash(row.innerText)
+                );
+                row.addEventListener("click", function (ev) {
+                    _location =
+                        location.origin +
+                        "/" +
+                        blitzphpDebugBar.trimSlash(ev.target.innerText);
+                    var redirectWindow = window.open(_location, "_blank");
+                    redirectWindow.location;
+                });
+            } else {
+                row.innerHTML =
+                    "<div>" +
+                    row.innerText +
+                    "</div>" +
+                    '<form data-debugbar-route-tpl="' +
+                    blitzphpDebugBar.trimSlash(row.innerText.replace(patt, "?")) +
+                    '">' +
+                    row.innerText.replace(
+                        patt,
+                        '<input type="text" placeholder="$1">'
+                    ) +
+                    '<input type="submit" value="Go" class="debug-bar-mleft4">' +
+                    "</form>";
+            }
+        }
+
+        rowGet = this.toolbar.querySelectorAll(
+            'td[data-debugbar-route="GET"] form'
+        );
+        for (var i = 0; i < rowGet.length; i++) {
+            row = rowGet[i];
+
+            row.addEventListener("submit", function (event) {
+                event.preventDefault();
+                var inputArray = [],
+                    t = 0;
+                var input = event.target.querySelectorAll("input[type=text]");
+                var tpl = event.target.getAttribute("data-debugbar-route-tpl");
+
+                for (var n = 0; n < input.length; n++) {
+                    if (input[n].value.length > 0) {
+                        inputArray.push(input[n].value);
+                    }
+                }
+
+                if (inputArray.length > 0) {
+                    _location =
+                        location.origin +
+                        "/" +
+                        tpl.replace(/\?/g, function () {
+                            return inputArray[t++];
+                        });
+
+                    var redirectWindow = window.open(_location, "_blank");
+                    redirectWindow.location;
+                }
+            });
+        }
+    },
+};
diff --git a/src/Debug/Toolbar/Views/toolbar.tpl.php b/src/Debug/Toolbar/Views/toolbar.tpl.php
index daee1d4d..890b18e1 100644
--- a/src/Debug/Toolbar/Views/toolbar.tpl.php
+++ b/src/Debug/Toolbar/Views/toolbar.tpl.php
@@ -19,11 +19,10 @@
  */
 ?>
 <style type="text/css">/* BlitzPHP - Debug bar ======== Credit: CodeIgniter - https://codeigniter.com */<?= preg_replace('#[\r\n\t ]+#', ' ', file_get_contents(__DIR__ . '/toolbar.css')) ?></style>
-<script id="toolbar_js" type="text/javascript">/* BlitzPHP - Debug bar ======== Credit: CodeIgniter - https://codeigniter.com */<?= file_get_contents(__DIR__ . '/toolbar-min.js') ?></script>
-
+<script id="toolbar_js" type="text/javascript">/* BlitzPHP - Debug bar ======== Credit: CodeIgniter - https://codeigniter.com */var blitzSiteURL = "<?= rtrim(site_url(), '/') ?>"; <?= file_get_contents(__DIR__ . '/toolbar-min.js') ?></script>
 <!-- BlitzPHP - Debug bar ======== Credit: CodeIgniter - https://codeigniter.com  -->
-<div id="debug-icon" class="debug-bar-ndisplay">
-    <a id="debug-icon-link" href="javascript:void(0)">
+ <div id="debug-icon" class="debug-bar-ndisplay">
+    <a id="debug-icon-link">
     <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
 			x="0px" y="0px" width="200px" height="200px" viewBox="0 0 200 200" preserveAspectRatio="xMidYMid meet" enable-background="new 0 0 175 173" xml:space="preserve">
         <image width="200" height="200" x="0" y="0" xlink:href="data:image/png;base64,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" />
@@ -32,10 +31,15 @@
 </div>
 <div id="debug-bar">
     <div class="toolbar">
-        <span id="toolbar-position"><a href="javascript: void(0)">&#8597;</a></span>
-        <span id="toolbar-theme"><a href="javascript: void(0)">&#128261;</a></span>
+        <span id="toolbar-position">&#8597;</span>
+        <span id="toolbar-theme">&#128261;</span>
+        <span id="hot-reload-btn" class="blitzphp-label">
+            <a id="debug-hot-reload" title="Basculer le rechargement à chaud">
+                <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAABNklEQVR4nN2US04CQRCGv/DaiBxEvYWuBRPDKSCIXsCdcg0ULqTI8xIGN7JwTCU/ScV5tTO64Us6maSq/7+nuqvgkLgHopTl+QAWwBToAg3+wMTzM7YBrihp4jkCToEB8OJyRkCFAB5yDDxVoAd8OpNMOkrcAeMAgz3nzsQ0EqkDayXZqXy5Qugrdy2tGNdKeNWv40xCqGpvJK0YEwXt8ooylMZzUnCh4EkJgzNpmFaMrYLNEgbH0thmGVhSUVrSeE8KLv+7RBMFb0oY3EnDeihGN+WZhmJ7ZlnPtKHB5RvtNwy0d5XWaGgqRmp7a/9QLjRevoDLvOSRM+nnlKumk++0xwZlLhVnEulOhnohTS37vnU1t5M/ho7rPR03/LKW1bxNQep6ETZb5mpGW2/Ak2KpF3oYfAPX9Xpc671kqwAAAABJRU5ErkJggg==" />
+            </a>
+        </span>
         <span class="blitzphp-label">
-            <a href="javascript: void(0)" data-tab="blitzphp-timeline">
+            <a data-tab="blitzphp-timeline">
                 <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAD7SURBVEhLY6ArSEtLK09NTbWHcvGC9PR0BaDaQiAdUl9fzwQVxg+AFvwHamqHcnGCpKQkeaDa9yD1UD09UCn8AKaBWJySkmIApFehi0ONwwRQBceBLurAh4FqFoHUAtkrgPgREN+ByYEw1DhMANVEMIhAYQ5U1wtU/wmILwLZRlAp/IBYC8gGw88CaFj3A/FnIL4ETDXGUCnyANSC/UC6HIpnQMXAqQXIvo0khxNDjcMEQEmU9AzDuNI7Lgw1DhOAJIEuhQcRKMcC+e+QNHdDpcgD6BaAANSSQqBcENFlDi6AzQKqgkFlwWhxjVI8o2OgmkFaXI8CTMDAAAAxd1O4FzLMaAAAAABJRU5ErkJggg==">
                 <span class="hide-sm"><?= $totalTime ?> ms &nbsp; <?= $totalMemory ?> MB</span>
             </a>
@@ -44,7 +48,7 @@
         <?php foreach ($collectors as $c) : ?>
             <?php if (! $c['isEmpty'] && ($c['hasTabContent'] || $c['hasLabel'])) : ?>
                 <span class="blitzphp-label">
-                    <a href="javascript: void(0)" data-tab="blitzphp-<?= $c['key'] ?>">
+                    <a data-tab="blitzphp-<?= $c['key'] ?>">
                         <img src="<?= $c['icon'] ?>">
                         <span class="hide-sm">
                             <?= $c['title'] ?>
@@ -58,7 +62,7 @@
         <?php endforeach ?>
 
         <span class="blitzphp-label">
-            <a href="javascript: void(0)" data-tab="blitzphp-vars">
+            <a data-tab="blitzphp-vars">
                 <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACLSURBVEhLYxgFJIHU1NSraWlp/6H4T0pKSjRUijoAyXAwBlrYDpViAFpmARQrJwZDtWACoCROC4D8CnR5XBiqBRMADfyNprgRKkUdAApzoCUdUNwE5MtApYYIALp6NBWBMVQLJgAaOJqK8AOgq+mSio6DggjEBtLUT0UwQ5HZIADkj6aiUTAggIEBANAEDa/lkCRlAAAAAElFTkSuQmCC">
                 <span class="hide-sm">Vars</span>
             </a>
@@ -66,8 +70,8 @@
 
         <h1>
             <span class="blitzphp-label">
-                <a href="javascript: void(0)" data-tab="blitzphp-config">
-				<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="25px" height="25px" viewBox="0 -6 20 20" preserveAspectRatio="xMidYMid meet">
+                <a data-tab="blitzphp-config">
+                    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="25px" height="25px" viewBox="0 -6 20 20" preserveAspectRatio="xMidYMid meet">
 						<image width="30" height="30" x="-5" y="-10" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD4AAAA8CAYAAAA+CQlPAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAIMElEQVR4Xu1aCVBVVRj+jwIuoGSCa2kqUTY5uEQ1YW73gqSiaWLFlJob4pbpmDagLZimUWqmmBrLSCRaUqQgea/lhppoKJiZoqGYyiKYqIjyTv9Bnl4ej/fOue/p2Mw7M2fexfv/3/m+/z/7FcBRHBFwRMARAUcEHBFwROD/GgFib+JuHlI9xHTC6o7VBWv96jZo9S9r04C1MdY2WH8rK1KvmeOBWMyW4Htmb9fCCNqlhL8pvYxAz2N9uroyUc4a8Ov4XFEtmv1epwZSmphBI8uKYJMpidYdpAYjg8lyJyeKAZSu4vtyoKTk44VKuD0I20V4aqT0g1tDMsQKoUb4ntU7JfssheIrsNOc35D+JGKgP4zHhNd43bWLHBgcovSwVTzrljaVjRFyNIfoWm1Q7Pjf7oFVV4rUItOX7b1lr0EBEGGOWEtP6B6zWt5oE2l0tkl4zEx5dkt3mKiHRE4+hcN58IWpL47rpsMG0rimTepG9eoAwz9bLK/U067RR7fwz8Okrl6tYKGexlm2E3dDEmb7mKl/m1bgE9CH+FnD9e0GYRER8nvW7Op6r1v4Mx3JfgTVtSpkY7aPnIWlpqSaeEoewweRFa5svuco/r1gQViYFMhhWstEl/Adi+V8RGJLlXBh2V6/B9KuFKr7TJ3bPQK+vXtCF15QgmEfMYSkvfq61IzXR3dX/2WRnI4NthVtyGh/+AywbK83k+1HUURsowZiyPVxlzD+Dbgk5iU4uW1bKC+pXw8CRBsx2rNsJ+2lewwGWKfFYBsVnLCe9fOlLfVguzgTSE2WC0R8ubt6WqQ8toETTBcBN7U9fIZCzllIwp2YcRdXZVKvHni9PhS+c3HRNWVUYbi5gWdykpzFy49L+KZ58quuDWEtL6g5O5btDXtha6UBLppk2/kpb/D37aZftBHP42Hw+SZW2sLD06rwhNlyd48mtcckD7jWJiuPQvZZ2ITZ3qD9dxyjbUJegRVsrOoqNfoOAE6QA6KXS6utYVkUHv223L2dh/ktpTVg7XsDphuznXy5QF1jmm3vjuDTtjWBwmKoVS+VArCeYrVgZ9H2l6efgLGfzJciLflZ7F87P5XPoTM7bNhUDv1N4f2NMBKF15jUqsamh9QQf9iZgSWh6jSGleXf2d0dOsQshYxGDS3QZIG5I1wTJTzQ/JhmGBe1ZHutAxBrt85DSmqkzA4CNovGMQ3f7YNvzIlmBLDrl5uLatMWklfYKBLTiIVFtFAChNBmfs+RYVFQ++TH4Ors6gPmKgdvVcL3om2a2rOZHMf2VyI42AsaB/Yjo3s+B09a9KuR7ZqW5eWQOvQ19Y26/C2O8YTdNASxD4iQ1treup3teMz2LhGMju3B763XIByXOV3FYKDpcpA60JKzReiYzWqFmkOXIkCJHgZH8uhVzDbz5y4tHpU6TRsPm1xduV2qDe9c8PzRO1C1un+3GtOP4tXEo/nAZuObIlSqxvZ++BazncXrh4eUlm+OIPO8OxE3Xh8Tu8K9mdSqaObDvWtICpe/bv0QjOElVHGLwioFdhSVkVz0YXdq/2Itw1qUX0RjTuaqlVosHNcuL/hCyJxpJNaJ916o5oxennuaBo+esH0zD0du4Qwsbb680bUBDOcBrsuGrctvx1P/rKOqorXp1FnqEfUhyWwucs7SCC8uoTNfHqF+zsvNalfXAi3fSifjTP8TL7g5O7xnO3GqALK175q1lh6bMpbEConWAJTfgCgR0cxVSHjqbrUgcQ8sxEALzdJakZsPwfp/C9U7+3V21TR0AMzu4cN/Dtfi4Qy+xn+QMks0GULCGfjan5S924/SL/ExT7SxC6UUDuRCotavszcJChmm794OcX7t01+dIMpDOOPGBj6MUzfk5MMS/Ftomdt6GOKKL6h/GnFaPSb7zQyDBJ3H0TMZB+g4PaJ1C2eOk5Ypy86XQjQ+cn3luHYDQM25ewHR1LNfx7BRkIyXi3pK2cnTMH1OuMpWDF1FuKtrW1mUQudfLefbju46TpXiMsg0+ksvkpl9e4KnHtbFJTBrzAQlWY+v0ccm4Yey1evL0+kHNyshxhIJXAkgNYvE4YGEreXQ2UeaGDqKTNJD/Ho5zBs6Qlmlx1frY5NwBsRm+vUZMBfX59S6yPxxjqafukh3s/fN20i93gkl0Y05r5C1mJWVsLJ/kGLxnM0bEJuFs4bWpCj//HKUjsbH46YN49J3YsvvsAG3rnm4dOGWFGY8+Tgvvbt2iJPTN1CZLO5p3sMuwhn0B/Fq4bFzdDA+XtY2db4EMg6eur3u+3aH4KAAqx8XzTG9tP8gnWov0QzHbsIZWOhS9a+Ll6GPhmCmkgMJ1yogt4O35DtlDFnsrP1wzKek8nQezHh3jvornzmflV2FsyaD5ytZuHRVXSDgjB+3NkVR8NDRePJYMtqzec3PxDwUS0phwahxSjyPrYiN3YWzxgMjlON4LHV/aa6ygv09uD/0w498fUWIMdsbFbBuSLAyT9SPx17odMYDaM4mfbOcgp+GgkT8cZXY0jtAGSTiI2J7TzKuJZAQK01F0b1ESKHtn/dSNONyz4WXXQW2NxdZtS/vy6ShgoESNr/nwidOUbddKKALOJndxD34gnffU3dy2us2uy9jnLFL+1FeiR/8wywxxT14FG5Hhc/WetTfN+GMnJoqr8J13Gw3xj34ItyOztEjQo/PfRXOCO74WV6C/7FgupYs7sFDcTtq9UOfHoF1+dx34YzIzm1yCv5ULW+4bMk4g6v2FPVAY6H4Y1h/fqBJOsg5IuCIgCMCjgg4IuCIwAMZgf8A4vigRWjIHHQAAAAASUVORK5CYII=" />
 					</svg>
                     <?= $blitzVersion ?>
@@ -76,7 +80,7 @@
         </h1>
 
         <!-- Open/Close Toggle -->
-        <a id="debug-bar-link" href="javascript:void(0)" title="Open/Close">
+        <a id="debug-bar-link" role="button" title="Ouvrir/Fermer">
             <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEPSURBVEhL7ZVLDoJAEEThRuoGDwSEG+jCuFU34s3AK3APP1VDDSGMqI1xx0s6M/2rnlHEaMZElmWrPM+vsDvsYbQ7+us0TReSC2EBrEHxCevRYuppYLXkQpC8sVCuGfTvqSE3hFdFwUGuGfRvqSE35NUAfKZrbQNQm2jrMA+gOK+M+FmhDsRL5voHMA8gFGecq0JOXLWlQg7E7AMIxZnjOiZOEJ82gFCcedUE4gS56QP8yf8ywItz7e+RituKlkkDBoIOH4Nd4HZD4NsGYJ/Abn1xEVOcuZ8f0zc/tHiYmzTAwscBvDIK/veyQ9K/rnewjdF26q0kF1IUxZIFPAVW98x/a+qp8L2M/+HMhETRE6S8TxpZ7KGXAAAAAElFTkSuQmCC">
         </a>
     </div>
@@ -120,7 +124,7 @@
         <?php if (isset($vars['varData'])) : ?>
             <?php foreach ($vars['varData'] as $heading => $items) : ?>
 
-                <a href="javascript:void(0)" onclick="blitzphpDebugBar.toggleDataTable('<?= strtolower(str_replace(' ', '-', $heading)) ?>'); return false;">
+                <a class="debug-bar-vars" data-toggle="datatable" data-table="<?= strtolower(str_replace(' ', '-', $heading)) ?>">
                     <h2><?= $heading ?></h2>
                 </a>
 
@@ -144,7 +148,7 @@
         <?php endif ?>
 
         <!-- Session -->
-        <a href="javascript:void(0)" onclick="blitzphpDebugBar.toggleDataTable('session'); return false;">
+        <a class="debug-bar-vars" data-toggle="datatable" data-table="session">
             <h2>Données utilisateur de session</h2>
         </a>
 
@@ -170,7 +174,7 @@
         <h2>Requête <span>( <?= $vars['request'] ?> )</span></h2>
 
         <?php if (isset($vars['get']) && $get = $vars['get']) : ?>
-            <a href="javascript:void(0)" onclick="blitzphpDebugBar.toggleDataTable('get'); return false;">
+            <a class="debug-bar-vars" data-toggle="datatable" data-table="get">
                 <h3>$_GET</h3>
             </a>
 
@@ -187,7 +191,7 @@
         <?php endif ?>
 
         <?php if (isset($vars['post']) && $post = $vars['post']) : ?>
-            <a href="javascript:void(0)" onclick="blitzphpDebugBar.toggleDataTable('post'); return false;">
+            <a class="debug-bar-vars" data-toggle="datatable" data-table="post">
                 <h3>$_POST</h3>
             </a>
 
@@ -204,7 +208,7 @@
         <?php endif ?>
 
         <?php if (isset($vars['headers']) && $headers = $vars['headers']) : ?>
-            <a href="javascript:void(0)" onclick="blitzphpDebugBar.toggleDataTable('request_headers'); return false;">
+            <a class="debug-bar-vars" data-toggle="datatable" data-table="request_headers">
                 <h3>Headers</h3>
             </a>
 
@@ -221,7 +225,7 @@
         <?php endif ?>
 
         <?php if (isset($vars['cookies']) && $cookies = $vars['cookies']) : ?>
-            <a href="javascript:void(0)" onclick="blitzphpDebugBar.toggleDataTable('cookie'); return false;">
+            <a class="debug-bar-vars" data-toggle="datatable" data-table="cookie">
                 <h3>Cookies</h3>
             </a>
 
@@ -237,12 +241,12 @@
             </table>
         <?php endif ?>
 
-        <h2>Reponse
+        <h2>Réponse
             <span>( <?= $vars['response']['statusCode'] . ' - ' . $vars['response']['reason'] ?> )</span>
         </h2>
 
         <?php if (isset($vars['response']['headers']) && $headers = $vars['response']['headers']) : ?>
-            <a href="javascript:void(0)" onclick="blitzphpDebugBar.toggleDataTable('response_headers'); return false;">
+            <a class="debug-bar-vars" data-toggle="datatable" data-table="response_headers">
                 <h3>Headers</h3>
             </a>
 
@@ -266,5 +270,4 @@
         <?= $parser->setData($config)->render('_config.tpl') ?>
     </div>
 </div>
-
-<style type="text/css"><?php foreach ($styles as $name => $style): ?><?= sprintf('.%s { %s }', $name, $style) ?><?php endforeach ?></style>
+<style><?php foreach ($styles as $name => $style): ?><?= sprintf(".%s { %s }\n", $name, $style) ?><?php endforeach ?></style>
diff --git a/src/Debug/Toolbar/Views/toolbarloader.js b/src/Debug/Toolbar/Views/toolbarloader.js
index 7e591435..6f0083fa 100644
--- a/src/Debug/Toolbar/Views/toolbarloader.js
+++ b/src/Debug/Toolbar/Views/toolbarloader.js
@@ -25,19 +25,19 @@ function loadDoc(time) {
             let dynamicStyle = document.getElementById('debugbar_dynamic_style');
             let dynamicScript = document.getElementById('debugbar_dynamic_script');
 
-            // get the first style block, copy contents to dynamic_style, then remove here
+            // récupérez le premier bloc de style, copiez le contenu dans dynamic_style, puis supprimez-le ici
             let start = responseText.indexOf('>', responseText.indexOf('<style')) + 1;
             let end = responseText.indexOf('</style>', start);
             dynamicStyle.innerHTML = responseText.substr(start, end - start);
             responseText = responseText.substr(end + 8);
 
-            // get the first script after the first style, copy contents to dynamic_script, then remove here
+            // récupérez le premier script après le premier style, copiez le contenu dans dynamic_script, puis supprimez-le ici
             start = responseText.indexOf('>', responseText.indexOf('<script')) + 1;
             end = responseText.indexOf('\<\/script>', start);
             dynamicScript.innerHTML = responseText.substr(start, end - start);
             responseText = responseText.substr(end + 9);
 
-            // check for last style block, append contents to dynamic_style, then remove here
+            // vérifier le dernier bloc de style, ajouter le contenu à dynamic_style, puis supprimer ici
             start = responseText.indexOf('>', responseText.indexOf('<style')) + 1;
             end = responseText.indexOf('</style>', start);
             dynamicStyle.innerHTML += responseText.substr(start, end - start);
@@ -45,11 +45,11 @@ function loadDoc(time) {
 
             toolbar.innerHTML = responseText;
 
-            if (typeof ciDebugBar === 'object') {
-                ciDebugBar.init();
+            if (typeof blitzphpDebugBar === 'object') {
+                blitzphpDebugBar.init();
             }
         } else if (this.readyState === 4 && this.status === 404) {
-            console.log('CodeIgniter DebugBar: File "WRITEPATH/debugbar/debugbar_' + time + '" not found.');
+            console.log('BlitzPHP DebugBar: File "STORAGE_PATH/debugbar/debugbar_' + time + '" not found.');
         }
     };
 
@@ -71,11 +71,14 @@ function newXHR() {
                 let debugbarTime = realXHR.getResponseHeader('Debugbar-Time');
 
                 if (debugbarTime) {
-                    let h2 = document.querySelector('#ci-history > h2');
+                    let h2 = document.querySelector('#blitzphp-history > h2');
 
                     if (h2) {
-                        h2.innerHTML = 'History <small>You have new debug data.</small> <button onclick="loadDoc(' + debugbarTime + ')">Update</button>';
-                        document.querySelector('a[data-tab="ci-history"] > span > .badge').className += ' active';
+                        h2.innerHTML = 'Historique <small>Vous avez de nouvelles données de débogage.</small> <button id="blitzphp-history-update">Mettre à jour</button>';
+                        document.querySelector('a[data-tab="blitzphp-history"] > span > .badge').className += ' active';
+                        document.getElementById('blitzphp-history-update').addEventListener('click', function () {
+                            loadDoc(debugbarTime);
+                        }, false)
                     }
                 }
             }
diff --git a/src/Exceptions/FrameworkException.php b/src/Exceptions/FrameworkException.php
index f01337a5..570cd99c 100644
--- a/src/Exceptions/FrameworkException.php
+++ b/src/Exceptions/FrameworkException.php
@@ -28,6 +28,11 @@ public static function enabledZlibOutputCompression()
         return new static(lang('Core.enabledZlibOutputCompression'));
     }
 
+    public static function invalidDirectory(string $path)
+    {
+        return new static(lang('Core.invalidDirectory', [$path]));
+    }
+
     public static function invalidFile(string $path)
     {
         return new static(lang('Core.invalidFile', [$path]));
diff --git a/src/HotReloader/DirectoryHasher.php b/src/HotReloader/DirectoryHasher.php
new file mode 100644
index 00000000..6f590c45
--- /dev/null
+++ b/src/HotReloader/DirectoryHasher.php
@@ -0,0 +1,80 @@
+<?php
+
+/**
+ * This file is part of Blitz PHP framework.
+ *
+ * (c) 2022 Dimitri Sitchet Tomkeu <devcode.dst@gmail.com>
+ *
+ * For the full copyright and license information, please view
+ * the LICENSE file that was distributed with this source code.
+ */
+
+namespace BlitzPHP\HotReloader;
+
+use BlitzPHP\Exceptions\FrameworkException;
+use FilesystemIterator;
+use RecursiveDirectoryIterator;
+use RecursiveIteratorIterator;
+
+/**
+ * @internal
+ *
+ * @credit	<a href="https://codeigniter.com">CodeIgniter 4.6 - CodeIgniter\HotReloader\DirectoryHasher</a>
+ */
+final class DirectoryHasher
+{
+    /**
+     * Génère une valeur MD5 de tous les répertoires surveillés par le rechargeur à chaud,
+     * comme défini dans le fichier app/Config/toolbar.php.
+     *
+     * Il s'agit de l'empreinte actuelle de l'application.
+     */
+    public function hash(): string
+    {
+        return md5(implode('', $this->hashApp()));
+    }
+
+    /**
+     * Génère un tableau de hachages md5 pour tous les répertoires surveillés par le Hot Reloader,
+     * comme défini dans app/Config/toolbar.php.
+     */
+    public function hashApp(): array
+    {
+        $hashes = [];
+
+        $watchedDirectories = config('toolbar.watched_directories', []);
+
+        foreach ($watchedDirectories as $directory) {
+            if (is_dir(ROOTPATH . $directory)) {
+                $hashes[$directory] = $this->hashDirectory(ROOTPATH . $directory);
+            }
+        }
+
+        return array_unique(array_filter($hashes));
+    }
+
+    /**
+     * Génère un hachage MD5 d'un répertoire donné et de tous ses fichiers * qui correspondent aux extensions surveillées
+     * définies dans app/Config/toolbar.php.
+     */
+    public function hashDirectory(string $path): string
+    {
+        if (! is_dir($path)) {
+            throw FrameworkException::invalidDirectory($path);
+        }
+
+        $directory = new RecursiveDirectoryIterator($path, FilesystemIterator::SKIP_DOTS);
+        $filter    = new IteratorFilter($directory);
+        $iterator  = new RecursiveIteratorIterator($filter);
+
+        $hashes = [];
+
+        foreach ($iterator as $file) {
+            if ($file->isFile()) {
+                $hashes[] = md5_file($file->getRealPath());
+            }
+        }
+
+        return md5(implode('', $hashes));
+    }
+}
diff --git a/src/HotReloader/HotReloader.php b/src/HotReloader/HotReloader.php
new file mode 100644
index 00000000..779daf50
--- /dev/null
+++ b/src/HotReloader/HotReloader.php
@@ -0,0 +1,73 @@
+<?php
+
+/**
+ * This file is part of Blitz PHP framework.
+ *
+ * (c) 2022 Dimitri Sitchet Tomkeu <devcode.dst@gmail.com>
+ *
+ * For the full copyright and license information, please view
+ * the LICENSE file that was distributed with this source code.
+ */
+
+namespace BlitzPHP\HotReloader;
+
+/**
+ * @internal
+ *
+ * @credit	<a href="https://codeigniter.com">CodeIgniter 4.6 - CodeIgniter\HotReloader\HotReloader</a>
+ */
+final class HotReloader
+{
+    public function run(): void
+    {
+        if (session_status() === PHP_SESSION_ACTIVE) {
+            session_write_close();
+        }
+
+        ini_set('zlib.output_compression', 'Off');
+
+        header('Cache-Control: no-store');
+        header('Content-Type: text/event-stream');
+        header('Access-Control-Allow-Methods: GET');
+
+        ob_end_clean();
+        set_time_limit(0);
+
+        $hasher  = new DirectoryHasher();
+        $appHash = $hasher->hash();
+
+        while (true) {
+            if (connection_status() !== CONNECTION_NORMAL || connection_aborted() === 1) {
+                break;
+            }
+
+            $currentHash = $hasher->hash();
+
+            // Si le hachage a changé, demandez au navigateur de se recharger.
+            if ($currentHash !== $appHash) {
+                $appHash = $currentHash;
+
+                $this->sendEvent('reload', ['time' => date('Y-m-d H:i:s')]);
+                break;
+            }
+
+            if (mt_rand(1, 10) > 8) {
+                $this->sendEvent('ping', ['time' => date('Y-m-d H:i:s')]);
+            }
+
+            sleep(1);
+        }
+    }
+
+    /**
+     * Envoyer un événement au navigateur.
+     */
+    private function sendEvent(string $event, array $data): void
+    {
+        echo "event: {$event}\n";
+        echo 'data: ' . json_encode($data) . "\n\n";
+
+        ob_flush();
+        flush();
+    }
+}
diff --git a/src/HotReloader/IteratorFilter.php b/src/HotReloader/IteratorFilter.php
new file mode 100644
index 00000000..8291501a
--- /dev/null
+++ b/src/HotReloader/IteratorFilter.php
@@ -0,0 +1,56 @@
+<?php
+
+/**
+ * This file is part of Blitz PHP framework.
+ *
+ * (c) 2022 Dimitri Sitchet Tomkeu <devcode.dst@gmail.com>
+ *
+ * For the full copyright and license information, please view
+ * the LICENSE file that was distributed with this source code.
+ */
+
+namespace BlitzPHP\HotReloader;
+
+use RecursiveFilterIterator;
+use RecursiveIterator;
+
+/**
+ * @internal
+ *
+ * @psalm-suppress MissingTemplateParam
+ *
+ * @credit	<a href="https://codeigniter.com">CodeIgniter 4.6 - CodeIgniter\HotReloader\IteratorFilter</a>
+ */
+final class IteratorFilter extends RecursiveFilterIterator implements RecursiveIterator
+{
+    private array $watchedExtensions = [];
+
+    public function __construct(RecursiveIterator $iterator)
+    {
+        parent::__construct($iterator);
+
+        $this->watchedExtensions = config('toolbar.watched_extensions', []);
+    }
+
+    /**
+     * Appliquer des filtres aux fichiers dans l'itérateur.
+     */
+    public function accept(): bool
+    {
+        if (! $this->current()->isFile()) {
+            return true;
+        }
+
+        $filename = $this->current()->getFilename();
+
+        // Ignorer les fichiers et répertoires cachés.
+        if ($filename[0] === '.') {
+            return false;
+        }
+
+        // Ne consommez que les fichiers qui vous intéressent.
+        $ext = trim(strtolower($this->current()->getExtension()), '. ');
+
+        return in_array($ext, $this->watchedExtensions, true);
+    }
+}
diff --git a/src/Http/ServerRequest.php b/src/Http/ServerRequest.php
index dd491c0e..8c2bb2a7 100644
--- a/src/Http/ServerRequest.php
+++ b/src/Http/ServerRequest.php
@@ -242,10 +242,6 @@ protected function _setConfig(array $config): void
             $uri = new Uri(Psr7ServerRequest::getUriFromGlobals()->__toString());
         }
 
-        if (isset($config['environment']['REQUEST_URI'])) {
-            $uri = $uri->withPath($config['environment']['REQUEST_URI']);
-        }
-
         if (in_array($uri->getHost(), ['localhost', '127.0.0.1'], true)) {
             $uri = $uri->withHost(parse_url(config('app.base_url'), PHP_URL_HOST));
         }
diff --git a/src/Router/Dispatcher.php b/src/Router/Dispatcher.php
index a54ea6cf..28e39f41 100644
--- a/src/Router/Dispatcher.php
+++ b/src/Router/Dispatcher.php
@@ -365,7 +365,7 @@ protected function dispatchRoutes(?RouteCollectionInterface $routes = null): arr
         }
 
         // $routes est defini dans app/Config/routes.php
-        $this->router = single_service('router', $routes, $this->request);
+        $this->router = service('router', $routes, $this->request);
 
         $this->outputBufferingStart();
 
@@ -576,7 +576,7 @@ public function storePreviousURL($uri)
     protected function sendResponse()
     {
         if (! $this->isAjaxRequest()) {
-            $this->response = service('toolbar')->prepare(
+            $this->response = service('toolbar')->process(
                 $this->getPerformanceStats(),
                 $this->request,
                 $this->response
@@ -685,6 +685,12 @@ private function spoofRequestMethod(): callable
         };
     }
 
+    /**
+     * Démarre l'application en configurant la requete et la réponse,
+     * en exécutant le contrôleur et en gérant les exceptions de validation.
+     *
+     * Cette méthode renvoie un objet callable qui sert de middleware pour le cycle requête-réponse de l'application.
+     */
     private function bootApp(): callable
     {
         return function (ServerRequestInterface $request, ResponseInterface $response, callable $next): ResponseInterface {
diff --git a/src/Translations/en/Core.php b/src/Translations/en/Core.php
index f5812490..c0801278 100644
--- a/src/Translations/en/Core.php
+++ b/src/Translations/en/Core.php
@@ -13,6 +13,7 @@
 return [
     'copyError'                    => 'An error was encountered while attempting to replace the file ({0}). Please make sure your file directory is writable.',
     'enabledZlibOutputCompression' => 'Your zlib.output_compression ini directive is turned on. This will not work well with output buffers.',
+    'invalidDirectory'             => 'Directory does not exist: "{0}"',
     'invalidFile'                  => 'Invalid file: {0}',
     'invalidPhpVersion'            => 'Your PHP version must be {0} or higher to run CodeIgniter. Current version: {1}',
     'missingExtension'             => 'The framework needs the following extension(s) installed and loaded: {0}.',