From 8b047a642bd391cc0fe77a8ed84cfcf162b017d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jesper=20M=C3=B8ller=20Jensen?=
 <26099018+JesmoDev@users.noreply.github.com>
Date: Mon, 4 Dec 2023 19:43:39 +1300
Subject: [PATCH] log viewer filter menu

---
 ...log-viewer-log-level-filter-menu.element.ts | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-log-level-filter-menu.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-log-level-filter-menu.element.ts
index 39591c5804..589e0aa1b7 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-log-level-filter-menu.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/search/components/log-viewer-log-level-filter-menu.element.ts
@@ -64,7 +64,7 @@ export class UmbLogViewerLogLevelFilterMenuElement extends UmbLitElement {
 
 	#renderLogLevelSelector() {
 		return html`
-			<div slot="dropdown" id="log-level-selector" @change=${this.setLogLevelDebounce}>
+			<div id="log-level-selector" @change=${this.setLogLevelDebounce}>
 				${Object.values(LogLevelModel).map(
 					(logLevel) =>
 						html`<uui-checkbox
@@ -73,7 +73,7 @@ export class UmbLogViewerLogLevelFilterMenuElement extends UmbLitElement {
 							.value=${logLevel}
 							label="${logLevel}">
 							<umb-log-viewer-level-tag .level=${logLevel}></umb-log-viewer-level-tag>
-						</uui-checkbox>`
+						</uui-checkbox>`,
 				)}
 				<uui-button class="log-level-menu-item" @click=${this.#selectAllLogLevels} label="Select all"
 					>Select all</uui-button
@@ -87,13 +87,15 @@ export class UmbLogViewerLogLevelFilterMenuElement extends UmbLitElement {
 
 	render() {
 		return html`
-			<umb-button-with-dropdown label="Select log levels">
-				Log Level:
-				${this._logLevelFilter.length > 0
-					? this._logLevelFilter.map((level) => html`<span class="log-level-button-indicator">${level}</span>`)
-					: 'All'}
+			<umb-dropdown label="Select log levels">
+				<span slot="label">
+					Log Level:
+					${this._logLevelFilter.length > 0
+						? this._logLevelFilter.map((level) => html`<span class="log-level-button-indicator">${level}</span>`)
+						: 'All'}
+				</span>
 				${this.#renderLogLevelSelector()}
-			</umb-button-with-dropdown>
+			</umb-dropdown>
 		`;
 	}