fix(files): clear search input on directory navigation

Signed-off-by: Maksim Sukharev <[email protected]>

Author: Antreesy

apps/files/src/composables/useFilenameFilter.ts

@@ -8,11 +8,29 @@ import { watchThrottled } from '@vueuse/core'
 import { onMounted, onUnmounted, ref } from 'vue'
 import { FilenameFilter } from '../filters/FilenameFilter'
 
+const searchQuery = ref('')
+
+/**
+ * This is for the non-component usage to modify the query
+ */
+export function useSearchQuery() {
+	/**
+	 * Updating the search query ref
+	 * @param value The new value
+	 */
+	function updateQuery(value: string) {
+		searchQuery.value = value
+	}
+
+	return {
+		updateQuery,
+	}
+}
+
 /**
  * This is for the `Navigation` component to provide a filename filter
  */
 export function useFilenameFilter() {
-	const searchQuery = ref('')
 	const filenameFilter = new FilenameFilter()
 
 	/**

apps/files/src/router/router.ts

@@ -11,6 +11,7 @@ import Router, { isNavigationFailure, NavigationFailureType } from 'vue-router'
 import Vue from 'vue'
 
 import { useFilesStore } from '../store/files'
+import { useSearchQuery } from '../composables/useFilenameFilter'
 import { useNavigation } from '../composables/useNavigation'
 import { usePathsStore } from '../store/paths'
 import logger from '../logger'
@@ -87,6 +88,12 @@ router.beforeEach((to, from, next) => {
 	const fromDir = (from.query?.dir || '/') as string
 	const toDir = (to.query?.dir || '/') as string
 
+	if (fromDir !== toDir) {
+		// we navigate to another directory -> unset the query
+		const { updateQuery } = useSearchQuery()
+		updateQuery('')
+	}
+
 	// We are going back to a parent directory
 	if (relative(fromDir, toDir) === '..') {
 		const { currentView } = useNavigation()