From b97482c64265c73419abda428178ddb990a84b8c Mon Sep 17 00:00:00 2001 From: Oliver Davies <oliver@oliverdavies.uk> Date: Wed, 17 Feb 2021 23:30:58 +0000 Subject: [PATCH] Task 5 - Refactor menu items using a loop --- config/packages/twig.yaml | 2 ++ src/Repository/MenuItemArrayRepository.php | 34 ++++++++++++++++++++++ src/Repository/MenuItemRepository.php | 8 +++++ templates/includes/navbar.html.twig | 16 ++++++---- 4 files changed, 55 insertions(+), 5 deletions(-) create mode 100644 src/Repository/MenuItemArrayRepository.php create mode 100644 src/Repository/MenuItemRepository.php diff --git a/config/packages/twig.yaml b/config/packages/twig.yaml index b3cdf30..c9409a4 100644 --- a/config/packages/twig.yaml +++ b/config/packages/twig.yaml @@ -1,2 +1,4 @@ twig: default_path: '%kernel.project_dir%/templates' + globals: + menu_items: '@App\Repository\MenuItemRepository' diff --git a/src/Repository/MenuItemArrayRepository.php b/src/Repository/MenuItemArrayRepository.php new file mode 100644 index 0000000..a0f0647 --- /dev/null +++ b/src/Repository/MenuItemArrayRepository.php @@ -0,0 +1,34 @@ +<?php + +declare(strict_types=1); + +namespace App\Repository; + +final class MenuItemArrayRepository implements MenuItemRepository +{ + public function findAll(): array + { + return [ + [ + 'title' => 'Conference', + 'is_active' => false, + ], + [ + 'title' => 'Sponsors', + 'is_active' => false, + ], + [ + 'title' => 'Community', + 'is_active' => false, + ], + [ + 'title' => 'FAQ', + 'is_active' => false, + ], + [ + 'title' => 'Register', + 'is_active' => true, + ], + ]; + } +} diff --git a/src/Repository/MenuItemRepository.php b/src/Repository/MenuItemRepository.php new file mode 100644 index 0000000..830e464 --- /dev/null +++ b/src/Repository/MenuItemRepository.php @@ -0,0 +1,8 @@ +<?php + +namespace App\Repository; + +interface MenuItemRepository +{ + public function findAll(): array; +} diff --git a/templates/includes/navbar.html.twig b/templates/includes/navbar.html.twig index 9a4b38f..785aa26 100644 --- a/templates/includes/navbar.html.twig +++ b/templates/includes/navbar.html.twig @@ -7,11 +7,17 @@ </div> <div> <ul class="flex justify-end h-full"> - <li><a class="block px-2 py-3 text-2xl uppercase duration-200 ease-out transition-color font-display text-blue-dark hover:bg-orange focus:bg-orange hover:text-gray-dark focus:text-gray-dark" href="#0">Conference</a></li> - <li><a class="block px-2 py-3 text-2xl uppercase duration-200 ease-out transition-color font-display text-blue-dark hover:bg-orange focus:bg-orange hover:text-gray-dark focus:text-gray-dark" href="#0">Sponsors</a></li> - <li><a class="block px-2 py-3 text-2xl uppercase duration-200 ease-out transition-color font-display text-blue-dark hover:bg-orange focus:bg-orange hover:text-gray-dark focus:text-gray-dark" href="#0">Community</a></li> - <li><a class="block px-2 py-3 text-2xl uppercase duration-200 ease-out transition-color font-display text-blue-dark hover:bg-orange focus:bg-orange hover:text-gray-dark focus:text-gray-dark" href="#0">FAQ</a></li> - <li><a class="block px-2 py-3 text-2xl text-white uppercase duration-200 ease-out transition-color font-display bg-blue hover:text-gray-dark focus:text-gray-dark" href="#0">Register</a></li> + {% for menu_item in menu_items.findAll() %} + {% set linkClasses = [ + 'block px-2 py-3 text-2xl uppercase duration-200 ease-out transition-color font-display text-blue-dark hover:bg-orange focus:bg-orange hover:text-gray-dark focus:text-gray-dark', + menu_item.is_active ? 'text-white bg-blue' + ] %} + <li> + <a class="{{ linkClasses|join(' ')|trim }}" href="#0"> + {{ menu_item.title }} + </a> + </li> + {% endfor %} </ul> </div> </div>