@bouko/react 3.1.6 → 3.1.8

package/dist/hooks/auth/index.d.ts

@@ -1,3 +1,8 @@
 export { AuthProvider } from "./provider";
-export { useAuth } from "./context";
 export * from "./redirect";
+export declare function useAuth(): {
+    session: import("@supabase/auth-js").Session | null;
+    accessToken: string | undefined;
+    user: import("@supabase/auth-js").User | null;
+    loading: boolean;
+};

package/dist/hooks/auth/index.js

@@ -1,3 +1,7 @@
+import { useAuth as useAuthBase } from "./context";
 export { AuthProvider } from "./provider";
-export { useAuth } from "./context";
 export * from "./redirect";
+export function useAuth() {
+    const { session, ...auth } = useAuthBase();
+    return { ...auth, session, accessToken: session?.access_token };
+}

package/dist/hooks/router/params.d.ts

@@ -1,19 +1,36 @@
 type Options<T> = {
-    fetcher: (query: PaginationQuery) => Promise<T[]>;
+    fetcher: (query: PageQuery) => Promise<T[] | {
+        items: T[];
+        total?: number;
+        totalPages?: number;
+    }>;
     pageSize: number;
 };
-type PaginationQuery = {
+export type PageQuery = {
     page: number;
     pageSize: number;
     refresh?: boolean;
 };
+export type PageState<T> = {
+    page: number;
+    isLoading: boolean;
+    items: T[];
+    totalPages: number;
+    fetchedAt: Date | null;
+    prev: () => void;
+    next: () => void;
+    jump: (page: number) => void;
+    refresh: () => void;
+};
 export declare const useSearchParam: (key: string) => string | null;
 export declare function usePagination<T>({ fetcher, pageSize }: Options<T>): {
     items: T[];
-    loading: boolean;
+    isLoading: boolean;
     page: number;
+    totalPages: number;
     prev: () => void;
     next: () => void;
+    jump: (target: number) => void;
     refresh: () => Promise<void>;
     fetchedAt: Date | null;
 };

package/dist/hooks/router/params.js

@@ -7,35 +7,77 @@ export const useSearchParam = (key) => {
 export function usePagination({ fetcher, pageSize }) {
     const [params, setParams] = useSearchParams();
     const [items, setItems] = useState([]);
+    const [totalPages, setTotalPages] = useState(0);
     const [loading, setLoading] = useState(false);
     const [fetchedAt, setFetchedAt] = useState(null);
     const raw = params.get("page");
     const page = Math.max(1, Number(raw) || 1);
-    const setPage = (nextPage) => {
-        params.set("page", String(Math.max(1, nextPage)));
-        setParams(params);
-    };
+    const setPage = useCallback((nextPage) => {
+        const p = Math.max(1, Math.trunc(nextPage));
+        const next = new URLSearchParams(params.toString());
+        next.set("page", String(p));
+        setParams(next);
+    }, [params, setParams]);
+    const jump = useCallback((target) => setPage(target), [setPage]);
     const fetchPage = useCallback(async (refresh = false) => {
         setLoading(true);
-        const result = await fetcher({
-            page,
-            pageSize,
-            refresh
-        });
-        setItems(result);
-        setFetchedAt(new Date());
-        setLoading(false);
+        try {
+            const result = await fetcher({ page, pageSize, refresh });
+            // normalize result to { items, totalPages }
+            let resultItems = [];
+            let computedTotalPages = 0;
+            if (Array.isArray(result)) {
+                resultItems = result;
+                // can't compute total pages from array alone
+                computedTotalPages = 0;
+            }
+            else {
+                resultItems = result?.items ?? [];
+                if (typeof result?.totalPages === "number") {
+                    computedTotalPages = Math.max(0, Math.trunc(result.totalPages));
+                }
+                else if (typeof result?.total === "number") {
+                    computedTotalPages = Math.max(0, Math.ceil(result.total / pageSize));
+                }
+                else {
+                    computedTotalPages = 0;
+                }
+            }
+            setItems(resultItems);
+            setTotalPages(computedTotalPages);
+            setFetchedAt(new Date());
+        }
+        finally {
+            setLoading(false);
+        }
     }, [page, pageSize]);
     useEffect(() => {
         fetchPage(false);
     }, [fetchPage]);
+    const prev = useCallback(() => {
+        if (page > 1)
+            setPage(page - 1);
+    }, [page, setPage]);
+    const next = useCallback(() => {
+        // if totalPages is known, don't advance past it
+        if (totalPages > 0) {
+            if (page < totalPages)
+                setPage(page + 1);
+        }
+        else {
+            // unknown total -> allow advancing
+            setPage(page + 1);
+        }
+    }, [page, setPage, totalPages]);
     return {
         items,
-        loading,
+        isLoading: loading,
         page,
-        prev: () => page > 1 ? setPage(page - 1) : undefined,
-        next: () => !(page > 1 && items.length === 0) ? setPage(page + 1) : undefined,
+        totalPages,
+        prev,
+        next,
+        jump,
         refresh: () => fetchPage(true),
-        fetchedAt
+        fetchedAt,
     };
 }

package/package.json

@@ -1,7 +1,7 @@
 {
 
   "name": "@bouko/react",
-  "version": "3.1.6",
+  "version": "3.1.8",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "license": "MIT",