account view endpoint added

src/components/account_view/AccountViewCom.jsx

@@ -1,16 +1,55 @@
 import {useEffect, useState} from 'react'
-import {Link} from 'react-router-dom'
+import { useQuery } from '@tanstack/react-query'
+
+import {useLocation, useNavigate, Link} from 'react-router-dom'
 
 import BreadcrumbCom from '../breadcrumb/BreadcrumbCom'
+import RouteLinks from '../../RouteLinks'
+import { getAccountView } from '../../services/siteServices'
+import queryKeys from '../../services/queryKeys'
 
 export default function AccountViewCom() {
 
+    const {state:{memberUID}} = useLocation()
+    const navigate = useNavigate()
+
+    useEffect(()=>{
+        if(!memberUID){
+            navigate(RouteLinks.customerPage, {replace: true})
+        }
+    },[])
+
+    const {data, isFetching, isError, error} = useQuery({
+        queryKey: queryKeys.account_view,
+        queryFn: () => {
+            // const filterData = filter?.type ? {[filter?.type]: filter.id} : {}
+            const reqData = {
+                member_uid: memberUID
+                // page,
+                // ...filterData
+            }
+            return getAccountView(reqData)
+        },
+        staleTime: 0 //0 mins
+    })
+    const accountsViewData = data?.data?.products // ACCOUNT VIEW DATA
+    const pagination = data?.data?.pagination
+    console.log('DATA', data?.data)
+
     return (
         <div className='w-full flex flex-col gap-8'>
-            <BreadcrumbCom title='Account View [PUT MEMBER_UID]' paths={['Dashboard', 'Account View']}/>
+            <BreadcrumbCom title={`Account View [${memberUID}]`} paths={['Dashboard', 'Account View']}/>
 
             <div className='box bg-white dark:bg-black-box text-black-body dark:text-white-body'>
-
+                {isFetching ? 
+                <>
+                    <p className='text-slate-800'>Loading...</p>
+                </>
+                : isError ?
+                    <p className='text-red-500'>{error.message}</p>
+                :
+                    <p className='text-slate-800'>coming soon</p>
+                }
 
             </div>
         </div>