Skip to content

S
sweepstake
Commit b01ec1f2 by Arjun Jhukal
Options

updated the minor changes

parent 3f60ac1c
Showing with 142 additions and 15 deletions
src/components/organism/dialog/AgeGate.tsx
......@@ -27,6 +27,7 @@ export default function AgeGate() {
key: process.env.NEXT_PUBLIC_AGE_CHECKER_KEY,
mode: "manual",
autoload: true,
show_close: true,
onready: () => {
(window as any).AgeCheckerAPI.show(uuid);
},
......@@ -35,6 +36,10 @@ export default function AgeGate() {
handleSuccess(verification.uuid);
}
},
onpagehide: () => {
(window as any).AgeCheckerAPI.close();
// Optional: Handle page hide if needed
}
};
// 3. Now load the script
......
src/components/pages/auth/register/index.tsx
......@@ -65,11 +65,11 @@ const validationSchema = Yup.object().shape({
.email('Must be a valid email')
.max(255)
.required('Email is required'),
displayName: Yup.string()
.required("Display Name is required")
.max(14, "Display Name must be less than 14 characters")
.min(6, "Display Name must be at least 6 characters long")
.matches(/^\S+$/, "Display Name cannot contain spaces"),
// displayName: Yup.string()
// .required("Display Name is required")
// .max(14, "Display Name must be less than 14 characters")
// .min(6, "Display Name must be at least 6 characters long")
// .matches(/^\S+$/, "Display Name cannot contain spaces"),
phone: Yup.string()
.required("Phone number is required"),
password: Yup.string()
......@@ -94,7 +94,7 @@ const validationSchema = Yup.object().shape({
first_name: Yup.string().required('First name is required'),
middle_name: Yup.string(),
last_name: Yup.string().required('Last name is required'),
photoid_number: Yup.string().required('Photo ID is required'),
// photoid_number: Yup.string().required('Photo ID is required'),
city: Yup.string(),
pob: Yup.string().required('Place of birth is required'),
agree: Yup.boolean().required().oneOf([true], 'You must agree to the terms and conditions'),
......@@ -160,7 +160,7 @@ export default function RegisterPage() {
password: "",
confirmPassword: "",
phone: "",
photoid_number: '',
// photoid_number: '',
dob: null as Dayjs | null,
city: '',
pob: '',
......@@ -190,7 +190,7 @@ export default function RegisterPage() {
middle_name: values.middle_name,
last_name: values.last_name,
phone: fullPhoneNumber,
photoid_number: values.photoid_number,
// photoid_number: values.photoid_number,
dob: formattedDob,
city: values.city,
pob: values.pob,
......@@ -332,9 +332,8 @@ export default function RegisterPage() {
{/* Photo ID */}
<div className="col-span-2 lg:col-span-3">
{/* <div className="col-span-2 lg:col-span-3">
<div className="input__field">
{/* <InputLabel htmlFor="photoid_number"></InputLabel> */}
<PasswordField
label='Photo ID Number'
name="photoid_number"
......@@ -345,7 +344,7 @@ export default function RegisterPage() {
/>
<span className="error">{touched.photoid_number && errors.photoid_number}</span>
</div>
</div>
</div> */}
{/* Address */}
<div className="col-span-2 lg:col-span-3">
......
src/components/pages/dashboard/adminDashboard/players/addPlayerForm/AddPlayerForm.tsx
......@@ -3,8 +3,51 @@ import InputFile from '@/components/atom/InputFile';
import PasswordField from '@/components/molecules/PasswordField';
import { PlayerProps, SinlgePlayerResponseProps } from '@/types/player';
import { Button, InputLabel, OutlinedInput } from '@mui/material';
import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers';
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
import dayjs from 'dayjs';
import { FormikProps } from 'formik';
const formFieldSx = {
'& .MuiOutlinedInput-root, & .MuiPickersInputBase-root, & .MuiPickersOutlinedInput-root': {
borderRadius: '27px',
background: 'rgba(118, 107, 120, 0.55)',
color: '#fff',
'& .MuiOutlinedInput-notchedOutline, & .MuiPickersOutlinedInput-notchedOutline': {
border: '0.576px solid rgba(255, 255, 255, 0.04)',
},
'&:hover .MuiOutlinedInput-notchedOutline, &:hover .MuiPickersOutlinedInput-notchedOutline': {
borderColor: 'rgba(255,255,255,0.2)',
},
'&.Mui-focused .MuiOutlinedInput-notchedOutline, &.Mui-focused .MuiPickersOutlinedInput-notchedOutline': {
borderColor: '#B801C0',
},
},
'& .MuiOutlinedInput-input, & .MuiPickersInputBase-input': {
padding: '12px 16px',
color: '#fff',
'&::placeholder': {
color: 'rgba(255, 255, 255, 0.2)',
fontWeight: 300,
fontSize: '12px',
opacity: 1,
},
},
'& .MuiInputAdornment-root': {
marginRight: '8px',
},
'& .MuiInputAdornment-root button': {
color: 'rgba(255, 255, 255, 0.7)',
'&:hover': {
color: '#fff',
background: 'rgba(255, 255, 255, 0.08)',
}
},
'& .MuiIconButton-root': {
padding: '8px',
}
};
export default function AddPlayerForm({ formik, id, data, loading, buttonLabel }: { formik: FormikProps<PlayerProps>, id?: string, data?: SinlgePlayerResponseProps, loading?: boolean, buttonLabel?: string }) {
return (
......@@ -139,6 +182,67 @@ export default function AddPlayerForm({ formik, id, data, loading, buttonLabel }
</span>
</div>
{/* DOB */}
<div className="input__field">
<InputLabel htmlFor="dob">Date of Birth <span className="text-red-500">*</span></InputLabel>
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DatePicker
value={formik.values.dob ? dayjs(formik.values.dob) : null}
onChange={(newValue) => {
formik.setFieldValue('dob', newValue);
}}
onClose={() => formik.setFieldTouched('dob', true)}
slotProps={{
textField: {
fullWidth: true,
id: 'dob',
name: 'dob',
placeholder: 'MM/DD/YYYY',
error: Boolean(formik.touched.dob && formik.errors.dob),
onBlur: formik.handleBlur,
helperText: formik.touched.dob && formik.errors.dob,
sx: formFieldSx
},
popper: {
sx: {
'& .MuiPickersCalendarHeader-label': {
color: '#fff',
},
'& .MuiDayCalendar-weekDayLabel': {
color: '#fff',
},
'& .MuiPickersDay-root': {
color: '#fff',
},
'& .MuiPickersDay-root.Mui-selected': {
backgroundColor: '#B801C0',
},
'& .MuiPickersDay-root:hover': {
backgroundColor: 'rgba(184, 1, 192, 0.3)',
},
'& .MuiPickersArrowSwitcher-button': {
color: '#fff',
},
'& .MuiPickersCalendarHeader-root': {
color: '#fff',
},
'& .MuiPickersDay-root.MuiPickersDay-today': {
backgroundColor: '#B801C0',
border: '1px solid #fff',
'&:not(.Mui-selected)': {
backgroundColor: '#B801C0',
}
},
}
}
}}
maxDate={dayjs()}
format="MM/DD/YYYY"
/>
</LocalizationProvider>
</div>
<div className="input__field">
<PasswordField
name="password"
......
src/components/pages/dashboard/adminDashboard/players/addPlayerForm/index.tsx
......@@ -4,6 +4,7 @@ import { useAppDispatch } from '@/hooks/hook'
import { useCreatePlayerMutation, useGetPlayerByIdQuery, useUpdatePlayerByIdMutation } from '@/services/playerApi'
import { showToast, ToastVariant } from '@/slice/toastSlice'
import { initialPlayerValues } from '@/types/player'
import dayjs, { Dayjs } from 'dayjs'
import { useFormik } from 'formik'
import { useRouter } from 'next/navigation'
import * as Yup from "yup"
......@@ -30,6 +31,14 @@ export const PlayerValidationSchema = (isEdit: boolean) => Yup.object().shape({
then: (schema) => schema.oneOf([Yup.ref("password")], "Passwords must match").required("Password confirmation is required"),
otherwise: (schema) => schema.nullable(),
}),
dob: Yup.date()
.required("Date of birth is required")
.max(new Date(), 'Date of birth cannot be in the future')
.test('age', 'You must be at least 21 years old', function (value) {
if (!value) return true;
const cutoff = dayjs().subtract(21, 'years');
return dayjs(value).isBefore(cutoff);
}),
// profile_image: Yup.mixed().required("Profile is required"),
});
export default function AddPlayerPage({ id }: { id?: string }) {
......@@ -57,6 +66,7 @@ export default function AddPlayerPage({ id }: { id?: string }) {
password: data?.data.password,
password_confirmation: data?.data.password_confirmation,
profile_image: null,
dob: data?.data.dob || null as Dayjs | null,
} : initialPlayerValues,
validationSchema: PlayerValidationSchema(!!id),
enableReinitialize: true,
......@@ -72,6 +82,7 @@ export default function AddPlayerPage({ id }: { id?: string }) {
if (values.address) formData.append("address", values.address);
if (values.city) formData.append("city", values.city);
if (values.phone) formData.append("phone", values.phone);
if (values.dob) formData.append("dob", values.dob.toString());
if (values.profile_image) {
if (Array.isArray(values.profile_image)) {
......
src/components/pages/dashboard/userDashboard/account/profile/editProfile/index.tsx
......@@ -6,6 +6,7 @@ import { useUpdateUserProfileMutation } from '@/services/userApi';
import { setTokens } from '@/slice/authSlice';
import { showToast, ToastVariant } from '@/slice/toastSlice';
import { initialPlayerValues, PlayerItem } from '@/types/player';
import dayjs, { Dayjs } from 'dayjs';
import { useFormik } from 'formik';
export default function EditUserProfile({ id, buttonLabel }: { id: string, buttonLabel?: string; }) {
......@@ -16,7 +17,6 @@ export default function EditUserProfile({ id, buttonLabel }: { id: string, butto
const access_token = useAppSelector((state) => state?.auth.access_token);
const formik = useFormik({
initialValues: user ? {
name: user.name,
......@@ -30,10 +30,12 @@ export default function EditUserProfile({ id, buttonLabel }: { id: string, butto
password: '',
password_confirmation: '',
profile_image: null,
dob: user.dob || null as Dayjs | null,
} : initialPlayerValues,
validationSchema: PlayerValidationSchema(!!user?.id),
validationSchema: PlayerValidationSchema(user?.id ? true : false),
enableReinitialize: true,
onSubmit: async (values) => {
const formattedDob = values.dob ? dayjs(values.dob).format('YYYY-MM-DD') : '';
const formData = new FormData();
formData.append("name", values.name);
formData.append("email", values.email);
......@@ -41,10 +43,12 @@ export default function EditUserProfile({ id, buttonLabel }: { id: string, butto
formData.append("last_name", values.last_name);
formData.append("password", values.password);
formData.append("password_confirmation", values.password_confirmation);
if (values.wallet_address) formData.append("wallet_address", values.wallet_address);
if (values.address) formData.append("address", values.address);
if (values.city) formData.append("city", values.city);
if (values.phone) formData.append("phone", values.phone);
if (values.dob) formData.append("dob", formattedDob);
if (values.profile_image) {
if (Array.isArray(values.profile_image)) {
......@@ -69,7 +73,7 @@ export default function EditUserProfile({ id, buttonLabel }: { id: string, butto
dispatch(
setTokens({
access_token: access_token,
user: response?.data?.data,
user: { ...user, ...response?.data?.data },
}),
);
}
......@@ -103,6 +107,7 @@ export default function EditUserProfile({ id, buttonLabel }: { id: string, butto
total_withdrawl: user.total_withdrawl ?? undefined,
total_deposited: user.total_deposited ?? undefined,
profile_image_file: user.profile_image_file ?? undefined,
dob: user.dob ? dayjs(user.dob).format('YYYY-MM-DD') : undefined,
} as PlayerItem,
}
: undefined;
......
src/types/auth.ts
......@@ -36,7 +36,7 @@ export interface RegisterProps extends LoginProps {
middle_name: string;
last_name: string;
phone: string;
photoid_number: string;
// photoid_number: string;
dob: string;
city: string;
pob: string;
......
src/types/player.ts
import { Dayjs } from "dayjs";
import { Pagination } from "./game";
......@@ -14,6 +15,7 @@ export interface CommonPlayerProps {
password_confirmation: string;
role?: string;
state?: string;
dob?: string | Dayjs | null;
}
export interface PlayerProps extends CommonPlayerProps {
id?: string;
......@@ -37,6 +39,7 @@ export const initialPlayerValues: PlayerProps = {
password: "",
password_confirmation: "",
profile_image: null,
dob: null as Dayjs | null,
};
type GameInformation = {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment