feat: garage module for client B (step 4)

assessment/assets/css/toolbar.css

@@ -2,6 +2,7 @@
     background: #1f2937;
     color: #fff;
     display: flex;
+    flex-wrap: wrap;
     align-items: center;
     gap: 10px;
     padding: 10px 14px;
@@ -28,6 +29,14 @@
     border: 1px solid rgba(255, 255, 255, 0.08)
 }
 
+.toolbar-modules {
+    width: 100%;
+    display: flex;
+    gap: 10px;
+    margin-top: 8px;
+    align-items: center;
+}
+
 .error-message {
     color: crimson;
 }

assessment/assets/js/toolbar.js

@@ -6,6 +6,10 @@ class Toolbar {
             { label: 'Client B', value: 'clientb' },
             { label: 'Client C', value: 'clientc' }
         ];
+        this.moduleMapping = [
+            { label: 'Voitures', module: 'cars', script: 'ajax' },
+            { label: 'Garages', module: 'garages', script: 'ajax', onlyFor: 'clientb' }
+        ];
         this.injectStylesheet('assets/css/toolbar.css');
         this.render();
         this.activateExistingClient();
@@ -31,6 +35,7 @@ class Toolbar {
             $button.on('click', () => {
                 this.setCookieValue('client', mapping.value);
                 this.markActiveButton($button);
+                this.updateModuleButtonsVisibility(mapping.value);
                 if (window.loadDynamic && typeof window.loadDynamic === 'function') window.loadDynamic();
             });
             this.$container.append($button);
@@ -43,9 +48,55 @@ class Toolbar {
         });
         this.$container.append($closeButton);
 
+        const $moduleWrap = $('<div>').addClass('toolbar-modules');
+        this.moduleMapping.forEach(mod => {
+            const $mBtn = $('<button>').text(mod.label).attr('data-module', mod.module).attr('data-script', mod.script).addClass('module-button');
+            $mBtn.on('click', () => {
+                this.markActiveModuleButton($mBtn);
+                const $dyn = $('.dynamic-div').first();
+                if ($dyn && $dyn.length) {
+                    $dyn.data('module', mod.module);
+                    $dyn.data('script', mod.script);
+                    if (window.loadDynamic && typeof window.loadDynamic === 'function') window.loadDynamic();
+                }
+            });
+            $moduleWrap.append($mBtn);
+        });
+        this.$container.append($moduleWrap);
+
         $('body').prepend(this.$container);
     }
 
+    markActiveModuleButton($button) {
+        this.$container.find('.module-button').removeClass('active');
+        if ($button && $button.length) $button.addClass('active');
+    }
+
+    updateModuleButtonsVisibility(clientValue) {
+        this.$container.find('.module-button').each((i, el) => {
+            const $el = $(el);
+            const mod = $el.attr('data-module');
+            const cfg = this.moduleMapping.find(m => m.module === mod);
+            if (cfg && cfg.onlyFor) {
+                if (cfg.onlyFor === clientValue) $el.show();
+                else $el.hide();
+            } else {
+                $el.show();
+            }
+        });
+        const $dyn = $('.dynamic-div').first();
+        if ($dyn && $dyn.length) {
+            const current = $dyn.data('module') || $dyn.attr('data-module');
+            const visible = this.$container.find(`.module-button[data-module="${current}"]`).is(':visible');
+            if (!visible) {
+                const $carsBtn = this.$container.find('.module-button[data-module="cars"]');
+                if ($carsBtn.length) {
+                    $carsBtn.trigger('click');
+                }
+            }
+        }
+    }
+
     getCookieValue(name) {
         const match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
         return match ? decodeURIComponent(match[2]) : null;
@@ -56,6 +107,13 @@ class Toolbar {
         if (!existingClient) return;
         const $btn = this.$container.find(`button[data-client="${existingClient}"]`);
         if ($btn.length) this.markActiveButton($btn);
+        this.updateModuleButtonsVisibility(existingClient);
+        const $dyn = $('.dynamic-div').first();
+        if ($dyn && $dyn.length) {
+            const current = $dyn.data('module') || $dyn.attr('data-module');
+            const $m = this.$container.find(`.module-button[data-module="${current}"]`);
+            if ($m.length) this.markActiveModuleButton($m);
+        }
     }
 }
 

assessment/customs/clientb/modules/garages/ajax.php

@@ -0,0 +1,17 @@
+<?php
+require_once __DIR__ . '/../../../../src/utils.php';
+$garages = DataManager::getGarages('clientb');
+?>
+<h1>Garages Client B</h1>
+<?php if (empty($garages)): ?>
+    <p>Aucun garage trouvé.</p>
+<?php else: ?>
+    <ul>
+        <?php foreach ($garages as $g): ?>
+            <li class="garage-item" data-garage-id="<?php echo htmlspecialchars($g['id'] ?? ''); ?>">
+                <strong><?php echo htmlspecialchars($g['title'] ?? '-'); ?></strong>
+                - <?php echo htmlspecialchars($g['address'] ?? '-'); ?>
+            </li>
+        <?php endforeach; ?>
+    </ul>
+<?php endif; ?>

assessment/customs/clientb/modules/garages/edit.php

@@ -0,0 +1,34 @@
+<?php
+require_once __DIR__ . '/../../../../src/utils.php';
+$id = $_GET['id'] ?? null;
+$garageFound = null;
+$garages = DataManager::getGarages('clientb');
+if ($id !== null) {
+    foreach ($garages as $g) {
+        if (isset($g['id']) && (string)$g['id'] === (string)$id) {
+            $garageFound = $g;
+            break;
+        }
+    }
+}
+?>
+<?php if (!$garageFound): ?>
+    <div>Garage non trouvé.</div>
+<?php else: ?>
+    <h1>Détails: <?php echo htmlspecialchars($garageFound['title'] ?? '-'); ?></h1>
+    <ul>
+        <li>Adresse: <?php echo htmlspecialchars($garageFound['address'] ?? '-'); ?></li>
+        <li>ID: <?php echo htmlspecialchars((string)($garageFound['id'] ?? '-')); ?></li>
+    </ul>
+    <?php
+    $cars = DataManager::getCars('clientb');
+    $carsInGarage = array_filter($cars, fn($c) => isset($c['garageId']) && (string)$c['garageId'] === (string)$garageFound['id']);
+    if (!empty($carsInGarage)): ?>
+        <h2>Voitures dans ce garage</h2>
+        <ul>
+            <?php foreach ($carsInGarage as $c): ?>
+                <li><?php echo htmlspecialchars($c['modelName'] ?? '-'); ?> - <?php echo htmlspecialchars($c['brand'] ?? '-'); ?></li>
+            <?php endforeach; ?>
+        </ul>
+    <?php endif; ?>
+<?php endif; ?>