diff --git a/src/renderer/components/FtSearchFilters/FtSearchFilters.vue b/src/renderer/components/FtSearchFilters/FtSearchFilters.vue index 046a20cdff79c..8866bf6d8df47 100644 --- a/src/renderer/components/FtSearchFilters/FtSearchFilters.vue +++ b/src/renderer/components/FtSearchFilters/FtSearchFilters.vue @@ -1,3 +1,4 @@ + @@ -173,6 +180,16 @@ const featureLabels = computed(() => [ const searchSettings = store.getters.getSearchSettings +function applyFilters() { + const queryText = store.getters.getTopNavInstance?.$refs.searchInput.inputData || '' + const searchSettings = store.getters.getSearchSettings + if (!queryText) { + console.error('No queryText found during Apply Filters') + return + } + store.dispatch('applyFilters', { queryText, searchSettings }) +} + /** @type {import('vue').Ref<'relevance' | 'rating' | 'upload_date' | 'view_count'>} */ const sortByValue = ref(searchSettings.sortBy) diff --git a/src/renderer/components/top-nav/top-nav.js b/src/renderer/components/top-nav/top-nav.js index b807048f2904a..c7dcc73a93339 100644 --- a/src/renderer/components/top-nav/top-nav.js +++ b/src/renderer/components/top-nav/top-nav.js @@ -189,6 +189,7 @@ export default defineComponent({ }, }, mounted: function () { + this.$store.commit('setTopNavInstance', this) let previousWidth = window.innerWidth if (window.innerWidth <= MOBILE_WIDTH_THRESHOLD) { this.showSearchContainer = false @@ -209,27 +210,22 @@ export default defineComponent({ previousWidth = window.innerWidth } }) - this.debounceSearchResults = debounce(this.getSearchSuggestions, 200) }, methods: { - goToSearch: async function (queryText, { event }) { + goToSearch: async function (queryText, { event, searchSettings = null } = {}) { const doCreateNewWindow = event && event.shiftKey - if (window.innerWidth <= MOBILE_WIDTH_THRESHOLD) { this.$refs.searchContainer.blur() this.showSearchContainer = false } else { this.$refs.searchInput.blur() } - clearLocalSearchSuggestionsSession() - this.getYoutubeUrlInfo(queryText).then((result) => { switch (result.urlType) { case 'video': { const { videoId, timestamp, playlistId } = result - const query = {} if (timestamp) { query.timestamp = timestamp @@ -237,7 +233,6 @@ export default defineComponent({ if (playlistId && playlistId.length > 0) { query.playlistId = playlistId } - openInternalPath({ path: `/watch/${videoId}`, query, @@ -246,10 +241,8 @@ export default defineComponent({ }) break } - case 'playlist': { const { playlistId, query } = result - openInternalPath({ path: `/playlist/${playlistId}`, query, @@ -258,10 +251,8 @@ export default defineComponent({ }) break } - case 'search': { const { searchQuery, query } = result - openInternalPath({ path: `/search/${encodeURIComponent(searchQuery)}`, query, @@ -270,7 +261,6 @@ export default defineComponent({ }) break } - case 'hashtag': { const { hashtag } = result openInternalPath({ @@ -278,13 +268,10 @@ export default defineComponent({ doCreateNewWindow, searchQueryText: `#${hashtag}`, }) - break } - case 'post': { const { postId, query } = result - openInternalPath({ path: `/post/${postId}`, query, @@ -293,10 +280,8 @@ export default defineComponent({ }) break } - case 'channel': { const { channelId, subPath, url } = result - openInternalPath({ path: `/channel/${channelId}/${subPath}`, doCreateNewWindow, @@ -307,31 +292,30 @@ export default defineComponent({ }) break } - case 'invalid_url': default: { + // If searchSettings is provided (e.g., from the Apply button), use it. + const queryParams = searchSettings || { + sortBy: this.searchSettings.sortBy, + time: this.searchSettings.time, + type: this.searchSettings.type, + duration: this.searchSettings.duration, + features: this.searchSettings.features, + } openInternalPath({ path: `/search/${encodeURIComponent(queryText)}`, - query: { - sortBy: this.searchSettings.sortBy, - time: this.searchSettings.time, - type: this.searchSettings.type, - duration: this.searchSettings.duration, - features: this.searchSettings.features, - }, + query: queryParams, doCreateNewWindow, searchQueryText: queryText, }) } } - if (doCreateNewWindow) { - // Query text copied to new window = can be removed from current window + // Query text copied to new window = can be removed from the current window this.updateSearchInputText('') } }) }, - focusSearch: function () { if (!this.hideSearchBar) { // In order to prevent Klipper's "Synchronize contents of the clipboard diff --git a/src/renderer/store/modules/utils.js b/src/renderer/store/modules/utils.js index 2022f5e44e4eb..0da2ba53ff8b2 100644 --- a/src/renderer/store/modules/utils.js +++ b/src/renderer/store/modules/utils.js @@ -18,6 +18,7 @@ import { } from '../../helpers/utils' const state = { + topNavInstance: null, isSideNavOpen: false, outlinesHidden: true, sessionSearchHistory: [], @@ -65,6 +66,10 @@ const state = { } const getters = { + getTopNavInstance(state) { + return state.topNavInstance + }, + getIsSideNavOpen(state) { return state.isSideNavOpen }, @@ -280,6 +285,23 @@ const actions = { } }, + applyFilters({ state, rootGetters }, { queryText, searchSettings }) { + const topNavInstance = rootGetters.getTopNavInstance + if (topNavInstance && topNavInstance.goToSearch) { + topNavInstance.goToSearch(queryText, { searchSettings }) + } else { + console.error('Unable to find goToSearch method in top-nav instance.') + } + this.dispatch('hideSearchFilters') + }, + performSearch({ state }) { + const searchSettings = state.searchSettings + const queryText = state.sessionSearchHistory.length + ? state.sessionSearchHistory[0].query + : '' + this.dispatch('goToSearch', { queryText, searchSettings }) + }, + parseScreenshotCustomFileName: function({ rootState }, payload) { const { pattern = rootState.settings.screenshotFilenamePattern, date, playerTime, videoId } = payload const keywords = [ @@ -805,6 +827,10 @@ const actions = { } const mutations = { + setTopNavInstance(state, instance) { + state.topNavInstance = instance + }, + toggleSideNav (state) { state.isSideNavOpen = !state.isSideNavOpen }, diff --git a/static/locales/en-GB.yaml b/static/locales/en-GB.yaml index 774e2621669a3..8bd53c808486c 100644 --- a/static/locales/en-GB.yaml +++ b/static/locales/en-GB.yaml @@ -100,6 +100,8 @@ Search Filters: 4K: 4K 3D: 3D Location: Location + Apply: 'Apply' + Close: 'Close' Subscriptions: # On Subscriptions Page Subscriptions: 'Subscriptions' diff --git a/static/locales/en-US.yaml b/static/locales/en-US.yaml index 3012b22228be3..9b27ef7b95c8a 100644 --- a/static/locales/en-US.yaml +++ b/static/locales/en-US.yaml @@ -116,6 +116,8 @@ Search Filters: Location: Location HDR: HDR VR180: VR180 + Apply: 'Apply' + Close: 'Close' # On Search Page Search Results: Search Results Fetching results. Please wait: Fetching results. Please wait