From b94748019040b2147ca98e2364f221721055cec4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?R=C3=A2u=20Cao?= Date: Wed, 15 Mar 2023 11:38:23 +0700 Subject: [PATCH] Refactor sidenav link component, allow multiple levels --- app/components/sidenav_link_component.rb | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/app/components/sidenav_link_component.rb b/app/components/sidenav_link_component.rb index 999871b..60e58ed 100644 --- a/app/components/sidenav_link_component.rb +++ b/app/components/sidenav_link_component.rb @@ -1,8 +1,9 @@ # frozen_string_literal: true class SidenavLinkComponent < ViewComponent::Base - def initialize(name:, path:, icon:, active: false, disabled: false) + def initialize(name:, level: 1, path:, icon:, active: false, disabled: false) @name = name + @level = level @path = path @icon = icon @active = active @@ -12,12 +13,15 @@ class SidenavLinkComponent < ViewComponent::Base end def class_names_link(path) + px = @level == 1 ? "px-4" : "pl-8 pr-4" + base = "#{px} py-2 group border-l-4 flex items-center text-base font-medium" + if @active - "bg-teal-50 border-teal-500 text-teal-700 hover:bg-teal-50 hover:text-teal-700 group border-l-4 px-4 py-2 flex items-center text-base font-medium" + "#{base} bg-teal-50 border-teal-500 text-teal-700 hover:bg-teal-50 hover:text-teal-700" elsif @disabled - "border-transparent text-gray-400 hover:bg-gray-50 group border-l-4 px-4 py-2 flex items-center text-base font-medium" + "#{base} border-transparent text-gray-400 hover:bg-gray-50" else - "border-transparent text-gray-900 hover:bg-gray-50 hover:text-gray-900 group border-l-4 px-4 py-2 flex items-center text-base font-medium" + "#{base} border-transparent text-gray-900 hover:bg-gray-50 hover:text-gray-900" end end