@opexa/portal-components 0.0.897 → 0.0.898

package/dist/components/KYC/KYCNonPagCor/IdentityVerification.js

@@ -2,6 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Capacitor } from '@capacitor/core';
 import { zodResolver } from '@hookform/resolvers/zod';
+import { ObjectId } from '@opexa/object-id';
 import { useRouter } from 'next/navigation';
 import { useEffect } from 'react';
 import { Controller, useForm } from 'react-hook-form';
@@ -16,6 +17,7 @@ import { useSignOutMutation } from '../../../client/hooks/useSignOutMutation.js'
 import { useUpdateMemberVerificationMutation } from '../../../client/hooks/useUpdateMemberVerificationMutation.js';
 import { getSession } from '../../../client/services/getSession.js';
 import { toaster } from '../../../client/utils/toaster.js';
+import { ObjectType } from '../../../services/ObjectType.js';
 import { unregisterFCMDevice } from '../../../services/trigger.js';
 import { Button } from '../../../ui/Button/index.js';
 import { Dialog } from '../../../ui/Dialog/index.js';
@@ -106,6 +108,7 @@ export function IdentityVerification() {
         },
     });
     async function onSubmit(values) {
+        //if member verification id is not available (first time doing kyc to trigger notifications)
         if (!memberId) {
             createMemberVerification({
                 selfieImage: values.selfieImage,
@@ -117,7 +120,10 @@ export function IdentityVerification() {
                 placeOfBirth: '',
                 sourceOfIncome: '',
             });
+            const id = ObjectId.generate(ObjectType.MemberVerification).toString();
+            await approveMemberVerificationMutation.mutateAsync(id);
         }
+        //if member verification id is available (updating kyc)
         else {
             updateMemberVerification({
                 id: memberId,

package/dist/components/Quests/JourneyQuest.d.ts

@@ -1,9 +1,19 @@
 import { type CSSProperties } from 'react';
 export interface ClassNameEntries {
     root?: string;
+    completedBadgeRoot?: string;
+    completedBadgeLabel?: string;
+    failedBadgeRoot?: string;
+    failedBadgeLabel?: string;
+    progressRoot?: string;
+    progressTrack?: string;
+    progressRange?: string;
+    progressLabel?: string;
     checkboxName?: string;
     checkboxBonus?: string;
     dialogRoot?: string;
+    dialogTitle?: string;
+    dialogDescription?: string;
     dialogMilestone?: string;
     dialogMilestoneName?: string;
     dialogMilestoneDescription?: string;

package/dist/components/Quests/JourneyQuest.js

@@ -85,13 +85,20 @@ export function JourneyQuest(props) {
         disclosure.setOpen(true);
     }, [disclosure]);
     const localeInfo = useLocaleInfo();
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: twMerge('flex h-full w-full flex-col space-y-6 rounded-2xl border border-border-primary bg-bg-tertiary px-4 pt-5 pb-6', classNames?.root), children: [_jsxs("div", { className: "flex flex-col space-y-2", children: [_jsxs("div", { className: "flex max-h-7.5 items-center justify-between", children: [_jsx(RemainingTime, { endOfDay: true }), quest.status === 'COMPLETED' && (_jsx(Badge.Root, { colorScheme: "success", size: "lg", round: false, children: _jsxs(Badge.Label, { children: ["Final Bonus:", ' ', formatNumber(quest.bonus, {
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: twMerge('flex h-full w-full flex-col space-y-6 rounded-2xl border border-border-primary bg-bg-tertiary px-4 pt-5 pb-6', classNames?.root), children: [_jsxs("div", { className: "flex flex-col space-y-2", children: [_jsxs("div", { className: "flex max-h-7.5 items-center justify-between", children: [_jsx(RemainingTime, { endOfDay: true, className: {
+                                            completedBadgeRoot: classNames?.completedBadgeRoot,
+                                            completedBadgeLabel: classNames?.completedBadgeLabel,
+                                            failedBadgeRoot: classNames?.failedBadgeRoot,
+                                            failedBadgeLabel: classNames?.failedBadgeLabel,
+                                        } }), quest.status === 'COMPLETED' && (_jsx(Badge.Root, { colorScheme: "success", size: "lg", round: false, children: _jsxs(Badge.Label, { children: ["Final Bonus:", ' ', formatNumber(quest.bonus, {
                                                     currency: localeInfo.currency.code,
-                                                })] }) }))] }), _jsx("p", { className: "font-semibold text-xl", children: quest?.name || 'Journey Quest' }), _jsxs("div", { className: "flex w-full items-center space-x-2", children: [_jsx(Progress.Root, { max: 100, className: "h-2 rounded-full bg-bg-primary", value: progressValue, children: _jsx(Progress.Track, { children: _jsx(Progress.Range, {}) }) }), _jsxs("p", { className: "text-text-quarterary-brand text-xs", children: [currentMilestone, "/", totalMilestones] })] }), _jsx("div", { className: "flex w-full flex-col space-y-3", children: milestones.map((milestone, index) => (_jsx(QuestMilestone, { label: milestone.label, bonus: milestone.bonus, isCompleted: milestone.isCompleted, checkboxControlStyle: props.checkboxControlStyle, className: {
+                                                })] }) }))] }), _jsx("p", { className: "font-semibold text-xl", children: quest?.name || 'Journey Quest' }), _jsxs("div", { className: "flex w-full items-center space-x-2", children: [_jsx(Progress.Root, { max: 100, className: twMerge('h-2 rounded-full bg-bg-primary', classNames?.progressRoot), value: progressValue, children: _jsx(Progress.Track, { className: classNames?.progressTrack, children: _jsx(Progress.Range, { className: classNames?.progressRange }) }) }), _jsxs("p", { className: twMerge('text-text-quarterary-brand text-xs', classNames?.progressLabel), children: [currentMilestone, "/", totalMilestones] })] }), _jsx("div", { className: "flex w-full flex-col space-y-3", children: milestones.map((milestone, index) => (_jsx(QuestMilestone, { label: milestone.label, bonus: milestone.bonus, isCompleted: milestone.isCompleted, checkboxControlStyle: props.checkboxControlStyle, className: {
                                         name: classNames?.checkboxName,
                                         bonus: classNames?.checkboxBonus,
                                     } }, index))) })] }), _jsx("div", { className: "flex h-full items-end", children: _jsx(Button, { size: "sm", onClick: handleViewDetails, "aria-label": "View Details", disabled: false, className: "disabled:bg-bg-primary disabled:text-text-disabled", children: "View Details" }) })] }), _jsx(Rules, { open: disclosure.open, onOpenChange: disclosure.setOpen, quest: quest, milestones: milestones, className: {
                     root: classNames?.dialogRoot,
+                    title: classNames?.dialogTitle,
+                    description: classNames?.dialogDescription,
                     milestone: classNames?.dialogMilestone,
                     milestoneName: classNames?.dialogMilestoneName,
                     milestoneDescription: classNames?.dialogMilestoneDescription,
@@ -124,9 +131,9 @@ function Rules(props) {
     }, [milestones]);
     const sessionQuery = useSessionQuery();
     const session = sessionQuery.data;
-    return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: open, onOpenChange: (details) => setOpen(details.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 p-4", children: _jsxs(Dialog.Content, { className: twMerge('mx-auto max-h-[80vh] min-h-auto min-w-[21.438rem] max-w-[400px] overflow-y-auto rounded-xl px-4 py-10 md:scrollbar:h-2 md:scrollbar:w-2 md:scrollbar-thumb:rounded-full md:scrollbar-thumb:bg-bg-quaternary md:scrollbar-track:bg-transparent', props.className?.root), children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "group flex flex-col space-y-5 text-sm text-text-quarterary-brand", children: [_jsx("h2", { className: "font-semibold text-lg text-text-primary-900", children: quest?.name || 'Quest' }), _jsxs("div", { className: "relative", children: [_jsx("div", { className: "max-h-[30vh] overflow-y-auto", children: quest?.description ? (_jsx(Prose, { dangerouslySetInnerHTML: {
-                                                        __html: quest.description,
-                                                    }, className: "mb-3" })) : (_jsx("p", { children: "Ready for a challenge? Complete them all and get amazing rewards!" })) }), _jsx("div", { className: "pointer-events-none absolute inset-x-0 bottom-safe-area-inset-bottom h-8 bg-gradient-to-t from-bg-primary to-transparent" })] }), milestones.map((milestone) => {
+    return (_jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: open, onOpenChange: (details) => setOpen(details.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 p-4", children: _jsxs(Dialog.Content, { className: twMerge('mx-auto max-h-[80vh] min-h-auto min-w-[21.438rem] max-w-[400px] overflow-y-auto rounded-xl px-4 py-10 md:scrollbar:h-2 md:scrollbar:w-2 md:scrollbar-thumb:rounded-full md:scrollbar-thumb:bg-bg-quaternary md:scrollbar-track:bg-transparent', props.className?.root), children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "group flex flex-col space-y-5 text-sm text-text-quarterary-brand", children: [_jsx("h2", { className: twMerge('font-semibold text-lg text-text-primary-900', props.className?.title), children: quest?.name || 'Quest' }), _jsx("div", { className: "relative", children: _jsx("div", { className: "max-h-[30vh] overflow-y-auto", children: quest?.description ? (_jsx(Prose, { dangerouslySetInnerHTML: {
+                                                    __html: quest.description,
+                                                }, className: twMerge('mb-3', props.className?.description) })) : (_jsx("p", { className: twMerge(props.className?.description), children: "Ready for a challenge? Complete them all and get amazing rewards!" })) }) }), milestones.map((milestone) => {
                                         const milestoneType = quest?.milestones?.find((m) => m.id === milestone.id)?.type;
                                         const accountVerificationMessage = milestoneType === 'ACCOUNT_VERIFICATION'
                                             ? verificationStatus === 'PENDING'

package/dist/components/Quests/RemainingTime.d.ts

@@ -1,5 +1,11 @@
 interface RemainingTimeProps {
     endOfDay?: boolean;
+    className?: {
+        completedBadgeRoot?: string;
+        completedBadgeLabel?: string;
+        failedBadgeRoot?: string;
+        failedBadgeLabel?: string;
+    };
 }
-export declare function RemainingTime({ endOfDay: useEndOfDay, }: RemainingTimeProps): import("react/jsx-runtime").JSX.Element;
+export declare function RemainingTime({ endOfDay: useEndOfDay, className, }: RemainingTimeProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Quests/RemainingTime.js

@@ -4,17 +4,17 @@ import { useRemainingTime } from '../../client/hooks/useRemainingTime.js';
 import { ClockStopWatchIcon } from '../../icons/ClockStopWatchIcon.js';
 import { Badge } from '../../ui/Badge/index.js';
 import { useQuestContext } from './QuestsContext.js';
-export function RemainingTime({ endOfDay: useEndOfDay = false, }) {
+export function RemainingTime({ endOfDay: useEndOfDay = false, className, }) {
     const quest = useQuestContext();
     const targetDateTime = useEndOfDay
         ? endOfDay(new Date(quest.endDateTime)).toISOString()
         : quest.endDateTime;
     const remainingTime = useRemainingTime(targetDateTime);
     if (quest.status === 'COMPLETED') {
-        return (_jsx(Badge.Root, { size: "lg", colorScheme: "success", round: false, children: _jsx(Badge.Label, { children: "Completed" }) }));
+        return (_jsx(Badge.Root, { size: "lg", colorScheme: "success", round: false, className: className?.completedBadgeRoot, children: _jsx(Badge.Label, { className: className?.completedBadgeLabel, children: "Completed" }) }));
     }
     if (quest.status === 'FAILED' || remainingTime.expired) {
-        return (_jsx(Badge.Root, { size: "lg", colorScheme: "danger", round: false, children: _jsx(Badge.Label, { children: "Failed" }) }));
+        return (_jsx(Badge.Root, { size: "lg", colorScheme: "danger", round: false, className: className?.failedBadgeRoot, children: _jsx(Badge.Label, { className: className?.failedBadgeLabel, children: "Failed" }) }));
     }
     return (_jsxs(Badge.Root, { size: "lg", colorScheme: "brand", round: false, children: [_jsx(Badge.Icon, { children: _jsx(ClockStopWatchIcon, {}) }), _jsx(Badge.Label, { children: remainingTime.toString() })] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@opexa/portal-components",
-	"version": "0.0.897",
+	"version": "0.0.898",
 	"exports": {
 		"./ui/*": {
 			"types": "./dist/ui/*/index.d.ts",