added dashboard payments endpoint

.env

@@ -1,3 +1,4 @@
+REACT_APP_PANEL_NAME="MERMS Panel DEV"
 SKIP_PREFLIGHT_CHECK=true
 REACT_APP_NODE_ENV="development"
 NODE_ENV="development"

.env.development

@@ -1,7 +1,10 @@
+REACT_APP_PANEL_NAME="MERMS Panel DEV"
 SKIP_PREFLIGHT_CHECK=true
 REACT_APP_NODE_ENV="development"
+NODE_ENV="development"
 REACT_APP_SOCKET_URL="https://devsocket.mermsemr.com"
 REACT_APP_MAIN_API="https://devapi.mermsemr.com"
+REACT_APP_MAIN_API_LL="http://localhost:14700"
 REACT_APP_MEDIA_SERVER="https://qa-media.mermsemr.com"
 REACT_APP_MAIN_SOCKET="https://devsocket.mermsemr.com"
 

.env.production

@@ -1,3 +1,4 @@
+REACT_APP_PANEL_NAME="MERMS Panel"
 SKIP_PREFLIGHT_CHECK=true
 REACT_APP_NODE_ENV="production"
 NODE_ENV="production"

.env.qa

@@ -1,3 +1,4 @@
+REACT_APP_PANEL_NAME="MERMS Panel QA"
 SKIP_PREFLIGHT_CHECK=true
 REACT_APP_NODE_ENV="development"
 NODE_ENV="development"

docker/Dockerfile

@@ -126,7 +126,7 @@ RUN apk add --no-cache --virtual .build-deps-yarn curl gnupg tar \
 # add app
   COPY . ./
 
-# start app
+# start appdpvle
 #CMD ["npm","run", "start"]
  
 # CMD ["yarn", "start"]

public/index.html

@@ -7,7 +7,7 @@
     <meta name="theme-color" content="#000000"/>
     <meta
             name="description"
-      content="Web site created using create-react-app"
+            content="Empowering Healthcare Decision-Making with Artificial Intelligence"
     />
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png"/>
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json"/>
@@ -17,7 +17,11 @@
 <script async src="https://www.googletagmanager.com/gtag/js?id=G-Y9QSQFV003"></script>
 <script>
     window.dataLayer = window.dataLayer || [];
-    function gtag(){dataLayer.push(arguments);}
+
+    function gtag() {
+        dataLayer.push(arguments);
+    }
+
     gtag('js', new Date());
 
     gtag('config', 'G-Y9QSQFV003');

src/component/auth/CSignup.jsx

@@ -100,7 +100,7 @@ export default function CSignup() {
                         <div className="col-11 col-sm-6 col-lg-5 col-xxl-4 align-self-center order-2 order-sm-1" style={{maxWidth: '520px'}}>
                             <div className="mt-5 d-flex">
                                 <div className="bg-white register p-5">
-                                    <h1 className="mb-2">MERMS Panel</h1>
+                                    <h1 className="mb-2">{process.env.REACT_APP_PANEL_NAME}</h1>
                                     {/* <p>Welcome, Enter your password.</p> */}
                                     <div
                                     >

src/component/auth/Forgetpwd2.jsx

@@ -50,7 +50,7 @@ export default function Forgetpwd2() {
                             <div className="col-11 col-sm-6 col-lg-5 col-xxl-4 align-self-center order-2 order-sm-1h" style={{maxWidth: '520px'}}>
                                 <div className="mt-5 d-flex">
                                     <div className="bg-white register p-5">
-                                        <h1 className="mb-2">MERMS Panel</h1>
+                                        <h1 className="mb-2">{process.env.REACT_APP_PANEL_NAME}</h1>
                                         {!mutation.isSuccess && <p>Please enter your username.</p>}
                                         <Formik
                                         initialValues={initialValues}

src/component/auth/Login.jsx

@@ -27,7 +27,7 @@ export default function Login() {
             <div className="col-span-1 lg:col-span-2 xl:col-span-2 place-content-center order-2 sm:order-1">
                 <div className="w-full p-4 px-8 md:p-10 flex flex-col gap-6 items-start justify-start">
                     <div className='w-full text-left'>
-                        <h1 className="mb-2 text-black text-4xl font-semibold">MERMS Panel</h1>
+                        <h1 className="mb-2 text-black text-4xl font-semibold">{process.env.REACT_APP_PANEL_NAME}</h1>
                         <p className='text-black-gray text-base'>Welcome back, please login to your account.</p>
                     </div>
                     <form className="w-full text-14 text-left text-black-gray">

src/component/auth/Login2.jsx

@@ -86,7 +86,7 @@ export default function Login() {
                             <div className="col-11 col-sm-6 col-lg-5 col-xxl-4 align-self-center order-2 order-sm-1" style={{maxWidth: '520px'}}>
                                 <div className="mt-5 d-flex">
                                     <div className="bg-white register px-5 pt-5 pb-3">
-                                        <h1 className="mb-2">MERMS Panel</h1>
+                                        <h1 className="mb-2">{process.env.REACT_APP_PANEL_NAME}</h1>
                                         <p>Welcome back, please login to your account.</p>
                                         <form className="mt-3 mt-sm-5">
                                             <div className="row">
@@ -124,10 +124,18 @@ export default function Login() {
                                                     <button type='button' onClick={()=>{login.mutate(fields)}} className="btn btn-primary text-uppercase">{login.isPending ? 'loading...' : 'Sign In'}</button>
                                                 </div>
                                                 <div className="col-12  mt-3">
-                                                    <p>Don't have an account ?<Link to={siteLinks.signup}><span style={{fontWeight: 'bolder'}}>Sign Up</span></Link></p>
+                                                    <p> <Link to={siteLinks.signup}>
+                                                        {/*<span style={{fontWeight: 'bolder'}}>Sign Up</span>*/}
+                                                        <button className="btn btn-warning text-uppercase">
+                                                            Sign Up
+                                                        </button>
+                                                    </Link><span style={{paddingLeft: '5px' , fontWeight: 'bolder'}}> if you don't have an account yet.</span></p>
                                                 </div>
                                             </div>
                                         </form>
+                                        <div className="row" style={{margin: '5px'}}>
+                                            <hr />
+                                        </div>
                                         <div className="row" style={{marginTop: '20px'}}>
                                             <div className="col-6">
                                                 <div className="app-store-icons-wrap text-center">

src/component/auth/Signup.jsx

@@ -27,7 +27,7 @@ export default function Signup() {
                 <div className="col-span-1 lg:col-span-2 xl:col-span-2 place-content-center order-2 sm:order-1">
                     <div className="w-full p-4 px-8 md:p-10 flex flex-col gap-6 items-start justify-start">
                         <div className='w-full text-left'>
-                        <h1 className="mb-2 text-black text-4xl font-semibold">MERMS Panel</h1>
+                            <h1 className="mb-2 text-black text-4xl font-semibold">{process.env.REACT_APP_PANEL_NAME}</h1>
                             <p className='text-black-gray text-base'>Welcome, Please create your account.</p>
                         </div>
                         <form className="w-full text-14 text-left text-black-gray">
@@ -69,22 +69,31 @@ export default function Signup() {
                                         <div className="flex gap-2">
                                             <input className="form-check-input" type="checkbox" id="gridCheck"/>
                                             <label className="font-semibold form-check-label" htmlFor="gridCheck">
-                                        I accept terms & policy
+                                                I accept terms & policy of use.
                                             </label>
                                         </div>
                                     </div>
                                 </div>
                                 <div className="w-full mt-3">
-                                <button onClick={()=>{navigate(siteLinks.home)}} className="bg-primary rounded-sm px-4 py-2 text-white font-medium uppercase">Sign Up</button>
+                                    <button onClick={() => {
+                                        navigate(siteLinks.home)
+                                    }} className="bg-primary rounded-sm px-4 py-2 text-white font-medium uppercase">Sign
+                                        Up
+                                    </button>
                                 </div>
                                 <div className="mt-3">
-                                <p className='font-medium'>Already have an account ?<Link to={siteLinks.login} className=' hover:text-primary'> Sign In</Link></p>
+                                    <p className='font-medium'>Already have an account ?
+                                        <Link to={siteLinks.login}
+                                              className='hover:text-primary font-bold'> Sign In
+                                        </Link>
+                                    </p>
                                 </div>
                             </div>
                         </form>
                     </div>
                 </div>
-            <div className="bg-login_gradient h-full col-span-1 lg:col-span-3 xl:col-span-6 place-content-center order-1 sm:order-2">
+                <div
+                    className="bg-login_gradient h-full col-span-1 lg:col-span-3 xl:col-span-6 place-content-center order-1 sm:order-2">
                     <div className="w-full">
                         <div className="w-2/3 mx-auto">
                             <img className="w-[80%]" src={LoginImg} alt=""/>

src/component/auth/Signup2.jsx

@@ -64,7 +64,7 @@ export default function Signup2() {
                             <div className="col-11 col-sm-6 col-lg-5 col-xxl-4 align-self-center order-2 order-sm-1" style={{maxWidth: '520px'}}>
                                 <div className="mt-5 d-flex">
                                     <div className="bg-white register p-5">
-                                        <h1 className="mb-2">MERMS Panel</h1>
+                                        <h1 className="mb-2">{process.env.REACT_APP_PANEL_NAME}</h1>
                                         <p>Welcome, Please create your account.</p>
                                         <Formik
                                             initialValues={initialValues}

src/component/comments/Comments.js

@@ -3,10 +3,9 @@ import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
 import getImage from "../../utils/getImage";
 
 export default function Comments() {
-
   return (
     <>
-            <BreadcrumbComBS title='Comments' paths={['Dashboard', 'Comments']} />
+      <BreadcrumbComBS title="Comments" paths={["Dashboard", "Comments"]} />
       <div className="row">
         {/*<div className="vh-100 col-12 flex align-items-center">Coming Soon</div>*/}
         <div className="col-12">
@@ -18,7 +17,12 @@ export default function Comments(){
                     <div className="row justify-content-center">
                       <div className="col-12">
                         <div className="text-center mail-sidebar-title px-4">
-                                                    <a href="javascript:void(0)" className="btn btn-primary btn-block py-3 font-weight-bold font-18"><i className="fa fa-plus pl-2"></i></a>
+                          <a
+                            href="javascript:void(0)"
+                            className="btn btn-primary btn-block py-3 font-weight-bold font-18"
+                          >
+                            <i className="fa fa-plus pl-2"></i>
+                          </a>
                         </div>
                       </div>
                       <div className="col-12">
@@ -34,7 +38,9 @@ export default function Comments(){
                                     <span>Inbox</span>
                                   </span>
                                   <span className="nav-item ml-auto text-right">
-                                                                                             <span className="badge badge-pill badge-primary float-right">0+</span>
+                                    <span className="badge badge-pill badge-primary float-right">
+                                      0+
+                                    </span>
                                   </span>
                                 </span>
                               </a>
@@ -51,7 +57,6 @@ export default function Comments(){
                                 </span>
                               </a>
                             </li>
-
                           </ul>
                           <ul className="pl-0 mt-5">
                             <li className="py-2">
@@ -102,7 +107,12 @@ export default function Comments(){
                       <div className="row align-items-center mx-0">
                         <div className="col-12">
                           <div className="form-group pt-3">
-                                                        <input type="text" className="form-control" id="search" placeholder="Search.." />
+                            <input
+                              type="text"
+                              className="form-control"
+                              id="search"
+                              placeholder="Search.."
+                            />
                             <i className="fa fa-search"></i>
                           </div>
                         </div>
@@ -114,17 +124,29 @@ export default function Comments(){
                           <div className="media align-items-center">
                             <div className="mr-3">
                               <div className="bg-img">
-                                                                <img  src={getImage("avtar/01.jpg")}  className="img-fluid" alt="user" />
+                                <img
+                                  src={getImage("avtar/01.jpg")}
+                                  className="img-fluid"
+                                  alt="user"
+                                />
                               </div>
                             </div>
                             <div className="w-100">
                               <div className="mail-msg-item-titel justify-content-between">
                                 <p>Martin smith</p>
-                                                                <p className="d-none d-xl-block">06:59 <span> PM </span></p>
+                                <p className="d-none d-xl-block">
+                                  06:59 <span> PM </span>
+                                </p>
                               </div>
                               <h5 className="mb-0 my-2">Saas Designer</h5>
-                                                            <p>Since there is not an "all the above" category, I'll take the opportunity to enthusiastically congratulate you on the very high quality.</p>
+                              <p>
-                                                            <p className="d-xl-none">06:59 <span> PM </span></p>
+                                Since there is not an "all the above" category,
+                                I'll take the opportunity to enthusiastically
+                                congratulate you on the very high quality.
+                              </p>
+                              <p className="d-xl-none">
+                                06:59 <span> PM </span>
+                              </p>
                             </div>
                           </div>
                         </a>
@@ -134,17 +156,30 @@ export default function Comments(){
                           <div className="media align-items-center">
                             <div className="mr-3">
                               <div className="bg-img">
-                                                                <img  src={getImage("avtar/02.jpg")}  className="img-fluid" alt="user" />
+                                <img
+                                  src={getImage("avtar/02.jpg")}
+                                  className="img-fluid"
+                                  alt="user"
+                                />
                               </div>
                             </div>
                             <div className="w-100">
                               <div className="mail-msg-item-titel justify-content-between">
                                 <p>DutcaPatrick</p>
-                                                                <p className="d-none d-xl-block">06:59 <span> PM </span></p>
+                                <p className="d-none d-xl-block">
+                                  06:59 <span> PM </span>
+                                </p>
                               </div>
-                                                            <h5 className="mb-0 my-2">Mobile app Designer </h5>
+                              <h5 className="mb-0 my-2">
-                                                            <p>Very nice template, lots of pages and good documentation.</p>
+                                Mobile app Designer{" "}
-                                                            <p className="d-xl-none">06:59 <span> PM </span></p>
+                              </h5>
+                              <p>
+                                Very nice template, lots of pages and good
+                                documentation.
+                              </p>
+                              <p className="d-xl-none">
+                                06:59 <span> PM </span>
+                              </p>
                             </div>
                           </div>
                         </a>
@@ -154,17 +189,30 @@ export default function Comments(){
                           <div className="media align-items-center">
                             <div className="mr-3">
                               <div className="bg-img">
-                                                                <img  src={getImage("avtar/03.jpg")}  className="img-fluid" alt="user" />
+                                <img
+                                  src={getImage("avtar/03.jpg")}
+                                  className="img-fluid"
+                                  alt="user"
+                                />
                               </div>
                             </div>
                             <div className="w-100">
                               <div className="mail-msg-item-titel justify-content-between">
                                 <p>m_morsch</p>
-                                                                <p className="d-none d-xl-block">06:59 <span> PM </span></p>
+                                <p className="d-none d-xl-block">
+                                  06:59 <span> PM </span>
+                                </p>
                               </div>
-                                                            <h5 className="mb-0 my-2">Landing page Designer</h5>
+                              <h5 className="mb-0 my-2">
-                                                            <p>Excellent and at a great price... thank you very much!</p>
+                                Landing page Designer
-                                                            <p className="d-xl-none">06:59 <span> PM </span></p>
+                              </h5>
+                              <p>
+                                Excellent and at a great price... thank you very
+                                much!
+                              </p>
+                              <p className="d-xl-none">
+                                06:59 <span> PM </span>
+                              </p>
                             </div>
                           </div>
                         </a>
@@ -174,17 +222,28 @@ export default function Comments(){
                           <div className="media align-items-center">
                             <div className="mr-3">
                               <div className="bg-img">
-                                                                <img  src={getImage("avtar/04.jpg")} className="img-fluid" alt="user" />
+                                <img
+                                  src={getImage("avtar/04.jpg")}
+                                  className="img-fluid"
+                                  alt="user"
+                                />
                               </div>
                             </div>
                             <div className="w-100">
                               <div className="mail-msg-item-titel justify-content-between">
                                 <p>AnnaHorno</p>
-                                                                <p className="d-none d-xl-block">06:59 <span> PM </span></p>
+                                <p className="d-none d-xl-block">
+                                  06:59 <span> PM </span>
+                                </p>
                               </div>
                               <h5 className="mb-0 my-2">Re-Design ios app</h5>
-                                                            <p>Solved my theme problem in 10 minutes. We thank you.</p>
+                              <p>
-                                                            <p className="d-xl-none">06:59 <span> PM </span></p>
+                                Solved my theme problem in 10 minutes. We thank
+                                you.
+                              </p>
+                              <p className="d-xl-none">
+                                06:59 <span> PM </span>
+                              </p>
                             </div>
                           </div>
                         </a>
@@ -194,17 +253,30 @@ export default function Comments(){
                           <div className="media align-items-center">
                             <div className="mr-3">
                               <div className="bg-img">
-                                                                <img  src={getImage("avtar/05.jpg")}  className="img-fluid" alt="user" />
+                                <img
+                                  src={getImage("avtar/05.jpg")}
+                                  className="img-fluid"
+                                  alt="user"
+                                />
                               </div>
                             </div>
                             <div className="w-100">
                               <div className="mail-msg-item-titel justify-content-between">
                                 <p>Wdcorbitt</p>
-                                                                <p className="d-none d-xl-block">06:59 <span> PM </span></p>
+                                <p className="d-none d-xl-block">
+                                  06:59 <span> PM </span>
+                                </p>
                               </div>
-                                                            <h5 className="mb-0 my-2">Mobil UX/UI Designer</h5>
+                              <h5 className="mb-0 my-2">
-                                                            <p>Asked for information and received it EXTREMELY quickly. Great layout - good code - great price! </p>
+                                Mobil UX/UI Designer
-                                                            <p className="d-xl-none">06:59 <span> PM </span></p>
+                              </h5>
+                              <p>
+                                Asked for information and received it EXTREMELY
+                                quickly. Great layout - good code - great price!{" "}
+                              </p>
+                              <p className="d-xl-none">
+                                06:59 <span> PM </span>
+                              </p>
                             </div>
                           </div>
                         </a>
@@ -214,17 +286,28 @@ export default function Comments(){
                           <div className="media align-items-center">
                             <div className="mr-3">
                               <div className="bg-img">
-                                                                <img  src={getImage("avtar/06.jpg")}  className="img-fluid" alt="user" />
+                                <img
+                                  src={getImage("avtar/06.jpg")}
+                                  className="img-fluid"
+                                  alt="user"
+                                />
                               </div>
                             </div>
                             <div className="w-100">
                               <div className="mail-msg-item-titel justify-content-between">
                                 <p>Anne Smith</p>
-                                                                <p className="d-none d-xl-block">06:59 <span> PM </span></p>
+                                <p className="d-none d-xl-block">
+                                  06:59 <span> PM </span>
+                                </p>
                               </div>
                               <h5 className="mb-0 my-2">Jobly Opportunity</h5>
-                                                            <p>Mentor has so many features and layouts. Its a great choice.</p>
+                              <p>
-                                                            <p className="d-xl-none">06:59 <span> PM </span></p>
+                                Mentor has so many features and layouts. Its a
+                                great choice.
+                              </p>
+                              <p className="d-xl-none">
+                                06:59 <span> PM </span>
+                              </p>
                             </div>
                           </div>
                         </a>
@@ -234,17 +317,29 @@ export default function Comments(){
                           <div className="media align-items-center">
                             <div className="mr-3">
                               <div className="bg-img">
-                                                                <img  src={getImage("avtar/07.jpg")}  className="img-fluid" alt="user" />
+                                <img
+                                  src={getImage("avtar/07.jpg")}
+                                  className="img-fluid"
+                                  alt="user"
+                                />
                               </div>
                             </div>
                             <div className="w-100">
                               <div className="mail-msg-item-titel justify-content-between">
                                 <p>Paul Flavius</p>
-                                                                <p className="d-none d-xl-block">06:59 <span> PM </span></p>
+                                <p className="d-none d-xl-block">
+                                  06:59 <span> PM </span>
+                                </p>
                               </div>
                               <h5 className="mb-0 my-2">Saas Designer</h5>
-                                                            <p>There are many people in the world with amazing talents who realize only a small percentage of their potential. </p>
+                              <p>
-                                                            <p className="d-xl-none">06:59 <span> PM </span></p>
+                                There are many people in the world with amazing
+                                talents who realize only a small percentage of
+                                their potential.{" "}
+                              </p>
+                              <p className="d-xl-none">
+                                06:59 <span> PM </span>
+                              </p>
                             </div>
                           </div>
                         </a>
@@ -254,17 +349,29 @@ export default function Comments(){
                           <div className="media align-items-center">
                             <div className="mr-3">
                               <div className="bg-img">
-                                                                <img  src={getImage("avtar/08.jpg")}  className="img-fluid" alt="user" />
+                                <img
+                                  src={getImage("avtar/08.jpg")}
+                                  className="img-fluid"
+                                  alt="user"
+                                />
                               </div>
                             </div>
                             <div className="w-100">
                               <div className="mail-msg-item-titel justify-content-between">
                                 <p>Sara Lisbon</p>
-                                                                <p className="d-none d-xl-block">06:59 <span> PM </span></p>
+                                <p className="d-none d-xl-block">
+                                  06:59 <span> PM </span>
+                                </p>
                               </div>
                               <h5 className="mb-0 my-2">UI Designer</h5>
-                                                            <p>We can look a bit further back in time to Albert Einstein or even further back to Abraham Lincoln.</p>
+                              <p>
-                                                            <p className="d-xl-none">06:59 <span> PM </span></p>
+                                We can look a bit further back in time to Albert
+                                Einstein or even further back to Abraham
+                                Lincoln.
+                              </p>
+                              <p className="d-xl-none">
+                                06:59 <span> PM </span>
+                              </p>
                             </div>
                           </div>
                         </a>
@@ -274,17 +381,28 @@ export default function Comments(){
                           <div className="media align-items-center">
                             <div className="mr-3">
                               <div className="bg-img">
-                                                                <img  src={getImage("avtar/09.jpg")}  className="img-fluid" alt="user" />
+                                <img
+                                  src={getImage("avtar/09.jpg")}
+                                  className="img-fluid"
+                                  alt="user"
+                                />
                               </div>
                             </div>
                             <div className="w-100">
                               <div className="mail-msg-item-titel justify-content-between">
                                 <p>Annahorno</p>
-                                                                <p className="d-none d-xl-block">06:59 <span> PM </span></p>
+                                <p className="d-none d-xl-block">
+                                  06:59 <span> PM </span>
+                                </p>
                               </div>
                               <h5 className="mb-0 my-2">Saas Designer</h5>
-                                                            <p>One of the most difficult aspects of achieving success is staying motivated over the long haul.</p>
+                              <p>
-                                                            <p className="d-xl-none">06:59 <span> PM </span></p>
+                                One of the most difficult aspects of achieving
+                                success is staying motivated over the long haul.
+                              </p>
+                              <p className="d-xl-none">
+                                06:59 <span> PM </span>
+                              </p>
                             </div>
                           </div>
                         </a>
@@ -296,7 +414,11 @@ export default function Comments(){
                   <div className="mail-chat py-5 px-5">
                     <div className="media align-items-center">
                       <div className="bg-img mr-3">
-                                                <img  src={getImage("avtar/03.jpg")}  className="img-fluid" alt="user" />
+                        <img
+                          src={getImage("avtar/03.jpg")}
+                          className="img-fluid"
+                          alt="user"
+                        />
                       </div>
                       <div>
                         <h4 className="mb-0">Dutca Patrick</h4>
@@ -314,9 +436,27 @@ export default function Comments(){
                     </div>
                     <div>
                       <p className="my-4">hey adminjon...</p>
-                                            <p className="mb-2">I truly believe Augustine’s words are true and if you look at history you know it is true. There are many people in the world with amazing talents who realize only a small percentage of their potential. We all know people who live this truth.</p>
+                      <p className="mb-2">
-                                            <p>We also know those epic stories, those modern-day legends surrounding the early failures of such supremely successful folks as Michael Jordan and Bill Gates. We can look a bit further back in time to Albert Einstein or even further back to Abraham Lincoln. What made each of these people so successful? Motivation.</p>
+                        I truly believe Augustine’s words are true and if you
-                                            <p>We know this in our gut, but what can we do about it? How can we motivate ourselves? One of the most difficult aspects of achieving success is staying motivated over the long haul.</p>
+                        look at history you know it is true. There are many
+                        people in the world with amazing talents who realize
+                        only a small percentage of their potential. We all know
+                        people who live this truth.
+                      </p>
+                      <p>
+                        We also know those epic stories, those modern-day
+                        legends surrounding the early failures of such supremely
+                        successful folks as Michael Jordan and Bill Gates. We
+                        can look a bit further back in time to Albert Einstein
+                        or even further back to Abraham Lincoln. What made each
+                        of these people so successful? Motivation.
+                      </p>
+                      <p>
+                        We know this in our gut, but what can we do about it?
+                        How can we motivate ourselves? One of the most difficult
+                        aspects of achieving success is staying motivated over
+                        the long haul.
+                      </p>
                       <div className="my-5">
                         <p>Have lovely Day,</p>
                         <p>adminjon</p>
@@ -335,29 +475,75 @@ export default function Comments(){
                   {/*</div>*/}
                   <div className="bg-light mail-f px-4 py-3">
                     <div className="py-2 bg-white px-4 py-3 d-flex justify-content-between">
-                                            <p>Click here to <a href="#editer" data-toggle="collapse" className="text-primary px-1">Reply</a>or<a href="#forward" data-toggle="collapse" className="text-primary px-1">Forward</a></p>
+                      <p>
-                                            <a href="javascript:void(0)" className="text-primary"><i className="fa fa-microphone"></i></a>
+                        Click here to{" "}
+                        <a
+                          href="#editer"
+                          data-toggle="collapse"
+                          className="text-primary px-1"
+                        >
+                          Reply
+                        </a>
+                        or
+                        <a
+                          href="#forward"
+                          data-toggle="collapse"
+                          className="text-primary px-1"
+                        >
+                          Forward
+                        </a>
+                      </p>
+                      <a href="javascript:void(0)" className="text-primary">
+                        <i className="fa fa-microphone"></i>
+                      </a>
                     </div>
                     <div className="collapse" id="editer">
                       <div className="form-group">
-                                                <textarea className="form-control mt-3" id="exampleFormControlTextarea1" rows="3" placeholder="Type here..."></textarea>
+                        <textarea
+                          className="form-control mt-3"
+                          id="exampleFormControlTextarea1"
+                          rows="3"
+                          placeholder="Type here..."
+                        ></textarea>
                       </div>
                     </div>
                     <div className="collapse" id="forward">
                       <div className="form-group">
-                                                <input className="form-control mt-3" id="exampleFormControl" placeholder="Email Address" />
+                        <input
+                          className="form-control mt-3"
+                          id="exampleFormControl"
+                          placeholder="Email Address"
+                        />
                       </div>
                     </div>
                     <div className="d-flex align-items-center justify-content-between py-2">
                       <div>
                         <ul className="nav">
-                                                    <li className="nav-item pr-3"><a href="javascript:void(0)"><i className="ti ti-clip font-20"></i></a></li>
+                          <li className="nav-item pr-3">
-                                                    <li className="nav-item pr-3"><a href="javascript:void(0)"><i className="ti ti-face-smile font-20"></i></a></li>
+                            <a href="javascript:void(0)">
-                                                    <li className="nav-item"><a href="javascript:void(0)"><i className="ti ti-gallery font-20"></i></a></li>
+                              <i className="ti ti-clip font-20"></i>
+                            </a>
+                          </li>
+                          <li className="nav-item pr-3">
+                            <a href="javascript:void(0)">
+                              <i className="ti ti-face-smile font-20"></i>
+                            </a>
+                          </li>
+                          <li className="nav-item">
+                            <a href="javascript:void(0)">
+                              <i className="ti ti-gallery font-20"></i>
+                            </a>
+                          </li>
                         </ul>
                       </div>
                       <div>
-                                                <a href="javascript:void(0)" className="btn btn-primary"><span>Send</span> <i className="fa fa-paper-plane"></i></a>
+                        <a
+                          href="javascript:void(0)"
+                          className="btn btn-primary"
+                        >
+                          <span>Send</span>{" "}
+                          <i className="fa fa-paper-plane"></i>
+                        </a>
                       </div>
                     </div>
                   </div>
@@ -368,5 +554,5 @@ export default function Comments(){
         </div>
       </div>
     </>
-    )
+  );
 }

src/component/contacts/Contacts.js

@@ -1,4 +1,4 @@
-"use client"
+"use client";
 import React, { useEffect, useState } from "react";
 import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
 import getImage from "../../utils/getImage";
@@ -8,86 +8,87 @@ import queryKeys from "../../services/queryKeys";
 import getCustomTime from "../../utils/getCustomTime";
 
 export default function Contacts() {
-
   // const {data:contacts, isFetching, isError, error} = useQuery({
   //     queryKey: queryKeys.contacts,
   //     queryFn: () => contactData()
   // })
 
-    const [activeCategoryUID, setActiveCategoryUID] = useState('0') // HOLDS VALUE OF THE ACTIVE CATEGORY
+  const [activeCategoryUID, setActiveCategoryUID] = useState("0"); // HOLDS VALUE OF THE ACTIVE CATEGORY
 
-    const [activeContactUID, setActiveContactUID] = useState('')
+  const [activeContactUID, setActiveContactUID] = useState("");
-    const [activeDetail, setActiveDetail] = useState([])
+  const [activeDetail, setActiveDetail] = useState([]);
-
-    const [filteredContactData, setFiltererdContactData] = useState([])
 
+  const [filteredContactData, setFiltererdContactData] = useState([]);
 
   const getContactData = useMutation({
     mutationFn: (reqData) => {
-            return contactData(reqData)
+      return contactData(reqData);
     },
     onError: (error) => {
-            console.log(error)
+      console.log(error);
     },
     onSuccess: (res) => {
-            if(res?.data?.resultCode != '0'){
+      if (res?.data?.resultCode != "0") {
-                throw({message: 'Something went wrong'})
+        throw { message: "Something went wrong" };
       }
-            setFiltererdContactData(res?.data?.contacts)
+      setFiltererdContactData(res?.data?.contacts);
-        }
+    },
-    })
+  });
 
   const changeActiveUID = (uid) => {
-        setActiveContactUID(uid)
+    setActiveContactUID(uid);
-        let detail = contactsData.filter(item => item.uid == uid)
+    let detail = contactsData.filter((item) => item.uid == uid);
-        setActiveDetail(detail)
+    setActiveDetail(detail);
-    }
+  };
 
   const changeActiveCategoryUID = (id) => {
-        let filteredConData = []
+    let filteredConData = [];
-        setActiveCategoryUID(id)
+    setActiveCategoryUID(id);
-        if(id == '0'){
+    if (id == "0") {
-            filteredConData = contactsData
+      filteredConData = contactsData;
     } else {
-            filteredConData = contactsData.filter(item => item.category == id)
+      filteredConData = contactsData.filter((item) => item.category == id);
-        }
-        setFiltererdContactData(filteredConData)
-        changeActiveUID(filteredConData[0]?.uid)
     }
+    setFiltererdContactData(filteredConData);
+    changeActiveUID(filteredConData[0]?.uid);
+  };
 
   useEffect(() => {
     let reqData = {
-        token: localStorage.getItem('token'), // USER TOKEN
+      token: localStorage.getItem("token"), // USER TOKEN
-        uid: localStorage.getItem('uid') // USER UID
+      uid: localStorage.getItem("uid"), // USER UID
-    }
+    };
-    getContactData.mutate(reqData)
+    getContactData.mutate(reqData);
-    },[])
+  }, []);
 
-    const contactsData = getContactData?.data?.data?.contacts // LIST OF CONTACTS
+  const contactsData = getContactData?.data?.data?.contacts; // LIST OF CONTACTS
-    const contactsCategory = getContactData?.data?.data?.category // LIST OF CATEGORY
+  const contactsCategory = getContactData?.data?.data?.category; // LIST OF CATEGORY
 
   return (
     <>
-            <BreadcrumbComBS title='Contacts' paths={['Dashboard', 'Contacts']} />
+      <BreadcrumbComBS title="Contacts" paths={["Dashboard", "Contacts"]} />
-            {getContactData?.isPending ? 
+      {getContactData?.isPending ? (
         <>
           <div className="row">
             <div className="col-12">
-                            <p className='text-mute'>Loading...</p>
+              <p className="text-mute">Loading...</p>
             </div>
           </div>
         </>
-                : getContactData?.error ?
+      ) : getContactData?.error ? (
         <div className="row">
           <div className="col-12">
-                        <p className='text-danger'>{getContactData?.error?.message}</p>
+            <p className="text-danger">{getContactData?.error?.message}</p>
           </div>
         </div>
-                :
+      ) : (
         <div className="row">
           {/*<div className="vh-100 col-12 flex align-items-center">Coming Soon</div>*/}
           <div className="col-12">
-                        <div className="card card-statistics mail-contant">
+            <div
+              className="card card-statistics mail-contant"
+              style={{ minHeight: "200px", borderRadius: "10px" }}
+            >
               <div className="card-body p-0">
                 <div className="row no-gutters">
                   <div className="col-md-4 col-xxl-2 col-md-4">
@@ -95,7 +96,12 @@ export default function Contacts(){
                       <div className="row justify-content-center">
                         <div className="d-none col-12">
                           <div className="text-center mail-sidebar-title px-4">
-                                                        <a href="#" className="btn btn-primary btn-block py-3 font-weight-bold font-18"><i className="fa fa-plus pl-2"></i></a>
+                            <a
+                              href="#"
+                              className="btn btn-primary btn-block py-3 font-weight-bold font-18"
+                            >
+                              <i className="fa fa-plus pl-2"></i>
+                            </a>
                           </div>
                         </div>
                         <div className="col-12">
@@ -111,32 +117,44 @@ export default function Contacts(){
                                       <span>Inbox</span>
                                     </span>
                                     <span className="nav-item ml-auto text-right">
-                                                                                                <span className="badge badge-pill badge-primary float-right">{contactsData?.length}</span>
+                                      <span className="badge badge-pill badge-primary float-right">
+                                        {contactsData?.length}
+                                      </span>
                                     </span>
                                   </span>
                                 </a>
                               </li>
-                                                            <li className="py-2">
+                              {/*<li className="py-2">*/}
-                                                                <a href="#">
+                              {/*    <a href="#">*/}
-                                                                                <span className="nav align-items-center">
+                              {/*                <span*/}
-                                                                                            <span>
+                              {/*                    className="nav align-items-center">*/}
-                                                                                                <i className="fa fa-paper-plane-o pr-4"></i>
+                              {/*                            <span>*/}
-                                                                                            </span>
+                              {/*                                <i className="fa fa-paper-plane-o pr-4"></i>*/}
-                                                                                <span>
+                              {/*                            </span>*/}
-                                                                                                <span>Replied Mail</span>
+                              {/*                <span>*/}
-                                                                                </span>
+                              {/*                                <span>Replied Mail</span>*/}
-                                                                                </span>
+                              {/*                </span>*/}
-                                                                </a>
+                              {/*                </span>*/}
-                                                            </li>
+                              {/*    </a>*/}
-
+                              {/*</li>*/}
                             </ul>
 
                             <ul className="pl-0 mt-5">
-                                                            <li className="py-2" onClick={()=>changeActiveCategoryUID('0')} style={{cursor: 'pointer'}}>
+                              <li
+                                className="py-2"
+                                onClick={() => changeActiveCategoryUID("0")}
+                                style={{ cursor: "pointer" }}
+                              >
                                 <div>
                                   <span className="nav align-items-center">
                                     <span>
-                                                                                <i className={`fa fa-circle-o pr-4 ${activeCategoryUID == '0' ? 'text-primary' : 'text-warning'}`}></i>
+                                      <i
+                                        className={`fa fa-circle-o pr-4 ${
+                                          activeCategoryUID == "0"
+                                            ? "text-primary"
+                                            : "text-warning"
+                                        }`}
+                                      ></i>
                                     </span>
                                     <span>
                                       <span>All</span>
@@ -144,12 +162,27 @@ export default function Contacts(){
                                   </span>
                                 </div>
                               </li>
-                                                            {contactsCategory && contactsCategory.map(item => (
+                              {contactsCategory &&
-                                                                <li key={item?.cid} className="py-2" onClick={()=>changeActiveCategoryUID(`A00000${item?.cid}`)} style={{cursor: 'pointer'}}>
+                                contactsCategory.map((item) => (
+                                  <li
+                                    key={item?.cid}
+                                    className="py-2"
+                                    onClick={() =>
+                                      changeActiveCategoryUID(`${item?.cid}`)
+                                    }
+                                    style={{ cursor: "pointer" }}
+                                  >
                                     <div>
                                       <span className="nav align-items-center">
                                         <span>
-                                                                                <i className={`fa fa-circle-o pr-4 ${activeCategoryUID == `A00000${item?.cid}` ? 'text-primary' : 'text-warning'}`}></i>
+                                          <i
+                                            className={`fa fa-circle-o pr-4 ${
+                                              activeCategoryUID ==
+                                              `${item?.cid}`
+                                                ? "text-primary"
+                                                : "text-warning"
+                                            }`}
+                                          ></i>
                                         </span>
                                         <span>
                                           <span>{item?.description}</span>
@@ -158,71 +191,89 @@ export default function Contacts(){
                                     </div>
                                   </li>
                                 ))}
-                                                            {/* <li className="py-2">
-                                                                <a href="#">
-                                                                                <span className="nav align-items-center">
-                                                                                            <span>
-                                                                                                <i className="fa fa-circle-o pr-4 text-warning"></i>
-                                                                                            </span>
-                                                                                <span>
-                                                                                                <span>Work</span>
-                                                                                </span>
-                                                                                </span>
-                                                                </a>
-                                                            </li>
-                                                            <li className="py-2">
-                                                                <a href="#">
-                                                                                <span className="nav align-items-center">
-                                                                                            <span>
-                                                                                                <i className="fa fa-plus pr-4"></i>
-                                                                                            </span>
-                                                                                <span>
-                                                                                                <span>Add Category</span>
-                                                                                </span>
-                                                                                </span>
-                                                                </a>
-                                                            </li> */}
                             </ul>
                           </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                                    <div className="col-md-8  col-xxl-4 border-md-t">
+                  <div className={`${filteredContactData.length > 0 ? 'col-md-8 col-xxl-4' : 'col-md-8 col-xxl-10'} border-md-t`}>
-                                        <div className="mail-content  border-right border-n h-100">
+                    <div className="mail-content  border-right border-n h-100" style={{placeContent: 'center'}}>
-                                            <div className="mail-search border-bottom">
+                      {/* <div className="mail-search border-bottom">
                         <div className="row align-items-center mx-0">
                           <div className="col-12">
-                                                        {/*<div className="form-group pt-3">*/}
+                            <div className="form-group pt-3">
-                                                        {/*    <input type="text" className="form-control" id="search" placeholder="Search.." />*/}
+                               <input type="text" className="form-control" id="search" placeholder="Search.." />
-                                                        {/*        <i className="fa fa-search"></i>*/}
+                                   <i className="fa fa-search"></i>
-                                                        {/*</div>*/}
                             </div>
                           </div>
                         </div>
+                      </div> */}
                       <div className="mail-msg scrollbar scroll_dark">
-                                                {contactsData && filteredContactData?.map((contact, index)=> {
+                        { filteredContactData.length ?
-                                                    const isActive = (contact?.uid == activeContactUID) || (!activeContactUID && index == 0)
+                          filteredContactData?.map((contact, index) => {
+                            const isActive =
+                              contact?.uid == activeContactUID ||
+                              (!activeContactUID && index == 0);
+                            const avtarImage =
+                              contact?.category === undefined
+                                ? "avtar/01.jpg"
+                                : "avtar/" + contact.category + ".png";
                             return (
-                                                        <div key={contact?.uid} onClick={()=>changeActiveUID(contact?.uid)} className={`mail-msg-item ${isActive && 'bg-light'}`}>
+                              <div
+                                key={contact?.uid}
+                                onClick={() => changeActiveUID(contact?.uid)}
+                                className={`mail-msg-item ${
+                                  isActive && "bg-light"
+                                }`}
+                              >
                                 <a href="#">
                                   <div className="media align-items-center">
                                     <div className="mr-3">
                                       <div className="bg-img">
-                                                                            <img src={getImage("avtar/01.jpg")} className="img-fluid" alt="user" />
+                                        <img
+                                          src={getImage(avtarImage)}
+                                          className="img-fluid"
+                                          alt="user"
+                                        />
                                       </div>
                                     </div>
                                     <div className="w-100">
                                       <div className="mail-msg-item-titel justify-content-between">
-                                                                            <p>{contact?.sender}</p>
+                                        <p>
+                                          <span
+                                            style={{
+                                              fontSize: "14px",
+                                              color: "#148399",
+                                              fontWeight: "bolder",
+                                            }}
+                                          >
+                                            {contact?.sender}
+                                          </span>
+                                        </p>
                                         {/* <p className="d-none d-xl-block">06:59 <span> PM </span></p> */}
-                                                                            <p className="d-none d-xl-block"><span>{new Date(contact?.added).toDateString()}</span></p>
+                                        <p className="d-none d-xl-block">
+                                          <span style={{ fontSize: "14px" }}>
+                                            {new Date(
+                                              contact?.added
+                                            ).toDateString()}
+                                          </span>
+                                        </p>
                                       </div>
-                                                                        <h5 className="mb-0 my-2">{contact?.title}</h5>
+                                      <h5 className="mb-0 my-2">
-                                                                        <p>{contact?.message?.length < 100 ? contact?.message : contact?.message.substring(0,101) + ' ...' }</p>
+                                        {contact?.title}
+                                      </h5>
+                                      <p>
+                                        {contact?.message?.length < 100
+                                          ? contact?.message
+                                          : contact?.message.substring(0, 101) +
+                                            " ..."}
+                                      </p>
                                       <p className="d-xl-none">
                                         <span>
-                                                                            {new Date(contact?.added).toDateString()}
+                                          {new Date(
+                                            contact?.added
+                                          ).toDateString()}
                                           {/* {getCustomTime(contact.added)} */}
                                         </span>
                                       </p>
@@ -230,26 +281,47 @@ export default function Contacts(){
                                   </div>
                                 </a>
                               </div>
-                                                    )
+                            );
-                                                })}
+                          })
+                          :
+                          <p className="text-center">Messages will appear here as soon as they are available for selection</p>
+                        }
                       </div>
                     </div>
                   </div>
+                  {filteredContactData.length > 0 &&
                   <div className="col-xxl-6 border-t border-xxl-t">
-
                     <div className="mail-chat py-5 px-5">
                       <div className="media align-items-center">
                         <div className="bg-img mr-3">
-                                                    <img  src={getImage("avtar/03.jpg")}  className="img-fluid" alt="user" />
+                          <img
+                            src={activeContactUID ? getImage("avtar/" + activeDetail[0].category + ".png") : getImage(filteredContactData[0] == undefined ? "avtar/01.jpg": "avtar/" + filteredContactData[0].category + ".png")}
+                            className="img-fluid"
+                            alt="user"
+                          />
                         </div>
                         <div>
-                                                    <h4 className="mb-0">{activeContactUID ? activeDetail[0]?.sender : filteredContactData[0]?.sender}</h4>
+                          <h4 className="mb-0" style={{ color: "#148399" }}>
-                                                    <p>{activeContactUID ? new Date(activeDetail[0]?.added).toDateString() : new Date(filteredContactData[0]?.added).toDateString()}</p>
+                            {activeContactUID
+                              ? activeDetail[0]?.sender
+                              : filteredContactData[0]?.sender}
+                          </h4>
+                          <p>
+                            {activeContactUID
+                              ? new Date(activeDetail[0]?.added).toDateString()
+                              : new Date(
+                                  filteredContactData[0]?.added
+                                ).toDateString()}
+                          </p>
                         </div>
                       </div>
                       <div className="mt-4 d-flex justify-content-between">
                         <div>
-                                                    <h3>{activeContactUID ? activeDetail[0]?.title : filteredContactData[0]?.title}</h3>
+                          <h3>
+                            {activeContactUID
+                              ? activeDetail[0]?.title
+                              : filteredContactData[0]?.title}
+                          </h3>
                         </div>
                         <div className="d-flex">
                           {/*<a href="javascript:void(0)"><i className="fa fa-reply font-22 pr-3"></i></a>*/}
@@ -257,53 +329,21 @@ export default function Contacts(){
                         </div>
                       </div>
                       <div>
-                                                <p>{activeContactUID ? activeDetail[0]?.message : filteredContactData[0]?.message}</p>
+                        <p>
-                                                {/* <p className="my-4">hey adminjon...</p>
+                          {activeContactUID
-                                                <p className="mb-2">I truly believe Augustine’s words are true and if you look at history you know it is true. There are many people in the world with amazing talents who realize only a small percentage of their potential. We all know people who live this truth.</p>
+                            ? activeDetail[0]?.message
-                                                <p>We also know those epic stories, those modern-day legends surrounding the early failures of such supremely successful folks as Michael Jordan and Bill Gates. We can look a bit further back in time to Albert Einstein or even further back to Abraham Lincoln. What made each of these people so successful? Motivation.</p>
+                            : filteredContactData[0]?.message}
-                                                <p>We know this in our gut, but what can we do about it? How can we motivate ourselves? One of the most difficult aspects of achieving success is staying motivated over the long haul.</p> */}
+                        </p>
-                                                {/*<div className="my-5">*/}
-                                                {/*    <p>Have lovely Day,</p>*/}
-                                                {/*    <p>adminjon</p>*/}
-                                                {/*</div>*/}
-                                            </div>
-                                        </div>
-
-                                        <div className="bg-light mail-f px-4 py-3">
-                                            <div className="py-2 bg-white px-4 py-3 d-flex justify-content-between">
-                                                <p>Click here to <a href="#editer" data-toggle="collapse" className="text-primary px-1">Reply</a>or<a href="#forward" data-toggle="collapse" className="text-primary px-1">Forward</a></p>
-                                                <a href="#" className="text-primary"><i className="fa fa-microphone"></i></a>
-                                            </div>
-                                            <div className="collapse" id="editer">
-                                                <div className="form-group">
-                                                    <textarea className="form-control mt-3" id="exampleFormControlTextarea1" rows="3" placeholder="Type here..."></textarea>
-                                                </div>
-                                            </div>
-                                            <div className="collapse" id="forward">
-                                                <div className="form-group">
-                                                    <input className="form-control mt-3" id="exampleFormControl" placeholder="Email Address" />
-                                                </div>
-                                            </div>
-                                            <div className="d-flex align-items-center justify-content-between py-2">
-                                                <div>
-                                                    {/*<ul className="nav">*/}
-                                                    {/*    <li className="nav-item pr-3"><a href="javascript:void(0)"><i className="ti ti-clip font-20"></i></a></li>*/}
-                                                    {/*    <li className="nav-item pr-3"><a href="javascript:void(0)"><i className="ti ti-face-smile font-20"></i></a></li>*/}
-                                                    {/*    <li className="nav-item"><a href="javascript:void(0)"><i className="ti ti-gallery font-20"></i></a></li>*/}
-                                                    {/*</ul>*/}
-                                                </div>
-                                                <div>
-                                                    {/*<a href="javascript:void(0)" className="btn btn-primary"><span>Send</span> <i className="fa fa-paper-plane"></i></a>*/}
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
                       </div>
                     </div>
                   </div>
                   }
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      )}
     </>
-    )
+  );
 }

src/component/home/DashPayments.jsx

@@ -0,0 +1,91 @@
+import React from 'react'
+import { getDashPayments } from '../../services/services'
+import { useQuery } from '@tanstack/react-query'
+import queryKeys from '../../services/queryKeys'
+import getImage from '../../utils/getImage'
+
+export default function DashPayments() {
+
+    
+    const {data, isFetching, isError, error} = useQuery({
+        queryKey: queryKeys.dash_payments,
+        queryFn: () => {
+            let reqData = {
+                token: localStorage.getItem('token'), // USER TOKEN
+                uid: localStorage.getItem('uid') // USER UID
+            }
+            return getDashPayments(reqData)
+        }
+    })
+
+    const payments = data?.data
+    // console.log('data', payments)
+
+  return (
+    <>
+        <div className="col-xxl-4 m-b-30" style={{minHeight: '300px'}}>
+            <div className="card card-statistics h-100 mb-0 panel_round_c3">
+                <div className="card-header d-flex justify-content-between">
+                    <div className="card-heading">
+                        <h4 className="card-title">Payments</h4>
+                    </div>
+                </div>
+                <div className="card-body scrollbar scroll_dark pt-0" style={{maxHeight: '350px'}}>
+                    <div className="datatable-wrapper table-responsive">
+                    {isFetching ? 
+                        <>
+                            <div className="col-12">
+                                <div className="p-4">
+                                    <p className='text-mute'>Loading...</p>
+                                </div>
+                            </div>
+                        </>
+                        : isError ?
+                        <div className="col-12">
+                            <div className="p-4">
+                                <p className='text-danger'>{error.message}</p>
+                            </div>
+                        </div>
+                        :
+                        <table id="datatable" className="table table-borderless table-striped">
+                            <thead>
+                            <tr>
+                                {/* <th style={{width: '30px'}}>#</th> */}
+                                <th>Date</th>
+
+                                <th  style={{width: '130px'}}>Subscription</th>
+                                <th  style={{width: '80px'}}>Amount</th>
+                            </tr>
+                            </thead>
+                            <tbody>
+                                {payments.length > 0 ? 
+                                payments.map((item, index) => {
+                                    return (
+                                        <tr key={index}>
+                                            <td>{Number(item?.id).toString().padStart(6,'0')}</td>
+                                            <td>
+                                                <a className="mr-3" href={externalUrl} target='_blank'><b>{externalUrl}</b></a> -  {item?.description}
+                                            </td>
+
+                                            <td><span className={`badge ${statusColor}`}>{statusText}</span></td>
+                                            <td>
+                                                <a className="mr-3" href={productUrl}>
+                                                    <img src={getImage('arrow-next.png')} alt='next' />
+                                                </a>
+                                            </td>
+                                        </tr>
+                                    )
+                                })
+                                :
+                                    <td colSpan={3} className='text-center'>No record found</td>
+                                }
+                            </tbody>
+                        </table>
+                    }
+                    </div>
+                </div>
+            </div>
+        </div>
+    </>
+  )
+}

src/component/home/HomeSections.jsx

@@ -5,6 +5,7 @@ import Products from "./Products";
 import TopBar from "./TopBar";
 import ProductsURL from "./ProductsURL";
 import { SocketContextValues } from "../context/SocketIOContext";
+import DashPayments from "./DashPayments";
 
 export default function HomeSections(){
 
@@ -52,41 +53,7 @@ export default function HomeSections(){
         <div className="row">
             <ProductsURL />
 
-            <div className="col-xxl-4 m-b-30" style={{minHeight: '300px'}}>
+            <DashPayments />
-                <div className="card card-statistics h-100 mb-0 panel_round_c3">
-                    <div className="card-header d-flex justify-content-between">
-                        <div className="card-heading">
-                            <h4 className="card-title">Payments</h4>
-                        </div>
-                        {/*<div className="dropdown">*/}
-                        {/*    <a className="p-2" href="#!" data-toggle="dropdown" aria-haspopup="true"*/}
-                        {/*       aria-expanded="false">*/}
-                        {/*        <i className="fe fe-circle"></i>*/}
-                        {/*    </a>*/}
-                        {/*    <div className="dropdown-menu custom-dropdown dropdown-menu-right p-4">*/}
-                        {/*        <h6 className="mb-1">Action</h6>*/}
-                        {/*        <a className="dropdown-item" href="#!"><i className="fa-fw fa fa-file-o pr-2"></i>View*/}
-                        {/*            reports</a>*/}
-                        {/*        <a className="dropdown-item" href="#!"><i className="fa-fw fa fa-edit pr-2"></i>Edit reports</a>*/}
-                        {/*        <a className="dropdown-item" href="#!"><i className="fa-fw fa fa-bar-chart-o pr-2"></i>Statistics</a>*/}
-                        {/*        <h6 className="mb-1 mt-3">Export</h6>*/}
-                        {/*        <a className="dropdown-item" href="#!"><i className="fa-fw fa fa-file-pdf-o pr-2"></i>Export*/}
-                        {/*            to PDF</a>*/}
-                        {/*        <a className="dropdown-item" href="#!"><i className="fa-fw fa fa-file-excel-o pr-2"></i>Export*/}
-                        {/*            to CSV</a>*/}
-                        {/*    </div>*/}
-                        {/*</div>*/}
-                    </div>
-                    <div className="card-body">
-                        {/*<h5>We only started collecting data from February 2019 </h5>*/}
-                        {/*<p>Questions about the Net Earnings number? <a*/}
-                        {/*    className="btn btn-square btn-inverse-success btn-xs ml-1" href="#">Click here</a></p>*/}
-                        <div className="row mt-4">
-                            .
-                        </div>
-                    </div>
-                </div>
-            </div>
         </div>
     </>;
 

src/component/home/Products.jsx

@@ -44,13 +44,13 @@ export default function Products() {
                     {products && products.map((product, index) => (
                         <div key={product.uid+index} className={`col-xxs-6 col-xl-4 col-xxl-6 mb-2 mb-xxl-0`}>
                             <Link to={productPath(product?.product_id)}  >
-                                <div className={`d-flex align-items-center extraProductCard  ${product?.icon_style}`} >
+                                <div className={`d-flex align-items-center extraProductCard  ${product?.icon_style}`} style={{borderColor:'black', borderWidth: '2px'}} >
                                     <div className="icon-container img-icon m-r-20 bg-light-gray rounded">
                                         <i className={`fa ${product?.product_icon} text-primary`}></i>
                                     </div>
                                     <div className="report-details">
-                                        <p>{product?.status_text}</p>
+                                        <p><span style={{fontWeight: 'bolder', color: '#00557A'}}>{product?.status_text}</span></p>
-                                        <h4>{product?.name}</h4>
+                                        <h4><span style={{paddingLeft: '10px'}}>{product?.name}</span></h4>
                                     </div>
                                 </div>
                             </Link>

src/component/home/TopBar.jsx

@@ -57,19 +57,26 @@ export default function TopBar() {
         <>
         {data && data?.map((item, index)=>{
             let textColor = item?.description == 'Contacts' ? 'text-danger' : item?.description == 'Site Traffic' ? 'text-primary' : item?.description == 'Appointments' ? 'text-orange' : 'text-success'
+            let dataSpan = ''
+            if(item?.extra_style){
+                const data = item.data_span.split(' ')
+                dataSpan = `${data[0]} ${data[1]}`
+            }
+
             return (
                 <div key={item.id + index} className="col-sm-6 col-xxl-3">
-                <div className={`card card-statistics ecommerce-contant overflow-h ${item?.extra_style} `}>
+                    <Link to={item?.link}>
+                        <div className={`card card-statistics ecommerce-contant overflow-h ${item?.extra_style} `} style={{borderRadius: '10px'}}>
                             <div className="card-body p-0">
                                 <div className="d-flex m-b-0 ecommerce-contant-text h-100">
                                     <div className="w-100">
                                         <div className="row p-3">
                                             <div className="col">
                                                 <h3 className="mb-0">{item?.value || 0}</h3>
-                                        <small className="d-block">{item?.data_span}</small>
+                                                <small className="d-block">{item?.extra_style ? dataSpan : item?.data_span}</small>
                                             </div>
                                             <div className="col text-right">
-                                        <h5 className="text-muted mb-0"><Link to={item?.link}>{item?.description}</Link></h5>
+                                                <h5 className="text-muted mb-0">{item?.description}</h5>
                                             </div>
                                         </div>
                                         <div className="apexchart-wrapper">
@@ -79,6 +86,7 @@ export default function TopBar() {
                                 </div>
                             </div>
                         </div>
+                    </Link>
                 </div>
             )
         })}

src/component/layout/layoutcom/UserMenu.jsx

@@ -16,7 +16,7 @@ export default function UserMenu() {
     return (
         <>
             <div className="sidebar-nav scrollbar scroll_dark">
-                <ul className="metismenu " id="sidebarNav">
+                <ul className="metismenu h-100" id="sidebarNav">
                     <li className="nav-static-title">Panel</li>
                     <li className={`${pathname == siteLinks.dash ? 'active' : ''}`}>
                         <Link className="has-arrow" to='#' data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
@@ -30,7 +30,7 @@ export default function UserMenu() {
                         <ul id="collapseOne" className="collapse show" aria-labelledby="headingOne" data-bs-parent="#sidebarNav">
                             <li className={`${pathname == siteLinks.dash ? 'active' : ''}`}><Link to={siteLinks.dash}>Home</Link></li>
                             <li className={`${pathname == siteLinks.calendar ? 'active' : ''}`}><Link to={siteLinks.calendar}>Calendar</Link></li>
-                            <li className={`${pathname == siteLinks.contacts ? 'active' : ''}`}><Link to={siteLinks.contacts}>Contacts</Link></li>
+                            <li className={`${pathname == siteLinks.contacts ? 'active' : ''}`}><Link to={siteLinks.contacts}>Sites Contacts</Link></li>
                             <li className={`${pathname == siteLinks.comments ? 'active' : ''}`}><Link to={siteLinks.comments}>Comments</Link></li>
                         </ul>
                     </li>
@@ -54,7 +54,7 @@ export default function UserMenu() {
                     </li>
 
 
-                    <li className="sidebar-banner p-4 bg-gradient text-center m-3 d-block rounded">
+                    <li className="sidebar-banner p-4 bg-gradient text-center m-3 mt-auto d-block rounded">
                         <h5 className="text-white mb-1">MERMS Panel</h5>
                         <Link className="btn btn-square btn-inverse-light btn-xs d-inline-block mt-2 mb-0" to='' onClick={logout}> Log Out</Link>
                     </li>

src/component/product/ProductActive.jsx

@@ -46,7 +46,9 @@ export default function ProductActive({productData}){
                             <div className="card card-statistics">
                                 <div className="card-header">
                                     <div className="card-heading d-flex justify-content-between">
-                                        <h4 className="card-title">{externalUrl}</h4>
+                                        {/*<h4 className="card-title">{externalUrl}</h4>*/}
+                                        <h4  style={{color: '#148399', fontWeight: 'bolder'}}>
+                                            <a  href={externalUrl} target='_blank'>{externalUrl}</a></h4>
                                         <button type="button" onClick={()=>iframe.current.src += ''} className="btn">
                                             <img src={getImage('refresh.png')} style={{width: '30px', height: 'auto'}} alt='refresh page' />
                                         </button>

src/component/product/settingsTab/GeneralTab.jsx

@@ -20,7 +20,7 @@ const GeneralTab = memo(({name='Full Name', data, isCustom, productData, backend
     fieldData[item?.setting_key?.toLowerCase().replaceAll(" ", "_")] = item?.setting_value
     })
 
-    console.log('fieldData', fieldData)
+    // console.log('fieldData', fieldData)
 
     const [fields, setFields] = useState(fieldData)
     

src/component/product/settingsTab/Settings.jsx

@@ -31,6 +31,8 @@ const Settings = memo(({productData}) => {
     const footerFields ={
         footer_description: { name: 'Footer Description', controls: 'TEXTAREA', active: true },
         boolean_footer_show_email: { name: 'Show email in footer', controls: 'SELECT_NO_YES', active: true },
+        boolean_footer_show_made_by: { name: 'Show made by in footer', controls: 'SELECT_NO_YES', active: true },
+        boolean_footer_show_socials: { name: 'Show social in footer', controls: 'SELECT_NO_YES', active: true },
     }
 
     const aboutFields ={

src/component/product/settingsTab/SiteTemplateSelector.jsx

@@ -15,19 +15,55 @@ const SiteTemplateSelector = memo(({name='Full Name', data, productData}) =>{
                     product_id: productData?.product_id
                 }
             return getProductTemplateData(reqData)
-        }
+            },
+            staleTime: 0
         })
 
-    const settingsData = templateData?.data
+        const templateResponse = templateData?.data
-    console.log('data Template', settingsData)
+        const templates = templateResponse?.templates
 
-        console.log("Page data == ", data)
+        // console.log('data Template', templates)
+        // console.log("Page data == ", data)
         return (
             <div className="page-account-form">
                 <div className="p-0">
+                    {isFetching ? 
+                    <>
+                        <div className="row">
+                            <div className="col-12">
+                                <p className='text-mute'>Loading...</p>
+                            </div>
+                        </div>
+                    </>
+                    : isError ?
+                    <div className="row">
+                        <div className="col-12">
+                            <p className='text-danger'>{error?.message}</p>
+                        </div>
+                    </div>
+                    :
                     <div className="row">
                         <>
-                            {Object.entries(data)?.map(([key, value]) => (
+                        {!templates.length ?
+                            <p>No data Found</p>
+                            :
+                            templates.map(template => (
+                                <div key={template.template_uid} className="col-xl-6 col-sm-6">
+                                    <div className="card card-statistics">
+                                        <div className="card-body">
+                                            <div className="text-center p-2">
+                                                <div className="mb-2">
+                                                    <img  src={getImage('file-icon/svg.png')} alt={template.title} />
+                                                </div>
+                                                <h4 className="mb-0">{template.title}</h4>
+                                                <a href="#" className="btn btn-light">Activate</a>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            ))
+                        }
+                            {/* {Object.entries(data)?.map(([key, value]) => (
                                 <div key={key} className="col-xl-6 col-sm-6">
                                     <div className="card card-statistics">
                                         <div className="card-body">
@@ -41,9 +77,10 @@ const SiteTemplateSelector = memo(({name='Full Name', data, productData}) =>{
                                         </div>
                                     </div>
                                 </div>
-                            ))}
+                            ))} */}
                         </>
                     </div>
+                    }
                 </div>
             </div>
         )

src/component/profile_complete/ProfileCompleteCom.jsx

@@ -61,7 +61,9 @@ export default function ProfileCompleteCom(){
             return completeProfile(fields)
         },
         onError: () => {
-            setTimeout(()=>{mutation.reset()}, 4000)
+            setTimeout(() => {
+                mutation.reset()
+            }, 4000)
         },
         onSuccess: (res) => {
             if (res.data.resultCode != '0') {
@@ -133,7 +135,7 @@ export default function ProfileCompleteCom(){
                 :
                 <div className="row pt-1">
                     <div className="col-md-6 m-b-30">
-                    <div className="card card-statistics h-100 mb-0">
+                        <div className="card card-statistics h-100 mb-0" style={{borderRadius: '10px'}}>
                             {/* <div className="card-header d-flex align-items-center justify-content-between">
                             <div className="card-heading">
                                 <h4 className="card-title">My Product URLs</h4>
@@ -154,39 +156,64 @@ export default function ProfileCompleteCom(){
                                                             <option key={index} value={practice.practice}>{practice.practice}</option>
                                                         ))}
                                                     </select> */}
-                                                    <select onChange={handlePracticeChange} name='practice' value={initialValues.practice} className="form-control">
+                                                    <select onChange={handlePracticeChange} name='practice'
+                                                            value={initialValues.practice} className="form-control">
                                                         <option value=''>Select</option>
                                                         {practices.map((practice, index) => (
-                                                            <option key={index} value={practice.practice}>{practice.practice}</option>
+                                                            <option key={index}
+                                                                    value={practice.practice}>{practice.practice}</option>
                                                         ))}
                                                     </select>
-                                                    <IoMdArrowDropdown className='position-absolute w-auto' style={{top: '50%', right: '2px', transform: 'translateY(-50%)'}} /> 
+                                                    <IoMdArrowDropdown className='position-absolute w-auto' style={{
+                                                        top: '50%',
+                                                        right: '2px',
+                                                        transform: 'translateY(-50%)'
+                                                    }}/>
                                                 </div>
                                             </div>
                                         </div>
 
                                         <div className="">
                                             <div className="form-group">
-                                                <label className={`text-black fw-bold control-label`}>Specialization :</label>
+                                                <label className={`text-black fw-bold control-label`}>Your
+                                                    Specialization :</label>
                                                 <div className="position-relative">
-                                                    <select onChange={handlePracticeChange} name='specialization' value={initialValues.specialization} className="form-control">
+                                                    <select onChange={handlePracticeChange} name='specialization'
+                                                            value={initialValues.specialization}
+                                                            className="form-control">
                                                         <option value=''>Select</option>
                                                         {specialties.map((specialty, index) => (
                                                             <option key={index} value={specialty}>{specialty}</option>
                                                         ))}
                                                     </select>
-                                                    <IoMdArrowDropdown className='position-absolute w-auto' style={{top: '50%', right: '2px', transform: 'translateY(-50%)'}} /> 
+                                                    <IoMdArrowDropdown className='position-absolute w-auto' style={{
+                                                        top: '50%',
+                                                        right: '2px',
+                                                        transform: 'translateY(-50%)'
+                                                    }}/>
                                                 </div>
                                             </div>
                                         </div>
 
                                         <div className="">
                                             <div className="form-group position-relative">
-                                                <label className={`text-black fw-bold control-label`}>General Information :</label>
+                                                <label className={`text-black fw-bold control-label`}>Other General
-                                                <textarea name='introduction' rows={10} style={{resize: 'none'}} className="form-control" value={initialValues.introduction} onChange={handlePracticeChange} />
+                                                    Information :</label>
+                                                <textarea name='introduction' rows={10} style={{resize: 'none'}}
+                                                          className="form-control" value={initialValues.introduction}
+                                                          onChange={handlePracticeChange}/>
                                             </div>
                                         </div>
 
+                                        <div className="">
+                                            <div className="form-group position-relativ'e">
+                                                {/*<label className={`text-black fw-bold control-label`}>What we use this*/}
+                                                {/*    information for :</label>*/}
+                                                <div style={{fontSize: '14px', borderRadius: '10px', backgroundColor: 'aliceblue', fontWeight:'bolder', padding: '15px' }}>
+                                                    MERMS A.I. agents use the information supplied to help generate useful entries for your product settings.
+                                                </div>
+                                            </div>
+                                        </div>
 
                                         {(mutation.isError || mutation.isSuccess) &&
                                             <>
@@ -197,7 +224,8 @@ export default function ProfileCompleteCom(){
                                         }
 
                                         <div className="mt-auto text-end">
-                                            <button type='button' onClick={handleCompleteProfile} className="btn btn-primary text-uppercase">{mutation.isPending ? 'loading...' : 'Continue'}</button>
+                                            <button type='button' onClick={handleCompleteProfile}
+                                                    className="btn btn-primary text-uppercase">{mutation.isPending ? 'loading...' : 'Continue'}</button>
                                         </div>
                                     </>
                                     {/* </div> */}
@@ -207,7 +235,7 @@ export default function ProfileCompleteCom(){
                     </div>
                     <div className="col-md-6 m-b-30">
                         <div className="text-center img-block left-column wow fadeInRight">
-                        <img className="img-fluid" src={getImage('img-07.png')} alt="content-image" />
+                            <img className="img-fluid" src={getImage('tell-us-more.png')} alt="content-image"/>
                         </div>
                     </div>
                 </div>

src/component/settings/Settings.jsx

@@ -1,9 +1,10 @@
 import React from "react";
 import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
+import getImage from "../../utils/getImage";
 
 
 export default function Settings() {
-
+    const avtarImage = "avtar/merms-user.png";
     return (
         <>
             <BreadcrumbComBS title='Settings' paths={['Dashboard', 'Settings']}/>
@@ -22,39 +23,18 @@ export default function Settings(){
                                         <div className="profile-img text-center rounded-circle">
                                             <div className="pt-5">
                                                 <div className="bg-img m-auto">
-                                                    <img src="assets/img/avtar/01.jpg" className="img-fluid"
+                                                    {/*<img src="assets/img/avtar/01.jpg" className="img-fluid"*/}
-                                                         alt="users-avatar" />
+                                                    {/*     alt="users-avatar" />*/}
+                                                    <img src={getImage(avtarImage)}
+                                                         className="img-fluid" alt="user"/>
                                                 </div>
                                                 <div className="profile pt-4">
                                                     <h4 className="mb-1">Alice Williams</h4>
-                                                    <p>Enthusiast</p>
+                                                    <div style={{padding: '10px'}}>
+                                                        <hr/>
                                                     </div>
                                                 </div>
                                             </div>
-
-                                        <div className="py-5 profile-counter">
-                                            <ul className="nav justify-content-center text-center">
-                                                <li className="nav-item border-right px-3">
-                                                    <div>
-                                                        <h4 className="mb-0">90</h4>
-                                                        <p>Post</p>
-                                                    </div>
-                                                </li>
-
-                                                <li className="nav-item border-right px-3">
-                                                    <div>
-                                                        <h4 className="mb-0">1.5K</h4>
-                                                        <p>Messages</p>
-                                                    </div>
-                                                </li>
-
-                                                <li className="nav-item px-3">
-                                                    <div>
-                                                        <h4 className="mb-0">4.4K</h4>
-                                                        <p>Members</p>
-                                                    </div>
-                                                </li>
-                                            </ul>
                                         </div>
 
                                         <div className="profile-btn text-center">
@@ -205,7 +185,8 @@ export default function Settings(){
                                                            value="https://yourwebsite.com"/>
                                                 </div>
                                                 <div style={{textAlign: "right"}}>
-                                                    <button type="submit" className="btn btn-primary">Update Links</button>
+                                                    <button type="submit" className="btn btn-primary">Update Links
+                                                    </button>
                                                 </div>
 
                                             </form>

src/component/subscription/Subscription.jsx

@@ -6,7 +6,7 @@ import {useQuery} from '@tanstack/react-query';
 import queryKeys from '../../services/queryKeys';
 import siteLinks from "../../links/siteLinks";
 import {Link, useNavigate} from 'react-router-dom'
-import getDateFromDateString from '../../helpers/GetDateFromDateString';
+import getDateTimeFromDateString from '../../helpers/getDateTimeFromDateString';
 
 export default function Subscription() {
     const navigate = useNavigate()
@@ -57,8 +57,8 @@ export default function Subscription() {
                                         <h2 className="text-primary pt-3">{currentSubscription?.display_name}</h2>
                                     </div>
                                     <div className="pt-2" style={{textAlign: 'left'}}>
-                                        <div style={{fontSize: '10px'}}>
+                                        <div style={{fontSize: '12px', fontWeight: 'bolder' , color: "#3E3699"  }}>
-                                            Next Payment: {getDateFromDateString(currentSubscription?.next_payment)}
+                                            Next Payment: {getDateTimeFromDateString(currentSubscription?.next_payment)}
                                         </div>
                                     </div>
                                 </div>
@@ -84,11 +84,19 @@ export default function Subscription() {
 
                                             </div>
                                         </div>
-                                        <div className="pt-2">
+                                        <div className="pt-2" style={{fontWeight: 'bolder'}}>
+                                            {
+                                                (currentSubscription?.display_name == value.option_name) ? 'Current Subscription' :
                                                     <button onClick={() => {
-                                                navigate(siteLinks.subscribe, {state: {selectedSubscription: value, customerId: stripe_customer_id }})
+                                                        navigate(siteLinks.subscribe, {
+                                                            state: {
+                                                                selectedSubscription: value,
+                                                                customerId: stripe_customer_id
+                                                            }
+                                                        })
                                                     }}
                                                             className="btn btn-inverse-secondary btn-round btn-sm">Go {value.display_name}</button>
+                                            }
                                         </div>
                                     </div>
                                 </div>

src/css/style.scss

@@ -99,8 +99,13 @@ $event-padding: 10px;
   border-radius: 5px !important;
 }
 .billing{
-  background-color: darkgoldenrod;
+  background-color: #b9c2c5;
-  color: white;
+  color: #77117a;
+}
+
+.next_billing{
+  background-color: #cff1f0;
+  color: #19548e;
 }
 .extraProductCard{
   background-color: aliceblue;

src/helpers/getDateFromDateString.js

@@ -0,0 +1,17 @@
+function getDateFromDateString(dateString) {
+    const date = new Date(dateString);
+    
+    // Ensure the date is valid
+    if (isNaN(date)) {
+        return "Invalid date string";
+    }
+
+    // Get the year, month, and day
+    const year = date.getFullYear();
+    const month = String(date.getMonth() + 1).padStart(2, '0');  // Months are 0-indexed, so we add 1
+    const day = String(date.getDate()).padStart(2, '0');
+
+    return `${year}-${month}-${day}`;
+}
+
+export default getDateFromDateString

src/helpers/getDateTimeFromDateString.js

@@ -1,4 +1,4 @@
-function getDateFromDateString(dateString) {
+function getDateTimeFromDateString(dateString) {
   const date = new Date(dateString);
 
   const days = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
@@ -30,4 +30,4 @@ function getDateFromDateString(dateString) {
   return `${dayName}, ${monthName} ${day}${getOrdinal(day)} ${year} ${hours}:${minutes}${ampm}`;
 }
 
-export default getDateFromDateString
+export default getDateTimeFromDateString

src/services/queryKeys.js

@@ -1,6 +1,7 @@
 const queryKeys = {
     user_details: ['user_details'],
     product_url: ['product_url'],
+    dash_payments: ['dash_payments'],
     products: ['product-data'],
     myproduct_provision: ['myproduct_provision'],
     product_page: ['product_page'],

src/services/services.js

@@ -114,6 +114,14 @@ export const productsURL = (reqData) => {
     return postAuxEnd(`/panel/account/products/url`, postData, false)
 }
 
+// FUNCTION TO GET DASHBOARD PRODUCT URL DATA SECTION
+export const getDashPayments = (reqData) => {
+    let postData = {
+        ...reqData,
+    }
+    return postAuxEnd(`/panel/account/payments`, postData, false)
+}
+
 // FUNCTION TO GET DASHBOARD PRODUCT DATA SECTION
 export const productsData = (reqData) => {
     let postData = {