From 739cff7a0b73c10f0e85a427023866837ec2f378 Mon Sep 17 00:00:00 2001
From: Johnny McQuade <jfmcquade@hotmail.com>
Date: Tue, 24 Dec 2024 12:44:42 +0000
Subject: [PATCH] fix: use RouterLinkActive to fix active link logic

---
 .../bottom-navigation-bar.component.html               | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/packages/components/plh/plh-kids-kw/components/bottom-navigation-bar/bottom-navigation-bar.component.html b/packages/components/plh/plh-kids-kw/components/bottom-navigation-bar/bottom-navigation-bar.component.html
index 2b2f338c34..17b1c62eb1 100644
--- a/packages/components/plh/plh-kids-kw/components/bottom-navigation-bar/bottom-navigation-bar.component.html
+++ b/packages/components/plh/plh-kids-kw/components/bottom-navigation-bar/bottom-navigation-bar.component.html
@@ -5,14 +5,10 @@
       routerLinkActive="active-link"
       [routerLink]="'template/' + button.target_template"
       [attr.data-name]="button.name"
-      (click)="toggleIcon()"
-      [ngClass]="isActive ? 'active-link' : ''"
+      #rla="routerLinkActive"
     >
-      <div *ngIf="!isActive" class="icon">
-        <img [src]="button.icon | plhAsset" />
-      </div>
-      <div *ngIf="isActive" class="icon">
-        <img [src]="button.active_icon | plhAsset" />
+      <div class="icon">
+        <img [src]="(rla.isActive ? button.active_icon : button.icon) | plhAsset" />
       </div>
       <div class="label">
         <p>{{ button.label }}</p>