Skip to content

S
sweepstake
Commit ed0ed73d by Arjun Jhukal
Options

fixed the admin and superadmin redirection

parent c3a60610
Showing with 216 additions and 226 deletions
src/components/atom/ChatbotIcon.tsx
...@@ -11,6 +11,10 @@ export default function Chatbot() { ...@@ -11,6 +11,10 @@ export default function Chatbot() {
const isVideo = fileUrl?.toLowerCase().endsWith(".mp4"); const isVideo = fileUrl?.toLowerCase().endsWith(".mp4");
if (!fileUrl || !label) {
return null;
}
return ( return (
<Button <Button
className=" max-w-fit px-8!" className=" max-w-fit px-8!"
......
src/components/molecules/Pagination.tsx
// import React from 'react' "use client";
// export default function Pagination() { import { Pagination as MuiPagination } from "@mui/material";
// return ( export type QueryParams = {
// .pagi pageIndex: number;
// ) pageSize: number;
// } }
type Props = {
qp: QueryParams;
setQp: (qp: QueryParams) => void;
totalPages: number;
};
export default function TablePaginationControls({
qp,
setQp,
totalPages,
}: Props) {
return (
<div className="flex flex-col md:flex-row justify-between items-start md:items-center mt-4 px-8 py-6 gap-4">
<div>
<span>Row per page:</span>
<select
value={qp.pageSize}
onChange={(e) => setQp({ ...qp, pageSize: Number(e.target.value) })}
className="ml-2 border border-gray-300 rounded p-1"
>
{[10, 15, 20, 50, 100].map((size) => (
<option key={size} value={size}>
{size}
</option>
))}
</select>
</div>
<MuiPagination
count={totalPages || 1}
page={qp.pageIndex}
onChange={(_, value) => setQp({ ...qp, pageIndex: value })}
variant="outlined"
shape="rounded"
sx={{ gap: "8px" }}
/>
</div>
);
}
\ No newline at end of file
src/components/molecules/PasswordField.tsx
...@@ -30,7 +30,7 @@ export default function PasswordField({ ...@@ -30,7 +30,7 @@ export default function PasswordField({
const handleClickShowPassword = () => setShowPassword((prev) => !prev); const handleClickShowPassword = () => setShowPassword((prev) => !prev);
const handleMouseDownPassword = (event: React.MouseEvent<HTMLButtonElement>) => event.preventDefault(); const handleMouseDownPassword = (event: React.MouseEvent<HTMLButtonElement>) => event.preventDefault();
return ( return (
<div className="input_field"> <div className="input__field">
<InputLabel htmlFor={name}>{label} {required && <span className="text-red-500">*</span>}</InputLabel> <InputLabel htmlFor={name}>{label} {required && <span className="text-red-500">*</span>}</InputLabel>
<OutlinedInput <OutlinedInput
id={name} id={name}
...@@ -48,9 +48,9 @@ export default function PasswordField({ ...@@ -48,9 +48,9 @@ export default function PasswordField({
onMouseDown={handleMouseDownPassword} onMouseDown={handleMouseDownPassword}
edge="end" edge="end"
color="secondary" color="secondary"
// sx={{ sx={{
// padding: 0, padding: "0 4px",
// }} }}
> >
{showPassword ? <Eye size={16} /> : <EyeSlash size={16} />} {showPassword ? <Eye size={16} /> : <EyeSlash size={16} />}
</IconButton> </IconButton>
......
src/components/organism/Charts/CreditCard.tsx
"use client"; "use client";
import { ApexOptions } from "apexcharts"; import { ApexOptions } from "apexcharts";
import Image from "next/image"; import Image from "next/image";
import React from "react";
import Chart from "react-apexcharts"; import Chart from "react-apexcharts";
const CreditCard = ({ game }: { game: any }) => { const CreditCard = ({ game }: { game: any }) => {
...@@ -35,7 +34,8 @@ const CreditCard = ({ game }: { game: any }) => { ...@@ -35,7 +34,8 @@ const CreditCard = ({ game }: { game: any }) => {
return ( return (
<div className=" rounded-lg p-3 border border-gray"> <div className=" rounded-lg p-3 border border-gray">
<Image src={game?.logo || "/assets/images/auth-image.png"} alt='' width={32} height={32} className='aspect-square rounded-sm' /> <Image src={game?.logo || "/assets/images/auth-image.png"} alt='' width={32} height={32} className='aspect-square rounded-sm' />
<strong className="block text-[16px] leading-[120%] font-[600] tet-title mt-2 mb-3">{game?.name}</strong> <strong className="block text-[16px] leading-[120%] font-[600] text-title my-2">{game?.name}</strong>
{game?.username ? <span className="text-para-light text-[12px] block mb-3">{game?.username || "username"}</span> : ""}
<div className="chart__wrapper mt-2 px-2 py-3" style={{ <div className="chart__wrapper mt-2 px-2 py-3" style={{
background: "rgba(184, 1, 192, 0.10)", background: "rgba(184, 1, 192, 0.10)",
borderRadius: "4px" borderRadius: "4px"
......
src/components/pages/dashboard/adminDashboard/activityLog/Activities.tsx
"use client"; "use client";
import TablePaginationControls from '@/components/molecules/Pagination';
import TableHeader from '@/components/molecules/TableHeader'; import TableHeader from '@/components/molecules/TableHeader';
import CustomTable from '@/components/organism/Table'; import CustomTable from '@/components/organism/Table';
import { useGetAllActivityQuery } from '@/services/notificationApi'; import { useGetAllActivityQuery } from '@/services/notificationApi';
import { StatusOptions } from '@/types/config'; import { StatusOptions } from '@/types/config';
import { ActivityProps } from '@/types/notification'; import { ActivityProps } from '@/types/notification';
import { Box, Pagination } from '@mui/material'; import { Box } from '@mui/material';
import { ColumnDef, getCoreRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table'; import { ColumnDef, getCoreRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table';
import { ArrowDown, ArrowUp } from '@wandersonalwes/iconsax-react'; import { ArrowDown, ArrowUp } from '@wandersonalwes/iconsax-react';
import React, { useMemo } from 'react'; import React, { useMemo } from 'react';
import { TransactionStatusProps } from '../transaction/TransactionTable'; import { TransactionStatusProps } from '../transaction/TransactionTable';
...@@ -23,26 +24,29 @@ export default function Activities() { ...@@ -23,26 +24,29 @@ export default function Activities() {
{ value: 'game_play', label: 'Games' }, { value: 'game_play', label: 'Games' },
{ value: 'profile_update', label: 'Profile Updates' }, { value: 'profile_update', label: 'Profile Updates' },
{ value: 'bonus', label: 'Bonuses' }, { value: 'bonus', label: 'Bonuses' },
{ value: 'user', label: 'User' } { value: 'user', label: 'User' },
{ value: 'payment', label: 'Payment' }
]; ];
const [qp, setQp] = React.useState({
pageIndex: 1,
pageSize: 10,
});
const [search, setSearch] = React.useState(""); const [search, setSearch] = React.useState("");
const [pageIndex, setPageIndex] = React.useState(1);
const [status, setStatus] = React.useState<TransactionStatusProps | undefined>(); const [status, setStatus] = React.useState<TransactionStatusProps | undefined>();
const [pageSize, setPageSize] = React.useState(10);
const [activityType, setActivityType] = React.useState(""); const [activityType, setActivityType] = React.useState("");
const [sorting, setSorting] = React.useState<any>([]); const [sorting, setSorting] = React.useState<any>([]);
// const [download, { isLoading: downloading }] = useStartDownloadMutation(); // const [download, { isLoading: downloading }] = useStartDownloadMutation();
const queryArgs = useMemo( const queryArgs = useMemo(
() => ({ () => ({
pageIndex: pageIndex, pageIndex: qp.pageIndex,
pageSize: pageSize, pageSize: qp.pageSize,
search: search || "", search: search || "",
activity_type: activityType, activity_type: activityType,
status status
}), }),
[pageIndex, pageSize, search, status, activityType] [qp, search, status, activityType]
); );
...@@ -149,15 +153,15 @@ export default function Activities() { ...@@ -149,15 +153,15 @@ export default function Activities() {
state: { sorting }, state: { sorting },
onSortingChange: setSorting, onSortingChange: setSorting,
getCoreRowModel: getCoreRowModel(), getCoreRowModel: getCoreRowModel(),
getPaginationRowModel: getPaginationRowModel(), // getPaginationRowModel: getPaginationRowModel(),
getSortedRowModel: getSortedRowModel(), getSortedRowModel: getSortedRowModel(),
manualPagination: true,
}); });
return ( return (
<div className="border-gray border-solid border-[1px] rounded-[8px] lg:rounded-[16px]"> <div className="border-gray border-solid border-[1px] rounded-[8px] lg:rounded-[16px]">
<TableHeader <TableHeader
search={search} search={search}
setSearch={setSearch} setSearch={setSearch}
filters={[ filters={[
...@@ -169,30 +173,16 @@ export default function Activities() { ...@@ -169,30 +173,16 @@ export default function Activities() {
/> />
<CustomTable <CustomTable
key={`${pageIndex}-${pageSize}-${search}-${activityType}`} key={`${qp.pageIndex}-${qp.pageSize}-${search}-${activityType}`}
table={table} table={table}
loading={isLoading} loading={isLoading}
/> />
<div className="flex flex-col md:flex-row justify-between items-start md:items-center mt-4 px-8 py-6 gap-4"> <TablePaginationControls
<div> qp={qp}
<span>Row per page:</span> setQp={setQp}
<select totalPages={data?.data?.pagination?.total_pages || 1}
value={pageSize} />
onChange={(e) => setPageSize(Number(e.target.value))}
className="ml-2 border border-gray-300 rounded p-1"
>
{[5, 10, 15, 20].map((size) => (
<option key={size} value={size}>
{size}
</option>
))}
</select>
</div>
<Pagination count={data?.data?.pagination?.total_pages || 1}
page={pageIndex}
onChange={(_, value) => setPageIndex(value)} variant="outlined" shape="rounded" sx={{ gap: "8px" }} />
</div>
</div> </div>
); );
} }
\ No newline at end of file
src/components/pages/dashboard/adminDashboard/pages/index.tsx
"use client"; "use client";
import ActionGroup from '@/components/molecules/Action'; import ActionGroup from '@/components/molecules/Action';
import TablePaginationControls from '@/components/molecules/Pagination';
import TableHeader from '@/components/molecules/TableHeader'; import TableHeader from '@/components/molecules/TableHeader';
import CustomTable from '@/components/organism/Table'; import CustomTable from '@/components/organism/Table';
import { useAppDispatch } from '@/hooks/hook'; import { useAppDispatch } from '@/hooks/hook';
...@@ -8,19 +9,22 @@ import { useDeletePageByIdMutation, useGetAllPageQuery } from '@/services/pageAp ...@@ -8,19 +9,22 @@ import { useDeletePageByIdMutation, useGetAllPageQuery } from '@/services/pageAp
import { showToast, ToastVariant } from '@/slice/toastSlice'; import { showToast, ToastVariant } from '@/slice/toastSlice';
import { PageRequestProps } from '@/types/page'; import { PageRequestProps } from '@/types/page';
import { formatDateTime } from '@/utils/formatDateTime'; import { formatDateTime } from '@/utils/formatDateTime';
import { Checkbox, Pagination } from '@mui/material'; import { Checkbox } from '@mui/material';
import { ColumnDef, getCoreRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table'; import { ColumnDef, getCoreRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table';
import { useMemo, useState } from 'react'; import { useMemo, useState } from 'react';
export default function GeneralPageLiting() { export default function GeneralPageLiting() {
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const [search, setSearch] = useState(""); const [search, setSearch] = useState("");
const [sorting, setSorting] = useState<{ id: string; desc: boolean }[]>([]); const [sorting, setSorting] = useState<{ id: string; desc: boolean }[]>([]);
const [pageIndex, setPageIndex] = useState(1); const [qp, setQp] = useState({
const [pageSize, setPageSize] = useState(10); pageIndex: 1,
pageSize: 10,
});
const { data, isLoading: loadingPages } = useGetAllPageQuery({ const { data, isLoading: loadingPages } = useGetAllPageQuery({
pageIndex: pageIndex, pageIndex: qp.pageIndex,
pageSize: pageSize, pageSize: qp.pageSize,
search: search || "" search: search || ""
}); });
const [deletePage] = useDeletePageByIdMutation(); const [deletePage] = useDeletePageByIdMutation();
...@@ -106,8 +110,9 @@ export default function GeneralPageLiting() { ...@@ -106,8 +110,9 @@ export default function GeneralPageLiting() {
state: { sorting }, state: { sorting },
onSortingChange: setSorting, onSortingChange: setSorting,
getCoreRowModel: getCoreRowModel(), getCoreRowModel: getCoreRowModel(),
getPaginationRowModel: getPaginationRowModel(), // getPaginationRowModel: getPaginationRowModel(),
getSortedRowModel: getSortedRowModel(), getSortedRowModel: getSortedRowModel(),
manualPagination: true,
}) })
return ( return (
...@@ -122,25 +127,11 @@ export default function GeneralPageLiting() { ...@@ -122,25 +127,11 @@ export default function GeneralPageLiting() {
table={table} table={table}
loading={loadingPages} loading={loadingPages}
/> />
<div className="flex flex-col md:flex-row justify-between items-start md:items-center mt-4 px-8 py-6 gap-4"> <TablePaginationControls
<div> qp={qp}
<span>Row per page:</span> setQp={setQp}
<select totalPages={data?.data?.pagination?.total_pages || 1}
value={pageSize} />
onChange={(e) => setPageSize(Number(e.target.value))}
className="ml-2 border border-gray-300 rounded p-1"
>
{[5, 10, 15, 20].map((size) => (
<option key={size} value={size}>
{size}
</option>
))}
</select>
</div>
<Pagination count={data?.data?.pagination?.total_pages || 1}
page={pageIndex}
onChange={(_, value) => setPageIndex(value)} variant="outlined" shape="rounded" sx={{ gap: "8px" }} />
</div>
</div> </div>
</section> </section>
) )
......
src/components/pages/dashboard/adminDashboard/players/LatestRegisteredPlayer.tsx
...@@ -8,11 +8,13 @@ import { ColumnDef, getCoreRowModel, useReactTable } from '@tanstack/react-table ...@@ -8,11 +8,13 @@ import { ColumnDef, getCoreRowModel, useReactTable } from '@tanstack/react-table
import { useMemo, useState } from 'react'; import { useMemo, useState } from 'react';
export default function LatestRegisteredPlayer() { export default function LatestRegisteredPlayer() {
const [pageIndex, _setPageIndex] = useState(1); const [qp, _setQp] = useState({
const [pageSize, _setPageSize] = useState(6); pageIndex: 1,
pageSize: 10,
});
const { data, isLoading: loadingPlayer } = useGetAllPlayerQuery({ const { data, isLoading: loadingPlayer } = useGetAllPlayerQuery({
pageIndex, pageIndex: qp.pageIndex,
pageSize, pageSize: qp.pageSize,
}); });
const columns = useMemo<ColumnDef<PlayerItem>[]>(() => [ const columns = useMemo<ColumnDef<PlayerItem>[]>(() => [
......
src/components/pages/dashboard/adminDashboard/players/addPlayerForm/AddPlayerForm.tsx
...@@ -10,43 +10,14 @@ import dayjs from 'dayjs'; ...@@ -10,43 +10,14 @@ import dayjs from 'dayjs';
import { FormikProps } from 'formik'; import { FormikProps } from 'formik';
const formFieldSx = { const formFieldSx = {
'& .MuiOutlinedInput-root, & .MuiPickersInputBase-root, & .MuiPickersOutlinedInput-root': { "&& .MuiPickersInputBase-input": {
borderRadius: '27px', borderRadius: "8px !important",
background: 'rgba(118, 107, 120, 0.55)', padding: "10px 0px !important",
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', "&& .MuiPickersSectionList-root": {
color: '#fff', padding: "4px 16px 4px 0 !important",
'&::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 }) { export default function AddPlayerForm({ formik, id, data, loading, buttonLabel }: { formik: FormikProps<PlayerProps>, id?: string, data?: SinlgePlayerResponseProps, loading?: boolean, buttonLabel?: string }) {
...@@ -194,7 +165,6 @@ export default function AddPlayerForm({ formik, id, data, loading, buttonLabel } ...@@ -194,7 +165,6 @@ export default function AddPlayerForm({ formik, id, data, loading, buttonLabel }
value={formik.values.pob} value={formik.values.pob}
onChange={formik.handleChange} onChange={formik.handleChange}
onBlur={formik.handleBlur} onBlur={formik.handleBlur}
sx={formFieldSx}
renderValue={(selected) => renderValue={(selected) =>
selected === "" ? "Select a State" : selected selected === "" ? "Select a State" : selected
} }
...@@ -249,39 +219,7 @@ export default function AddPlayerForm({ formik, id, data, loading, buttonLabel } ...@@ -249,39 +219,7 @@ export default function AddPlayerForm({ formik, id, data, loading, buttonLabel }
helperText: formik.touched.dob && formik.errors.dob, helperText: formik.touched.dob && formik.errors.dob,
sx: formFieldSx 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()} maxDate={dayjs()}
format="MM/DD/YYYY" format="MM/DD/YYYY"
......
src/components/pages/dashboard/adminDashboard/players/index.tsx
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
import CustomSwitch from '@/components/atom/Switch'; import CustomSwitch from '@/components/atom/Switch';
import ActionGroup from '@/components/molecules/Action'; import ActionGroup from '@/components/molecules/Action';
import TablePaginationControls from '@/components/molecules/Pagination';
import TabController from '@/components/molecules/TabController'; import TabController from '@/components/molecules/TabController';
import TableHeader from '@/components/molecules/TableHeader'; import TableHeader from '@/components/molecules/TableHeader';
import CustomTable from '@/components/organism/Table'; import CustomTable from '@/components/organism/Table';
...@@ -13,20 +14,22 @@ import { showToast, ToastVariant } from '@/slice/toastSlice'; ...@@ -13,20 +14,22 @@ import { showToast, ToastVariant } from '@/slice/toastSlice';
import { PlayerItem } from '@/types/player'; import { PlayerItem } from '@/types/player';
import { formatDateTime } from '@/utils/formatDateTime'; import { formatDateTime } from '@/utils/formatDateTime';
import { getInitials } from '@/utils/getInitials'; import { getInitials } from '@/utils/getInitials';
import { Box, Checkbox, Pagination } from '@mui/material'; import { Box, Checkbox } from '@mui/material';
import { ColumnDef, getCoreRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table'; import { ColumnDef, getCoreRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table';
import React, { useMemo, useState } from 'react'; import React, { useMemo, useState } from 'react';
export default function PlayerListing() { export default function PlayerListing() {
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const [search, setSearch] = useState(""); const [search, setSearch] = useState("");
const [sorting, setSorting] = useState<{ id: string; desc: boolean }[]>([]); const [sorting, setSorting] = useState<{ id: string; desc: boolean }[]>([]);
const [pageIndex, setPageIndex] = useState(1); const [qp, setQp] = useState({
const [pageSize, setPageSize] = useState(10); pageIndex: 1,
pageSize: 10,
});
const [currentTab, setCurrentTab] = React.useState(""); const [currentTab, setCurrentTab] = React.useState("");
const { data, isLoading: loadingPlayer } = useGetAllPlayerQuery({ const { data, isLoading: loadingPlayer } = useGetAllPlayerQuery({
pageIndex: pageIndex, pageIndex: qp.pageIndex,
pageSize: pageSize, pageSize: qp.pageSize,
search: search || "", search: search || "",
status: currentTab || "" status: currentTab || ""
}); });
...@@ -180,30 +183,17 @@ export default function PlayerListing() { ...@@ -180,30 +183,17 @@ export default function PlayerListing() {
), ),
}, },
], []); ], []);
// const table = useReactTable({
// data: data?.data?.data || [],
// columns,
// state: {
// sorting,
// },
// onSortingChange: setSorting,
// getCoreRowModel: getCoreRowModel(),
// getPaginationRowModel: getPaginationRowModel(),
// getSortedRowModel: getSortedRowModel(),
// })
const table = useReactTable({ const table = useReactTable({
data: data?.data?.data || [], data: data?.data?.data || [],
columns, columns,
state: { state: {
sorting, sorting,
}, },
onSortingChange: setSorting, onSortingChange: setSorting,
getCoreRowModel: getCoreRowModel(), getCoreRowModel: getCoreRowModel(),
getSortedRowModel: getSortedRowModel(), getSortedRowModel: getSortedRowModel(),
getPaginationRowModel: getPaginationRowModel(), manualPagination: true,
}); });
...@@ -262,25 +252,11 @@ export default function PlayerListing() { ...@@ -262,25 +252,11 @@ export default function PlayerListing() {
table={table} table={table}
loading={loadingPlayer} loading={loadingPlayer}
/> />
<div className="flex flex-col md:flex-row justify-between items-start md:items-center mt-4 px-8 py-6 gap-4"> <TablePaginationControls
<div> qp={qp}
<span>Row per page:</span> setQp={setQp}
<select totalPages={data?.data?.pagination?.total_pages || 1}
value={pageSize} />
onChange={(e) => setPageSize(Number(e.target.value))}
className="ml-2 border border-gray-300 rounded p-1"
>
{[5, 10, 15, 20].map((size) => (
<option key={size} value={size}>
{size}
</option>
))}
</select>
</div>
<Pagination count={data?.data?.pagination?.total_pages || 1}
page={pageIndex}
onChange={(_, value) => setPageIndex(value)} variant="outlined" shape="rounded" sx={{ gap: "8px" }} />
</div>
</div> </div>
</section> </section>
) )
......
src/components/pages/dashboard/adminDashboard/players/playerDetail/index.tsx
...@@ -198,6 +198,7 @@ export default function PlayerDetailPage({ id }: { id: number }) { ...@@ -198,6 +198,7 @@ export default function PlayerDetailPage({ id }: { id: number }) {
percentage: info.percentage, percentage: info.percentage,
logo: info.game_logo, logo: info.game_logo,
type: info.type, type: info.type,
username: info.name
}; };
return ( return (
......
src/components/pages/dashboard/adminDashboard/transaction/TransactionTable.tsx
"use client"; "use client";
import SortableHeader from '@/components/atom/SortableHeader'; import SortableHeader from '@/components/atom/SortableHeader';
import TablePaginationControls from '@/components/molecules/Pagination';
import TableHeader from '@/components/molecules/TableHeader'; import TableHeader from '@/components/molecules/TableHeader';
import CustomTable from '@/components/organism/Table'; import CustomTable from '@/components/organism/Table';
import { useAppDispatch } from '@/hooks/hook'; import { useAppDispatch } from '@/hooks/hook';
...@@ -11,11 +12,10 @@ import { StatusOptions } from '@/types/config'; ...@@ -11,11 +12,10 @@ import { StatusOptions } from '@/types/config';
import { SingleDepositProps } from '@/types/transaction'; import { SingleDepositProps } from '@/types/transaction';
import { formatDateTime } from '@/utils/formatDateTime'; import { formatDateTime } from '@/utils/formatDateTime';
import { getInitials } from '@/utils/getInitials'; import { getInitials } from '@/utils/getInitials';
import { Box, Pagination } from '@mui/material'; import { Box } from '@mui/material';
import { import {
ColumnDef, ColumnDef,
getCoreRowModel, getCoreRowModel,
getPaginationRowModel,
getSortedRowModel, getSortedRowModel,
useReactTable useReactTable
} from '@tanstack/react-table'; } from '@tanstack/react-table';
...@@ -29,8 +29,10 @@ export default function TransactionTable({ user_id, game_id, search, setSearch } ...@@ -29,8 +29,10 @@ export default function TransactionTable({ user_id, game_id, search, setSearch }
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const [sorting, setSorting] = useState<{ id: string; desc: boolean }[]>([]); const [sorting, setSorting] = useState<{ id: string; desc: boolean }[]>([]);
const [pageIndex, setPageIndex] = useState(1); const [qp, setQp] = useState({
const [pageSize, setPageSize] = useState(10); pageIndex: 1,
pageSize: 10,
});
// const [rowSelection, setRowSelection] = useState({}); // const [rowSelection, setRowSelection] = useState({});
const [status, setStatus] = React.useState<TransactionStatusProps | undefined>(); const [status, setStatus] = React.useState<TransactionStatusProps | undefined>();
const [selectedGame, setSelectedGame] = React.useState(""); const [selectedGame, setSelectedGame] = React.useState("");
...@@ -42,8 +44,8 @@ export default function TransactionTable({ user_id, game_id, search, setSearch } ...@@ -42,8 +44,8 @@ export default function TransactionTable({ user_id, game_id, search, setSearch }
const queryArgs = useMemo( const queryArgs = useMemo(
() => ({ () => ({
pageIndex, pageIndex: qp.pageIndex,
pageSize, pageSize: qp.pageSize,
search: search || "", search: search || "",
game_id, game_id,
user_id, user_id,
...@@ -53,7 +55,7 @@ export default function TransactionTable({ user_id, game_id, search, setSearch } ...@@ -53,7 +55,7 @@ export default function TransactionTable({ user_id, game_id, search, setSearch }
start_date: customRange.startDate, start_date: customRange.startDate,
end_date: customRange.endDate end_date: customRange.endDate
}), }),
[pageIndex, pageSize, search, game_id, user_id, status, selectedGame, selectedTransactionType, customRange] [qp, search, game_id, user_id, status, selectedGame, selectedTransactionType, customRange]
); );
const { data, isLoading: loadingTransaction } = useGetAllTransactionQuery(queryArgs); const { data, isLoading: loadingTransaction } = useGetAllTransactionQuery(queryArgs);
...@@ -139,9 +141,10 @@ export default function TransactionTable({ user_id, game_id, search, setSearch } ...@@ -139,9 +141,10 @@ export default function TransactionTable({ user_id, game_id, search, setSearch }
// enableRowSelection: true, // enableRowSelection: true,
onSortingChange: setSorting, onSortingChange: setSorting,
getCoreRowModel: getCoreRowModel(), getCoreRowModel: getCoreRowModel(),
getPaginationRowModel: getPaginationRowModel(), // getPaginationRowModel: getPaginationRowModel(),
getSortedRowModel: getSortedRowModel(), getSortedRowModel: getSortedRowModel(),
// onRowSelectionChange: setRowSelection, // onRowSelectionChange: setRowSelection,
manualPagination: true,
}); });
const { data: games } = useGetAllGamesQuery(); const { data: games } = useGetAllGamesQuery();
...@@ -222,28 +225,14 @@ export default function TransactionTable({ user_id, game_id, search, setSearch } ...@@ -222,28 +225,14 @@ export default function TransactionTable({ user_id, game_id, search, setSearch }
<> <>
<CustomTable <CustomTable
key={`${pageIndex}-${pageSize}-${search}-${game_id}-${user_id}`} key={`${qp.pageIndex}-${qp.pageSize}-${search}-${game_id}-${user_id}`}
table={table} loading={loadingTransaction} /> table={table} loading={loadingTransaction} />
<div className="flex flex-col md:flex-row justify-between items-start md:items-center mt-4 px-8 py-6 gap-4"> <TablePaginationControls
<div> qp={qp}
<span>Row per page:</span> setQp={setQp}
<select totalPages={data?.data?.pagination?.total_pages || 1}
value={pageSize} />
onChange={(e) => setPageSize(Number(e.target.value))}
className="ml-2 border border-gray-300 rounded p-1"
>
{[5, 10, 15, 20].map((size) => (
<option key={size} value={size}>
{size}
</option>
))}
</select>
</div>
<Pagination count={data?.data?.pagination?.total_pages || 1}
page={pageIndex}
onChange={(_, value) => setPageIndex(value)} variant="outlined" shape="rounded" sx={{ gap: "8px" }} />
</div>
</> </>
</div> </div>
); );
......
src/components/pages/dashboard/userDashboard/buyCoins/buyCoinSinlgeGame/checkout/FortPay.tsx
...@@ -10,6 +10,7 @@ import { useFormik } from 'formik'; ...@@ -10,6 +10,7 @@ import { useFormik } from 'formik';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import Script from 'next/script'; import Script from 'next/script';
import { useState } from 'react'; import { useState } from 'react';
import * as Yup from 'yup';
import { PaymentModeProps } from '.'; import { PaymentModeProps } from '.';
declare global { declare global {
...@@ -27,16 +28,16 @@ type CardFieldValidity = { ...@@ -27,16 +28,16 @@ type CardFieldValidity = {
cvv: boolean; cvv: boolean;
}; };
// const billingSchema = Yup.object({ const billingSchema = Yup.object({
// fname: Yup.string().required('First name is required'), fname: Yup.string().required('First name is required'),
// lname: Yup.string().required('Last name is required'), lname: Yup.string().required('Last name is required'),
// address1: Yup.string().required('Address is required'), address1: Yup.string().required('Address is required'),
// city: Yup.string().required('City is required'), city: Yup.string().required('City is required'),
// state: Yup.string().required('State is required'), state: Yup.string().required('State is required'),
// zip: Yup.string() zip: Yup.string()
// .required('Zip code is required') .required('Zip code is required')
// .matches(/^\d{5}(-\d{4})?$/, 'Enter a valid zip code'), .matches(/^\d{5}(-\d{4})?$/, 'Enter a valid zip code'),
// }); });
...@@ -62,7 +63,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type: ...@@ -62,7 +63,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type:
state: user?.state || '', state: user?.state || '',
zip: '', zip: '',
}, },
// validationSchema: billingSchema, validationSchema: billingSchema,
onSubmit: () => { onSubmit: () => {
setCardTouched(true); setCardTouched(true);
const allCardValid = cardValidity.ccnumber && cardValidity.ccexp && cardValidity.cvv; const allCardValid = cardValidity.ccnumber && cardValidity.ccexp && cardValidity.cvv;
...@@ -150,7 +151,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type: ...@@ -150,7 +151,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type:
{/* ── Billing fields ── */} {/* ── Billing fields ── */}
<div className="form-group"> <div className="form-group">
<InputLabel htmlFor="name">First Name</InputLabel> <InputLabel htmlFor="name">First Name <span className="text-red-500">*</span></InputLabel>
<OutlinedInput <OutlinedInput
id="fname" id="fname"
...@@ -169,7 +170,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type: ...@@ -169,7 +170,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type:
</div> </div>
<div className="form-group"> <div className="form-group">
<InputLabel htmlFor="name">Last Name</InputLabel> <InputLabel htmlFor="name">Last Name <span className="text-red-500">*</span></InputLabel>
<OutlinedInput <OutlinedInput
id="lname" id="lname"
...@@ -188,7 +189,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type: ...@@ -188,7 +189,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type:
</div> </div>
<div className="form-group"> <div className="form-group">
<InputLabel htmlFor="address1">Address</InputLabel> <InputLabel htmlFor="address1">Address<span className="text-red-500">*</span></InputLabel>
<OutlinedInput <OutlinedInput
id="address1" id="address1"
name="address1" name="address1"
...@@ -206,7 +207,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type: ...@@ -206,7 +207,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type:
</div> </div>
<div className="form-group"> <div className="form-group">
<InputLabel htmlFor="city">City</InputLabel> <InputLabel htmlFor="city">City<span className="text-red-500">*</span></InputLabel>
<OutlinedInput <OutlinedInput
id="city" id="city"
name="city" name="city"
...@@ -224,7 +225,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type: ...@@ -224,7 +225,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type:
</div> </div>
<div className="form-group"> <div className="form-group">
<InputLabel htmlFor="state">State</InputLabel> <InputLabel htmlFor="state">State<span className="text-red-500">*</span></InputLabel>
<OutlinedInput <OutlinedInput
id="state" id="state"
name="state" name="state"
...@@ -242,7 +243,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type: ...@@ -242,7 +243,7 @@ export default function PaymentForm({ id, amount, type }: DepositProps & { type:
</div> </div>
<div className="form-group"> <div className="form-group">
<InputLabel htmlFor="zip">Zip Code</InputLabel> <InputLabel htmlFor="zip">Zip Code<span className="text-red-500">*</span></InputLabel>
<OutlinedInput <OutlinedInput
id="zip" id="zip"
name="zip" name="zip"
......
src/components/pages/dashboard/userDashboard/withdrawl/index.tsx
...@@ -155,7 +155,7 @@ export default function WithdrawlPage({ ...@@ -155,7 +155,7 @@ export default function WithdrawlPage({
}; };
const handleWithdrawClick = (balance: number, provider: string) => { const handleWithdrawClick = (balance: number, provider: string) => {
if (balance < 40 || balance > 400) { if (balance < 10 || balance > 400) {
dispatch( dispatch(
showToast({ showToast({
message: "Withdraw Amount must be at least $40 and below $400", message: "Withdraw Amount must be at least $40 and below $400",
......
src/services/playerApi.ts
...@@ -67,7 +67,6 @@ export const playerApi = createApi({ ...@@ -67,7 +67,6 @@ export const playerApi = createApi({
providesTags: (result, error, { id }) => [{ type: "Players", id }], providesTags: (result, error, { id }) => [{ type: "Players", id }],
}), }),
// UPDATE PLAYER
updatePlayerById: builder.mutation<SinlgePlayerResponseProps, { id: string; body: FormData }>({ updatePlayerById: builder.mutation<SinlgePlayerResponseProps, { id: string; body: FormData }>({
query: ({ id, body }) => ({ query: ({ id, body }) => ({
url: `/api/admin/update-user/${id}`, url: `/api/admin/update-user/${id}`,
......
src/types/player.ts
...@@ -54,6 +54,7 @@ type GameInformation = { ...@@ -54,6 +54,7 @@ type GameInformation = {
game_name: string, game_name: string,
percentage: number, percentage: number,
type: string type: string
name: string;
} }
export interface PlayerItem extends CommonPlayerProps { export interface PlayerItem extends CommonPlayerProps {
id: string; id: string;
......
src/utils/formatDateTime.ts
...@@ -16,3 +16,60 @@ export function formatDateTime(dateString: string | null | undefined) { ...@@ -16,3 +16,60 @@ export function formatDateTime(dateString: string | null | undefined) {
}), }),
}; };
} }
// const NY_TZ = "America/New_York";
// function hasTimezoneInfo(dateString: string): boolean {
// // Ends with Z, or has +HH:MM / -HH:MM offset
// return /Z$|[+-]\d{2}:\d{2}$/.test(dateString);
// }
// function parseAsNYTime(dateString: string): Date {
// // Get current NY UTC offset (handles DST automatically)
// const nowInNY = new Date().toLocaleString("en-US", { timeZone: NY_TZ, timeZoneName: "shortOffset" });
// const offsetMatch = nowInNY.match(/GMT([+-]\d+(?::\d+)?)/);
// const offset = offsetMatch ? offsetMatch[1].padEnd(6, ":00").replace(/^([+-]\d)$/, "$10:00") : "-05:00";
// return new Date(`${dateString}${offset}`);
// }
// export function formatDateTime(dateString: string | null | undefined): { date: string; time: string } {
// if (!dateString) return { date: "", time: "" };
// let dateObj: Date;
// if (hasTimezoneInfo(dateString)) {
// dateObj = new Date(dateString);
// } else {
// dateObj = parseAsNYTime(dateString);
// if (process.env.NODE_ENV === "development") {
// console.warn(
// `[formatDateTime] Naive date string detected: "${dateString}". ` +
// `Treating as NY time. If backend sends UTC, strings should end with "Z".`
// );
// }
// }
// if (isNaN(dateObj.getTime())) {
// if (process.env.NODE_ENV === "development") {
// console.error(`[formatDateTime] Invalid date string: "${dateString}"`);
// }
// return { date: "", time: "" };
// }
// const date = dateObj.toLocaleDateString("en-US", {
// timeZone: NY_TZ,
// day: "2-digit",
// month: "short",
// year: "numeric",
// });
// const time = dateObj.toLocaleTimeString("en-US", {
// timeZone: NY_TZ,
// hour: "2-digit",
// minute: "2-digit",
// });
// return { date, time };
// }
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