@findlane/browser 0.10.0 → 0.11.0

package/README.md

@@ -42,7 +42,7 @@ import "@findlane/browser/react/styles.css" // optional
 <SearchBox publicId="pub_your_public_id" getHref={(hit) => hit.record.url} action="/search" />
 ```
 
-`SearchDialog` is the same search box in a dialog that ⌘K opens, as on docs sites. A results page shares its state through `SearchProvider`, with `RefinementList`, `SortSelect`, `Hits`, `LoadMore`, and hooks such as `useRefinementList` and `useRange` for your own markup. With `routing`, the search is kept in the URL. `@findlane/browser/react/ssr` renders the first results on the server. Docs: https://findlane.dev/docs/react
+`SearchDialog` is the same search box in a dialog that ⌘K opens, as on docs sites. A results page shares its state through `SearchProvider`, with `RefinementList`, `SortSelect`, `Hits`, `LoadMore`, and hooks such as `useRefinementList` and `useRange` for your own markup. With `routing`, the search is kept in the URL. `@findlane/browser/react/ssr` renders the first results on the server. On a product page, `useProductView(objectID)`, or `<ProductView>` in a server component, sends the page's view for the index's Events page. Docs: https://findlane.dev/docs/react
 
 ## Search requests
 

package/dist/index.d.ts

@@ -149,6 +149,8 @@ export type ClickDetails = {
 /** Events from the page, sent in the background: a batch a second, and what's left when the page is
  * hidden or closed. They carry no cookie or ID. */
 export type BrowserEvents = {
+    /** A product's page was viewed. A repeat of the last view within 5 seconds is the same page view
+     * (React's double mount in development, a re-render), so it isn't sent. */
     view(objectID: string): void;
     click(objectID: string, details?: ClickDetails): void;
     addToCart(items: EventItem[], options?: {

package/dist/index.js

@@ -13,6 +13,7 @@ function eventSender(url, fetcher, mode) {
     let allowed = mode === "afterConsent" ? undefined : mode;
     let timer;
     let listening = false;
+    let lastView = { objectID: "", at: 0 };
     const flush = () => {
         clearTimeout(timer);
         timer = undefined;
@@ -37,7 +38,13 @@ function eventSender(url, fetcher, mode) {
         timer ??= setTimeout(flush, 1000);
     };
     return {
-        view: (objectID) => add({ type: "view", objectID }),
+        view(objectID) {
+            const now = Date.now();
+            if (objectID === lastView.objectID && now - lastView.at < 5000)
+                return;
+            lastView = { objectID, at: now };
+            add({ type: "view", objectID });
+        },
         click: (objectID, details) => add({ type: "click", objectID, ...details }),
         addToCart: (items, options) => add({ type: "addToCart", items, ...options }),
         purchase: (order) => add({ type: "purchase", ...order }),

package/dist/react/index.d.ts

@@ -3,6 +3,7 @@ export { useSearch, type UseSearchOptions, type UseSearchResult } from "./use-se
 export { useAutocomplete, type AutocompleteOptions } from "./use-autocomplete.js";
 export { useRecommendations, type UseRecommendationsOptions, type UseRecommendationsResult } from "./use-recommendations.js";
 export { Recommendations, type RecommendationsProps } from "./recommendations.js";
+export { ProductView, useProductView } from "./product-view.js";
 export { SearchProvider, useCurrentRefinements, useDidYouMean, useGeoSearch, useHits, useLoadMore, usePagination, useRange, useRefinementList, useSearchBox, useSearchState, useSortBy, useToggle, type Range, type Refinement, type SearchProviderProps, } from "./search-provider.js";
 export { CurrentRefinements, DefaultHit, DidYouMean, Hits, LoadMore, RefinementList, SearchBox, SearchInput, SortSelect, Stats, type HitsProps, type RefinementListProps, type SearchBoxProps, } from "./components.js";
 export { SearchDialog, type SearchDialogProps } from "./dialog.js";

package/dist/react/index.js

@@ -5,6 +5,7 @@ export { useSearch } from "./use-search.js";
 export { useAutocomplete } from "./use-autocomplete.js";
 export { useRecommendations } from "./use-recommendations.js";
 export { Recommendations } from "./recommendations.js";
+export { ProductView, useProductView } from "./product-view.js";
 export { SearchProvider, useCurrentRefinements, useDidYouMean, useGeoSearch, useHits, useLoadMore, usePagination, useRange, useRefinementList, useSearchBox, useSearchState, useSortBy, useToggle, } from "./search-provider.js";
 export { CurrentRefinements, DefaultHit, DidYouMean, Hits, LoadMore, RefinementList, SearchBox, SearchInput, SortSelect, Stats, } from "./components.js";
 export { SearchDialog } from "./dialog.js";

package/dist/react/product-view.d.ts

@@ -0,0 +1,10 @@
+import { type ClientOptions } from "./client.js";
+/** Sends a view of the product when its page shows, and again when `objectID` changes, for the index's
+ * Events page and popularity. Nothing is sent while `objectID` is empty. The client's `events` option
+ * turns views off, or holds them until consent. */
+export declare function useProductView(objectID: string | null | undefined, options?: ClientOptions): void;
+/** useProductView as a component that renders nothing, for pages that can't call hooks, such as a
+ * Next.js server component. */
+export declare function ProductView({ objectID, ...options }: ClientOptions & {
+    objectID: string;
+}): null;

package/dist/react/product-view.js

@@ -0,0 +1,19 @@
+"use client";
+import { useEffect } from "react";
+import { useClient } from "./client.js";
+/** Sends a view of the product when its page shows, and again when `objectID` changes, for the index's
+ * Events page and popularity. Nothing is sent while `objectID` is empty. The client's `events` option
+ * turns views off, or holds them until consent. */
+export function useProductView(objectID, options = {}) {
+    const client = useClient(options);
+    useEffect(() => {
+        if (objectID)
+            client.events.view(objectID);
+    }, [client, objectID]);
+}
+/** useProductView as a component that renders nothing, for pages that can't call hooks, such as a
+ * Next.js server component. */
+export function ProductView({ objectID, ...options }) {
+    useProductView(objectID, options);
+    return null;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@findlane/browser",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "description": "Findlane browser SDK: fast, typo-tolerant public search from the browser with an index's public ID, plus React hooks and components.",
   "keywords": ["findlane", "search", "full-text search", "typo tolerance", "instant search", "ecommerce search", "browser", "react", "autocomplete"],
   "license": "MIT",