From 116cedc71e3660d8699dc5000543a6585739ae7c Mon Sep 17 00:00:00 2001
From: Sahil Silare <ssilare@adobe.com>
Date: Sun, 1 Oct 2023 11:34:17 +0530
Subject: [PATCH] fix: fixed a bug related to search on log viewer page

---
 ...-viewer-saved-searches-overview.element.ts | 48 ++++++++++++++++++-
 1 file changed, 47 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts
index a6883f413e..c66b342d36 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/log-viewer/workspace/views/overview/components/log-viewer-saved-searches-overview.element.ts
@@ -3,12 +3,25 @@ import { UmbTextStyles } from "@umbraco-cms/backoffice/style";
 import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
 import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
 import { SavedLogSearchResponseModel } from '@umbraco-cms/backoffice/backend-api';
+import {debounceTime, Subject, tap} from "@umbraco-cms/backoffice/external/rxjs";
+import {path, query as getQuery, toQueryString} from "@umbraco-cms/backoffice/external/router-slot";
 
 //TODO: implement the saved searches pagination when the API total bug is fixed
 @customElement('umb-log-viewer-saved-searches-overview')
 export class UmbLogViewerSavedSearchesOverviewElement extends UmbLitElement {
 	@state()
 	private _savedSearches: SavedLogSearchResponseModel[] = [];
+	@state()
+	private _inputQuery = '';
+
+	@state()
+	private _showLoader = false;
+
+	@state()
+	private _isQuerySaved = false;
+
+	private inputQuery$ = new Subject<string>();
+
 
 	#logViewerContext?: UmbLogViewerWorkspaceContext;
 
@@ -19,13 +32,46 @@ export class UmbLogViewerSavedSearchesOverviewElement extends UmbLitElement {
 			this.#logViewerContext?.getSavedSearches();
 			this.#observeStuff();
 		});
+		this.inputQuery$
+			.pipe(
+				tap(() => (this._showLoader = true)),
+				debounceTime(250)
+			)
+			.subscribe((query) => {
+				this.#logViewerContext?.setFilterExpression(query);
+				this.#persist(query);
+				this._isQuerySaved = this._savedSearches.some((search) => search.query === query);
+				this._showLoader = false;
+			});
 	}
 
 	#observeStuff() {
 		if (!this.#logViewerContext) return;
 		this.observe(this.#logViewerContext.savedSearches, (savedSearches) => {
 			this._savedSearches = savedSearches ?? [];
+			this._isQuerySaved = this._savedSearches.some((search) => search.query === this._inputQuery);
 		});
+
+		this.observe(this.#logViewerContext.filterExpression, (query) => {
+			this._inputQuery = query;
+			this._isQuerySaved = this._savedSearches.some((search) => search.query === query);
+		});
+	}
+
+	#persist(filter: string) {
+		let query = getQuery();
+
+		query = {
+			...query,
+			lq: filter,
+		};
+		const newPath = path().replace('/overview', '/search');
+
+		window.history.pushState({}, '', `${newPath}?${toQueryString(query)}`);
+	}
+
+	#setQueryFromSavedSearch(query: string) {
+		this.inputQuery$.next(query);
 	}
 
 	#renderSearchItem = (searchListItem: SavedLogSearchResponseModel) => {
@@ -33,7 +79,7 @@ export class UmbLogViewerSavedSearchesOverviewElement extends UmbLitElement {
 			<uui-menu-item
 				label="${searchListItem.name ?? ''}"
 				title="${searchListItem.name ?? ''}"
-				href=${`section/settings/workspace/logviewer/search/?lq=${encodeURIComponent(searchListItem.query ?? '')}`}>
+				@click=${() => this.#setQueryFromSavedSearch(searchListItem.query ?? '')}>
 				<uui-icon slot="icon" name="umb:search"></uui-icon>${searchListItem.name}
 			</uui-menu-item>
 		</li>`;