@opexa/portal-components 0.0.124 → 0.0.126

package/dist/components/TransactionRecords/TableFilters.js

@@ -15,6 +15,20 @@ import { SegmentGroup } from '../../ui/SegmentGroup/index.js';
 import { Select } from '../../ui/Select/index.js';
 import { capitalize } from '../../utils/capitalize.js';
 const TabDefinition = z.enum(['all', 'today', 'custom']).catch('all');
+const DEPOSIT_TYPES = [
+    'BANK',
+    'GCASH',
+    'MAYA',
+    'MANUAL_UPI',
+    'ONLINE_BANK',
+];
+const DEPOSIT_TYPES_MAP = {
+    BANK: 'Bank',
+    GCASH: 'GCash',
+    MAYA: 'Maya',
+    MANUAL_UPI: 'Manual',
+    ONLINE_BANK: 'Online Bank',
+};
 const DEPOSIT_STATUSES = [
     'ACCEPTED',
     'APPROVED',
@@ -24,6 +38,20 @@ const DEPOSIT_STATUSES = [
     'PENDING',
     'REJECTED',
 ];
+const WITHDRAWAL_TYPES = [
+    'BANK',
+    'GCASH',
+    'INSTAPAY',
+    'MAYA_APP',
+    'MANUAL_UPI',
+];
+const WITHDRAWAL_TYPES_MAP = {
+    BANK: 'Bank',
+    GCASH: 'GCash',
+    INSTAPAY: 'Instapay',
+    MAYA_APP: 'Maya App',
+    MANUAL_UPI: 'Manual',
+};
 const WITHDRAWAL_STATUSES = [
     'ACCEPTED',
     'APPROVED',
@@ -37,36 +65,56 @@ const TRANSACTION_TYPES = [
     'DEPOSIT',
     'WITHDRAWAL',
     'BET',
+    'PAYOUT',
+    'BONUS',
 ];
+const TRANSACTION_TYPES_MAP = {
+    DEPOSIT: 'Deposit',
+    WITHDRAWAL: 'Withdrawal',
+    BET: 'Bet',
+    PAYOUT: 'Win',
+    BONUS: 'Bonus',
+};
 const deviceTimezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+const depositTypeCollection = createListCollection({
+    items: DEPOSIT_TYPES,
+    itemToValue: (item) => item,
+    itemToString: (item) => DEPOSIT_TYPES_MAP[item],
+});
+const depositStatusCollection = createListCollection({
+    items: DEPOSIT_STATUSES,
+    itemToValue: (item) => item,
+    itemToString: (item) => capitalize(item, {
+        delimiter: capitalize.delimiters.UNDERSCORE,
+    }),
+});
+const withdrawalTypeCollection = createListCollection({
+    items: WITHDRAWAL_TYPES,
+    itemToValue: (item) => item,
+    itemToString: (item) => WITHDRAWAL_TYPES_MAP[item],
+});
+const withdrawalStatusCollection = createListCollection({
+    items: WITHDRAWAL_STATUSES,
+    itemToValue: (item) => item,
+    itemToString: (item) => capitalize(item, {
+        delimiter: capitalize.delimiters.UNDERSCORE,
+    }),
+});
+const transactionTypeCollection = createListCollection({
+    items: TRANSACTION_TYPES,
+    itemToValue: (item) => item,
+    itemToString: (item) => TRANSACTION_TYPES_MAP[item],
+});
 export function TableFilters(props) {
-    const depositStatusCollection = createListCollection({
-        items: DEPOSIT_STATUSES,
-        itemToValue: (item) => item,
-        itemToString: (item) => capitalize(item, {
-            delimiter: capitalize.delimiters.UNDERSCORE,
-        }),
-    });
-    const withdrawalStatusCollection = createListCollection({
-        items: WITHDRAWAL_STATUSES,
-        itemToValue: (item) => item,
-        itemToString: (item) => capitalize(item, {
-            delimiter: capitalize.delimiters.UNDERSCORE,
-        }),
-    });
-    const transactionTypeCollection = createListCollection({
-        items: TRANSACTION_TYPES,
-        itemToValue: (item) => item,
-        itemToString: (item) => capitalize(item, {
-            delimiter: capitalize.delimiters.UNDERSCORE,
-        }),
-    });
     const [tab, setTab] = useState('all');
     const handleChange = (next) => {
         const prev = {
             timestamp,
+            depositType,
             depositStatus,
+            withdrawalType,
             withdrawalStatus,
+            transactionType,
         };
         props.onChange?.({
             ...prev,
@@ -80,6 +128,13 @@ export function TableFilters(props) {
             handleChange({ timestamp });
         },
     });
+    const [depositType, setdepositType] = useControllableState({
+        value: props.value?.depositType,
+        defaultValue: props.defaultValue?.depositType ?? null,
+        onChange(depositType) {
+            handleChange({ depositType });
+        },
+    });
     const [depositStatus, setDepositStatus] = useControllableState({
         value: props.value?.depositStatus,
         defaultValue: props.defaultValue?.depositStatus ?? null,
@@ -87,6 +142,13 @@ export function TableFilters(props) {
             handleChange({ depositStatus });
         },
     });
+    const [withdrawalType, setWithdrawalType] = useControllableState({
+        value: props.value?.withdrawalType,
+        defaultValue: props.defaultValue?.withdrawalType ?? null,
+        onChange(withdrawalType) {
+            handleChange({ withdrawalType });
+        },
+    });
     const [withdrawalStatus, setWithdrawalStatus] = useControllableState({
         value: props.value?.withdrawalStatus,
         defaultValue: props.defaultValue?.withdrawalStatus ?? null,
@@ -130,7 +192,16 @@ export function TableFilters(props) {
                                 setTimestamp(null);
                             }
                             setTab(value);
-                        }, className: "w-full lg:w-fit", children: [_jsxs(SegmentGroup.Item, { value: "all", className: "w-full lg:w-auto", children: [_jsx(SegmentGroup.ItemText, { children: "All" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsxs(SegmentGroup.Item, { value: "today", className: "w-full lg:w-auto", children: [_jsx(SegmentGroup.ItemText, { children: "Today" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsx(DatePicker.Context, { children: (api) => (_jsx(SegmentGroup.Item, { value: "custom", onClick: () => api.setOpen(true), className: "w-full lg:w-auto", children: _jsxs(DatePicker.Control, { children: [_jsx(SegmentGroup.ItemText, { children: "Custom" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }) })) }), _jsx(SegmentGroup.Indicator, {})] }), _jsx(Portal, { children: _jsx(DatePicker.Positioner, { children: _jsx(DatePicker.Content, { children: _jsx(DatePicker.View, { view: "day", children: _jsx(DatePicker.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsxs(DatePicker.Table, { children: [_jsx(DatePicker.TableHead, { children: _jsx(DatePicker.TableRow, { children: api.weekDays.map((weekDay, id) => (_jsx(DatePicker.TableHeader, { children: weekDay.short.substring(0, 2) }, id))) }) }), _jsx(DatePicker.TableBody, { children: api.weeks.map((week, id) => (_jsx(DatePicker.TableRow, { children: week.map((day, id) => (_jsx(DatePicker.TableCell, { value: day, children: _jsx(DatePicker.TableCellTrigger, { children: day.day }) }, id))) }, id))) })] })] })) }) }) }) }) })] }), _jsx("div", { className: "hidden grow lg:block" }), props.enabledFilters?.depositStatus && (_jsxs(Select.Root, { collection: depositStatusCollection, value: depositStatus ? [depositStatus] : [], onValueChange: (details) => {
+                        }, className: "w-full lg:w-fit", children: [_jsxs(SegmentGroup.Item, { value: "all", className: "w-full lg:w-auto", children: [_jsx(SegmentGroup.ItemText, { children: "All" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsxs(SegmentGroup.Item, { value: "today", className: "w-full lg:w-auto", children: [_jsx(SegmentGroup.ItemText, { children: "Today" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsx(DatePicker.Context, { children: (api) => (_jsx(SegmentGroup.Item, { value: "custom", onClick: () => api.setOpen(true), className: "w-full lg:w-auto", children: _jsxs(DatePicker.Control, { children: [_jsx(SegmentGroup.ItemText, { children: "Custom" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }) })) }), _jsx(SegmentGroup.Indicator, {})] }), _jsx(Portal, { children: _jsx(DatePicker.Positioner, { children: _jsx(DatePicker.Content, { children: _jsx(DatePicker.View, { view: "day", children: _jsx(DatePicker.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsxs(DatePicker.ViewControl, { children: [_jsx(DatePicker.PrevTrigger, { children: _jsx(ChevronLeftIcon, {}) }), _jsx(DatePicker.ViewTrigger, { children: _jsx(DatePicker.RangeText, {}) }), _jsx(DatePicker.NextTrigger, { children: _jsx(ChevronRightIcon, {}) })] }), _jsxs(DatePicker.Table, { children: [_jsx(DatePicker.TableHead, { children: _jsx(DatePicker.TableRow, { children: api.weekDays.map((weekDay, id) => (_jsx(DatePicker.TableHeader, { children: weekDay.short.substring(0, 2) }, id))) }) }), _jsx(DatePicker.TableBody, { children: api.weeks.map((week, id) => (_jsx(DatePicker.TableRow, { children: week.map((day, id) => (_jsx(DatePicker.TableCell, { value: day, children: _jsx(DatePicker.TableCellTrigger, { children: day.day }) }, id))) }, id))) })] })] })) }) }) }) }) })] }), _jsx("div", { className: "hidden grow lg:block" }), props.enabledFilters?.depositType && (_jsxs(Select.Root, { collection: depositTypeCollection, value: depositType ? [depositType] : [], onValueChange: (details) => {
+                    const value = z
+                        .enum(DEPOSIT_TYPES)
+                        .safeParse(details.value.at(0)).data;
+                    setdepositType(value ?? null);
+                }, lazyMount: true, deselectable: true, positioning: {
+                    sameWidth: true,
+                }, children: [_jsxs(Select.Trigger, { className: "w-full lg:w-[14rem]", children: [_jsx(Select.ValueText, { placeholder: "Type" }), _jsx(Select.Context, { children: (api) => (_jsx(_Fragment, { children: api.value.length ? (_jsx(Select.ClearTrigger, { asChild: true, children: _jsx("span", { onClick: (e) => {
+                                                e.stopPropagation();
+                                            }, children: "Clear" }) })) : (_jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })) })) })] }), _jsx(Portal, { children: _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: depositTypeCollection.items.map((item) => (_jsxs(Select.Item, { item: item, children: [_jsx(Select.ItemText, { children: depositTypeCollection.stringifyItem(item) }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, item))) }) }) }) })] })), props.enabledFilters?.depositStatus && (_jsxs(Select.Root, { collection: depositStatusCollection, value: depositStatus ? [depositStatus] : [], onValueChange: (details) => {
                     const value = z
                         .enum(DEPOSIT_STATUSES)
                         .safeParse(details.value.at(0)).data;
@@ -139,9 +210,16 @@ export function TableFilters(props) {
                     sameWidth: true,
                 }, children: [_jsxs(Select.Trigger, { className: "w-full lg:w-[14rem]", children: [_jsx(Select.ValueText, { placeholder: "Status" }), _jsx(Select.Context, { children: (api) => (_jsx(_Fragment, { children: api.value.length ? (_jsx(Select.ClearTrigger, { asChild: true, children: _jsx("span", { onClick: (e) => {
                                                 e.stopPropagation();
-                                            }, children: "Clear" }) })) : (_jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })) })) })] }), _jsx(Portal, { children: _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: withdrawalStatusCollection.items.map((status) => (_jsxs(Select.Item, { item: status, children: [_jsx(Select.ItemText, { children: capitalize(status, {
-                                                    delimiter: capitalize.delimiters.UNDERSCORE,
-                                                }) }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, status))) }) }) }) })] })), props.enabledFilters?.withdrawalStatus && (_jsxs(Select.Root, { collection: withdrawalStatusCollection, value: withdrawalStatus ? [withdrawalStatus] : [], onValueChange: (details) => {
+                                            }, children: "Clear" }) })) : (_jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })) })) })] }), _jsx(Portal, { children: _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: depositStatusCollection.items.map((item) => (_jsxs(Select.Item, { item: item, children: [_jsx(Select.ItemText, { children: depositStatusCollection.stringifyItem(item) }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, item))) }) }) }) })] })), props.enabledFilters?.withdrawalType && (_jsxs(Select.Root, { collection: withdrawalTypeCollection, value: withdrawalType ? [withdrawalType] : [], onValueChange: (details) => {
+                    const value = z
+                        .enum(WITHDRAWAL_TYPES)
+                        .safeParse(details.value.at(0)).data;
+                    setWithdrawalType(value ?? null);
+                }, lazyMount: true, deselectable: true, positioning: {
+                    sameWidth: true,
+                }, children: [_jsxs(Select.Trigger, { className: "w-full lg:w-[14rem]", children: [_jsx(Select.ValueText, { placeholder: "Type" }), _jsx(Select.Context, { children: (api) => (_jsx(_Fragment, { children: api.value.length ? (_jsx(Select.ClearTrigger, { asChild: true, children: _jsx("span", { onClick: (e) => {
+                                                e.stopPropagation();
+                                            }, children: "Clear" }) })) : (_jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })) })) })] }), _jsx(Portal, { children: _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: withdrawalTypeCollection.items.map((item) => (_jsxs(Select.Item, { item: item, children: [_jsx(Select.ItemText, { children: withdrawalTypeCollection.stringifyItem(item) }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, item))) }) }) }) })] })), props.enabledFilters?.withdrawalStatus && (_jsxs(Select.Root, { collection: withdrawalStatusCollection, value: withdrawalStatus ? [withdrawalStatus] : [], onValueChange: (details) => {
                     const value = z
                         .enum(WITHDRAWAL_STATUSES)
                         .safeParse(details.value.at(0)).data;
@@ -150,9 +228,7 @@ export function TableFilters(props) {
                     sameWidth: true,
                 }, children: [_jsxs(Select.Trigger, { className: "w-full lg:w-[14rem]", children: [_jsx(Select.ValueText, { placeholder: "Status" }), _jsx(Select.Context, { children: (api) => (_jsx(_Fragment, { children: api.value.length ? (_jsx(Select.ClearTrigger, { asChild: true, children: _jsx("span", { onClick: (e) => {
                                                 e.stopPropagation();
-                                            }, children: "Clear" }) })) : (_jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })) })) })] }), _jsx(Portal, { children: _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: depositStatusCollection.items.map((status) => (_jsxs(Select.Item, { item: status, children: [_jsx(Select.ItemText, { children: capitalize(status, {
-                                                    delimiter: capitalize.delimiters.UNDERSCORE,
-                                                }) }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, status))) }) }) }) })] })), props.enabledFilters?.transactionType && (_jsxs(Select.Root, { collection: transactionTypeCollection, value: transactionType ? [transactionType] : [], onValueChange: (details) => {
+                                            }, children: "Clear" }) })) : (_jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })) })) })] }), _jsx(Portal, { children: _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: withdrawalStatusCollection.items.map((item) => (_jsxs(Select.Item, { item: item, children: [_jsx(Select.ItemText, { children: withdrawalStatusCollection.stringifyItem(item) }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, item))) }) }) }) })] })), props.enabledFilters?.transactionType && (_jsxs(Select.Root, { collection: transactionTypeCollection, value: transactionType ? [transactionType] : [], onValueChange: (details) => {
                     const value = z
                         .enum(TRANSACTION_TYPES)
                         .safeParse(details.value.at(0)).data;
@@ -161,7 +237,5 @@ export function TableFilters(props) {
                     sameWidth: true,
                 }, children: [_jsxs(Select.Trigger, { className: "w-full lg:w-[14rem]", children: [_jsx(Select.ValueText, { placeholder: "Type" }), _jsx(Select.Context, { children: (api) => (_jsx(_Fragment, { children: api.value.length ? (_jsx(Select.ClearTrigger, { asChild: true, children: _jsx("span", { onClick: (e) => {
                                                 e.stopPropagation();
-                                            }, children: "Clear" }) })) : (_jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })) })) })] }), _jsx(Portal, { children: _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: transactionTypeCollection.items.map((type) => (_jsxs(Select.Item, { item: type, children: [_jsx(Select.ItemText, { children: capitalize(type, {
-                                                    delimiter: capitalize.delimiters.UNDERSCORE,
-                                                }) }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, type))) }) }) }) })] }))] }));
+                                            }, children: "Clear" }) })) : (_jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })) })) })] }), _jsx(Portal, { children: _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: transactionTypeCollection.items.map((item) => (_jsxs(Select.Item, { item: item, children: [_jsx(Select.ItemText, { children: transactionTypeCollection.stringifyItem(item) }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, item))) }) }) }) })] }))] }));
 }

package/dist/components/TransactionRecords/TransactionRecordsTable.js

@@ -2,7 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { tz, TZDateMini } from '@date-fns/tz';
 import { endOfDay, format, startOfDay } from 'date-fns';
-import { useState } from 'react';
+import { useReducer } from 'react';
 import { twMerge } from 'tailwind-merge';
 import { useInfiniteQueryHelper } from '../../client/hooks/useInfiniteQueryHelper.js';
 import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
@@ -18,26 +18,38 @@ import { formatNumber } from '../../utils/formatNumber.js';
 import { Empty } from '../shared/Empty.js';
 import { TableFilters } from './TableFilters.js';
 export function TransactionRecordsTable() {
-    const [timestamp, setTimestamp] = useState();
+    const [state, setState] = useReducer((prev, next) => ({
+        ...prev,
+        ...next,
+    }), {});
     const localeInfo = useLocaleInfo();
     const { page, hasNextPage, hasPrevPage, next, prev, rows, totalPages, loading, firstPage, } = useInfiniteQueryHelper(useTransactionRecordsQuery, {
         filter: {
-            ...(timestamp && {
+            ...(state.type && {
+                type: {
+                    equal: state.type,
+                },
+            }),
+            ...(state.timestamp && {
                 dateTimeCreated: {
-                    ...(timestamp.start && {
-                        greaterThanOrEqual: new TZDateMini(startOfDay(timestamp.start), localeInfo.timezone).toISOString(),
+                    ...(state.timestamp.start && {
+                        greaterThanOrEqual: new TZDateMini(startOfDay(state.timestamp.start), localeInfo.timezone).toISOString(),
                     }),
-                    ...(timestamp.end && {
-                        lesserThanOrEqual: new TZDateMini(endOfDay(timestamp.end), localeInfo.timezone).toISOString(),
+                    ...(state.timestamp.end && {
+                        lesserThanOrEqual: new TZDateMini(endOfDay(state.timestamp.end), localeInfo.timezone).toISOString(),
                     }),
                 },
             }),
         },
     });
     return (_jsxs(_Fragment, { children: [_jsx(TableFilters, { value: {
-                    timestamp,
+                    timestamp: state.timestamp,
+                    transactionType: state.type,
                 }, onChange: (value) => {
-                    setTimestamp(value.timestamp);
+                    setState({
+                        type: value.transactionType,
+                        timestamp: value.timestamp,
+                    });
                     firstPage();
                 }, enabledFilters: {
                     transactionType: true,

package/dist/components/TransactionRecords/WithdrawalRecordsTable.js

@@ -2,7 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { tz, TZDateMini } from '@date-fns/tz';
 import { endOfDay, format, startOfDay } from 'date-fns';
-import { useState } from 'react';
+import { useReducer } from 'react';
 import { twMerge } from 'tailwind-merge';
 import { useInfiniteQueryHelper } from '../../client/hooks/useInfiniteQueryHelper.js';
 import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
@@ -19,37 +19,49 @@ import { formatNumber } from '../../utils/formatNumber.js';
 import { Empty } from '../shared/Empty.js';
 import { TableFilters } from './TableFilters.js';
 export function WithdrawalRecordsTable() {
-    const [timestamp, setTimestamp] = useState();
-    const [withdrawalStatus, setWithdrawalStatus] = useState();
+    const [state, setState] = useReducer((prev, next) => ({
+        ...prev,
+        ...next,
+    }), {});
     const localeInfo = useLocaleInfo();
     const { page, hasNextPage, hasPrevPage, next, prev, rows, totalPages, loading, firstPage, } = useInfiniteQueryHelper(useWithdrawalRecordsQuery, {
         filter: {
-            ...(withdrawalStatus && {
+            ...(state.type && {
+                type: {
+                    equal: state.type,
+                },
+            }),
+            ...(state.status && {
                 status: {
-                    equal: withdrawalStatus,
+                    equal: state.status,
                 },
             }),
-            ...(timestamp && {
+            ...(state.timestamp && {
                 dateTimeCreated: {
-                    ...(timestamp.start && {
-                        greaterThanOrEqual: new TZDateMini(startOfDay(timestamp.start), localeInfo.timezone).toISOString(),
+                    ...(state.timestamp.start && {
+                        greaterThanOrEqual: new TZDateMini(startOfDay(state.timestamp.start), localeInfo.timezone).toISOString(),
                     }),
-                    ...(timestamp.end && {
-                        lesserThanOrEqual: new TZDateMini(endOfDay(timestamp.end), localeInfo.timezone).toISOString(),
+                    ...(state.timestamp.end && {
+                        lesserThanOrEqual: new TZDateMini(endOfDay(state.timestamp.end), localeInfo.timezone).toISOString(),
                     }),
                 },
             }),
         },
     });
-    return (_jsxs(_Fragment, { children: [_jsx(TableFilters, { enabledFilters: {
-                    withdrawalStatus: true,
-                }, value: {
-                    timestamp,
-                    withdrawalStatus,
+    return (_jsxs(_Fragment, { children: [_jsx(TableFilters, { value: {
+                    timestamp: state.timestamp,
+                    withdrawalType: state.type,
+                    withdrawalStatus: state.status,
                 }, onChange: (value) => {
+                    setState({
+                        type: value.withdrawalType,
+                        status: value.withdrawalStatus,
+                        timestamp: value.timestamp,
+                    });
                     firstPage();
-                    setTimestamp(value.timestamp);
-                    setWithdrawalStatus(value.withdrawalStatus);
+                }, enabledFilters: {
+                    withdrawalType: true,
+                    withdrawalStatus: true,
                 } }), rows.length <= 0 && (_jsx(Empty, { icon: loading ? SpinnerIcon : File02Icon, title: loading ? 'Just a moment' : 'No data', message: loading
                     ? 'Fetching latest withdrawal records...'
                     : 'No data is currently available.', className: "mt-5xl" })), rows.length >= 1 && (_jsxs("div", { className: twMerge('mt-xl', 'border-y', 'border-border-secondary', 'bleed', 'lg:not-bleed', 'lg:mt-3xl', 'lg:w-full', 'lg:rounded-xl', 'lg:border-x'), children: [_jsx("div", { className: "border-border-secondary scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent scrollbar:h-2 scrollbar-thumb:rounded-full overflow-hidden overflow-x-auto rounded-none border-b lg:rounded-t-xl", children: _jsxs(Table.Root, { className: "border-0", children: [_jsx(Table.Header, { children: _jsxs(Table.Row, { children: [_jsx(Table.Heading, { children: "Withdrawal No." }), _jsx(Table.Heading, { children: "Reference" }), _jsx(Table.Heading, { children: "Withdrawal Method" }), _jsx(Table.Heading, { children: "Mobile Number" }), _jsx(Table.Heading, { children: "Withdrawal Amount" }), _jsx(Table.Heading, { children: "Net Amount" }), _jsx(Table.Heading, { children: "Transaction Fee" }), _jsx(Table.Heading, { children: "Bank Name" }), _jsx(Table.Heading, { children: "Withdrawal Time" }), _jsx(Table.Heading, { children: "Status" })] }) }), _jsx(Table.Body, { children: rows.map((data) => (_jsxs(Table.Row, { children: [_jsx(Table.Cell, { className: "!py-1", children: data.withdrawalNumber }), _jsx(Table.Cell, { className: "!py-1", children: data.reference }), _jsx(Table.Cell, { className: "!py-1", children: capitalize(data.type, {

package/dist/constants/EnvVar.d.ts

@@ -1,5 +1,5 @@
 export declare const SITE_ID: string;
 export declare const PLATFORM_ID: string;
 export declare const PLATFORM_CODE: string;
-export declare const ENVIRONMENT: "development" | "production";
+export declare const ENVIRONMENT: "production" | "development";
 export declare const BYPASS_RECAPTCHA: boolean;

package/dist/services/queries.d.ts

@@ -1,7 +1,7 @@
 export declare const FILE_FRAGMENT = "\n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n";
 export declare const FILE = "\n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  query File($id: ObjectId!) {\n    node(id: $id) {\n      ... on File {\n        ...FileFragment\n      }\n    }\n  }\n";
 export declare const UPLOAD_PRIVATE_IMAGE_FILE = "\n  mutation UploadPrivateImageFile($input: UploadFileInput!) {\n    uploadPrivateImageFile(input: $input) {\n      ... on FileFormatNotSupportedError {\n        name: __typename\n        message\n      }\n      ... on FileNameTooLongError {\n        name: __typename\n        message\n      }\n      ... on FileSizeTooBigError {\n        name: __typename\n        message\n      }\n    }\n  }\n";
-export declare const WALLET = "\n  query Wallet {\n    wallet {\n      balance\n    }\n    bonus {\n      balance\n    }\n  }\n";
+export declare const WALLET = "\n  query Wallet {\n    wallet {\n      balance\n    }\n  }\n";
 export declare const POINTS_WALLET = "\n  query PointsWallet {\n    pointsWallet {\n      id\n      points\n      account\n      dateTimeCreated\n    }\n  }\n";
 export declare const REDEEM_POINTS_TO_CASH = "\n  mutation RedeemPointsToCash($input: RedeemPointsToCashInput!) {\n    redeemPointsToCash(input: $input) {\n      ... on InsufficientPointsError {\n        name: __typename\n        message\n      }\n      ... on PointsNotDivisibleBy100Error {\n        name: __typename\n        message\n      }\n    }\n  }\n";
 export declare const POINTS_WALLET_TRANSACTIONS = "\n  query PointsWalletTransactions(\n    $first: Int\n    $after: Cursor\n    $filter: MemberPointsWalletTransactionFilterInput\n  ) {\n    member {\n      pointsWalletTransactions(first: $first, after: $after, filter: $filter) {\n        edges {\n          cursor\n          node {\n            ... on PointsWalletTransaction {\n              id\n              type\n              amount\n              balance\n              dateTimeCreated\n            }\n          }\n        }\n        totalCount\n        pageInfo {\n          hasNextPage\n          endCursor\n        }\n      }\n    }\n  }\n";
@@ -49,12 +49,12 @@ export declare const CASHBACKS = "\n  \n  \n  fragment FileFragment on File {\n
 export declare const CASHBACK = "\n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment CashbackFragment on Cashback {\n    id\n    name\n    banner {\n      ...FileFragment\n    }\n    minimumCashback\n    maximumMonthlyCashback\n    status\n    description\n    activationStartDateTime\n    activationEndDateTime\n    turnoverContributionPercentagePerGameProvider\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query Cashback($id: ObjectId!) {\n    node(id: $id) {\n      ... on Cashback {\n        ...CashbackFragment\n      }\n    }\n  }\n";
 export declare const BONUS_FRAGMENT = "\n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment PromoFragment on Promo {\n    id\n    type\n    name\n    banner {\n      ...FileFragment\n    }\n    status\n    description\n    maximumBonusAmount\n    minimumBonusAmount\n    maximumDepositAmount\n    minimumDepositAmount\n    activationStartDateTime\n    turnoverRequirementContributionPercentagePerGameProvider\n    activationEndDateTime\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment BonusFragment on Bonus {\n    id\n    promo {\n      ...PromoFragment\n    }\n    deposit {\n      type\n      amount\n      netAmount\n      fee\n      status\n      reference\n      dateTimeCreated\n      dateTimeLastUpdated\n    }\n    amount\n    balance\n    turnoverRequirement\n    currentTurnoverRequirementContribution\n    currentTurnoverRequirementContributionPercentage\n    turnoverRequirementContributionPercentagePerGameProvider\n    enabledGameProviders\n    expiration\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n";
 export declare const BONUSES = "\n  \n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment PromoFragment on Promo {\n    id\n    type\n    name\n    banner {\n      ...FileFragment\n    }\n    status\n    description\n    maximumBonusAmount\n    minimumBonusAmount\n    maximumDepositAmount\n    minimumDepositAmount\n    activationStartDateTime\n    turnoverRequirementContributionPercentagePerGameProvider\n    activationEndDateTime\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment BonusFragment on Bonus {\n    id\n    promo {\n      ...PromoFragment\n    }\n    deposit {\n      type\n      amount\n      netAmount\n      fee\n      status\n      reference\n      dateTimeCreated\n      dateTimeLastUpdated\n    }\n    amount\n    balance\n    turnoverRequirement\n    currentTurnoverRequirementContribution\n    currentTurnoverRequirementContributionPercentage\n    turnoverRequirementContributionPercentagePerGameProvider\n    enabledGameProviders\n    expiration\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query Bonuses {\n    bonuses {\n      ...BonusFragment\n    }\n  }\n";
-export declare const BONUSES_IDS = "\n  query BonusesIds {\n    bonuses {\n      id\n    }\n  }\n";
+export declare const BONUS_IDS = "\n  query BonusIds {\n    bonuses {\n      id\n    }\n  }\n";
+export declare const BONUS_BALANCES = "\n  query BonusesBalance {\n    bonuses {\n      balance\n    }\n  }\n";
 export declare const BONUS = "\n  \n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment PromoFragment on Promo {\n    id\n    type\n    name\n    banner {\n      ...FileFragment\n    }\n    status\n    description\n    maximumBonusAmount\n    minimumBonusAmount\n    maximumDepositAmount\n    minimumDepositAmount\n    activationStartDateTime\n    turnoverRequirementContributionPercentagePerGameProvider\n    activationEndDateTime\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment BonusFragment on Bonus {\n    id\n    promo {\n      ...PromoFragment\n    }\n    deposit {\n      type\n      amount\n      netAmount\n      fee\n      status\n      reference\n      dateTimeCreated\n      dateTimeLastUpdated\n    }\n    amount\n    balance\n    turnoverRequirement\n    currentTurnoverRequirementContribution\n    currentTurnoverRequirementContributionPercentage\n    turnoverRequirementContributionPercentagePerGameProvider\n    enabledGameProviders\n    expiration\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query Bonus($id: ObjectId!) {\n    node(id: $id) {\n      ... on Bonus {\n        ...BonusFragment\n      }\n    }\n  }\n";
-export declare const CURRENT_BONUS = "\n  \n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment PromoFragment on Promo {\n    id\n    type\n    name\n    banner {\n      ...FileFragment\n    }\n    status\n    description\n    maximumBonusAmount\n    minimumBonusAmount\n    maximumDepositAmount\n    minimumDepositAmount\n    activationStartDateTime\n    turnoverRequirementContributionPercentagePerGameProvider\n    activationEndDateTime\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment BonusFragment on Bonus {\n    id\n    promo {\n      ...PromoFragment\n    }\n    deposit {\n      type\n      amount\n      netAmount\n      fee\n      status\n      reference\n      dateTimeCreated\n      dateTimeLastUpdated\n    }\n    amount\n    balance\n    turnoverRequirement\n    currentTurnoverRequirementContribution\n    currentTurnoverRequirementContributionPercentage\n    turnoverRequirementContributionPercentagePerGameProvider\n    enabledGameProviders\n    expiration\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query CurrentBonus {\n    currentBonus: bonus {\n      ...BonusFragment\n    }\n  }\n";
 export declare const CASHBACK_BONUS_FRAGMENT = "\n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment CashbackFragment on Cashback {\n    id\n    name\n    banner {\n      ...FileFragment\n    }\n    minimumCashback\n    maximumMonthlyCashback\n    status\n    description\n    activationStartDateTime\n    activationEndDateTime\n    turnoverContributionPercentagePerGameProvider\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment CashbackBonusFragment on CashbackBonus {\n    id\n    balance\n    total\n    cashback {\n      ...CashbackFragment\n    }\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n";
 export declare const CASHBACK_BONUSES = "\n  \n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment CashbackFragment on Cashback {\n    id\n    name\n    banner {\n      ...FileFragment\n    }\n    minimumCashback\n    maximumMonthlyCashback\n    status\n    description\n    activationStartDateTime\n    activationEndDateTime\n    turnoverContributionPercentagePerGameProvider\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment CashbackBonusFragment on CashbackBonus {\n    id\n    balance\n    total\n    cashback {\n      ...CashbackFragment\n    }\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query CashbackBonuses {\n    cashbackBonuses {\n      ...CashbackBonusFragment\n    }\n  }\n";
-export declare const CASHBACK_BONUSES_IDS = "\n  query CashbackBonusesIds {\n    cashbackBonuses {\n      id\n    }\n  }\n";
+export declare const CASHBACK_BONUS_IDS = "\n  query CashbackBonusIds {\n    cashbackBonuses {\n      id\n    }\n  }\n";
 export declare const CASHBACK_BONUS = "\n  \n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment CashbackFragment on Cashback {\n    id\n    name\n    banner {\n      ...FileFragment\n    }\n    minimumCashback\n    maximumMonthlyCashback\n    status\n    description\n    activationStartDateTime\n    activationEndDateTime\n    turnoverContributionPercentagePerGameProvider\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment CashbackBonusFragment on CashbackBonus {\n    id\n    balance\n    total\n    cashback {\n      ...CashbackFragment\n    }\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query CashbackBonus($id: ObjectId!) {\n    node(id: $id) {\n      ... on CashbackBonus {\n        ...CashbackBonusFragment\n      }\n    }\n  }\n";
 export declare const CLAIM_CASHBACK_BONUS = "\n  mutation ClaimCashbackBonus($input: ClaimCashbackBonusInput!) {\n    claimCashbackBonus(input: $input) {\n      ... on CashbackBonusDoesNotExistError {\n        name: __typename\n        message\n      }\n    }\n  }\n";
 export declare const MEMBER = "\n  query Member {\n    member {\n      dateTimeLastActive\n    }\n  }\n";
@@ -105,7 +105,7 @@ export declare const DAILY_CHECKIN_FRAGMENT = "\n  \n  fragment QuestProgramFrag
 export declare const WAGERING_FRAGMENT = "\n  fragment WageringQuestFragment on WageringQuest {\n    bonus\n    id\n    name\n    type\n    description\n    program {\n      ...QuestProgramFragment\n    }\n\n    status\n    progressPercentage\n    turnover\n    targetTurnover\n    endDateTime\n    dateTimeCreated\n  }\n";
 export declare const ONBOARDING_QUEST_FRAGMENT = "\n  fragment OnboardingQuestFragment on OnboardingQuest {\n    id\n    name\n    description\n    program {\n      ...QuestProgramFragment\n    }\n\n    status\n    type\n    progressPercentage\n    bonus\n    endDateTime\n    dateTimeCreated\n    firstDepositCompleted\n    accountVerificationCompleted\n  }\n";
 export declare const AVAILABLE_QUESTS = "\n  \n  fragment WageringQuestFragment on WageringQuest {\n    bonus\n    id\n    name\n    type\n    description\n    program {\n      ...QuestProgramFragment\n    }\n\n    status\n    progressPercentage\n    turnover\n    targetTurnover\n    endDateTime\n    dateTimeCreated\n  }\n\n  \n  \n  fragment QuestProgramFragment on QuestProgram {\n    status\n    type\n    name\n    description\n  }\n\n  fragment DailyCheckinQuestFragment on DailyCheckInQuest {\n    id\n    name\n    description\n    type\n    program {\n      ...QuestProgramFragment\n    }\n\n    status\n    progressPercentage\n    turnover\n    endDateTime\n    dateTimeCreated\n    lastCheckInDate\n    startDateTime\n    checkInStreak\n\n    thirdDayBonusAmount\n    seventhDayBonusAmount\n    sixthDayBonusAmount\n  }\n\n  \n  fragment OnboardingQuestFragment on OnboardingQuest {\n    id\n    name\n    description\n    program {\n      ...QuestProgramFragment\n    }\n\n    status\n    type\n    progressPercentage\n    bonus\n    endDateTime\n    dateTimeCreated\n    firstDepositCompleted\n    accountVerificationCompleted\n  }\n\n\n  query AvailableQuests {\n    availableQuests {\n      ... on Quest {\n        ... on WageringQuest {\n          ...WageringQuestFragment\n        }\n        ... on DailyCheckInQuest {\n          ...DailyCheckinQuestFragment\n        }\n        ... on OnboardingQuest {\n          ...OnboardingQuestFragment\n        }\n      }\n    }\n  }\n";
-export declare const AVAILABLE_QUESTS_IDS = "\n  query AvailableQuestsIds {\n    availableQuests {\n      ... on Node {\n        id\n      }\n    }\n  }\n";
+export declare const AVAILABLE_QUEST_IDS = "\n  query AvailableQuestIds {\n    availableQuests {\n      ... on Node {\n        id\n      }\n    }\n  }\n";
 export declare const CHECK_IN_DAILY_QUEST = "\n  mutation checkInDailyCheckInQuest($input: CheckInDailyCheckInQuestInput!) {\n    checkInDailyCheckInQuest(input: $input)\n  }\n";
 export declare const TOP_WINS = "\n  query TopWins($first: Int) {\n    topWins(first: $first) {\n      id\n      game {\n        id\n        name\n        type\n        provider\n      }\n      member {\n        id\n        name\n      }\n      multiplier\n      payout\n    }\n  }\n";
 export declare const JACKPOTS = "\n  query Jackpots(\n    $first: Int\n    $after: Cursor\n    $sort: JackpotSortInput\n    $filter: JackpotFilterInput\n  ) {\n    jackpots(first: $first, after: $after, sort: $sort, filter: $filter) {\n      totalCount\n      pageInfo {\n        hasNextPage\n        endCursor\n      }\n      edges {\n        node {\n          ... on Jackpot {\n            id\n            name\n            description\n            pool\n            status\n            minimumJackpotPoolDrawingLimit\n            maximumJackpotPoolLimit\n            drawing\n            minimumMultiplier\n            minimumBet\n            jackpotPayoutPercentage\n            jackpotTurnoverContributionPercentagePerGameProvider\n            totalPayout\n          }\n        }\n      }\n    }\n  }\n";