@opexa/portal-components 0.0.1072 → 0.0.1074

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.
@@ -23,7 +23,7 @@ export function Bonus__client(props) {
23
23
  const gameProviders = props.gameProviders ?? [];
24
24
  const enabledGameProviders = bonus?.enabledGameProviders ?? [];
25
25
  const localeInfo = useLocaleInfo();
26
- const remainingTime = useRemainingTime(bonus?.expiration ?? new Date());
26
+ const remainingTime = useRemainingTime(bonus?.promo.daysToClear ?? new Date());
27
27
  if (!bonus)
28
28
  return null;
29
29
  const turnoverRequirement = parseDecimal(bonus.turnoverRequirement, 0);
@@ -31,9 +31,10 @@ export function Bonus__client(props) {
31
31
  return (_jsxs("div", { className: props.className, children: [_jsxs(Link, { href: props.viewAllUrl ?? '/rewards', className: "flex items-center gap-lg font-semibold text-button-tertiary-fg text-lg", children: [_jsx(ChevronLeftIcon, { className: "size-6" }), "Back to all Rewards"] }), _jsx("div", { className: "mt-3xl", children: bonus.promo.banner?.url ? (_jsx(Image, { src: bonus.promo.banner.url, alt: "", width: 1024, height: 600, unoptimized: true, priority: true, className: "h-auto w-full rounded-xl" })) : (_jsx(DefaultImage, {})) }), _jsxs(Badge.Root, { size: "lg", round: false, colorScheme: remainingTime.expired ? 'danger' : 'brand-dark', className: "mt-xl lg:mt-6", children: [_jsx(Badge.Icon, { children: _jsx(StopWatchIcon, {}) }), _jsx(Badge.Label, { children: remainingTime.expired ? 'Expired' : remainingTime.toString() })] }), _jsx("h1", { className: "mt-xl font-semibold text-2xl text-text-primary-900 lg:mt-6 lg:text-3xl", children: bonus.promo.name }), _jsx("p", { className: "mt-xl text-base text-text-primary-brand lg:mt-6 lg:text-lg", children: "Complete the wagering before time runs out to convert your bonus balance into real money!" }), _jsxs("div", { className: "mt-xl flex items-center justify-between rounded-md border border-border-primary bg-bg-tertiary px-3.5 py-xl text-text-secondary-700 lg:mt-6", children: [_jsx("p", { children: "Your bonus balance" }), _jsx("p", { children: _jsx("span", { className: "text-text-primary-900", children: formatNumber(bonus.balance, {
32
32
  currency: localeInfo.currency.code,
33
33
  minDecimalPlaces: 2,
34
- }) }) })] }), _jsxs("div", { className: "mt-xl rounded-md border border-border-primary bg-bg-tertiary px-3.5 py-xl text-text-secondary-700 lg:mt-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: ["Wagering", !Number.isNaN(Number(bonus.currentTurnoverRequirementContributionPercentage)) && _jsxs("p", { children: [bonus.currentTurnoverRequirementContributionPercentage, "%"] }), _jsxs("p", { children: [currentTurnoverRequirementContribution, "/", turnoverRequirement] })] }), _jsx(Progress.Root, { className: "mt-2", min: 0, max: turnoverRequirement, value: clamp(currentTurnoverRequirementContribution, 0, turnoverRequirement), children: _jsx(Progress.Track, { children: _jsx(Progress.Range, {}) }) })] }), _jsxs(Collapsible.Root, { className: "mt-xl lg:mt-6", children: [_jsxs(Collapsible.Trigger, { className: 'flex w-full items-center justify-center gap-sm font-semibold text-button-tertiary-fg text-sm sm:justify-start', children: ["Game Provider Contribution", _jsx(Collapsible.Indicator, { asChild: true, children: _jsx(ChevronRightIcon, { className: "size-5" }) })] }), _jsx(Collapsible.Content, { className: "mt-xl space-y-1.5 rounded-md border border-border-primary bg-bg-tertiary px-3.5 py-xl text-text-secondary-700 lg:mt-6", children: Object.entries(bonus.promo
34
+ }) }) })] }), _jsxs("div", { className: "mt-xl rounded-md border border-border-primary bg-bg-tertiary px-3.5 py-xl text-text-secondary-700 lg:mt-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: ["Wagering", !Number.isNaN(Number(bonus.currentTurnoverRequirementContributionPercentage)) && _jsxs("p", { children: [bonus.currentTurnoverRequirementContributionPercentage, "%"] }), _jsxs("p", { children: [currentTurnoverRequirementContribution, "/", turnoverRequirement] })] }), _jsx(Progress.Root, { className: "mt-2", min: 0, max: turnoverRequirement, value: clamp(currentTurnoverRequirementContribution, 0, turnoverRequirement), children: _jsx(Progress.Track, { children: _jsx(Progress.Range, {}) }) })] }), _jsxs(Collapsible.Root, { className: "mt-xl lg:mt-6", children: [_jsxs(Collapsible.Trigger, { className: "flex w-full items-center justify-center gap-sm font-semibold text-button-tertiary-fg text-sm sm:justify-start", children: ["Game Provider Contribution", _jsx(Collapsible.Indicator, { asChild: true, children: _jsx(ChevronRightIcon, { className: "size-5" }) })] }), _jsx(Collapsible.Content, { className: "mt-xl space-y-1.5 rounded-md border border-border-primary bg-bg-tertiary px-3.5 py-xl text-text-secondary-700 lg:mt-6", children: Object.entries(bonus.promo
35
35
  .turnoverRequirementContributionPercentagePerGameProvider ?? {})
36
- .filter(([provider, valueAsString]) => gameProviders.includes(provider) && valueAsString !== "0")
36
+ .filter(([provider, valueAsString]) => gameProviders.includes(provider) &&
37
+ valueAsString !== '0')
37
38
  .map(([provider, valueAsString]) => {
38
39
  const value = parseDecimal(valueAsString, 0);
39
40
  return (_jsxs("div", { className: "flex items-center justify-between gap-md", children: [_jsx("p", { className: "w-[11.25rem] shrink-0", children: capitalize(provider, {
@@ -48,7 +48,7 @@ export function Promo__client(props) {
48
48
  return (_jsxs("div", { className: classNames.root, children: [_jsxs(Link, { href: props.viewAllPromosUrl ?? '/promos', className: "flex w-fit items-center gap-lg font-semibold text-button-tertiary-fg text-lg", children: [_jsx(ChevronLeftIcon, { className: "size-6" }), "Back to all Promotions"] }), promo.banner.url && (_jsx(Image, { src: promo.banner.url, alt: "", width: 1024, height: 600, priority: true, unoptimized: true, className: "mt-xl h-auto w-full rounded-xl lg:mt-6" })), claimable && (_jsx(Button, { className: "mt-xl lg:mt-6", onClick: () => {
49
49
  globalStore.depositWithdrawal.setOpen(true);
50
50
  globalStore.depositWithdrawal.setPromo(promo.id);
51
- }, children: "Deposit Now" })), _jsx("h1", { className: "mt-xl font-semibold text-2xl lg:mt-6 lg:text-3xl", children: promo.name }), _jsxs("p", { className: "mt-xl text-text-secondary-700 lg:mt-6", children: ["Ends", ' ', format(promo.activationEndDateTime, 'MM/dd/yyy hh:mm:ss', {
51
+ }, children: "Deposit Now" })), _jsx("h1", { className: "mt-xl font-semibold text-2xl lg:mt-6 lg:text-3xl", children: promo.name }), _jsxs("p", { className: "mt-xl text-text-secondary-700 lg:mt-6", children: ["Ends", ' ', format(promo.daysToClear, 'MM/dd/yyy hh:mm:ss', {
52
52
  in: tz(localeInfo.timezone),
53
53
  })] }), _jsx(Prose, { className: twMerge('mt-2xl lg:mt-6', classNames.promoDescription), dangerouslySetInnerHTML: { __html: descriptionHtml } })] }));
54
54
  }
@@ -1,15 +1,17 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { endOfDay } from 'date-fns';
2
+ import { useMemo } from 'react';
3
3
  import { useRemainingTime } from '../../client/hooks/useRemainingTime.js';
4
4
  import { ClockStopWatchIcon } from '../../icons/ClockStopWatchIcon.js';
5
5
  import { Badge } from '../../ui/Badge/index.js';
6
6
  import { useQuestContext } from './QuestsContext.js';
7
7
  export function RemainingTime({ endOfDay: useEndOfDay = false, className, }) {
8
8
  const quest = useQuestContext();
9
- const targetDateTime = useEndOfDay
10
- ? endOfDay(new Date(quest.endDateTime)).toISOString()
11
- : quest.endDateTime;
12
- const remainingTime = useRemainingTime(targetDateTime);
9
+ const targetDate = useMemo(() => {
10
+ const date = new Date(quest.dateTimeCreated);
11
+ date.setDate(date.getDate() + Number(quest.daysToClear ?? 0));
12
+ return date;
13
+ }, [quest.dateTimeCreated, quest.daysToClear]);
14
+ const remainingTime = useRemainingTime(targetDate);
13
15
  if (quest.status === 'COMPLETED') {
14
16
  return (_jsx(Badge.Root, { size: "lg", colorScheme: "success", round: false, className: className?.completedBadgeRoot, children: _jsx(Badge.Label, { className: className?.completedBadgeLabel, children: "Completed" }) }));
15
17
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opexa/portal-components",
3
- "version": "0.0.1072",
3
+ "version": "0.0.1074",
4
4
  "exports": {
5
5
  "./ui/*": {
6
6
  "types": "./dist/ui/*/index.d.ts",