import { o as __toESM } from "../_runtime.mjs";
import { h as require_react, m as require_jsx_runtime } from "../_libs/react+tanstack__react-query.mjs";
import { a as p, s as MyTouchableOpacity, t as AppContainer, u as SearchBar } from "./src-u_N1opJl.mjs";
import { l as useNavigate } from "../_libs/@tanstack/react-router+[...].mjs";
import { t as useCentralProductStore } from "./central-product-store-TS-vQ8-V.mjs";
import { t as Route } from "./home.search-C7gKn8CW.mjs";
import { t as Fuse } from "../_libs/fuse.js.mjs";
//#region node_modules/.nitro/vite/services/ssr/assets/home.search-pQXmTQuR.js
var import_react = /* @__PURE__ */ __toESM(require_react());
var import_jsx_runtime = require_jsx_runtime();
function SearchPage() {
	const { q } = Route.useSearch();
	const navigate = useNavigate();
	const products = useCentralProductStore((s) => s.products);
	const fuse = (0, import_react.useMemo)(() => new Fuse(products, {
		keys: [
			"name",
			"category",
			"description"
		],
		threshold: .3
	}), [products]);
	const results = (0, import_react.useMemo)(() => {
		if (!q) return products.slice(0, 20);
		return fuse.search(q).map((r) => r.item);
	}, [
		q,
		fuse,
		products
	]);
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AppContainer, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SearchBar, {
		placeholder: "Search products...",
		value: q,
		onChange: (val) => navigate({
			to: "/home/search",
			search: { q: val }
		}),
		onSearch: (val) => navigate({
			to: "/home/search",
			search: { q: val }
		})
	}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
		className: "mt-4 grid grid-cols-2 gap-3",
		children: results.map((product) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(MyTouchableOpacity, {
			onClick: () => navigate({
				to: "/home/product/$id",
				params: { id: String(product.id) }
			}),
			className: "rounded-xl border border-gray-100 bg-white p-3 shadow-sm",
			children: [
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: "mb-2 aspect-square w-full overflow-hidden rounded-lg bg-gray-100",
					children: product.images?.[0] && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
						src: product.images[0].uri,
						alt: product.name,
						className: "h-full w-full object-cover"
					})
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, {
					weight: "semibold",
					className: "text-sm",
					numberOfLines: 2,
					children: product.name
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(p, {
					weight: "bold",
					className: "mt-1 text-brand-600",
					children: ["₹", product.discountedPrice ?? product.price]
				})
			]
		}, product.id))
	})] });
}
//#endregion
export { SearchPage as component };