feat(marketplace): Add category wise search (#19760)

feat(marketplace): change route for category wise search

erpnext/public/js/hub/PageContainer.vue

@@ -24,7 +24,7 @@ import NotFound from './pages/NotFound.vue';
 function get_route_map() {
 	const read_only_routes = {
 		'marketplace/home': Home,
-		'marketplace/search/:keyword': Search,
+		'marketplace/search/:category/:keyword': Search,
 		'marketplace/category/:category': Category,
 		'marketplace/item/:item': Item,
 		'marketplace/seller/:seller': Seller,

erpnext/public/js/hub/pages/Category.vue

@@ -3,6 +3,12 @@
 		class="marketplace-page"
 		:data-page-name="page_name"
 	>
+		<search-input
+			:placeholder="search_placeholder"
+			:on_search="set_search_route"
+			v-model="search_value"
+		/>
+
 		<h5>{{ page_title }}</h5>
 
 		<item-cards-container
@@ -26,7 +32,13 @@ export default {
 			item_id_fieldname: 'name',
 
 			// Constants
-			empty_state_message: __(`No items in this category yet.`)
+			empty_state_message: __(`No items in this category yet.`),
+
+			search_value: '',
+
+			// Constants
+			search_placeholder: __('Search for anything ...'),
+
 		};
 	},
 	computed: {
@@ -35,6 +47,7 @@ export default {
 		}
 	},
 	created() {
+		this.search_value = '';
 		this.get_items();
 	},
 	methods: {
@@ -51,7 +64,11 @@ export default {
 
 		go_to_item_details_page(hub_item_name) {
 			frappe.set_route(`marketplace/item/${hub_item_name}`);
-		}
+		},
+
+		set_search_route() {
+			frappe.set_route('marketplace', 'search', this.category, this.search_value);
+		},
 	}
 }
 </script>

erpnext/public/js/hub/pages/Home.vue

@@ -98,7 +98,7 @@ export default {
 		},
 
 		set_search_route() {
-			frappe.set_route('marketplace', 'search', this.search_value);
+			frappe.set_route('marketplace', 'search', 'All', this.search_value);
 		},
 	}
 }

erpnext/public/js/hub/pages/Search.vue

@@ -29,8 +29,10 @@ export default {
 		return {
 			page_name: frappe.get_route()[1],
 			items: [],
-			search_value: frappe.get_route()[2],
+			category: frappe.get_route()[2],
+			search_value: frappe.get_route()[3],
 			item_id_fieldname: 'name',
+			filters: {},
 
 			// Constants
 			search_placeholder: __('Search for anything ...'),
@@ -40,7 +42,7 @@ export default {
 	computed: {
 		page_title() {
 			return this.items.length
-				? __(`Results for "${this.search_value}"`)
+				? __(`Results for "${this.search_value}" ${this.category !== 'All'? `in category ${this.category}` : ''}`)
 				: __('No Items found.');
 		}
 	},
@@ -49,14 +51,20 @@ export default {
 	},
 	methods: {
 		get_items() {
-			hub.call('get_items', { keyword: this.search_value })
+			if (this.category !== 'All') {
+				this.filters['hub_category'] = this.category;
+			}
+			hub.call('get_items', {
+				keyword: this.search_value,
+				filters: this.filters
+			})
 			.then((items) => {
 				this.items = items;
 			})
 		},
 
 		set_route_and_get_items() {
-			frappe.set_route('marketplace', 'search', this.search_value);
+			frappe.set_route('marketplace', 'search', this.category, this.search_value);
 			this.get_items();
 		},