@opexa/portal-components 0.0.142 → 0.0.143

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.
Files changed (215) hide show
  1. package/dist/components/Bonus/Bonus.client.js +1 -1
  2. package/dist/components/Bonuses/Bonuses.client.js +7 -4
  3. package/dist/components/Cashback/Cashback.client.js +1 -1
  4. package/dist/components/CustomPromo/CustomPromo.js +1 -1
  5. package/dist/components/GCashFailed/GCashFailed.d.ts +8 -0
  6. package/dist/components/GCashFailed/GCashFailed.js +17 -0
  7. package/dist/components/GCashFailed/index.d.ts +1 -0
  8. package/dist/components/GCashFailed/index.js +1 -0
  9. package/dist/components/GCashSuccess/GCashSuccess.d.ts +9 -0
  10. package/dist/components/GCashSuccess/GCashSuccess.js +88 -0
  11. package/dist/components/GCashSuccess/index.d.ts +1 -0
  12. package/dist/components/GCashSuccess/index.js +1 -0
  13. package/dist/components/GameLaunch/GameLaunch.lazy.js +1 -1
  14. package/dist/components/GamesSearch/GamesSearch.js +1 -1
  15. package/dist/components/Jackpots/JackpotsCarousel/JackpotsCarouselItem.module.css +184 -184
  16. package/dist/components/Jackpots/JackpotsList/JackpotsListItem.module.css +184 -184
  17. package/dist/components/Messages/Message.js +5 -6
  18. package/dist/components/News/News.js +1 -1
  19. package/dist/components/Promo/Promo.client.js +1 -1
  20. package/dist/components/Search/Search.lazy.js +1 -1
  21. package/dist/components/Tournaments/TournamentsCarousel/TournamentsCarouselItem.module.css +184 -184
  22. package/dist/components/Tournaments/TournamentsList/TournamentItem.module.css +184 -184
  23. package/dist/constants/EnvVar.d.ts +1 -1
  24. package/dist/icons/XCircleIcon.d.ts +1 -0
  25. package/dist/icons/XCircleIcon.js +4 -0
  26. package/dist/services/queries.js +2358 -2358
  27. package/dist/styles/theme.css +693 -693
  28. package/dist/ui/AlertDialog/AlertDialog.d.ts +121 -121
  29. package/dist/ui/AlertDialog/alertDialog.recipe.d.ts +11 -11
  30. package/dist/ui/Avatar/Avatar.d.ts +9 -9
  31. package/dist/ui/Avatar/avatar.recipe.d.ts +3 -3
  32. package/dist/ui/Button/button.recipe.d.ts +2 -2
  33. package/dist/ui/Button/button.recipe.js +1 -1
  34. package/dist/ui/Checkbox/Checkbox.d.ts +23 -23
  35. package/dist/ui/Checkbox/checkbox.recipe.d.ts +3 -3
  36. package/dist/ui/Collapsible/Collapsible.d.ts +20 -20
  37. package/dist/ui/Collapsible/collapsible.recipe.d.ts +5 -5
  38. package/dist/ui/Combobox/Combobox.d.ts +42 -42
  39. package/dist/ui/Combobox/combobox.recipe.d.ts +3 -3
  40. package/dist/ui/DatePicker/DatePicker.d.ts +72 -72
  41. package/dist/ui/DatePicker/datePicker.recipe.d.ts +3 -3
  42. package/dist/ui/Dialog/Dialog.d.ts +121 -121
  43. package/dist/ui/Dialog/dialog.recipe.d.ts +11 -11
  44. package/dist/ui/Drawer/Drawer.d.ts +33 -33
  45. package/dist/ui/Drawer/drawer.recipe.d.ts +3 -3
  46. package/dist/ui/IconButton/iconButton.recipe.d.ts +2 -2
  47. package/dist/ui/Menu/Menu.d.ts +360 -360
  48. package/dist/ui/Menu/menu.recipe.d.ts +20 -20
  49. package/dist/ui/Popover/Popover.d.ts +88 -88
  50. package/dist/ui/Popover/popover.recipe.d.ts +8 -8
  51. package/dist/ui/Progress/Progress.d.ts +27 -27
  52. package/dist/ui/Progress/progress.recipe.d.ts +3 -3
  53. package/dist/ui/QrCode/QrCode.d.ts +25 -25
  54. package/dist/ui/QrCode/qrCode.recipe.d.ts +5 -5
  55. package/dist/ui/SegmentGroup/SegmentGroup.d.ts +18 -18
  56. package/dist/ui/SegmentGroup/segmentGroup.recipe.d.ts +3 -3
  57. package/dist/ui/Select/Select.d.ts +45 -45
  58. package/dist/ui/Select/select.recipe.d.ts +3 -3
  59. package/dist/ui/Table/Table.d.ts +21 -21
  60. package/dist/ui/Table/table.anatomy.d.ts +1 -1
  61. package/dist/ui/Table/table.recipe.d.ts +3 -3
  62. package/dist/ui/Tabs/Tabs.d.ts +15 -15
  63. package/dist/ui/Tabs/tabs.recipe.d.ts +3 -3
  64. package/dist/ui/Tooltip/Tooltip.d.ts +48 -48
  65. package/dist/ui/Tooltip/tooltip.recipe.d.ts +8 -8
  66. package/dist/ui/Tooltip/tooltip.recipe.js +1 -1
  67. package/package.json +164 -164
  68. package/dist/client/hooks/index.d.ts +0 -65
  69. package/dist/client/hooks/index.js +0 -65
  70. package/dist/client/services/index.d.ts +0 -4
  71. package/dist/client/services/index.js +0 -4
  72. package/dist/client/utils/index.d.ts +0 -3
  73. package/dist/client/utils/index.js +0 -3
  74. package/dist/components/CashbackBonus/CashbackBonus.client.d.ts +0 -2
  75. package/dist/components/CashbackBonus/CashbackBonus.client.js +0 -9
  76. package/dist/components/CashbackBonus/CashbackBonus.d.ts +0 -10
  77. package/dist/components/CashbackBonus/CashbackBonus.js +0 -5
  78. package/dist/components/CashbackBonus/index.d.ts +0 -1
  79. package/dist/components/CashbackBonus/index.js +0 -1
  80. package/dist/components/Empty.d.ts +0 -9
  81. package/dist/components/Empty.js +0 -7
  82. package/dist/components/Games/GameContext.d.ts +0 -2
  83. package/dist/components/Games/GameContext.js +0 -2
  84. package/dist/components/InfiniteScroll.d.ts +0 -10
  85. package/dist/components/InfiniteScroll.js +0 -25
  86. package/dist/components/JackpotCounter/JackpotCounter.client.d.ts +0 -2
  87. package/dist/components/JackpotCounter/JackpotCounter.client.js +0 -66
  88. package/dist/components/JackpotCounter/JackpotCounter.d.ts +0 -17
  89. package/dist/components/JackpotCounter/JackpotCounter.js +0 -21
  90. package/dist/components/JackpotCounter/JackpotCounterItem.d.ts +0 -18
  91. package/dist/components/JackpotCounter/JackpotCounterItem.js +0 -109
  92. package/dist/components/JackpotCounter/JackpotCounterItem.module.css +0 -184
  93. package/dist/components/JackpotCounter/index.d.ts +0 -1
  94. package/dist/components/JackpotCounter/index.js +0 -1
  95. package/dist/components/Jackpots/JackpotDesktop.d.ts +0 -1
  96. package/dist/components/Jackpots/JackpotDesktop.js +0 -45
  97. package/dist/components/Jackpots/JackpotGameProviders.d.ts +0 -5
  98. package/dist/components/Jackpots/JackpotGameProviders.js +0 -41
  99. package/dist/components/Jackpots/JackpotItemDesktop.d.ts +0 -9
  100. package/dist/components/Jackpots/JackpotItemDesktop.js +0 -43
  101. package/dist/components/Jackpots/JackpotItemMobile.d.ts +0 -9
  102. package/dist/components/Jackpots/JackpotItemMobile.js +0 -44
  103. package/dist/components/Jackpots/JackpotMobile.d.ts +0 -1
  104. package/dist/components/Jackpots/JackpotMobile.js +0 -46
  105. package/dist/components/Jackpots/JackpotRules.d.ts +0 -5
  106. package/dist/components/Jackpots/JackpotRules.js +0 -11
  107. package/dist/components/Jackpots/Jackpots.client.d.ts +0 -2
  108. package/dist/components/Jackpots/Jackpots.client.js +0 -29
  109. package/dist/components/Jackpots/JackpotsContext.d.ts +0 -4
  110. package/dist/components/Jackpots/JackpotsContext.js +0 -3
  111. package/dist/components/Jackpots/useJackpotData.d.ts +0 -14
  112. package/dist/components/Jackpots/useJackpotData.js +0 -93
  113. package/dist/components/Jackpots/useJackpotItemData.d.ts +0 -20
  114. package/dist/components/Jackpots/useJackpotItemData.js +0 -87
  115. package/dist/components/KYC/Header.d.ts +0 -1
  116. package/dist/components/KYC/Header.js +0 -8
  117. package/dist/components/KYC/Step1.d.ts +0 -1
  118. package/dist/components/KYC/Step1.js +0 -13
  119. package/dist/components/KYC/Step2.d.ts +0 -1
  120. package/dist/components/KYC/Step2.js +0 -13
  121. package/dist/components/KYC/Step3.d.ts +0 -1
  122. package/dist/components/KYC/Step3.js +0 -13
  123. package/dist/components/KYC/Step4.d.ts +0 -1
  124. package/dist/components/KYC/Step4.js +0 -7
  125. package/dist/components/Messages/MessageItem.d.ts +0 -4
  126. package/dist/components/Messages/MessageItem.js +0 -34
  127. package/dist/components/PortalProvider/WebVitals.d.ts +0 -1
  128. package/dist/components/PortalProvider/WebVitals.js +0 -8
  129. package/dist/components/Promo/PromoContent.d.ts +0 -2
  130. package/dist/components/Promo/PromoContent.js +0 -9
  131. package/dist/components/Promos/PromoCarousel.d.ts +0 -2
  132. package/dist/components/Promos/PromoCarousel.js +0 -41
  133. package/dist/components/Promos/PromoGrid.d.ts +0 -2
  134. package/dist/components/Promos/PromoGrid.js +0 -12
  135. package/dist/components/Promos/PromoItem.d.ts +0 -7
  136. package/dist/components/Promos/PromoItem.js +0 -10
  137. package/dist/components/Quests/CountdownTimer.d.ts +0 -15
  138. package/dist/components/Quests/CountdownTimer.js +0 -33
  139. package/dist/components/Quests/DailyCheckInQuest/DailyCheckInQuest.d.ts +0 -4
  140. package/dist/components/Quests/DailyCheckInQuest/DailyCheckInQuest.js +0 -78
  141. package/dist/components/Quests/DailyCheckInQuest/DailyCheckInQuestModal.d.ts +0 -8
  142. package/dist/components/Quests/DailyCheckInQuest/DailyCheckInQuestModal.js +0 -9
  143. package/dist/components/Quests/OnboardingQuest/OnboardingQuest.d.ts +0 -4
  144. package/dist/components/Quests/OnboardingQuest/OnboardingQuest.js +0 -4
  145. package/dist/components/Quests/WageringQuest/WageringQuest.d.ts +0 -4
  146. package/dist/components/Quests/WageringQuest/WageringQuest.js +0 -20
  147. package/dist/components/Quests/WageringQuest/WageringQuestModal.d.ts +0 -9
  148. package/dist/components/Quests/WageringQuest/WageringQuestModal.js +0 -9
  149. package/dist/components/TournamentCounter/TournamentCounter.client.d.ts +0 -2
  150. package/dist/components/TournamentCounter/TournamentCounter.client.js +0 -50
  151. package/dist/components/TournamentCounter/TournamentCounter.d.ts +0 -8
  152. package/dist/components/TournamentCounter/TournamentCounter.js +0 -21
  153. package/dist/components/TournamentCounter/TournamentCounterItem.d.ts +0 -8
  154. package/dist/components/TournamentCounter/TournamentCounterItem.js +0 -106
  155. package/dist/components/TournamentCounter/index.d.ts +0 -1
  156. package/dist/components/TournamentCounter/index.js +0 -1
  157. package/dist/components/Tournaments/TournamentDesktop.d.ts +0 -1
  158. package/dist/components/Tournaments/TournamentDesktop.js +0 -57
  159. package/dist/components/Tournaments/TournamentGameProviders.d.ts +0 -5
  160. package/dist/components/Tournaments/TournamentGameProviders.js +0 -38
  161. package/dist/components/Tournaments/TournamentItemDesktop.d.ts +0 -7
  162. package/dist/components/Tournaments/TournamentItemDesktop.js +0 -56
  163. package/dist/components/Tournaments/TournamentItemMobile.d.ts +0 -7
  164. package/dist/components/Tournaments/TournamentItemMobile.js +0 -54
  165. package/dist/components/Tournaments/TournamentMobile.d.ts +0 -1
  166. package/dist/components/Tournaments/TournamentMobile.js +0 -55
  167. package/dist/components/Tournaments/TournamentRules.d.ts +0 -5
  168. package/dist/components/Tournaments/TournamentRules.js +0 -11
  169. package/dist/components/Tournaments/Tournaments.client.d.ts +0 -2
  170. package/dist/components/Tournaments/Tournaments.client.js +0 -20
  171. package/dist/components/Tournaments/TournamentsContext.d.ts +0 -4
  172. package/dist/components/Tournaments/TournamentsContext.js +0 -3
  173. package/dist/components/Tournaments/useTournamentData.d.ts +0 -10
  174. package/dist/components/Tournaments/useTournamentData.js +0 -72
  175. package/dist/components/Tournaments/useTournamentItemData.d.ts +0 -16
  176. package/dist/components/Tournaments/useTournamentItemData.js +0 -64
  177. package/dist/components/index.d.ts +0 -33
  178. package/dist/components/index.js +0 -33
  179. package/dist/constants/endpoints.d.ts +0 -10
  180. package/dist/constants/endpoints.js +0 -41
  181. package/dist/constants/envVars.d.ts +0 -5
  182. package/dist/constants/envVars.js +0 -28
  183. package/dist/constants/gameProviders.d.ts +0 -4
  184. package/dist/constants/gameProviders.js +0 -368
  185. package/dist/constants/gameTypes.d.ts +0 -3
  186. package/dist/constants/gameTypes.js +0 -64
  187. package/dist/constants/headerKeys.d.ts +0 -2
  188. package/dist/constants/headerKeys.js +0 -2
  189. package/dist/constants/secretQuestions.d.ts +0 -3
  190. package/dist/constants/secretQuestions.js +0 -24
  191. package/dist/constants/storageKeys.d.ts +0 -2
  192. package/dist/constants/storageKeys.js +0 -2
  193. package/dist/icons/index.d.ts +0 -65
  194. package/dist/icons/index.js +0 -65
  195. package/dist/images/hacksaw-gaming.png +0 -0
  196. package/dist/server/services/index.d.ts +0 -4
  197. package/dist/server/services/index.js +0 -4
  198. package/dist/server/utils/index.d.ts +0 -29
  199. package/dist/server/utils/index.js +0 -29
  200. package/dist/ui/Presence.d.ts +0 -2
  201. package/dist/ui/Presence.js +0 -7
  202. package/dist/ui/Prose.d.ts +0 -2
  203. package/dist/ui/Prose.js +0 -5
  204. package/dist/ui/index.d.ts +0 -26
  205. package/dist/ui/index.js +0 -26
  206. package/dist/utils/createErrorFromCode.d.ts +0 -2
  207. package/dist/utils/createErrorFromCode.js +0 -11
  208. package/dist/utils/dataUrlToBlob.d.ts +0 -1
  209. package/dist/utils/dataUrlToBlob.js +0 -11
  210. package/dist/utils/index.d.ts +0 -17
  211. package/dist/utils/index.js +0 -17
  212. package/dist/utils/isMobile.d.ts +0 -5
  213. package/dist/utils/isMobile.js +0 -9
  214. package/dist/utils/resizeImageSize.d.ts +0 -1
  215. package/dist/utils/resizeImageSize.js +0 -6
@@ -1,34 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { tz } from '@date-fns/tz';
3
- import { format } from 'date-fns';
4
- import Link from 'next/link';
5
- import { useShallow } from 'zustand/shallow';
6
- import { useGlobalStore, useLocaleInfo, useMarkMessageAsReadMutation, } from '../../client/hooks/index.js';
7
- import { getMessageIcon } from '../../components/Messages/utils.js';
8
- export function MessageItem({ message }) {
9
- const {
10
- /**/
11
- id, icon, title, content, actions, markedAsRead, dateTimeCreated, } = message;
12
- const localeInfo = useLocaleInfo();
13
- const globalStore = useGlobalStore(useShallow((ctx) => ({
14
- message: ctx.message,
15
- messages: ctx.messages,
16
- })));
17
- const markMessageAsReadMutation = useMarkMessageAsReadMutation();
18
- const Icon = getMessageIcon(icon);
19
- const handleViewMessage = async () => {
20
- globalStore.message.setData(message);
21
- globalStore.message.setOpen(true);
22
- globalStore.messages.setOpen(false);
23
- if (!markedAsRead)
24
- markMessageAsReadMutation.mutate(id);
25
- };
26
- const handleActionClick = (e) => {
27
- e.stopPropagation();
28
- globalStore.messages.setOpen(false);
29
- globalStore.messages.setTab('ALL');
30
- };
31
- return (_jsxs("div", { role: "button", tabIndex: 0, className: "border-border-secondary rounded-xs bg-bg-secondary flex h-auto flex-shrink-0 cursor-pointer flex-col border px-3.5 py-2.5", onClick: handleViewMessage, "aria-pressed": "false", children: [_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx("p", { className: "text-text-tertiary-600 text-xs font-normal", children: format(new Date(dateTimeCreated), 'M/d/yyyy - h:mma', {
32
- in: tz(localeInfo.timezone),
33
- }) }), !markedAsRead && (_jsx("div", { className: "bg-utility-success-500 h-2.5 w-2.5 rounded-full" }))] }), _jsxs("div", { className: "mb-2 flex items-center space-x-2", children: [_jsx(Icon, { className: "text-brand-400" }), _jsx("p", { className: "text-text-primary-brand text-sm font-semibold", children: title })] }), _jsx("p", { className: "line-clamp-3 text-wrap text-sm font-normal", dangerouslySetInnerHTML: { __html: content } }), actions.length > 0 && (_jsx("div", { className: "mt-2 flex flex-wrap items-center justify-end gap-2", children: actions.map((action, index) => (_jsx(Link, { className: "border-button-secondary-border text-button-secondary-fg rounded-md border px-3 py-2 text-sm", href: action.url, onClick: handleActionClick, children: action.name }, index))) }))] }));
34
- }
@@ -1 +0,0 @@
1
- export declare function WebVitals(): null;
@@ -1,8 +0,0 @@
1
- 'use client';
2
- import { useReportWebVitals } from 'next/web-vitals';
3
- export function WebVitals() {
4
- useReportWebVitals((metric) => {
5
- console.log(metric);
6
- });
7
- return null;
8
- }
@@ -1,2 +0,0 @@
1
- import type { PromoProps } from './Promo';
2
- export declare function PromoContent(props: PromoProps): import("react/jsx-runtime").JSX.Element;
@@ -1,9 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import Image from 'next/image';
4
- import Link from 'next/link';
5
- import { ChevronLeftIcon } from '../../icons/index.js';
6
- import { Button, Prose } from '../../ui/index.js';
7
- export function PromoContent(props) {
8
- return (_jsxs("div", { className: props.className, children: [_jsxs(Link, { href: props.viewAllPromosUrl ?? '/promos', className: "text-button-tertiary-fg flex w-fit items-center gap-lg text-lg font-semibold", children: [_jsx(ChevronLeftIcon, { className: "size-6" }), "Back to all Promotions"] }), _jsx(Image, { src: "https://s3.ap-east-1.amazonaws.com/opexa-assets.opexasystem.com/assets/BSxIXEsa59_zzMAR27-ALLDAYREBATE06-STATIC-WEB-HB-1920x1080.png", alt: "", width: 1024, height: 600, className: "mt-xl h-auto w-full rounded-xl lg:mt-6" }), _jsx(Button, { className: "mt-xl lg:mt-6", children: "Deposit Now" }), _jsx("h1", { className: "mt-xl text-2xl font-semibold lg:mt-6 lg:text-3xl", children: "Welcome Bonus 100% up to $500 + 10 Free Spins" }), _jsx("p", { className: "text-text-secondary-700 mt-xl lg:mt-6", children: "Ends 5/26/2025, 1:59:59 AM" }), _jsxs(Prose, { className: "mt-2xl lg:mt-6", children: [_jsx("p", { children: "Mi tincidunt elit, id quisque ligula ac diam, amet. Vel etiam suspendisse morbi eleifend faucibus eget vestibulum felis. Dictum quis montes, sit sit. Tellus aliquam enim urna, etiam. Mauris posuere vulputate arcu amet, vitae nisi, tellus tincidunt. At feugiat sapien varius id." }), _jsx("p", { children: "Eget quis mi enim, leo lacinia pharetra, semper. Eget in volutpat mollis at volutpat lectus velit, sed auctor. Porttitor fames arcu quis fusce augue enim. Quis at habitant diam at. Suscipit tristique risus, at donec. In turpis vel et quam imperdiet. Ipsum molestie aliquet sodales id est ac volutpat." }), _jsx("p", { children: "Ipsum sit mattis nulla quam nulla. Gravida id gravida ac enim mauris id. Non pellentesque congue eget consectetur turpis. Sapien, dictum molestie sem tempor. Diam elit, orci, tincidunt aenean tempus. Quis velit eget ut tortor tellus. Sed vel, congue felis elit erat nam nibh orci." }), _jsx("p", { children: "Dolor enim eu tortor urna sed duis nulla. Aliquam vestibulum, nulla odio nisl vitae. In aliquet pellentesque aenean hac vestibulum turpis mi bibendum diam. Tempor integer aliquam in vitae malesuada fringilla." }), _jsx("p", { children: "Elit nisi in eleifend sed nisi. Pulvinar at orci, proin imperdiet commodo consectetur convallis risus. Sed condimentum enim dignissim adipiscing faucibus consequat, urna. Viverra purus et erat auctor aliquam. Risus, volutpat vulputate posuere purus sit congue convallis aliquet. Arcu id augue ut feugiat donec porttitor neque. Mauris, neque ultricies eu vestibulum, bibendum quam lorem id. Dolor lacus, eget nunc lectus in tellus, pharetra, porttitor." }), _jsx("p", { children: "Ipsum sit mattis nulla quam nulla. Gravida id gravida ac enim mauris id. Non pellentesque congue eget consectetur turpis. Sapien, dictum molestie sem tempor. Diam elit, orci, tincidunt aenean tempus. Quis velit eget ut tortor tellus. Sed vel, congue felis elit erat nam nibh orci." }), _jsx("h5", { children: "General Conditions:" }), _jsx("p", { children: "Mi tincidunt elit, id quisque ligula ac diam, amet. Vel etiam suspendisse morbi eleifend faucibus eget vestibulum felis. Dictum quis montes, sit sit. Tellus aliquam enim urna, etiam. Mauris posuere vulputate arcu amet, vitae nisi, tellus tincidunt. At feugiat sapien varius id." }), _jsx("p", { children: "Eget quis mi enim, leo lacinia pharetra, semper. Eget in volutpat mollis at volutpat lectus velit, sed auctor. Porttitor fames arcu quis fusce augue enim. Quis at habitant diam at. Suscipit tristique risus, at donec. In turpis vel et quam imperdiet. Ipsum molestie aliquet sodales id est ac volutpat." })] }), _jsxs(Prose, { className: "bg-bg-secondary mt-xl rounded-2xl p-2xl lg:mt-16 lg:p-4xl", children: [_jsx("h2", { children: "Conclusion" }), _jsx("p", { children: "Morbi sed imperdiet in ipsum, adipiscing elit dui lectus. Tellus id scelerisque est ultricies ultricies. Duis est sit sed leo nisl, blandit elit sagittis. Quisque tristique consequat quam sed. Nisl at scelerisque amet nulla purus habitasse." }), _jsx("p", { children: "Nunc sed faucibus bibendum feugiat sed interdum. Ipsum egestas condimentum mi massa. In tincidunt pharetra consectetur sed duis facilisis metus. Etiam egestas in nec sed et. Quis lobortis at sit dictum eget nibh tortor commodo cursus." }), _jsx("p", { children: "Odio felis sagittis, morbi feugiat tortor vitae feugiat fusce aliquet. Nam elementum urna nisi aliquet erat dolor enim. Ornare id morbi eget ipsum. Aliquam senectus neque ut id eget consectetur dictum. Donec posuere pharetra odio consequat scelerisque et, nunc tortor." })] })] }));
9
- }
@@ -1,2 +0,0 @@
1
- import type { PromosProps } from './Promos';
2
- export declare function PromoCarousel(props: PromosProps): import("react/jsx-runtime").JSX.Element;
@@ -1,41 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import useEmblaCarousel, {} from 'embla-carousel-react';
4
- import Link from 'next/link';
5
- import { useCallback, useEffect, useState } from 'react';
6
- import { twMerge } from 'tailwind-merge';
7
- import { usePromosQuery } from '../../client/hooks/index.js';
8
- import { ArrowLeftIcon, ArrowRightIcon, ChevronRightIcon, Gift01Icon, } from '../../icons/index.js';
9
- import { Button } from '../../ui/index.js';
10
- import { Empty } from '../Empty.js';
11
- import { PromosItem } from './PromoItem.js';
12
- export function PromoCarousel(props) {
13
- const promosQuery = usePromosQuery({});
14
- const promos = promosQuery.data || [];
15
- const [emblaRef, emblaApi] = useEmblaCarousel({
16
- align: 'start',
17
- slidesToScroll: 1,
18
- breakpoints: {
19
- '(min-width: 1024px)': {
20
- slidesToScroll: 3,
21
- },
22
- },
23
- });
24
- const [prevBtnDisabled, setPrevBtnDisabled] = useState(true);
25
- const [nextBtnDisabled, setNextBtnDisabled] = useState(true);
26
- const onPrevButtonClick = useCallback(() => emblaApi?.scrollPrev(), [emblaApi]);
27
- const onNextButtonClick = useCallback(async () => {
28
- emblaApi?.scrollNext();
29
- }, [emblaApi]);
30
- const onSelect = useCallback((emblaApi) => {
31
- setPrevBtnDisabled(!emblaApi?.canScrollPrev());
32
- setNextBtnDisabled(!emblaApi?.canScrollNext());
33
- }, []);
34
- useEffect(() => {
35
- if (!emblaApi)
36
- return;
37
- onSelect(emblaApi);
38
- emblaApi.on('reInit', onSelect).on('select', onSelect);
39
- }, [emblaApi, onSelect]);
40
- return (_jsxs("div", { className: props.className, children: [_jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "text-lg font-semibold", children: props.heading ?? 'Promotions' }), _jsx("div", { className: "grow" }), _jsxs("div", { className: "flex items-center justify-center gap-xl", children: [_jsxs(Link, { href: props.viewAllUrl ?? '/promos', className: "text-button-tertiary-fg flex gap-sm text-sm font-semibold", children: ["See All", _jsx(ChevronRightIcon, { className: "size-5 lg:hidden" })] }), _jsxs("div", { className: "hidden lg:flex", children: [_jsx(Button, { variant: "outline", colorScheme: "gray", className: "rounded-r-none border-r-0", onClick: onPrevButtonClick, disabled: prevBtnDisabled, "aria-label": "Previous", children: _jsx(ArrowLeftIcon, { className: "size-5" }) }), _jsx(Button, { variant: "outline", colorScheme: "gray", className: "rounded-l-none", onClick: onNextButtonClick, disabled: nextBtnDisabled, "aria-label": "Next", children: _jsx(ArrowRightIcon, { className: "size-5" }) })] })] })] }), promos.length <= 0 && (_jsx(Empty, { icon: Gift01Icon, title: "No Promos", message: "No promo is currently available.", className: "mt-8" })), promos.length >= 1 && (_jsx("div", { ref: emblaRef, className: "relative mt-lg lg:overflow-hidden", children: _jsx("div", { className: twMerge('grid auto-cols-[calc((100%-(0.375rem*2))/1)] grid-flow-col gap-sm lg:auto-cols-[calc((100%-(0.5rem*5))/3)] lg:gap-md'), children: promos.map((promo) => (_jsx(PromosItem, { promo: promo, shouldShowDescription: props.shouldShowDescription }, promo.id))) }) }))] }));
41
- }
@@ -1,2 +0,0 @@
1
- import type { PromosProps } from './Promos';
2
- export declare function PromoGrid(props: PromosProps): import("react/jsx-runtime").JSX.Element;
@@ -1,12 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { twMerge } from 'tailwind-merge';
4
- import { usePromosQuery } from '../../client/hooks/index.js';
5
- import { Gift01Icon } from '../../icons/index.js';
6
- import { Empty } from '../Empty.js';
7
- import { PromosItem } from './PromoItem.js';
8
- export function PromoGrid(props) {
9
- const promosQuery = usePromosQuery({});
10
- const promos = promosQuery.data || [];
11
- return (_jsxs("div", { className: props.className, children: [_jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "text-lg font-semibold", children: props.heading ?? 'Promos' }), _jsx("div", { className: "grow" })] }), promos.length <= 0 && (_jsx(Empty, { icon: Gift01Icon, title: "No Promos", message: "No promo is currently available.", className: "mt-lg" })), promos.length >= 1 && (_jsx("div", { className: "relative mt-lg lg:overflow-hidden", children: _jsx("div", { className: twMerge('grid grid-cols-1 gap-sm lg:grid-cols-3 lg:gap-md'), children: promos.map((promo) => (_jsx(PromosItem, { promo: promo, shouldShowDescription: props.shouldShowDescription }, promo.id))) }) }))] }));
12
- }
@@ -1,7 +0,0 @@
1
- import type { Promo } from '@opexa/portal-sdk-core';
2
- interface PromosItemProps {
3
- promo: Promo;
4
- shouldShowDescription?: boolean;
5
- }
6
- export declare function PromosItem(props: PromosItemProps): import("react/jsx-runtime").JSX.Element;
7
- export {};
@@ -1,10 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import Image from 'next/image';
3
- import { useRouter } from 'next/navigation';
4
- import { twJoin } from 'tailwind-merge';
5
- import { Button } from '../../ui/index.js';
6
- export function PromosItem(props) {
7
- const { promo } = props;
8
- const router = useRouter();
9
- return (_jsxs("div", { className: "border-border-primary bg-accent-50 relative flex h-full flex-col rounded-md border", children: [promo.banner.url && (_jsx(Image, { src: promo.banner.url, alt: promo.name, width: 1200, height: 500, priority: true, className: "aspect-[1200/500] w-full rounded-t-md object-cover" })), _jsxs("div", { className: "flex flex-grow flex-col p-4", children: [_jsx("p", { className: twJoin('w-full text-xl font-bold', props.shouldShowDescription ? 'text-start' : 'text-center'), children: promo.name }), props.shouldShowDescription && promo.description && (_jsx("p", { className: "text-gray-600 mb-2 line-clamp-2 w-full overflow-hidden text-start text-sm", dangerouslySetInnerHTML: { __html: promo.description } })), _jsx("div", { className: "mt-auto pt-4", children: _jsx(Button, { className: "w-full text-sm font-semibold", onClick: () => router.push(`/promos/${promo.id}`), children: "Get Bonus" }) })] })] }, promo.id));
10
- }
@@ -1,15 +0,0 @@
1
- import { type ReactNode } from 'react';
2
- type TimeLeft = {
3
- days: number;
4
- hours: number;
5
- minutes: number;
6
- seconds: number;
7
- };
8
- interface CountdownTimerProps {
9
- startDateTime?: string;
10
- endDateTime?: string;
11
- renderAction: (timeLeft: TimeLeft) => ReactNode;
12
- onEnd?: () => void;
13
- }
14
- export default function CountdownTimer({ startDateTime, endDateTime, renderAction, onEnd, }: CountdownTimerProps): import("react/jsx-runtime").JSX.Element;
15
- export {};
@@ -1,33 +0,0 @@
1
- 'use client';
2
- import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
3
- import { differenceInSeconds, parseISO } from 'date-fns';
4
- import { useCallback, useEffect, useState } from 'react';
5
- export default function CountdownTimer({ startDateTime, endDateTime, renderAction, onEnd, }) {
6
- const calculateTimeLeft = useCallback(() => {
7
- const start = startDateTime ? parseISO(startDateTime) : new Date();
8
- const end = endDateTime ? parseISO(endDateTime) : new Date();
9
- const totalSeconds = Math.max(differenceInSeconds(end, start), 0);
10
- const days = Math.floor(totalSeconds / (60 * 60 * 24));
11
- const hours = Math.floor((totalSeconds % (60 * 60 * 24)) / (60 * 60));
12
- const minutes = Math.floor((totalSeconds % (60 * 60)) / 60);
13
- const seconds = totalSeconds % 60;
14
- return { days, hours, minutes, seconds };
15
- }, [startDateTime, endDateTime]);
16
- const [timeLeft, setTimeLeft] = useState(calculateTimeLeft);
17
- useEffect(() => {
18
- const interval = setInterval(() => {
19
- const newTimeLeft = calculateTimeLeft();
20
- setTimeLeft(newTimeLeft);
21
- const isZero = newTimeLeft.days === 0 &&
22
- newTimeLeft.hours === 0 &&
23
- newTimeLeft.minutes === 0 &&
24
- newTimeLeft.seconds === 0;
25
- if (isZero) {
26
- clearInterval(interval);
27
- onEnd?.();
28
- }
29
- }, 1000);
30
- return () => clearInterval(interval);
31
- }, [calculateTimeLeft, onEnd]);
32
- return _jsx(_Fragment, { children: renderAction(timeLeft) });
33
- }
@@ -1,4 +0,0 @@
1
- import type { Quest } from '../../../types';
2
- export declare function DailyCheckInQuest({ quest }: {
3
- quest: Quest;
4
- }): import("react/jsx-runtime").JSX.Element;
@@ -1,78 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
- import { addDays, isEqual, startOfDay } from 'date-fns';
4
- import { useState } from 'react';
5
- import { twMerge } from 'tailwind-merge';
6
- import { useCheckInDailyCheckInQuestMutation } from '../../../client/hooks/useCheckInDailyCheckInQuestMutation.js';
7
- import { toaster } from '../../../client/utils/toaster.js';
8
- import { CalendarIcon } from '../../../icons/CalendarIcon.js';
9
- import { CheckIcon } from '../../../icons/CheckIcon.js';
10
- import { ClockStopWatchIcon } from '../../../icons/ClockStopWatchIcon.js';
11
- import { InfoCircleIcon } from '../../../icons/InfoCircleIcon.js';
12
- import { Badge } from '../../../ui/Badge/index.js';
13
- import { Button } from '../../../ui/Button/index.js';
14
- import { getQueryClient } from '../../../utils/getQueryClient.js';
15
- import { getAvailableQuestsQueryKey } from '../../../utils/queryKeys.js';
16
- import CountdownTimer from '../CountdownTimer.js';
17
- import { DailyCheckInQuestModal } from './DailyCheckInQuestModal.js';
18
- export function DailyCheckInQuest({ quest }) {
19
- const queryClient = getQueryClient();
20
- const [showRules, setShowRules] = useState(false);
21
- const [isExpired, setIsExpired] = useState(false);
22
- const { name, description, status, lastCheckInDate, progressPercentage, checkInStreak, thirdDayBonusAmount, sixthDayBonusAmount, seventhDayBonusAmount, endDateTime, id, } = quest;
23
- const today = startOfDay(new Date());
24
- const hasCheckedInToday = lastCheckInDate
25
- ? isEqual(today, startOfDay(new Date(lastCheckInDate)))
26
- : false;
27
- const checkedInRewards = {
28
- 3: thirdDayBonusAmount,
29
- 6: sixthDayBonusAmount,
30
- 7: seventhDayBonusAmount,
31
- };
32
- const dailyCheckedInData = Array.from({ length: 7 }, (_, i) => {
33
- const day = i + 1;
34
- return {
35
- day,
36
- reward: checkedInRewards[day] ?? 0,
37
- };
38
- });
39
- const { mutate } = useCheckInDailyCheckInQuestMutation({
40
- onSuccess() {
41
- toaster.success({
42
- title: 'Check-in successful 🎉',
43
- description: 'You’ve successfully checked in for today! Keep it up to maintain your streak!',
44
- });
45
- queryClient.invalidateQueries({
46
- queryKey: getAvailableQuestsQueryKey(),
47
- });
48
- },
49
- onError(e) {
50
- toaster.error({
51
- title: 'Check-in successful 🎉',
52
- description: e.message ?? 'Check-In Failed',
53
- });
54
- },
55
- });
56
- const handleCheckIn = async () => mutate(id);
57
- return (_jsxs(_Fragment, { children: [_jsx(DailyCheckInQuestModal, { modalState: {
58
- isOpen: showRules,
59
- setIsOpen: setShowRules,
60
- } }), _jsxs("div", { className: "border-border-primary bg-bg-tertiary flex h-full w-full flex-col space-y-6 rounded-2xl border px-4 pb-6 pt-5", children: [_jsxs("div", { className: "flex flex-col space-y-2", children: [_jsxs("div", { className: "flex max-h-7.5 items-start justify-between", children: [_jsx(CountdownTimer, { endDateTime: endDateTime, renderAction: (timeLeft) => (_jsxs(Badge.Root, { size: "lg", colorScheme: "brand", round: false, children: [_jsx(Badge.Icon, { children: _jsx(ClockStopWatchIcon, {}) }), _jsxs(Badge.Label, { children: [timeLeft.days, "d:", timeLeft.hours, "h:", timeLeft.minutes, "m:", timeLeft.seconds, "s"] })] })), onEnd: () => setIsExpired(true) }), _jsx("div", { role: "button", className: "bg-bg-primary border-border-secondary flex size-9 cursor-pointer items-center justify-center rounded-md border", onClick: () => setShowRules((prev) => !prev), children: _jsx(InfoCircleIcon, { className: "text-text-disabled size-5" }) })] }), _jsx("p", { className: "text-xl font-semibold", children: name }), _jsx("p", { className: "text-text-secondary-700 text-wrap text-sm font-normal", dangerouslySetInnerHTML: { __html: description } })] }), _jsxs("div", { className: "flex w-full flex-col space-y-2", children: [_jsx("div", { className: "grid grid-cols-7", children: dailyCheckedInData.map((item) => {
61
- const reward = item.reward ? `+₱${item.reward}` : '-';
62
- return (_jsx("div", { className: twMerge('flex items-center justify-center', item.day <= (checkInStreak || 0)
63
- ? 'text-brand-400'
64
- : 'text-text-secondary-700'), children: _jsx("p", { children: reward }) }, item.day));
65
- }) }), _jsx("div", { className: "bg-bg-primary h-2 w-full overflow-hidden rounded-full", children: _jsx("div", { className: "bg-utility-brand-600 h-full rounded-full transition-all duration-300", style: { width: `${progressPercentage}%` } }) }), _jsx("div", { className: "grid grid-cols-7", children: dailyCheckedInData.map((item) => (_jsx("div", { className: "flex items-center justify-center", children: _jsx(CalendarWithDayNumber, { day: item.day, currentCheckedInDays: checkInStreak || 0 }, item.day) }, item.day))) })] }), _jsx(Button, { onClick: handleCheckIn, className: "disabled:bg-bg-primary disabled:text-text-disabled", disabled: isExpired ||
66
- status === 'COMPLETED' ||
67
- status === 'FAILED' ||
68
- hasCheckedInToday, children: hasCheckedInToday && status === 'IN_PROGRESS' ? (_jsx(CountdownTimer, { endDateTime: startOfDay(addDays(new Date(), 1)).toISOString(), renderAction: (timeLeft) => (_jsxs("div", { className: "flex items-center space-x-0.5", children: [_jsx(CheckIcon, {}), _jsxs("p", { children: [timeLeft.hours, "h:", timeLeft.minutes, "m:", timeLeft.seconds, "s"] })] })), onEnd: () => {
69
- queryClient.invalidateQueries({
70
- queryKey: getAvailableQuestsQueryKey(),
71
- });
72
- } })) : ('Check-In') })] })] }));
73
- }
74
- function CalendarWithDayNumber({ day, currentCheckedInDays, }) {
75
- return (_jsxs("div", { className: twMerge('group relative h-fit w-fit', day <= currentCheckedInDays
76
- ? 'text-brand-400'
77
- : 'text-text-secondary-700'), children: [_jsx(CalendarIcon, {}), _jsx("div", { className: "absolute inset-0 mt-1 flex items-center justify-center text-2xs lg:mt-[2px]", children: _jsx("p", { className: "text-center", children: day }) })] }));
78
- }
@@ -1,8 +0,0 @@
1
- interface Props {
2
- modalState: {
3
- isOpen: boolean;
4
- setIsOpen: (isOpen: boolean) => void;
5
- };
6
- }
7
- export declare function DailyCheckInQuestModal(props: Props): import("react/jsx-runtime").JSX.Element;
8
- export {};
@@ -1,9 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { XIcon } from '../../../icons/XIcon.js';
4
- import { Button } from '../../../ui/Button/index.js';
5
- import { Dialog } from '../../../ui/Dialog/index.js';
6
- import { Portal } from '../../../ui/Portal/index.js';
7
- export function DailyCheckInQuestModal(props) {
8
- return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: props.modalState.isOpen, onOpenChange: ({ open }) => props.modalState.setIsOpen(open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("p", { className: "text-text-primary-900 text-lg font-semibold", children: "Daily Check-In Rules" }), _jsxs("ul", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Earn rewards just for checking in each day!" }), _jsx("li", { children: "Stay consistent to unlock special rewards on the 3rd, 5th, and 7th day." }), _jsx("li", { children: "Missing a day will reset your streak, starting again from Day 1." }), _jsx("li", { children: "Each check-in unlocks the next one on the following day." }), _jsx("li", { children: "Successfully check in for 7 consecutive days to complete the quest and reset the cycle." })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => props.modalState.setIsOpen(false), children: "Ok" }) })] }) })] }) }));
9
- }
@@ -1,4 +0,0 @@
1
- import type { Quest } from '../../../types';
2
- export declare function OnboardingQuest(props: {
3
- quest: Quest;
4
- }): null;
@@ -1,4 +0,0 @@
1
- export function OnboardingQuest(props) {
2
- console.log('OnboardingQuest not implemented', props.quest);
3
- return null;
4
- }
@@ -1,4 +0,0 @@
1
- import type { Quest } from '../../../types';
2
- export declare function WageringQuest({ quest }: {
3
- quest: Quest;
4
- }): import("react/jsx-runtime").JSX.Element;
@@ -1,20 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
- import { useState } from 'react';
4
- import { twMerge } from 'tailwind-merge';
5
- import { ClockStopWatchIcon } from '../../../icons/ClockStopWatchIcon.js';
6
- import { InfoCircleIcon } from '../../../icons/InfoCircleIcon.js';
7
- import { Badge } from '../../../ui/Badge/index.js';
8
- import CountdownTimer from '../CountdownTimer.js';
9
- import { WageringQuestModal } from './WageringQuestModal.js';
10
- export function WageringQuest({ quest }) {
11
- const [showRules, setShowRules] = useState(false);
12
- const [isExpired, setIsExpired] = useState(false);
13
- const { progressPercentage, turnover, targetTurnover, name, description, endDateTime, bonus, status, } = quest;
14
- return (_jsxs(_Fragment, { children: [_jsx(WageringQuestModal, { questName: name, modalState: {
15
- isOpen: showRules,
16
- setIsOpen: setShowRules,
17
- } }), _jsxs("div", { className: "border-border-primary bg-bg-tertiary flex h-full w-full flex-col space-y-6 rounded-2xl border px-4 pb-6 pt-5", children: [_jsxs("div", { className: "flex flex-col space-y-2", children: [_jsxs("div", { className: "flex max-h-7.5 items-start justify-between", children: [_jsx(CountdownTimer, { endDateTime: endDateTime, renderAction: (timeLeft) => (_jsxs(Badge.Root, { size: "lg", colorScheme: "brand", round: false, children: [_jsx(Badge.Icon, { children: _jsx(ClockStopWatchIcon, {}) }), _jsxs(Badge.Label, { children: [timeLeft.days, "d:", timeLeft.hours, "h:", timeLeft.minutes, "m:", timeLeft.seconds, "s"] })] })), onEnd: () => setIsExpired(true) }), _jsx("div", { role: "button", className: "bg-bg-primary border-border-secondary flex size-9 cursor-pointer items-center justify-center rounded-md border", onClick: () => setShowRules((prev) => !prev), children: _jsx(InfoCircleIcon, { className: "text-text-disabled size-5" }) })] }), _jsx("p", { className: "text-xl font-semibold", children: name }), _jsx("p", { className: "text-text-secondary-700 text-wrap text-sm font-normal", dangerouslySetInnerHTML: { __html: description } })] }), _jsxs("div", { className: "flex w-full flex-col space-y-2", children: [_jsxs("div", { className: "text-text-primary-brand group flex items-center justify-between", children: [_jsxs("p", { children: ["Progress ", parseInt(progressPercentage).toFixed(2), "%"] }), _jsxs("p", { children: [turnover, _jsxs("span", { className: "text-text-quarterary-brand", children: ["/", targetTurnover, " PHP"] })] })] }), _jsx("div", { className: "bg-bg-primary h-2 w-full overflow-hidden rounded-full", children: _jsx("div", { className: "bg-utility-brand-600 h-full rounded-full transition-all duration-300", style: { width: `${progressPercentage}%` } }) })] }), _jsx("div", { className: "flex h-full items-end", children: _jsx("div", { className: "bg-button-secondary-bg border-bg-primary-hover w-full rounded-md border px-3.5 py-2.5 text-center text-white", children: _jsxs("p", { className: twMerge(isExpired || status === 'COMPLETED' || status === 'FAILED'
18
- ? ['opacity-50 grayscale']
19
- : ''), children: ["Complete to get ", _jsxs("span", { className: "text-brand-400", children: ["\u20B1", bonus] }), ' ', "bonus!"] }) }) })] })] }));
20
- }
@@ -1,9 +0,0 @@
1
- interface Props {
2
- questName: string;
3
- modalState: {
4
- isOpen: boolean;
5
- setIsOpen: (isOpen: boolean) => void;
6
- };
7
- }
8
- export declare function WageringQuestModal(props: Props): import("react/jsx-runtime").JSX.Element;
9
- export {};
@@ -1,9 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { XIcon } from '../../../icons/XIcon.js';
4
- import { Button } from '../../../ui/Button/index.js';
5
- import { Dialog } from '../../../ui/Dialog/index.js';
6
- import { Portal } from '../../../ui/Portal/index.js';
7
- export function WageringQuestModal(props) {
8
- return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: props.modalState.isOpen, onOpenChange: ({ open }) => props.modalState.setIsOpen(open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto max-w-[343px] rounded-xl px-4 pb-0 pt-5", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col space-y-5", children: [_jsx("p", { className: "text-text-primary-900 text-lg font-semibold", children: props.questName }), _jsxs("ul", { className: "text-text-tertiary-600 group list-disc text-wrap pl-4 text-sm font-normal", children: [_jsx("li", { children: "Earn extra rewards just by playing Slots, every bet counts, win or lose!" }), _jsx("li", { children: "Reach the wagering requirement in bets to complete the quest and claim your reward." })] })] }), _jsx("div", { className: "pb-4 pt-6", children: _jsx(Button, { onClick: () => props.modalState.setIsOpen(false), children: "Ok" }) })] }) })] }) }));
9
- }
@@ -1,2 +0,0 @@
1
- import type { TournamentCounterProps } from './TournamentCounter';
2
- export declare function TournamentCounter__client(props: TournamentCounterProps): import("react/jsx-runtime").JSX.Element | null;
@@ -1,50 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import useEmblaCarousel from 'embla-carousel-react';
4
- import Link from 'next/link';
5
- import { useCallback, useEffect, useState } from 'react';
6
- import { useTournamentsQuery } from '../../client/hooks/index.js';
7
- import { ArrowLeftIcon, ArrowRightIcon, ChevronRightIcon } from '../../icons/index.js';
8
- import { Button } from '../../ui/index.js';
9
- import { TournamentCounterItem } from './TournamentCounterItem.js';
10
- export function TournamentCounter__client(props) {
11
- const [emblaRef, emblaApi] = useEmblaCarousel({
12
- align: 'start',
13
- slidesToScroll: 1,
14
- });
15
- const scrollPrev = useCallback(() => {
16
- if (emblaApi)
17
- emblaApi.scrollPrev();
18
- }, [emblaApi]);
19
- const scrollNext = useCallback(() => {
20
- if (emblaApi)
21
- emblaApi.scrollNext();
22
- }, [emblaApi]);
23
- const [canScrollPrev, setCanScrollPrev] = useState(false);
24
- const [canScrollNext, setCanScrollNext] = useState(false);
25
- const onSelect = useCallback(() => {
26
- if (!emblaApi)
27
- return;
28
- setCanScrollPrev(emblaApi.canScrollPrev());
29
- setCanScrollNext(emblaApi.canScrollNext());
30
- }, [emblaApi]);
31
- useEffect(() => {
32
- if (!emblaApi)
33
- return;
34
- onSelect();
35
- emblaApi.on('select', onSelect);
36
- emblaApi.on('reInit', onSelect);
37
- }, [emblaApi, onSelect]);
38
- const tournamentsQuery = useTournamentsQuery({
39
- first: 100,
40
- filter: {
41
- status: {
42
- equal: 'ACTIVE',
43
- },
44
- },
45
- });
46
- const tournaments = tournamentsQuery.data?.pages[0].edges.map((edge) => edge.node) ?? [];
47
- if (tournaments.length <= 0)
48
- return null;
49
- return (_jsxs("div", { className: props.className, children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "text-lg font-semibold", children: props.heading ?? 'Tournaments' }), _jsxs("div", { className: "flex items-center md:gap-3xl", children: [_jsxs(Link, { href: props.viewAllUrl ?? '/tournaments', className: "text-button-tertiary-fg flex gap-sm text-sm font-semibold", 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 lg:overflow-hidden", ref: emblaRef, children: _jsx("div", { className: "flex gap-2.5", children: tournaments.map((tournament, i) => (_jsx(TournamentCounterItem, { tournament: tournament, viewAllUrl: props.viewAllUrl, className: "w-full" }, i))) }) })] }));
50
- }
@@ -1,8 +0,0 @@
1
- export interface TournamentCounterProps {
2
- /** @default "Tournaments" */
3
- heading?: string;
4
- /** @default "/tournaments" */
5
- viewAllUrl?: string;
6
- className?: string;
7
- }
8
- export declare function TournamentCounter(props: TournamentCounterProps): Promise<import("react/jsx-runtime").JSX.Element>;
@@ -1,21 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { prefetchJackpotsQuery } from '../../server/utils/index.js';
3
- import { TournamentCounter__client } from './TournamentCounter.client.js';
4
- export async function TournamentCounter(props) {
5
- await prefetchJackpotsQuery({
6
- first: 100,
7
- filter: {
8
- status: {
9
- equal: 'ACTIVE',
10
- },
11
- deleted: {
12
- equal: false,
13
- },
14
- },
15
- sort: {
16
- cursor: 'POOL',
17
- order: 'DESC',
18
- },
19
- });
20
- return _jsx(TournamentCounter__client, { ...props });
21
- }
@@ -1,8 +0,0 @@
1
- import type { Tournament } from '@opexa/portal-sdk-core';
2
- export interface TournamentCounterItemProps {
3
- tournament: Tournament;
4
- className?: string;
5
- /** @default "/tournaments" */
6
- viewAllUrl?: string;
7
- }
8
- export declare function TournamentCounterItem({ tournament, className, viewAllUrl, }: TournamentCounterItemProps): import("react/jsx-runtime").JSX.Element;
@@ -1,106 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
- import { pick } from 'lodash-es';
4
- import Image from 'next/image';
5
- import Link from 'next/link';
6
- import React, { useEffect, useMemo, useState } from 'react';
7
- import { twMerge } from 'tailwind-merge';
8
- import { useLocaleInfo } from '../../client/hooks/index.js';
9
- import { ChevronRightIcon, Trophy01Icon, User01Icon } from '../../icons/index.js';
10
- import { Award01Icon } from '../../icons/Award01Icon.js';
11
- import { StarIcon } from '../../icons/StarIcon.js';
12
- import firstPlace from '../../images/first-place.png';
13
- import trophyTwo from '../../images/trophy-two.png';
14
- import trophy from '../../images/trophy.png';
15
- import { formatNumber, mask } from '../../utils/index.js';
16
- import styles from '../JackpotCounter/JackpotCounterItem.module.css';
17
- export function TournamentCounterItem({ tournament, className, viewAllUrl, }) {
18
- const localeInfo = useLocaleInfo();
19
- const [timeRemaining, setTimeRemaining] = useState({
20
- days: 0,
21
- hours: 0,
22
- minutes: 0,
23
- seconds: 0,
24
- isPast: false,
25
- });
26
- const activationEndDateTime = useMemo(() => new Date(tournament.activationEndDateTime), [tournament.activationEndDateTime]);
27
- const calculateRemainingTime = React.useCallback(() => {
28
- const now = new Date();
29
- const diffMs = activationEndDateTime.getTime() - now.getTime();
30
- if (diffMs <= 0) {
31
- setTimeRemaining({
32
- days: 0,
33
- hours: 0,
34
- minutes: 0,
35
- seconds: 0,
36
- isPast: true,
37
- });
38
- return;
39
- }
40
- const diffSeconds = Math.floor(diffMs / 1000);
41
- const days = Math.floor(diffSeconds / (3600 * 24));
42
- const hours = Math.floor((diffSeconds % (3600 * 24)) / 3600);
43
- const minutes = Math.floor((diffSeconds % 3600) / 60);
44
- const seconds = diffSeconds % 60;
45
- const updated = pick({ days, hours, minutes, seconds, isPast: false }, [
46
- 'days',
47
- 'hours',
48
- 'minutes',
49
- 'seconds',
50
- 'isPast',
51
- ]);
52
- setTimeRemaining(updated);
53
- }, [activationEndDateTime]);
54
- useEffect(() => {
55
- calculateRemainingTime();
56
- const interval = setInterval(calculateRemainingTime, 1000); // Update every second
57
- return () => clearInterval(interval);
58
- }, [activationEndDateTime, calculateRemainingTime]);
59
- const timeParts = [
60
- { label: 'Day', value: timeRemaining.days },
61
- { label: 'Hour', value: timeRemaining.hours },
62
- { label: 'Min', value: timeRemaining.minutes },
63
- { label: 'Sec', value: timeRemaining.seconds },
64
- ];
65
- const tournamentReward = Object.values(tournament.rewardSettings)
66
- .map(Number)
67
- .reduce((sum, val) => sum + val, 0);
68
- const prizeAmountsByRank = Object.values(tournament.rewardSettings).map(Number);
69
- return (_jsxs("div", { className: twMerge('bg-bg-tertiary border-border-primary relative flex shrink-0 rounded-2xl border p-3 text-center lg:gap-6 lg:p-5', className), children: [_jsx("div", { className: "z-1 relative flex flex-1 flex-col", children: _jsx("div", { className: "flex h-full flex-col justify-between", children: _jsx("div", { className: "flex w-full justify-between", children: _jsxs("div", { className: "flex w-full flex-col", children: [_jsxs("div", { className: "relative flex w-full justify-between", children: [_jsxs("div", { className: "w-full", children: [_jsxs("div", { className: "flex w-full justify-between", children: [_jsxs("div", { className: "border-utility-brand-200 bg-utility-brand-50 text-utility-brand-700 flex h-fit w-fit items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium", children: [_jsx(Award01Icon, { className: "text-utility-brand-500 size-3.5" }), "Multiplier"] }), _jsx("div", { className: "flex h-fit", children: timeParts.map((part, idx) => (_jsxs(React.Fragment, { children: [_jsxs("div", { className: twMerge('bg-bg-primary text-text-primary-900 flex h-fit w-8 flex-col items-center rounded-[4px] pb-1.5'), children: [_jsx("span", { className: "text-base font-medium", children: String(part.value).padStart(2, '0') }), _jsx("span", { className: "text-[8px]", children: part.label })] }), idx < timeParts.length - 1 && (_jsxs("div", { className: "flex flex-col justify-center gap-[6px] px-[6px]", children: [_jsx("div", { className: "bg-bg-primary h-1 w-1 rounded-full" }), _jsx("div", { className: "bg-bg-primary h-1 w-1 rounded-full" })] }))] }, part.label))) })] }), _jsxs("div", { className: "flex justify-between", children: [_jsxs("div", { children: [_jsx("div", { className: "text-text-primary-900 mt-2.5 text-left text-lg font-medium lg:mt-5 lg:text-2xl", children: tournament.name }), _jsx("div", { className: "bg-bg-primary text-brand-400 mt-1.5 w-fit rounded-md px-2 py-1 text-2xl font-bold lg:mt-2 lg:text-4xl", children: formatNumber(tournamentReward, {
70
- currency: localeInfo.currency.code,
71
- minDecimalPlaces: 2,
72
- maxDecimalPlaces: 2,
73
- }) }), _jsx("div", { className: "text-text-primary-900 mt-4 block text-left text-base lg:hidden", children: "Play and Win!" })] }), _jsx("div", { className: "flex items-end lg:hidden", children: _jsx(Image, { src: trophy, alt: "trophy", quality: 100, width: 155, height: 155, className: "h-23 w-auto" }) })] })] }), _jsx("div", { className: "z-1 absolute -bottom-16 right-0 hidden lg:block", children: _jsx(Image, { quality: 100, width: 155, height: 155, src: trophy, alt: "trophy", className: "px-6 py-2.5" }) })] }), tournament.topPayouts.length ? (_jsx("div", { children: _jsxs("div", { className: "bg-bg-primary relative mt-4 hidden w-full gap-4 rounded-lg p-4 lg:flex", children: [_jsxs("div", { className: "bg-bg-tertiary relative flex h-18 w-18 items-center justify-center rounded-full", children: [_jsx(User01Icon, { className: "text-text-quarterary-500 size-9" }), _jsx("div", { className: "bg-yellow-400 text-brand-950 border-bg-primary absolute bottom-0 right-0 flex h-6 w-6 items-center justify-center rounded-full border-[1.5px] text-xs font-bold", children: "1st" })] }), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsxs("div", { className: "border-utility-brand-200 bg-utility-brand-50 text-utility-brand-700 flex h-fit w-fit items-center gap-1 rounded-sm border px-2 py-0.5 text-xs font-medium", children: [_jsx(Trophy01Icon, { className: "text-utility-brand-600 size-3.5" }), "Top Payout"] }), _jsx("div", { className: "font-semibold", children: mask(tournament?.topPayouts[0]?.member?.name || '') }), _jsx("div", { className: "text-brand-400 text-2xl", children: formatNumber(tournament?.topPayouts[0]?.amount, {
74
- currency: localeInfo.currency.code,
75
- minDecimalPlaces: 2,
76
- maxDecimalPlaces: 2,
77
- }) })] })] }) })) : (_jsxs("div", { className: "bg-bg-primary relative mt-4 hidden w-full gap-4 rounded-lg p-4 lg:flex", children: [_jsx(Image, { width: 66, height: 87, src: firstPlace, alt: "closeChest", className: "size-full h-auto w-[66px] mix-blend-luminosity" }), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsxs("div", { className: "border-utility-brand-200 bg-utility-brand-50 text-utility-brand-700 flex h-fit w-fit items-center gap-1 rounded-sm border px-2 py-0.5 text-xs font-medium", children: [_jsx(Trophy01Icon, { className: "text-utility-brand-600 size-3.5" }), "Top Payout"] }), _jsx("div", { className: "font-semibold", children: "No winners yet" }), _jsx("div", { className: "text-text-secondary-700 text-xs", children: "You could be the first to win the tournament!" })] })] }))] }) }) }) }), _jsxs("div", { className: "z-1 hidden flex-1 space-y-4 lg:block", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Image, { width: 24, height: 24, src: trophyTwo, quality: 100, alt: "leaderboardIcon", className: "size-full w-6" }), _jsx("div", { className: "text-text-primary-900 text-lg font-semibold", children: tournament.currentLeaderboard.edges.length
78
- ? 'Leaderboard'
79
- : 'Starting soon!' })] }), _jsxs(Link, { className: "text-button-tertiary-fg flex text-sm font-semibold", href: viewAllUrl ?? '/tournaments', children: ["See details", _jsx(ChevronRightIcon, { className: "size-5" })] })] }), _jsx("div", { className: twMerge('max-h-[272px] overflow-y-scroll', styles['scrollArea']), children: _jsx("div", { className: "border-gray-200 overflow-hidden rounded-xl", children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-bg-secondary text-text-tertiary-600 h-8 text-xs font-medium", children: [_jsx("th", { className: "w-[52px]", children: "#" }), _jsx("th", { children: "Player" }), _jsx("th", { children: "Multiplier" }), _jsx("th", { children: "Prize" })] }) }), _jsx("tbody", { children: tournament.currentLeaderboard.edges.length ? (_jsx(_Fragment, { children: tournament.currentLeaderboard.edges.map((tournament, i) => (_jsxs("tr", { className: "bg-bg-primary text-text-secondary-700 text-sm", children: [_jsx("td", { className: "border-border-secondary h-12 w-[52px] border-t-2", children: i + 1 < 6 ? (_jsxs("div", { className: "relative", children: [_jsx(StarIcon, { className: twMerge('mx-auto size-6.5', starTierStyles[i].starColor) }), _jsx("span", { className: twMerge('absolute inset-0 mt-0.5 flex items-center justify-center text-2xs font-bold', starTierStyles[i].numberColor), children: i + 1 })] })) : (i + 1) }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: mask(tournament.node.username) }), _jsxs("td", { className: "border-border-secondary h-12 border-t-2", children: [tournament.node.multiplier, "x"] }), i + 1 <= prizeAmountsByRank.length ? (_jsx("td", { className: "border-border-secondary text-brand-400 h-12 border-t-2", children: formatNumber(prizeAmountsByRank[i], {
80
- currency: localeInfo.currency.code,
81
- minDecimalPlaces: 2,
82
- maxDecimalPlaces: 2,
83
- }) })) : (_jsx("td", { className: "border-border-secondary h-12 border-t-2", children: "-" }))] }, i))) })) : (_jsx(_Fragment, { children: Array.from({ length: 10 }).map((_, i) => (_jsxs("tr", { className: "bg-bg-primary text-text-secondary-700 text-sm", children: [_jsx("td", { className: "border-border-secondary h-12 w-[52px] border-t-2", children: i + 1 < 6 ? (_jsxs("div", { className: "relative", children: [_jsx(StarIcon, { className: twMerge('mx-auto size-6.5', starTierStyles[i].starColor) }), _jsx("span", { className: twMerge('absolute inset-0 mt-0.5 flex items-center justify-center text-2xs font-bold', starTierStyles[i].numberColor), children: i + 1 })] })) : (i + 1) }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: "-" }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: "-" }), _jsx("td", { className: "border-border-secondary h-12 border-t-2", children: "-" })] }, i))) })) })] }) }) })] })] }));
84
- }
85
- const starTierStyles = [
86
- {
87
- starColor: 'text-yellow-400',
88
- numberColor: 'text-bg-primary',
89
- },
90
- {
91
- starColor: 'text-utility-gray-700',
92
- numberColor: 'text-bg-primary',
93
- },
94
- {
95
- starColor: 'text-yellow-700',
96
- numberColor: 'text-bg-primary',
97
- },
98
- {
99
- starColor: 'text-bg-quaternary',
100
- numberColor: 'text-text-primary-900',
101
- },
102
- {
103
- starColor: 'text-bg-quaternary',
104
- numberColor: 'text-text-primary-900',
105
- },
106
- ];
@@ -1 +0,0 @@
1
- export * from './TournamentCounter';
@@ -1 +0,0 @@
1
- export * from './TournamentCounter.js';