@opexa/portal-components 0.0.601 → 0.0.602
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/client/hooks/useAvailableQuestsQuery.js +0 -1
- package/dist/client/hooks/useJackpotPayoutsQuery.js +0 -1
- package/dist/client/hooks/useJackpotsQuery.js +0 -1
- package/dist/components/Jackpots/JackpotsCarousel/JackpotsCarousel.js +7 -1
- package/dist/components/Jackpots/JackpotsCarousel/JackpotsCarouselItem.js +1 -0
- package/dist/components/Jackpots/JackpotsList/JackpotsList.js +7 -1
- package/dist/components/Jackpots/JackpotsList/useJackpotsListItemData.js +1 -1
- package/dist/services/queries.d.ts +1 -1
- package/dist/services/queries.js +1 -0
- package/package.json +1 -1
|
@@ -14,7 +14,6 @@ export const useAvailableQuestsQuery = (config) => {
|
|
|
14
14
|
? false
|
|
15
15
|
: sessionQuery.data?.status === 'authenticated',
|
|
16
16
|
queryKey: getAvailableQuestsQueryKey(),
|
|
17
|
-
refetchInterval: 5000,
|
|
18
17
|
queryFn: async ({ signal }) => {
|
|
19
18
|
const session = await queryClient.fetchQuery({
|
|
20
19
|
queryKey: getSessionQueryKey(),
|
|
@@ -6,7 +6,6 @@ export const useJackpotPayoutsQuery = (input, config) => {
|
|
|
6
6
|
refetchOnMount: false,
|
|
7
7
|
refetchOnReconnect: false,
|
|
8
8
|
refetchOnWindowFocus: false,
|
|
9
|
-
refetchInterval: 10000, // 10 seconds
|
|
10
9
|
...config,
|
|
11
10
|
queryKey: getJackpotPayoutsQueryKey(input),
|
|
12
11
|
queryFn: ({ pageParam, signal }) => {
|
|
@@ -6,7 +6,6 @@ export const useJackpotsQuery = (input, config) => {
|
|
|
6
6
|
refetchOnMount: false,
|
|
7
7
|
refetchOnReconnect: false,
|
|
8
8
|
refetchOnWindowFocus: false,
|
|
9
|
-
refetchInterval: 10000, // 10 seconds
|
|
10
9
|
...config,
|
|
11
10
|
queryKey: getJackpotsQueryKey(input),
|
|
12
11
|
queryFn: ({ pageParam, signal }) => {
|
|
@@ -4,6 +4,7 @@ import useEmblaCarousel from 'embla-carousel-react';
|
|
|
4
4
|
import { isString } from 'lodash-es';
|
|
5
5
|
import Link from 'next/link';
|
|
6
6
|
import { useCallback, useEffect, useState, } from 'react';
|
|
7
|
+
import { useIntersectionObserver } from 'usehooks-ts';
|
|
7
8
|
import { useJackpotsQuery } from '../../../client/hooks/useJackpotsQuery.js';
|
|
8
9
|
import { ArrowLeftIcon } from '../../../icons/ArrowLeftIcon.js';
|
|
9
10
|
import { ArrowRightIcon } from '../../../icons/ArrowRightIcon.js';
|
|
@@ -40,6 +41,9 @@ export function JackpotsCarousel({ style, className, ...props }) {
|
|
|
40
41
|
emblaApi.on('select', onSelect);
|
|
41
42
|
emblaApi.on('reInit', onSelect);
|
|
42
43
|
}, [emblaApi, onSelect]);
|
|
44
|
+
const [ref, inView] = useIntersectionObserver({
|
|
45
|
+
threshold: 0.25,
|
|
46
|
+
});
|
|
43
47
|
const jackpotsQuery = useJackpotsQuery({
|
|
44
48
|
first: 100,
|
|
45
49
|
filter: {
|
|
@@ -51,6 +55,8 @@ export function JackpotsCarousel({ style, className, ...props }) {
|
|
|
51
55
|
cursor: 'POOL',
|
|
52
56
|
order: 'DESC',
|
|
53
57
|
},
|
|
58
|
+
}, {
|
|
59
|
+
refetchInterval: inView ? 10_000 : false,
|
|
54
60
|
});
|
|
55
61
|
const jackpots = jackpotsQuery.data?.pages[0].edges.map((edge) => edge.node) ?? [];
|
|
56
62
|
if (jackpots.length <= 0)
|
|
@@ -61,5 +67,5 @@ export function JackpotsCarousel({ style, className, ...props }) {
|
|
|
61
67
|
const classNames = isString(className)
|
|
62
68
|
? { root: className }
|
|
63
69
|
: (className ?? {});
|
|
64
|
-
return (_jsxs("div", { style: styles.root, className: classNames.root, children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "font-semibold text-lg", children: props.heading ?? 'Jackpots' }), _jsxs("div", { className: "flex items-center md:gap-3xl", children: [_jsxs(Link, { href: props.viewAllUrl ?? '/jackpots', className: "flex gap-sm font-semibold text-button-tertiary-fg text-sm", children: ["See All", _jsx(ChevronRightIcon, { className: "size-5 lg:hidden" })] }), _jsxs("div", { className: "hidden lg:flex", children: [_jsx(Button, { disabled: !canScrollPrev, onClick: scrollPrev, variant: "outline", colorScheme: "gray", className: "rounded-r-none border-r-0", "aria-label": "Previous", children: _jsx(ArrowLeftIcon, { className: "size-5" }) }), _jsxs(Button, { disabled: !canScrollNext, onClick: scrollNext, variant: "outline", colorScheme: "gray", className: "rounded-l-none", "aria-label": "Next", children: [_jsx("span", { className: "sr-only", children: "Next" }), _jsx(ArrowRightIcon, { className: "size-5" })] })] })] })] }), _jsx("div", { className: "relative mt-lg overflow-hidden", ref: emblaRef, children: _jsx("div", { className: "flex gap-2.5", children: jackpots.map((jackpot) => (_jsx(JackpotsCarouselItemContext, { value: jackpot, children: _jsx(JackpotsCarouselItem, { style: styles.itemRoot, className: classNames, viewAllUrl: props.viewAllUrl, animate: props.animate, customJackpotChestImage: props.customJackpotChestImage, jackpotProfileShape: props.jackpotProfileShape }) }, jackpot.id))) }) })] }));
|
|
70
|
+
return (_jsxs("div", { ref: ref, style: styles.root, className: classNames.root, children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "font-semibold text-lg", children: props.heading ?? 'Jackpots' }), _jsxs("div", { className: "flex items-center md:gap-3xl", children: [_jsxs(Link, { href: props.viewAllUrl ?? '/jackpots', className: "flex gap-sm font-semibold text-button-tertiary-fg text-sm", children: ["See All", _jsx(ChevronRightIcon, { className: "size-5 lg:hidden" })] }), _jsxs("div", { className: "hidden lg:flex", children: [_jsx(Button, { disabled: !canScrollPrev, onClick: scrollPrev, variant: "outline", colorScheme: "gray", className: "rounded-r-none border-r-0", "aria-label": "Previous", children: _jsx(ArrowLeftIcon, { className: "size-5" }) }), _jsxs(Button, { disabled: !canScrollNext, onClick: scrollNext, variant: "outline", colorScheme: "gray", className: "rounded-l-none", "aria-label": "Next", children: [_jsx("span", { className: "sr-only", children: "Next" }), _jsx(ArrowRightIcon, { className: "size-5" })] })] })] })] }), _jsx("div", { className: "relative mt-lg overflow-hidden", ref: emblaRef, children: _jsx("div", { className: "flex gap-2.5", children: jackpots.map((jackpot) => (_jsx(JackpotsCarouselItemContext, { value: jackpot, children: _jsx(JackpotsCarouselItem, { style: styles.itemRoot, className: classNames, viewAllUrl: props.viewAllUrl, animate: props.animate, customJackpotChestImage: props.customJackpotChestImage, jackpotProfileShape: props.jackpotProfileShape }) }, jackpot.id))) }) })] }));
|
|
65
71
|
}
|
|
@@ -41,6 +41,7 @@ export function JackpotsCarouselItem({ style, className, viewAllUrl, animate = t
|
|
|
41
41
|
},
|
|
42
42
|
}, {
|
|
43
43
|
enabled: typeof window !== 'undefined' && inView,
|
|
44
|
+
refetchInterval: 10_000,
|
|
44
45
|
});
|
|
45
46
|
const jackpotPayouts = jackpotPayoutsQuery.data?.pages[0].edges.map((edge) => edge.node) ?? [];
|
|
46
47
|
const latestJackpotPayout = jackpotPayouts[0] ?? [];
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { isString } from 'lodash-es';
|
|
4
4
|
import Image, {} from 'next/image';
|
|
5
|
+
import { useIntersectionObserver } from 'usehooks-ts';
|
|
5
6
|
import { useJackpotsQuery } from '../../../client/hooks/useJackpotsQuery.js';
|
|
6
7
|
import closeChest from '../../../images/close-chest.png';
|
|
7
8
|
import { isStyleEntries } from '../../../utils/isStyleEntries.js';
|
|
@@ -9,6 +10,9 @@ import { JackpotsListItemContext, JackpotsListPropsContext, } from './JackpotsLi
|
|
|
9
10
|
import { JackpotsListItemDesktop } from './JackpotsListItemDesktop.js';
|
|
10
11
|
import { JackpotsListItemMobile } from './JackpotsListItemMobile.js';
|
|
11
12
|
export function JackpotsList(props) {
|
|
13
|
+
const [ref, inView] = useIntersectionObserver({
|
|
14
|
+
threshold: 0.25,
|
|
15
|
+
});
|
|
12
16
|
const jackpotsQuery = useJackpotsQuery({
|
|
13
17
|
first: 100,
|
|
14
18
|
filter: {
|
|
@@ -20,6 +24,8 @@ export function JackpotsList(props) {
|
|
|
20
24
|
cursor: 'POOL',
|
|
21
25
|
order: 'DESC',
|
|
22
26
|
},
|
|
27
|
+
}, {
|
|
28
|
+
refetchInterval: inView ? 10_000 : false,
|
|
23
29
|
});
|
|
24
30
|
const jackpots = jackpotsQuery.data?.pages[0].edges.map((edge) => edge.node) ?? [];
|
|
25
31
|
const styles = isStyleEntries(props.style, ['root', 'itemRoot'])
|
|
@@ -28,5 +34,5 @@ export function JackpotsList(props) {
|
|
|
28
34
|
const classNames = isString(props.className)
|
|
29
35
|
? { root: props.className }
|
|
30
36
|
: (props.className ?? {});
|
|
31
|
-
return (_jsx(JackpotsListPropsContext, { value: props, children: _jsxs("div", { style: styles.root, className: classNames.root, children: [_jsx("div", { className: "mb-3 font-semibold text-lg lg:mb-4.5", children: props.heading ?? 'Jackpots' }), jackpots.length > 0 ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "hidden flex-col gap-6 lg:flex", children: jackpots.map((jackpot) => (_jsx(JackpotsListItemContext, { value: jackpot, children: _jsx(JackpotsListItemDesktop, { style: styles.itemRoot, className: classNames, animate: props.animate, customJackpotChestImage: props.customJackpotChestImage, jackpotProfileShape: props.jackpotProfileShape }) }, jackpot.id))) }), _jsx("div", { className: "flex flex-col gap-6 lg:hidden", children: jackpots.map((jackpot) => (_jsx(JackpotsListItemContext, { value: jackpot, children: _jsx(JackpotsListItemMobile, { style: styles.itemRoot, className: classNames, animate: props.animate, customJackpotChestImage: props.customJackpotChestImage, jackpotProfileShape: props.jackpotProfileShape }) }, jackpot.id))) })] })) : (_jsxs("div", { className: "mt-5 flex h-fit flex-col items-center justify-center lg:mt-0 lg:h-62", children: [_jsx(Image, { width: 100, height: 100, src: closeChest, alt: "closeChest", className: "size-full h-29.5 w-29.5 mix-blend-luminosity lg:h-25 lg:w-25" }), _jsx("div", { className: "mt-4 font-semibold text-base text-text-primary-900", children: "No Jackpots" }), _jsxs("div", { className: "mt-1 text-center text-sm text-text-tertiary-600", children: ["No jackpots are running at the moment. ", _jsx("br", {}), "Please check back later!"] })] }))] }) }));
|
|
37
|
+
return (_jsx(JackpotsListPropsContext, { value: props, children: _jsxs("div", { ref: ref, style: styles.root, className: classNames.root, children: [_jsx("div", { className: "mb-3 font-semibold text-lg lg:mb-4.5", children: props.heading ?? 'Jackpots' }), jackpots.length > 0 ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "hidden flex-col gap-6 lg:flex", children: jackpots.map((jackpot) => (_jsx(JackpotsListItemContext, { value: jackpot, children: _jsx(JackpotsListItemDesktop, { style: styles.itemRoot, className: classNames, animate: props.animate, customJackpotChestImage: props.customJackpotChestImage, jackpotProfileShape: props.jackpotProfileShape }) }, jackpot.id))) }), _jsx("div", { className: "flex flex-col gap-6 lg:hidden", children: jackpots.map((jackpot) => (_jsx(JackpotsListItemContext, { value: jackpot, children: _jsx(JackpotsListItemMobile, { style: styles.itemRoot, className: classNames, animate: props.animate, customJackpotChestImage: props.customJackpotChestImage, jackpotProfileShape: props.jackpotProfileShape }) }, jackpot.id))) })] })) : (_jsxs("div", { className: "mt-5 flex h-fit flex-col items-center justify-center lg:mt-0 lg:h-62", children: [_jsx(Image, { width: 100, height: 100, src: closeChest, alt: "closeChest", className: "size-full h-29.5 w-29.5 mix-blend-luminosity lg:h-25 lg:w-25" }), _jsx("div", { className: "mt-4 font-semibold text-base text-text-primary-900", children: "No Jackpots" }), _jsxs("div", { className: "mt-1 text-center text-sm text-text-tertiary-600", children: ["No jackpots are running at the moment. ", _jsx("br", {}), "Please check back later!"] })] }))] }) }));
|
|
32
38
|
}
|
|
@@ -14,7 +14,7 @@ export function useJackpotsListItemData() {
|
|
|
14
14
|
const jackpot = useJackpotsListItemContext();
|
|
15
15
|
const gameProviders = jackpotsListProps.gameProviders.map((provider) => GAME_PROVIDER_DATA[provider]);
|
|
16
16
|
const [rootRef, inView] = useIntersectionObserver({
|
|
17
|
-
threshold: 0.
|
|
17
|
+
threshold: 0.25,
|
|
18
18
|
});
|
|
19
19
|
const jackpotPayoutsQuery = useJackpotPayoutsQuery({
|
|
20
20
|
first: 30,
|
|
@@ -14,7 +14,7 @@ export declare const END_GAME_SESSION = "\n mutation EndGameSession($input: End
|
|
|
14
14
|
export declare const END_GAME_SESSION__LEGACY = "\n mutation EndGameSession($input: EndGameSessionInput!) {\n endGameSession(input: $input) {\n ... on GameSessionDoesNotExistError {\n name: __typename\n message\n }\n ... on GameSessionAlreadyClosedError {\n name: __typename\n message\n }\n ... on GameProviderError {\n name: __typename\n message\n }\n }\n }\n";
|
|
15
15
|
export declare const RECOMMENDED_GAMES = "\n query RecommendedGames {\n recommendedGames {\n id\n name\n type\n provider\n }\n }\n";
|
|
16
16
|
export declare const ANNOUNCEMENTS = "\n query Announcements(\n $first: Int\n $after: Cursor\n $filter: AnnouncementFilterInput\n ) {\n announcements(first: $first, after: $after, filter: $filter) {\n edges {\n cursor\n node {\n ... on Announcement {\n id\n type\n title\n status\n message\n activationStartDateTime\n activationEndDateTime\n dateTimeCreated\n dateTimeLastUpdated\n }\n }\n }\n totalCount\n pageInfo {\n hasNextPage\n endCursor\n }\n }\n }\n";
|
|
17
|
-
export declare const WITHDRAWAL_RECORDS = "\n query WithdrawalRecords(\n $first: Int\n $after: Cursor\n $filter: WithdrawalRecordFilterInput\n ) {\n member {\n withdrawalRecords(first: $first, after: $after, filter: $filter) {\n edges {\n cursor\n node {\n ... on BankWithdrawalRecord {\n id\n type\n bank\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on GCashWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n recipientMobileNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on ManualWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on MayaAppWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on InstapayWithdrawalRecord {\n id\n type\n fee\n netAmount\n bankName\n reference\n accountName\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on ManualUPIWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on ManualBankWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on VentajaDisbursementWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on PisoPayRemittanceWithdrawalRecord {\n bankName\n id\n type\n fee\n accountName\n accountNumber\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n }\n }\n totalCount\n pageInfo {\n hasNextPage\n endCursor\n }\n }\n }\n }\n";
|
|
17
|
+
export declare const WITHDRAWAL_RECORDS = "\n query WithdrawalRecords(\n $first: Int\n $after: Cursor\n $filter: WithdrawalRecordFilterInput\n ) {\n member {\n withdrawalRecords(first: $first, after: $after, filter: $filter) {\n edges {\n cursor\n node {\n ... on BankWithdrawalRecord {\n id\n type\n bank\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on GCashWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n recipientMobileNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on ManualWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on MayaAppWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on InstapayWithdrawalRecord {\n id\n type\n fee\n netAmount\n bankName\n reference\n accountName\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on ManualUPIWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on ManualBankWithdrawalRecord {\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on VentajaDisbursementWithdrawalRecord {\n bankName\n id\n type\n fee\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n ... on PisoPayRemittanceWithdrawalRecord {\n bankName\n id\n type\n fee\n accountName\n accountNumber\n netAmount\n reference\n amount\n status\n error\n withdrawalNumber\n dateTimeCreated\n dateTimeLastUpdated\n }\n }\n }\n totalCount\n pageInfo {\n hasNextPage\n endCursor\n }\n }\n }\n }\n";
|
|
18
18
|
export declare const CREATE_GCASH_WITHDRAWAL = "\n mutation CreateGCashWithdrawal($input: CreateGCashWithdrawalInput!) {\n createGCashWithdrawal(input: $input) {\n ... on AccountNotVerifiedError {\n name: __typename\n message\n }\n ... on InvalidTransactionPasswordError {\n name: __typename\n message\n }\n ... on InvalidWithdrawalAmountError {\n name: __typename\n message\n }\n ... on MobileNumberNotVerifiedError {\n name: __typename\n message\n }\n ... on NotEnoughBalanceError {\n name: __typename\n message\n }\n ... on WithdrawalDailyLimitExceededError {\n name: __typename\n message\n }\n ... on ReCAPTCHAVerificationFailedError {\n name: __typename\n message\n }\n ... on WalletDoesNotExistError {\n name: __typename\n message\n }\n ... on TransactionPasswordNotSetError {\n name: __typename\n message\n }\n }\n }\n";
|
|
19
19
|
export declare const CREATE_GCASH_STANDARD_CASH_IN_WITHDRAWAL = "\n mutation CreateGCashStandardCashInWithdrawal(\n $input: CreateGCashStandardCashInWithdrawalInput!\n ) {\n createGCashStandardCashInWithdrawal(input: $input) {\n ... on AccountNotVerifiedError {\n name: __typename\n message\n }\n ... on InvalidTransactionPasswordError {\n name: __typename\n message\n }\n ... on InvalidWithdrawalAmountError {\n name: __typename\n message\n }\n ... on MobileNumberNotVerifiedError {\n name: __typename\n message\n }\n ... on NotEnoughBalanceError {\n name: __typename\n message\n }\n ... on WithdrawalDailyLimitExceededError {\n name: __typename\n message\n }\n ... on ReCAPTCHAVerificationFailedError {\n name: __typename\n message\n }\n ... on WalletDoesNotExistError {\n name: __typename\n message\n }\n ... on TransactionPasswordNotSetError {\n name: __typename\n message\n }\n }\n }\n";
|
|
20
20
|
export declare const CREATE_MAYA_WITHDRAWAL = "\n mutation CreateMayaWithdrawal($input: CreateMayaWithdrawalInput!) {\n createMayaWithdrawal(input: $input) {\n ... on AccountNotVerifiedError {\n name: __typename\n message\n }\n ... on InvalidTransactionPasswordError {\n name: __typename\n message\n }\n ... on InvalidWithdrawalAmountError {\n name: __typename\n message\n }\n ... on MobileNumberNotVerifiedError {\n name: __typename\n message\n }\n ... on NotEnoughBalanceError {\n name: __typename\n message\n }\n ... on WithdrawalDailyLimitExceededError {\n name: __typename\n message\n }\n }\n }\n";
|
package/dist/services/queries.js
CHANGED