Merge branch 'main' into 'ui/slider'

# Conflicts:
#   src/app/globals.css

src/app/(dashboard)/(admin)/pages/page.tsx

 import PageHeader from '@/components/molecules/PageHeader'
+import GeneralPageLiting from '@/components/pages/dashboard/adminDashboard/pages'
 import React from 'react'
 
 export default function AllPages() {
     return (
         <>
             <PageHeader title='All Pages' cta={{ label: "Add New Page", url: "/pages/add-page" }} />
+            <GeneralPageLiting />
         </>
     )
 }

src/app/(dashboard)/(user)/(outsideAuth)/exclusive-games/[id]/loading.tsx

-import React from 'react'
+
+import React from "react";
+import { Box, Skeleton } from "@mui/material";
 
 export default function Loading() {
     return (
-        <div>loading</div>
-    )
+        <section className="detail__banner mb-8 animate-pulse">
+            <div className="grid grid-cols-12 gap-8 lg:gap-20">
+                {/* Left Image Skeleton */}
+                <div className="col-span-12 md:col-span-4">
+                    <Box className="aspect-[420/433] relative rounded-xl overflow-hidden">
+                        <Skeleton variant="rectangular" width="100%" height="100%" sx={{ borderRadius: "12px" }} />
+                    </Box>
+                </div>
+
+                {/* Right Content Skeleton */}
+                <div className="col-span-12 md:col-span-8 flex flex-col gap-4">
+                    {/* Tags */}
+                    <div className="flex gap-4">
+                        <Skeleton variant="rounded" width={120} height={24} />
+                        <Skeleton variant="rounded" width={80} height={24} />
+                    </div>
+
+                    {/* Title */}
+                    <Skeleton variant="text" width="60%" height={40} />
+
+                    {/* Description */}
+                    <Skeleton variant="text" width="100%" height={20} />
+                    <Skeleton variant="text" width="95%" height={20} />
+                    <Skeleton variant="text" width="90%" height={20} />
+
+                    {/* Action Buttons */}
+                    <div className="flex gap-2 flex-wrap">
+                        <Skeleton variant="rounded" width={160} height={50} />
+                        <Skeleton variant="rounded" width={160} height={50} />
+                        <Skeleton variant="rounded" width={160} height={50} />
+                    </div>
+
+                    {/* Play Now Button */}
+                    <Skeleton variant="rounded" width={180} height={45} />
+
+                    {/* Screenshots */}
+                    <div className="grid grid-cols-3 gap-2">
+                        {[1, 2, 3].map((i) => (
+                            <Skeleton key={i} variant="rectangular" height={100} sx={{ borderRadius: "8px" }} />
+                        ))}
+                    </div>
+                </div>
+            </div>
+        </section>
+    );
 }

src/app/(dashboard)/(user)/(outsideAuth)/general/[slug]/page.tsx

+import { getPageDetail } from '@/serverApi/pages';
+import { renderHTML } from '@/utils/RenderHTML';
+import { ArrowRight2 } from '@wandersonalwes/iconsax-react';
+import { notFound, redirect } from 'next/navigation';
+import React from 'react'
+
+export default async function GeneralPage(props: { params: Promise<{ slug: string }> }) {
+    const { slug } = await props.params;
+    let pageData = null;
+    console.log(pageData);
+
+    try {
+        pageData = await getPageDetail(slug);
+    } catch (err) {
+        console.log("❌ Failed to fetch games:", err);
+        return notFound();
+    }
+
+    if (!pageData?.data) {
+        return notFound();
+    }
+    return (
+        <section className="general__page__root">
+            <div className="section__title mb-6">
+                <h1 className='text-[24px] leading-[120%]'>{pageData?.data?.name}</h1>
+            </div>
+            <div className="page__content">
+                <div className="grid grid-cols-12 gap-5">
+                    {/* <div className="col-span-12 md:col-span lg:col-span-3">
+                        {pageData?.data?.content.length ? <div className="rounded-[24px] p-4" style={{
+                            background: "rgba(118, 107, 120, 0.55)"
+                        }}>
+                            <ul>
+                                {pageData.data.content.map((content) => (
+                                    <li key={content.heading}>
+                                        <a href="#" className='text-[14px] font-[500] leading-[120%] py-2 px-3 flex items-center gap-1'><ArrowRight2 size={14} />{content?.heading}</a>
+                                    </li>
+                                ))}
+                            </ul>
+                        </div> : ""}
+                    </div> */}
+                    <div className="col-span-12">
+                        <div className="general-content-box">
+                            {pageData.data.content.map((content) => (
+                                renderHTML(content.description)))}
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+    )
+}

src/app/(dashboard)/(user)/(privateUser)/account/@page/deposit-history/default.tsx

+import DepositHistoryPage from '@/components/pages/dashboard/userDashboard/depositHistory'
+import React from 'react'
+
+export default function DepositHistory() {
+    return (
+        <DepositHistoryPage />
+    )
+}

src/app/(dashboard)/(user)/(privateUser)/account/@page/profile/@section/account/default.tsx

+import AddPlayerPage from '@/components/pages/dashboard/adminDashboard/players/addPlayerForm';
+import AddPlayerForm from '@/components/pages/dashboard/adminDashboard/players/addPlayerForm/AddPlayerForm';
+import EditUserProfile from '@/components/pages/dashboard/userDashboard/account/profile/editProfile';
+import React from 'react'
+
+export default async function UserAccountUpdate(props: { params: Promise<{ id: string }> }) {
+    const { id } = await props.params;
+
+    return (
+        <EditUserProfile id={id} />
+    )
+}

src/app/(dashboard)/(user)/(privateUser)/account/@page/profile/@section/wallet/default.tsx

+import EditUserWallet from '@/components/pages/dashboard/userDashboard/account/profile/editUserWallet'
+import { Button, InputLabel, OutlinedInput } from '@mui/material'
+import { InfoCircle, WalletCheck } from '@wandersonalwes/iconsax-react'
+import React from 'react'
+
+export default function UserWallet() {
+    return (
+        <EditUserWallet />
+    )
+}

src/app/(dashboard)/(user)/(privateUser)/account/@page/profile/layout.tsx

-"use client";
+// "use client";
 
 import TabController from "@/components/molecules/TabController";
 import UserProfileCard from "@/components/organism/Cards/UserProfileCard";
-import Link from "next/link";
-import { usePathname } from "next/navigation";
+import { getUserGameBalance } from "@/serverApi/game";
 
-export default function ProfileTabs({ section }: { section: React.ReactNode }) {
-    const pathname = usePathname();
 
+export default async function ProfileTabs({ section }: { section: React.ReactNode }) {
+    const balance = await getUserGameBalance();
     const links = [
         { href: "/account/profile/account", label: "Account Details" },
         { href: "/account/profile/wallet", label: "Wallet Information" },
@@ -19,7 +18,7 @@ export default function ProfileTabs({ section }: { section: React.ReactNode }) {
         <div className='profile__root'>
             <div className="grid lg:grid-cols-12 gap-6">
                 <div className="col-span-12 lg:col-span-5">
-                    <UserProfileCard />
+                    <UserProfileCard balance={balance} />
                 </div>
                 <div className="col-span-12 lg:col-span-7">
                     <TabController links={links} />

src/app/(dashboard)/(user)/(privateUser)/account/@page/profile/page.tsx

-import React from 'react'
+import { redirect } from 'next/navigation';
 
 export default function ProfilePage() {
-    return (
-        <div>ProfilePage</div>
-    )
+    return redirect("/account/profile/account");
 }

src/app/(dashboard)/(user)/(privateUser)/account/@page/withdrawl-history/default.tsx

+import WithdrawnHistoryPage from '@/components/pages/dashboard/userDashboard/withdrawlHistory'
+import React from 'react'
+
+export default function WithdrawlHistory() {
+    return (
+        <WithdrawnHistoryPage />
+    )
+}

src/app/layout.tsx

@@ -24,7 +24,7 @@ export default function RootLayout({
   return (
     <html lang="en">
       {/* className="dark" */}
-      <body className={`${inter.className} scroll-smooth dark`}>
+      <body className={`${inter.className} scroll-smooth dark`} cz-shortcut-listen="true">
         <ProviderWrapper>
 
           {children}

src/components/atom/SelectField.tsx

 "use client";
 
+import { useThemeContext } from "@/context/ThemeContext";
 import { InputLabel } from "@mui/material";
 import React from "react";
 
@@ -32,6 +33,8 @@ export default function SelectField({
     error,
     touched,
 }: SelectFieldProps) {
+    const theme = useThemeContext();
+    console.log("theme", theme);
     return (
         <div className="input__field">
             <InputLabel className="block text-sm font-semibold mb-2">

src/components/organism/Cards/UserProfileCard.tsx

@@ -5,7 +5,7 @@ import { formatDateTime } from '@/utils/formatDateTime';
 import Image from 'next/image'
 import React from 'react'
 
-export default function UserProfileCard() {
+export default function UserProfileCard({ balance }: { balance: any }) {
     const user = useAppSelector(state => state.auth.user);
     const { date } = formatDateTime(user?.registered_date as string);
     return (
@@ -26,7 +26,7 @@ export default function UserProfileCard() {
                     <div className="flex justify-center items-center gap-3">
                         <Image src={"/assets/images/current-balance.svg"} alt='' width={48} height={48} />
                         <div className="content mt-3 text-start">
-                            <strong className="text-[12px] leading-[120%] font-[700] text-white block ">$30,000</strong>
+                            <strong className="text-[12px] leading-[120%] font-[700] text-white block ">${balance?.data?.current_balance}</strong>
                             <span className="text-white text-[9px]">Current Balance</span>
                         </div>
                     </div>
@@ -35,22 +35,22 @@ export default function UserProfileCard() {
                     <div className="w-full  rounded-[14px] p-4 lg:py-6" style={{ background: "rgba(191, 26, 198, 0.10)" }}>
                         <Image src={"/assets/images/deposit.svg"} alt='' width={48} height={48} className='mx-auto' />
                         <div className="content mt-3 ">
-                            <strong className="text-[12px] leading-[120%] font-[700] text-white block ">$30,000</strong>
-                            <span className="text-white text-[9px]">Current Balance</span>
+                            <strong className="text-[12px] leading-[120%] font-[700] text-white block ">${balance?.data?.total_deposit}</strong>
+                            <span className="text-white text-[9px]">Total Deposited</span>
                         </div>
                     </div>
                     <div className="w-full  rounded-[14px] p-4 lg:py-6" style={{ background: "rgba(191, 26, 198, 0.10)" }}>
                         <Image src={"/assets/images/withdrawn.svg"} alt='' width={48} height={48} className='mx-auto' />
                         <div className="content mt-3">
-                            <strong className="text-[12px] leading-[120%] font-[700] text-white block ">$30,000</strong>
-                            <span className="text-white text-[9px]">Current Balance</span>
+                            <strong className="text-[12px] leading-[120%] font-[700] text-white block ">$3{balance?.data?.total_withdrawl}</strong>
+                            <span className="text-white text-[9px]">Total Withdrawl</span>
                         </div>
                     </div>
                     <div className="w-full  rounded-[14px] p-4 lg:py-6" style={{ background: "rgba(191, 26, 198, 0.10)" }}>
                         <Image src={"/assets/images/withdrawn.svg"} alt='' width={48} height={48} className='mx-auto' />
                         <div className="content mt-3">
-                            <strong className="text-[12px] leading-[120%] font-[700] text-white block ">$30,000</strong>
-                            <span className="text-white text-[9px]">Current Balance</span>
+                            <strong className="text-[12px] leading-[120%] font-[700] text-white block ">${balance?.data?.total_wining || 0}</strong>
+                            <span className="text-white text-[9px]">Total Winnings</span>
                         </div>
                     </div>
                 </div>

src/components/organism/Header/Profile.tsx

@@ -3,15 +3,15 @@ import { Transitions } from '@/components/molecules/Transition';
 import { useAppDispatch, useAppSelector } from '@/hooks/hook';
 import { PATH } from '@/routes/PATH';
 import { clearTokens } from '@/slice/authSlice';
-import { Box, Button, ButtonBase, ClickAwayListener, Fade, List, ListItem, ListItemText, Paper, Popper, Stack, Typography } from '@mui/material'
-import { ArrowDown2 } from '@wandersonalwes/iconsax-react';
+import { Box, Button, ButtonBase, ClickAwayListener, Fade, List, ListItem, ListItemButton, ListItemIcon, ListItemText, Paper, Popper, Stack, Typography } from '@mui/material'
 import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 import React, { useRef, useState } from 'react'
-import UserProfileMenu from './UserProfileMenu';
 const avataur1 = '/assets/images/avatar-6.png';
+import { ArrowDown2, ArrowUp2, Coin, Logout, MoneySend, Profile, Wallet2 } from "@wandersonalwes/iconsax-react";
 
-export default function Profile() {
+
+export default function ProfileBlock() {
     const anchorRef = useRef<any>(null);
     const [open, setOpen] = useState(false);
     const handleToggle = () => {
@@ -27,6 +27,39 @@ export default function Profile() {
         setOpen(false);
     };
     const id = open ? 'profile-dropdown' : ""
+
+    const menuItems = [
+        {
+            label: "Profile",
+            href: "/account/profile/account",
+            icon: <Profile size="20" />,
+        },
+        {
+            label: "Game Credentials",
+            href: "/credentials",
+            icon: <Wallet2 size="20" />,
+        },
+        {
+            label: "Deposit History",
+            href: "/account/deposit-history",
+            icon: <Coin size="20" />,
+        },
+        {
+            label: "Withdraw History",
+            href: "/account/withdrawl-history",
+            icon: <MoneySend size="20" />,
+        },
+        {
+            label: "Logout",
+            href: "#",
+            icon: <Logout size="20" />,
+            onClick: (e: React.MouseEvent) => {
+                e.preventDefault();
+                dispatch(clearTokens());
+                router.replace("/login");
+            },
+        },
+    ];
     return (
         <Box >
             <Button
@@ -103,7 +136,21 @@ export default function Profile() {
                                             </ListItem>
                                         </List>
                                     ) : (
-                                        <UserProfileMenu />
+                                        <List>
+                                            {menuItems.map((item, idx) => (
+                                                <ListItem key={idx} disablePadding>
+                                                    <ListItemButton
+                                                        component={item.href ? Link : "button"}
+                                                        href={item.href || undefined}
+                                                        onClick={item.onClick}
+                                                        className={`flex items-center py-3 px-4 hover:bg-[#FBF4FB]`}
+                                                    >
+                                                        <ListItemIcon className="min-w-[30px] mr-1">{item.icon}</ListItemIcon>
+                                                        <ListItemText primary={item.label} />
+                                                    </ListItemButton>
+                                                </ListItem>
+                                            ))}
+                                        </List>
                                     )
                                 }
 

src/components/organism/Header/UserProfileMenu.tsx

-import { List, ListItem, ListItemButton, ListItemIcon, ListItemText } from "@mui/material";
-import Link from "next/link";
-import { useRouter } from "next/navigation";
-import { useAppDispatch } from "@/hooks/hook";
-import { clearTokens } from "@/slice/authSlice";
-import { ArrowDown2, ArrowUp2, Coin, Logout, MoneySend, Profile, Wallet2 } from "@wandersonalwes/iconsax-react";
-
-
-const UserProfileMenu = () => {
-    const router = useRouter();
-    const dispatch = useAppDispatch();
-
-    const menuItems = [
-        {
-            label: "Profile",
-            href: "/account/profile/account",
-            icon: <Profile size="20" />,
-        },
-        {
-            label: "Game Credentials",
-            href: "/credentials",
-            icon: <Wallet2 size="20" />,
-        },
-        {
-            label: "Deposit History",
-            href: "/account/deposit-history",
-            icon: <Coin size="20" />,
-        },
-        {
-            label: "Withdraw History",
-            href: "/account/withdrawl-history",
-            icon: <MoneySend size="20" />,
-        },
-        {
-            label: "Logout",
-            href: "#",
-            icon: <Logout size="20" />,
-            onClick: (e: React.MouseEvent) => {
-                e.preventDefault();
-                dispatch(clearTokens());
-                router.replace("/login");
-            },
-        },
-    ];
-
-    return (
-        <List>
-            {menuItems.map((item, idx) => (
-                <ListItem key={idx} disablePadding>
-                    <ListItemButton
-                        component={item.href ? Link : "button"}
-                        href={item.href || undefined}
-                        onClick={item.onClick}
-                        className={`flex items-center py-3 px-4 hover:bg-[#FBF4FB]`}
-                    >
-                        <ListItemIcon className="min-w-[30px] mr-1">{item.icon}</ListItemIcon>
-                        <ListItemText primary={item.label} />
-                    </ListItemButton>
-                </ListItem>
-            ))}
-        </List>
-    );
-};
-
-export default UserProfileMenu;

src/components/organism/Sidebar/UserSidebar/index.tsx

@@ -60,7 +60,7 @@ export default function UserMenu({ open }: { open: boolean }) {
                             />
                         </ListItemButton>
                     </ListItem>
-                    <ListItem>
+                    {/* <ListItem>
                         <ListItemButton
                             className={[
                                 open ? "expanded" : "collapsed",
@@ -81,7 +81,7 @@ export default function UserMenu({ open }: { open: boolean }) {
                                 className={open ? "expanded" : "collapsed"}
                             />
                         </ListItemButton>
-                    </ListItem>
+                    </ListItem> */}
                 </List>
                 <List>
                     <ListItem>
@@ -89,13 +89,11 @@ export default function UserMenu({ open }: { open: boolean }) {
                             className={[
                                 open ? "expanded" : "collapsed",
                                 [
-                                    PATH.ADMIN.GAMES.ROOT,
-                                    PATH.ADMIN.GAMES.ADD_GAME.ROOT,
-                                    "/edit-game"
+                                    PATH.USER.GENERAL_PAGES.REFUND_POLICY.ROOT
                                 ].some(path => pathname.startsWith(path)) ? "active" : ""
                             ].join(" ")}
 
-                            onClick={() => { router.push(PATH.DASHBOARD.ROOT) }}
+                            onClick={() => { router.push(PATH.USER.GENERAL_PAGES.REFUND_POLICY.ROOT) }}
 
                         >
                             <ListItemIcon className={open ? "expanded" : "collapsed"}>
@@ -112,19 +110,17 @@ export default function UserMenu({ open }: { open: boolean }) {
                             className={[
                                 open ? "expanded" : "collapsed",
                                 [
-                                    PATH.ADMIN.GAMES.ROOT,
-                                    PATH.ADMIN.GAMES.ADD_GAME.ROOT,
-                                    "/edit-game"
+                                    PATH.USER.GENERAL_PAGES.ACCESSIBILITY.ROOT
                                 ].some(path => pathname.startsWith(path)) ? "active" : ""
                             ].join(" ")}
-                            onClick={() => { router.push(PATH.ADMIN.GAMES.ROOT) }}
+                            onClick={() => { router.push(PATH.USER.GENERAL_PAGES.ACCESSIBILITY.ROOT) }}
 
                         >
                             <ListItemIcon className={open ? "expanded" : "collapsed"}>
                                 <ReceiptEdit size={18} />
                             </ListItemIcon>
                             <ListItemText
-                                primary="Accessibility"
+                                primary="AML Policy"
                                 className={open ? "expanded" : "collapsed"}
                             />
                         </ListItemButton>
@@ -134,12 +130,10 @@ export default function UserMenu({ open }: { open: boolean }) {
                             className={[
                                 open ? "expanded" : "collapsed",
                                 [
-                                    PATH.ADMIN.GAMES.ROOT,
-                                    PATH.ADMIN.GAMES.ADD_GAME.ROOT,
-                                    "/edit-game"
+                                    PATH.USER.GENERAL_PAGES.SWEEPSTAKE_POLICY.ROOT
                                 ].some(path => pathname.startsWith(path)) ? "active" : ""
                             ].join(" ")}
-                            onClick={() => { router.push(PATH.ADMIN.GAMES.ROOT) }}
+                            onClick={() => { router.push(PATH.USER.GENERAL_PAGES.SWEEPSTAKE_POLICY.ROOT) }}
 
                         >
                             <ListItemIcon className={open ? "expanded" : "collapsed"}>
@@ -156,12 +150,10 @@ export default function UserMenu({ open }: { open: boolean }) {
                             className={[
                                 open ? "expanded" : "collapsed",
                                 [
-                                    PATH.ADMIN.GAMES.ROOT,
-                                    PATH.ADMIN.GAMES.ADD_GAME.ROOT,
-                                    "/edit-game"
+                                    PATH.USER.GENERAL_PAGES.TERMS_AND_CONDITIONS.ROOT
                                 ].some(path => pathname.startsWith(path)) ? "active" : ""
                             ].join(" ")}
-                            onClick={() => { router.push(PATH.ADMIN.GAMES.ROOT) }}
+                            onClick={() => { router.push(PATH.USER.GENERAL_PAGES.TERMS_AND_CONDITIONS.ROOT) }}
 
                         >
                             <ListItemIcon className={open ? "expanded" : "collapsed"}>
@@ -178,12 +170,10 @@ export default function UserMenu({ open }: { open: boolean }) {
                             className={[
                                 open ? "expanded" : "collapsed",
                                 [
-                                    PATH.ADMIN.GAMES.ROOT,
-                                    PATH.ADMIN.GAMES.ADD_GAME.ROOT,
-                                    "/edit-game"
+                                    PATH.USER.GENERAL_PAGES.PRIVACY_POLICY.ROOT
                                 ].some(path => pathname.startsWith(path)) ? "active" : ""
                             ].join(" ")}
-                            onClick={() => { router.push(PATH.ADMIN.GAMES.ROOT) }}
+                            onClick={() => { router.push(PATH.USER.GENERAL_PAGES.PRIVACY_POLICY.ROOT) }}
 
                         >
                             <ListItemIcon className={open ? "expanded" : "collapsed"}>
@@ -195,14 +185,12 @@ export default function UserMenu({ open }: { open: boolean }) {
                             />
                         </ListItemButton>
                     </ListItem>
-                    <ListItem>
+                    {/* <ListItem>
                         <ListItemButton
                             className={[
                                 open ? "expanded" : "collapsed",
                                 [
-                                    PATH.ADMIN.GAMES.ROOT,
-                                    PATH.ADMIN.GAMES.ADD_GAME.ROOT,
-                                    "/edit-game"
+                                    PATH.USER.GENERAL_PAGES.PRIVACY_POLICY.ROOT
                                 ].some(path => pathname.startsWith(path)) ? "active" : ""
                             ].join(" ")}
                             onClick={() => { router.push(PATH.ADMIN.GAMES.ROOT) }}
@@ -216,10 +204,10 @@ export default function UserMenu({ open }: { open: boolean }) {
                                 className={open ? "expanded" : "collapsed"}
                             />
                         </ListItemButton>
-                    </ListItem>
+                    </ListItem> */}
                 </List>
             </div>
-            <div className="support">
+            <div className="support mt-4">
                 <button type="button" className="ss-btn support__btn flex items-center gap-2 w-full justify-start">
                     <SupportIcon />
                     {open ? <strong className='text-[14px] font-semibold  opacity-80 !text-white'>Support</strong> : null}

src/components/organism/Table/index.tsx

@@ -16,10 +16,10 @@ export default function CustomTable<TData>({ table, loading = false,
     const rowCount = table.getRowModel().rows.length;
     const columnCount = table.getAllLeafColumns().length;
     const user = useAppSelector((state) => state.auth.user)
-    if (user?.role && user?.role.toUpperCase() === "USER") {
+    if (user?.role && user?.role.toUpperCase() !== "USER") {
 
         return (
-            <table className="min-w-full border-collapse border border-gray-200 text-left">
+            <table className="min]-w-full border-collapse border border-gray-200 text-left">
                 <thead>
                     {table.getHeaderGroups().map((headerGroup) => (
                         <tr key={headerGroup.id}>
@@ -101,8 +101,8 @@ export default function CustomTable<TData>({ table, loading = false,
                     Array.from({ length: skeletonRows }).map((_, rowIndex) => (
                         <tr key={`skeleton-${rowIndex}`} className="animate-pulse">
                             {Array.from({ length: columnCount }).map((_, colIndex) => (
-                                <td key={`skeleton-cell-${rowIndex}-${colIndex}`} className="text-[14px] p-2 lg:p-4 ">
-                                    <div className="h-4 w-full rounded-xl bg-[rgba(255, 255, 255, 0.10)]" />
+                                <td key={`skeleton-cell-${rowIndex}-${colIndex}`} className="text-[14px] p-2 lg:p-4 " >
+                                    <div className="h-4 w-full rounded-xl bg-[rgba(255, 255, 255, 0.10)]" style={{ background: "rgba(255, 255, 255, 0.10)" }} />
                                 </td>
                             ))}
                         </tr>

src/components/pages/auth/register/index.tsx

@@ -18,8 +18,10 @@ const validationSchema = Yup.object().shape({
         .max(255)
         .required('Email is required'),
     displayName: Yup.string()
-        .required('Display Name is required')
-        .max(50, 'Display Name must be less than 50 characters'),
+        .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"),
     password: Yup.string()
         .required('Password is required')
         .test(

src/components/pages/dashboard/adminDashboard/pages/index.tsx

+"use client";
+import ActionGroup from '@/components/molecules/Action';
+import TableHeader from '@/components/molecules/TableHeader';
+import CustomTable from '@/components/organism/Table';
+import { useAppDispatch } from '@/hooks/hook';
+import { PATH } from '@/routes/PATH';
+import { useDeletePageByIdMutation, useGetAllPageQuery } from '@/services/pageApi';
+import { showToast, ToastVariant } from '@/slice/toastSlice';
+import { PageRequestProps } from '@/types/page';
+import { Checkbox, Pagination } from '@mui/material';
+import { ColumnDef, getCoreRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table';
+import React, { useMemo, useState } from 'react'
+
+export default function GeneralPageLiting() {
+    const dispatch = useAppDispatch();
+    const [search, setSearch] = useState("");
+    const [sorting, setSorting] = useState<{ id: string; desc: boolean }[]>([]);
+    const [page, setPage] = useState(1);
+    const [pageSize, setPageSize] = useState(10);
+    const { data, isLoading: loadingPages } = useGetAllPageQuery({
+        page,
+        per_page: pageSize,
+        search: search || ""
+    });
+    const [deletePage, { isLoading: deleting }] = useDeletePageByIdMutation();
+
+    const filteredData = useMemo(() => data?.data?.data || [], [data]);
+
+    const columns = useMemo<ColumnDef<PageRequestProps>[]>(() => [
+        {
+            id: 'select',
+            header: ({ table }) => (
+                <Checkbox
+                    indeterminate={
+                        table.getIsSomePageRowsSelected() &&
+                        !table.getIsAllPageRowsSelected()
+                    }
+                    checked={table.getIsAllPageRowsSelected()}
+                    onChange={table.getToggleAllPageRowsSelectedHandler()}
+                />
+            ),
+            cell: ({ row }) => (
+                <Checkbox
+                    checked={row.getIsSelected()}
+                    onChange={row.getToggleSelectedHandler()}
+                />
+            ),
+            size: 50
+        },
+        {
+            accessorKey: 'id',
+            header: '#ID',
+            cell: ({ row }) => row.original.id
+        },
+        {
+            accessorKey: "name",
+            header: "Title",
+            cell: ({ row }) => (
+                <strong className="text-primary block text-[12px] leading-[120%] font-[500] capitalize">
+                    {row.original.name}
+                </strong>
+            ),
+        },
+        {
+            accessorKey: 'description',
+            header: 'Description',
+            cell: ({ row }) => (
+                <span className="text-[12px] font-[500] max-w-[380px]">{row.original.description}</span>
+            )
+        },
+        {
+            accessorKey: 'registeredDate',
+            header: 'Registered Date',
+            // cell: 
+        },
+        {
+            id: 'action',
+            header: 'Action',
+            cell: ({ row }) => (
+                <ActionGroup
+                    // onView={`${PATH.ADMIN.PAGES.ROOT}/${row.original.id}`}
+                    onEdit={`${PATH.ADMIN.PAGES.EDIT_PAGE.ROOT}/${row.original.id}`}
+                    onDelete={async () => {
+                        const response = await deletePage({ id: row.original.id || "" }).unwrap();
+                        dispatch(
+                            showToast({
+                                message: response.message,
+                                variant: ToastVariant.SUCCESS
+                            })
+                        )
+                    }}
+                />
+            ),
+        },
+    ], []);
+
+    const table = useReactTable({
+        data: filteredData || [],
+        columns,
+        state: { sorting },
+        onSortingChange: setSorting,
+        getCoreRowModel: getCoreRowModel(),
+        getPaginationRowModel: getPaginationRowModel(),
+        getSortedRowModel: getSortedRowModel(),
+    })
+
+    return (
+        <section className="genral__page__lisiting">
+            <div className="border-gray border-solid border-[1px] rounded-[8px] lg:rounded-[16px]">
+                <TableHeader
+                    search={search}
+                    setSearch={setSearch}
+                    onDownloadCSV={() => { }}
+                />
+                <CustomTable
+                    table={table}
+                    loading={loadingPages}
+                />
+                <div className="flex justify-between items-center mt-4 px-8 py-6">
+                    <div>
+                        <span>Row per page:</span>
+                        <select
+                            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={page}
+                        onChange={(_, value) => setPage(value)} variant="outlined" shape="rounded" sx={{ gap: "8px" }} />
+                </div>
+            </div>
+        </section>
+    )
+}

src/components/pages/dashboard/userDashboard/games/exclusiveGames/exclusiveGameDetail/UserCoin.tsx

+"use client"
+
+import SilverCoinIcon from '@/icons/SilverCoinIcon'
+import { useGetUserBalanceBySlugQuery } from '@/services/userApi'
+import { Box } from '@mui/material'
+import React from 'react'
+
+export default function UserCoin({ slug }: { slug: string }) {
+    const { data } = useGetUserBalanceBySlugQuery({ slug });
+    return (
+        <Box sx={{
+            background: "linear-gradient(0deg, rgba(234, 47, 231, 0.10) 0%, rgba(234, 47, 231, 0.10) 100%)",
+            borderRadius: "16px"
+        }} className="flex justify-center items-center gap-2 py-4 px-6 min-w-[30%] ">
+            <SilverCoinIcon />
+            <div className="coins">
+                <strong className="text-[16px] leading-4 font-[600] block mb-1">{data?.balance||0}</strong>
+                <span className="text-[12px]  block">Current Sweep Coins</span>
+            </div>
+        </Box>
+    )
+}

src/components/pages/dashboard/userDashboard/games/exclusiveGames/exclusiveGameDetail/index.tsx

@@ -8,6 +8,7 @@ import SilverCoinIcon from "@/icons/SilverCoinIcon";
 import ScreenShotSlider from "@/components/molecules/Sliders/ScreenShotSlider";
 import CustomLightGallery from "@/components/organism/LightGallery";
 import Link from "next/link";
+import UserCoin from "./UserCoin";
 
 export default function ExclusiveGameDetail({ game }: { game: SingleGameResponse }) {
     return (
@@ -31,7 +32,7 @@ export default function ExclusiveGameDetail({ game }: { game: SingleGameResponse
                                 {renderHTML(game?.data?.description)}
                             </div>
                             <div className="action__group flex flex-wrap gap-2">
-                                <Box sx={{
+                                {/* <Box sx={{
                                     background: "linear-gradient(0deg, rgba(234, 47, 231, 0.10) 0%, rgba(234, 47, 231, 0.10) 100%)",
                                     borderRadius: "16px"
                                 }} className="flex justify-center items-center gap-2 py-4 px-6 min-w-[30%] ">
@@ -40,7 +41,8 @@ export default function ExclusiveGameDetail({ game }: { game: SingleGameResponse
                                         <strong className="text-[16px] leading-4 font-[600] block mb-1">20,000</strong>
                                         <span className="text-[12px]  block">Current Sweep Coins</span>
                                     </div>
-                                </Box>
+                                </Box> */}
+                                <UserCoin slug={game?.data?.provider} />
 
                                 <Box sx={{
                                     borderRadius: "16px"

src/components/pages/dashboard/userDashboard/games/exclusiveGames/index.tsx

@@ -25,7 +25,7 @@ export default async function ExclusiveGamePage() {
             <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 xl:grid-cols-5 gap-4">
                 {
                     games?.data?.data.map((game) => (
-                        <a href={`exclusive-games/${game.id}`} className="group block  overflow-hidden  hover:shadow-md transition rounded-2xl aspect-[208/222] relative" key={game.id}>
+                        <ProtectedLink href={`exclusive-games/${game.id}`} className="group block  overflow-hidden  hover:shadow-md transition rounded-2xl aspect-[208/222] relative" key={game.id}>
                             <Tooltip title={game.name}>
                                 <Image
                                     src={game.thumbnail || "/assets/images/fallback.png"}
@@ -34,7 +34,7 @@ export default async function ExclusiveGamePage() {
                                     className="w-full h-[222px] object-cover group-hover:scale-105 transition-transform duration-300"
                                 />
                             </Tooltip>
-                        </a>
+                        </ProtectedLink>
                     ))
                 }
             </div>

src/components/pages/dashboard/userDashboard/withdrawlHistory/index.tsx

@@ -51,6 +51,8 @@ export default function WithdrawnHistoryPage() {
         }
     ]
 
+    console.log(data);
+
     const table = useReactTable({
         data: data?.data?.data || [],
         // data: dummyDeposits,
@@ -62,9 +64,8 @@ export default function WithdrawnHistoryPage() {
     return (
         <>
             <CustomTable table={table} loading={isLoading} emptyMessage="You haven't deposite yet!" />
-            <div className="flex justify-between items-center mt-4 px-8 py-6">
-
-                <Pagination count={data?.data?.pagination.total_pages || 1}
+            {data && data?.data?.data.length > 5 ? <div className="flex justify-between items-center mt-4 px-8 py-6">
+                <Pagination count={data?.data?.pagination?.total_pages || 1}
                     page={page}
                     onChange={(_, value) => setPage(value)} variant="outlined" shape="rounded" sx={{ gap: "8px" }} />
                 <div>
@@ -81,7 +82,7 @@ export default function WithdrawnHistoryPage() {
                         ))}
                     </select>
                 </div>
-            </div>
+            </div> : ""}
         </>
     )
 }

src/routes/PATH.ts

@@ -42,6 +42,9 @@ export const PATH = {
             ROOT: "/pages",
             ADD_PAGE: {
                 ROOT: "/pages/add-page"
+            },
+            EDIT_PAGE: {
+                ROOT: "/pages/edit-page"
             }
         },
         NOTIFICATIONS: {
@@ -66,6 +69,23 @@ export const PATH = {
             PASSWORD: {
                 ROOT: "/profile/password"
             }
+        },
+        GENERAL_PAGES: {
+            PRIVACY_POLICY: {
+                ROOT: "/general/privacy-policy"
+            },
+            REFUND_POLICY: {
+                ROOT: "/general/refund-policy"
+            },
+            SWEEPSTAKE_POLICY: {
+                ROOT: "/general/sweepstake-policy"
+            },
+            ACCESSIBILITY: {
+                ROOT: "/general/aml-policy"
+            },
+            TERMS_AND_CONDITIONS: {
+                ROOT: "/general/terms-and-conditions"
+            }
         }
     }
 }
\ No newline at end of file

src/serverApi/pages.ts

+import { PageRequestProps, PageResponseProps } from "@/types/page";
+import { cookies } from "next/headers";
+import { serverBaseQuery } from "./serverBaseQuery";
+
+export async function getPageDetail(slug: string): Promise<PageResponseProps | undefined> {
+    return serverBaseQuery(`/api/general/page/${slug}`);
+}

src/services/pageApi.ts

 import { createApi } from "@reduxjs/toolkit/query/react";
 import { baseQuery } from "./baseQuery";
 import { GlobalResponse, QueryParams } from "@/types/config";
+import { PageListResponse, PageResponseProps } from "@/types/page";
 
 export const pageApi = createApi({
     reducerPath: "pageApi",
@@ -14,7 +15,7 @@ export const pageApi = createApi({
                 body: body
             })
         }),
-        getAllPage: builder.mutation<GlobalResponse, QueryParams>({
+        getAllPage: builder.query<PageListResponse, QueryParams>({
             query: (body) => ({
                 url: "/api/admin/page/list",
                 method: "GET",
@@ -38,7 +39,7 @@ export const pageApi = createApi({
 
 export const {
     useCreatePageMutation,
-    useGetAllPageMutation,
+    useGetAllPageQuery,
     useUpdatePageByIdMutation,
     useDeletePageByIdMutation
 } = pageApi;
\ No newline at end of file

src/services/userApi.ts

@@ -28,10 +28,18 @@ export const userApi = createApi({
             query: () => ({
                 url: "/api/get-balance",
                 method: "GET"
-            })
+            }),
+            providesTags: ['user']
+        }),
+        getUserBalanceBySlug: builder.query<{ provider: string; balance: number, flag: string }, { slug: string }>({
+            query: ({ slug }) => ({
+                url: `/api/balance/${slug}`,
+                method: "GET"
+            }),
+            providesTags: ['user']
         })
     })
 
 })
 
-export const { useAddUserWalletMutation, useUpdateUserProfileMutation, useGetUserBalanceQuery } = userApi;
+export const { useAddUserWalletMutation, useUpdateUserProfileMutation, useGetUserBalanceQuery, useGetUserBalanceBySlugQuery } = userApi;
\ No newline at end of file

src/types/page.ts

-export interface pageRequestProps {
+import { Pagination } from "./game";
+
+export interface PageRequestProps {
+    id?: string;
     name: string;
     slug: string;
     description: string;
@@ -8,6 +11,21 @@ export interface pageRequestProps {
     }[]
 }
 
+export interface PageResponseProps {
+    success: boolean,
+    data: PageRequestProps;
+    message: string;
+}
+
+
+export interface PageListResponse {
+    success: boolean,
+    data: {
+        data: PageRequestProps[];
+        pagination: Pagination;
+    };
+    message: string;
+}
 export const pageInitialData = {
     name: "",
     slug: "",