From df122148da06375fbf513c1790506ba5bae570ce Mon Sep 17 00:00:00 2001
From: Maciej Zieniuk <mzieniuk@bitwarden.com>
Date: Mon, 24 Jun 2024 10:09:24 +0200
Subject: [PATCH] SM-1146: Tab link component simplifications

---
 .../src/tabs/tab-nav-bar/tab-link.component.html     | 12 +++++-------
 .../src/tabs/tab-nav-bar/tab-link.component.ts       |  6 +++---
 2 files changed, 8 insertions(+), 10 deletions(-)

diff --git a/libs/components/src/tabs/tab-nav-bar/tab-link.component.html b/libs/components/src/tabs/tab-nav-bar/tab-link.component.html
index 6faceff7a6..b6c5abf80f 100644
--- a/libs/components/src/tabs/tab-nav-bar/tab-link.component.html
+++ b/libs/components/src/tabs/tab-nav-bar/tab-link.component.html
@@ -9,12 +9,10 @@
   [attr.aria-disabled]="disabled"
   ariaCurrentWhenActive="page"
   role="link"
-  [class]="'tw-flex' + (haveSlotEnd ? ' hover:tw-no-underline' : '')"
+  [class]="'tw-flex' + (haveEndSlot ? ' hover:tw-no-underline' : '')"
 >
-  <ng-container>
-    <div [class]="'tw-inline-flex' + (haveSlotEnd ? ' hover:tw-underline' : '')">
-      <ng-content></ng-content>
-    </div>
-  </ng-container>
-  <ng-content #slotEnd select="[slot=end]"></ng-content>
+  <div [class]="'tw-inline-flex' + (haveEndSlot ? ' hover:tw-underline' : '')">
+    <ng-content></ng-content>
+  </div>
+  <ng-content #endSlot select="[slot=end]"></ng-content>
 </a>
diff --git a/libs/components/src/tabs/tab-nav-bar/tab-link.component.ts b/libs/components/src/tabs/tab-nav-bar/tab-link.component.ts
index 06fca47fa7..1c9d8d5cb4 100644
--- a/libs/components/src/tabs/tab-nav-bar/tab-link.component.ts
+++ b/libs/components/src/tabs/tab-nav-bar/tab-link.component.ts
@@ -24,7 +24,7 @@ export class TabLinkComponent implements FocusableOption, AfterViewInit, OnDestr
 
   @ViewChild(TabListItemDirective) tabItem: TabListItemDirective;
   @ViewChild("rla") routerLinkActive: RouterLinkActive;
-  @ViewChild("slotEnd") slotEnd: ElementRef<HTMLElement>;
+  @ViewChild("endSlot") endSlot: ElementRef<HTMLElement>;
 
   readonly routerLinkMatchOptions: IsActiveMatchOptions = {
     queryParams: "ignored",
@@ -46,8 +46,8 @@ export class TabLinkComponent implements FocusableOption, AfterViewInit, OnDestr
     return this.routerLinkActive?.isActive ?? false;
   }
 
-  get haveSlotEnd() {
-    return this.slotEnd?.nativeElement?.innerHTML !== "" ?? false;
+  get haveEndSlot() {
+    return this.endSlot?.nativeElement?.childElementCount !== 0;
   }
 
   constructor(private _tabNavBar: TabNavBarComponent) {}