@streamlayer/feature-gamification 0.30.3 → 0.32.0

package/lib/deepLink.d.ts

@@ -1,7 +1,12 @@
 import type { Transport } from '@streamlayer/sdk-web-api';
 import { ReadableAtom } from 'nanostores';
+type DeepLinkData = {
+    data?: string;
+    loading?: boolean;
+    error?: string;
+};
 export declare const deepLink: (transport: Transport, $eventId: ReadableAtom<string | undefined>, $userId: ReadableAtom<string | undefined>) => {
-    $store: import("@nanostores/query").FetcherStore<import("@streamlayer/sl-eslib/sdkSettings/client/client_pb").DeepLink | undefined, any>;
+    $store: import("nanostores").MapStore<DeepLinkData>;
     fetch: typeof fetch;
-    desktopLink: string;
 };
+export {};

package/lib/deepLink.js

@@ -1,6 +1,23 @@
-import { $deepLink } from './queries/deepLink';
+import { createMapStore } from '@streamlayer/sdk-web-interfaces';
+import { onMount } from 'nanostores';
+import { $deepLink, generateShortLink } from './queries/deepLink';
 export const deepLink = (transport, $eventId, $userId) => {
-    const $store = $deepLink(transport, [$eventId]);
-    const desktopLink = `${window.location.host + window.location.pathname}%23sl_eid=${$eventId.get()}&sl_uid=${$userId.get()}`;
-    return { $store, fetch, desktopLink };
+    const $store = createMapStore({});
+    onMount($store, () => {
+        const $branchLink = $deepLink(transport, [$eventId]);
+        const cancel = $branchLink.subscribe(async ({ data }) => {
+            const mobileDeepLink = data?.url;
+            if (mobileDeepLink) {
+                $store.setKey('loading', true);
+                const desktopLink = `${window.location.host + window.location.pathname}%23sl_eid=${$eventId.get()}&sl_uid=${$userId.get()}`;
+                const shortLink = await generateShortLink(transport, { web: desktopLink, mobile: mobileDeepLink });
+                $store.set({
+                    data: shortLink.data?.link,
+                    loading: false,
+                });
+            }
+        });
+        return cancel;
+    });
+    return { $store, fetch };
 };

package/lib/leaderboard.d.ts

@@ -7,11 +7,12 @@ type LeaderboardOptions = {
 type LeaderboardStore = {
     data?: LeaderboardItem[];
     loading?: boolean;
+    hasMore: boolean;
     error?: string;
 };
 export declare const leaderboard: (transport: Transport, $eventId: ReadableAtom<string | undefined>, options?: LeaderboardOptions) => {
     $store: import("nanostores").MapStore<LeaderboardStore>;
-    fetchMore: () => void;
+    fetchMore: (page?: number) => void;
     invalidate: () => void;
 };
 export {};

package/lib/leaderboard.js

@@ -1,12 +1,17 @@
 import { createSingleStore, createMapStore } from '@streamlayer/sdk-web-interfaces';
+import { onMount } from 'nanostores';
 import { createLeaderboardListFetch } from './queries/leaderboard';
 const defaultOptions = {
     pageSize: 10,
 };
 export const leaderboard = (transport, $eventId, options) => {
+    let maxPage = 0;
     const $pagination = createSingleStore({ pageSize: options?.pageSize || defaultOptions.pageSize, page: 0 });
-    const $store = createMapStore({ data: [], loading: undefined, error: undefined });
+    const $store = createMapStore({ data: [], hasMore: true, loading: undefined, error: undefined });
     const fetch = createLeaderboardListFetch(transport);
+    /**
+     * Refetch leaderboard data, reset pagination
+     */
     const refetch = async (eventId) => {
         if (eventId) {
             $store.setKey('loading', true);
@@ -15,34 +20,58 @@ export const leaderboard = (transport, $eventId, options) => {
                 pagination: { page: 0, pageSize: options?.pageSize || defaultOptions.pageSize },
             };
             const newData = await fetch(request);
-            $store.set({ data: newData.data.map((item) => item.attributes), loading: false });
+            $store.set({
+                data: newData.data.map((item) => item.attributes),
+                hasMore: true,
+                loading: false,
+            });
+            if (newData.meta) {
+                maxPage = Math.round(newData.meta.count / newData.meta.pageSize);
+            }
             $pagination.set(request.pagination);
         }
     };
-    $eventId.listen(refetch);
     const invalidate = () => {
         void refetch($eventId.get());
     };
-    $pagination.listen(async (pagination) => {
-        const eventId = $eventId.get();
-        const prevDataLength = $store.get().data?.length || 0;
-        if (pagination.page > 0 && eventId && prevDataLength >= pagination.page * pagination.pageSize) {
-            $store.setKey('loading', true);
-            const request = {
-                eventId: eventId,
-                pagination,
-            };
-            const newData = await fetch(request);
-            const prevData = $store.get().data || [];
-            $store.set({
-                data: [...prevData, ...newData.data.map((item) => item.attributes)],
-                loading: false,
-            });
-        }
-    });
-    const fetchMore = () => {
+    /**
+     * Whether there is more data to fetch
+     */
+    const fetchMore = (page) => {
         const pagination = $pagination.get();
-        $pagination.set({ ...pagination, page: pagination.page + 1 });
+        const nextPage = page || pagination.page + 1;
+        if (nextPage <= maxPage) {
+            $pagination.set({ ...pagination, page: nextPage });
+        }
     };
+    onMount($store, () => {
+        const cancelRefetchListener = $eventId.listen(refetch);
+        const cancelPaginationListener = $pagination.listen(async (pagination) => {
+            const eventId = $eventId.get();
+            if (pagination.page > 0 && eventId) {
+                if (pagination.page < maxPage) {
+                    $store.setKey('loading', true);
+                    const request = {
+                        eventId: eventId,
+                        pagination,
+                    };
+                    const newData = await fetch(request);
+                    const prevData = $store.get().data || [];
+                    $store.set({
+                        data: [...prevData, ...newData.data.map((item) => item.attributes)],
+                        loading: false,
+                        hasMore: true,
+                    });
+                }
+                else {
+                    $store.setKey('hasMore', false);
+                }
+            }
+        });
+        return () => {
+            cancelRefetchListener();
+            cancelPaginationListener();
+        };
+    });
     return { $store, fetchMore, invalidate };
 };

package/lib/queries/deepLink.d.ts

@@ -3,4 +3,8 @@ import { ReadableAtom } from 'nanostores';
 import { DeepLink } from '@streamlayer/sl-eslib/sdkSettings/client/client_pb';
 type EventId = ReadableAtom<string | undefined>;
 export declare const $deepLink: (transport: Transport, params: [EventId]) => import("@nanostores/query").FetcherStore<DeepLink | undefined, any>;
+export declare const generateShortLink: (transport: Transport, { web, mobile }: {
+    web: string;
+    mobile: string;
+}) => Promise<import("@streamlayer/sl-eslib/shortLinks/client_pb").GenerateResponse>;
 export {};

package/lib/queries/deepLink.js

@@ -1,4 +1,5 @@
 import { Client } from '@streamlayer/sl-eslib/sdkSettings/client/client_connect';
+import { Client as ShortLinkClient } from '@streamlayer/sl-eslib/shortLinks/client_connect';
 export const $deepLink = (transport, params) => {
     const { client, queryKey } = transport.createPromiseClient(Client, {
         method: 'generateDeepLink',
@@ -14,3 +15,7 @@ export const $deepLink = (transport, params) => {
         },
     });
 };
+export const generateShortLink = (transport, { web, mobile }) => {
+    const { client } = transport.createPromiseClient(ShortLinkClient, { method: 'generate' });
+    return client.generate({ web, mobile });
+};

package/package.json

@@ -1,17 +1,17 @@
 {
   "name": "@streamlayer/feature-gamification",
-  "version": "0.30.3",
+  "version": "0.32.0",
   "peerDependencies": {
     "@bufbuild/protobuf": "^1.4.2",
-    "@streamlayer/sl-eslib": "^5.61.0",
+    "@streamlayer/sl-eslib": "^5.61.1",
     "@fastify/deepmerge": "*",
     "nanostores": "^0.9.5",
-    "@streamlayer/sdk-web-api": "^0.1.0",
-    "@streamlayer/sdk-web-core": "^0.1.0",
-    "@streamlayer/sdk-web-interfaces": "^0.18.19",
-    "@streamlayer/sdk-web-notifications": "^0.0.3",
-    "@streamlayer/sdk-web-storage": "^0.0.4",
+    "@streamlayer/sdk-web-api": "^0.0.1",
+    "@streamlayer/sdk-web-core": "^0.0.1",
+    "@streamlayer/sdk-web-interfaces": "^0.18.21",
     "@streamlayer/sdk-web-logger": "^0.0.1",
+    "@streamlayer/sdk-web-notifications": "^0.0.5",
+    "@streamlayer/sdk-web-storage": "^0.0.4",
     "@streamlayer/sdk-web-types": "^0.1.0"
   },
   "devDependencies": {