initial commit

src/app/[lang]/(dashboard)/(private)/apps/academy/course-details/page.tsx

@@ -0,0 +1,47 @@
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Component Imports
+import Details from '@views/apps/academy/course-details/Details'
+import Sidebar from '@views/apps/academy/course-details/Sidebar'
+
+// Data Imports
+import { getAcademyData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/academy` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getAcademyData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/academy`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch academy data')
+  }
+
+  return res.json()
+} */
+
+const CourseDetailsPage = async () => {
+  // Vars
+  const data = await getAcademyData()
+
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12, md: 8 }}>
+        <Details data={data?.courseDetails} />
+      </Grid>
+      <Grid size={{ xs: 12, md: 4 }}>
+        <div className='sticky top-[94px]'>
+          <Sidebar content={data?.courseDetails.content} />
+        </div>
+      </Grid>
+    </Grid>
+  )
+}
+
+export default CourseDetailsPage

src/app/[lang]/(dashboard)/(private)/apps/academy/dashboard/page.tsx

@@ -0,0 +1,65 @@
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Component Imports
+import WelcomeCard from '@views/apps/academy/dashboard/WelcomeCard'
+import InterestedTopics from '@views/apps/academy/dashboard/InterestedTopics'
+import PopularInstructors from '@views/apps/academy/dashboard/PopularInstructors'
+import TopCourses from '@views/apps/academy/dashboard/TopCourses'
+import UpcomingWebinar from '@views/apps/academy/dashboard/UpcomingWebinar'
+import AssignmentProgress from '@views/apps/academy/dashboard/AssignmentProgress'
+import CourseTable from '@views/apps/academy/dashboard/CourseTable'
+
+// Data Imports
+import { getAcademyData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/academy` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getAcademyData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/academy`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch academy data')
+  }
+
+  return res.json()
+} */
+
+const AcademyDashboard = async () => {
+  // Vars
+  const data = await getAcademyData()
+
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12 }}>
+        <WelcomeCard />
+      </Grid>
+      <Grid size={{ xs: 12, md: 8 }}>
+        <InterestedTopics />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, md: 4 }}>
+        <PopularInstructors />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, md: 4 }}>
+        <TopCourses />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, md: 4 }}>
+        <UpcomingWebinar />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, md: 4 }}>
+        <AssignmentProgress />
+      </Grid>
+      <Grid size={{ xs: 12 }}>
+        <CourseTable courseData={data?.courses} />
+      </Grid>
+    </Grid>
+  )
+}
+
+export default AcademyDashboard

src/app/[lang]/(dashboard)/(private)/apps/academy/my-courses/page.tsx

@@ -0,0 +1,36 @@
+// Component Imports
+import AcademyMyCourse from '@/views/apps/academy/my-courses'
+
+// Server Action Imports
+import { getServerMode } from '@core/utils/serverHelpers'
+
+// Data Imports
+import { getAcademyData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/academy` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getAcademyData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/academy`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch academy data')
+  }
+
+  return res.json()
+} */
+
+const MyCoursePage = async () => {
+  // Vars
+  const mode = await getServerMode()
+  const data = await getAcademyData()
+
+  return <AcademyMyCourse mode={mode} courseData={data?.courses} />
+}
+
+export default MyCoursePage

src/app/[lang]/(dashboard)/(private)/apps/calendar/page.tsx

@@ -0,0 +1,20 @@
+// MUI Imports
+import Card from '@mui/material/Card'
+
+// Component Imports
+import CalendarWrapper from '@views/apps/calendar/CalendarWrapper'
+
+// Styled Component Imports
+import AppFullCalendar from '@/libs/styles/AppFullCalendar'
+
+const CalendarApp = () => {
+  return (
+    <Card className='overflow-visible'>
+      <AppFullCalendar className='app-calendar'>
+        <CalendarWrapper />
+      </AppFullCalendar>
+    </Card>
+  )
+}
+
+export default CalendarApp

src/app/[lang]/(dashboard)/(private)/apps/chat/page.tsx

@@ -0,0 +1,8 @@
+// Component Imports
+import ChatWrapper from '@views/apps/chat'
+
+const ChatApp = () => {
+  return <ChatWrapper />
+}
+
+export default ChatApp

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/customers/details/[id]/page.tsx

@@ -0,0 +1,46 @@
+// Next Imports
+import { redirect } from 'next/navigation'
+
+// Type Imports
+import type { Customer } from '@/types/apps/ecommerceTypes'
+
+// Component Imports
+import CustomerDetails from '@/views/apps/ecommerce/customers/details'
+
+// Data Imports
+import { getEcommerceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/ecommerce` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getEcommerceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/ecommerce`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch ecommerce data')
+  }
+
+  return res.json()
+} */
+
+const CustomerDetailsPage = async (props: { params: Promise<{ id: string }> }) => {
+  const params = await props.params
+
+  // Vars
+  const data = await getEcommerceData()
+
+  const filteredData = data?.customerData.filter((item: Customer) => item.customerId === params.id)[0]
+
+  if (!filteredData) {
+    redirect('/not-found')
+  }
+
+  return filteredData ? <CustomerDetails customerData={filteredData} customerId={params.id} /> : null
+}
+
+export default CustomerDetailsPage

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/customers/list/page.tsx

@@ -0,0 +1,31 @@
+import CustomerListTable from '@views/apps/ecommerce/customers/list/CustomerListTable'
+
+// Data Imports
+import { getEcommerceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/ecommerce` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getEcommerceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/ecommerce`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch ecommerce data')
+  }
+
+  return res.json()
+} */
+
+const CustomerListTablePage = async () => {
+  // Vars
+  const data = await getEcommerceData()
+
+  return <CustomerListTable customerData={data?.customerData} />
+}
+
+export default CustomerListTablePage

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/dashboard/page.tsx

@@ -0,0 +1,86 @@
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Components Imports
+import CongratulationsJohn from '@views/apps/ecommerce/dashboard/Congratulations'
+import StatisticsCard from '@views/apps/ecommerce/dashboard/StatisticsCard'
+import LineChartProfit from '@views/apps/ecommerce/dashboard/LineChartProfit'
+import RadialBarChart from '@views/apps/ecommerce/dashboard/RadialBarChart'
+import DonutChartGeneratedLeads from '@views/apps/ecommerce/dashboard/DonutChartGeneratedLeads'
+import RevenueReport from '@views/apps/ecommerce/dashboard/RevenueReport'
+import EarningReports from '@views/apps/ecommerce/dashboard/EarningReports'
+import PopularProducts from '@views/apps/ecommerce/dashboard/PopularProducts'
+import Orders from '@views/apps/ecommerce/dashboard/Orders'
+import Transactions from '@views/apps/ecommerce/dashboard/Transactions'
+import InvoiceListTable from '@views/apps/ecommerce/dashboard/InvoiceListTable'
+
+// Data Imports
+import { getInvoiceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/invoice` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getInvoiceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/invoice`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch invoice data')
+  }
+
+  return res.json()
+}
+ */
+
+const EcommerceDashboard = async () => {
+  // Vars
+  const invoiceData = await getInvoiceData()
+
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12, md: 4 }}>
+        <CongratulationsJohn />
+      </Grid>
+      <Grid size={{ xs: 12, md: 8 }}>
+        <StatisticsCard />
+      </Grid>
+      <Grid size={{ xs: 12, xl: 4 }}>
+        <Grid container spacing={6}>
+          <Grid size={{ xs: 12, sm: 6, md: 3, xl: 6 }}>
+            <LineChartProfit />
+          </Grid>
+          <Grid size={{ xs: 12, sm: 6, md: 3, xl: 6 }}>
+            <RadialBarChart />
+          </Grid>
+          <Grid size={{ xs: 12, md: 6, xl: 12 }}>
+            <DonutChartGeneratedLeads />
+          </Grid>
+        </Grid>
+      </Grid>
+      <Grid size={{ xs: 12, xl: 8 }}>
+        <RevenueReport />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, lg: 4 }}>
+        <EarningReports />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, lg: 4 }}>
+        <PopularProducts />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, lg: 4 }}>
+        <Orders />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, lg: 4 }}>
+        <Transactions />
+      </Grid>
+      <Grid size={{ xs: 12, lg: 8 }}>
+        <InvoiceListTable invoiceData={invoiceData} />
+      </Grid>
+    </Grid>
+  )
+}
+
+export default EcommerceDashboard

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/manage-reviews/page.tsx

@@ -0,0 +1,49 @@
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Component Imports
+import TotalReviews from '@views/apps/ecommerce/manage-reviews/TotalReviews'
+import ReviewsStatistics from '@views/apps/ecommerce/manage-reviews/ReviewsStatistics'
+import ManageReviewsTable from '@views/apps/ecommerce/manage-reviews/ManageReviewsTable'
+
+// Data Imports
+import { getEcommerceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/ecommerce` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getEcommerceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/ecommerce`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch ecommerce data')
+  }
+
+  return res.json()
+} */
+
+const eCommerceManageReviews = async () => {
+  // Vars
+  const data = await getEcommerceData()
+
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12, md: 6 }}>
+        <TotalReviews />
+      </Grid>
+      <Grid size={{ xs: 12, md: 6 }}>
+        <ReviewsStatistics />
+      </Grid>
+      <Grid size={{ xs: 12 }}>
+        <ManageReviewsTable reviewsData={data?.reviews} />
+      </Grid>
+    </Grid>
+  )
+}
+
+export default eCommerceManageReviews

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/orders/details/[id]/page.tsx

@@ -0,0 +1,46 @@
+// Next Imports
+import { redirect } from 'next/navigation'
+
+// Type Imports
+import type { OrderType } from '@/types/apps/ecommerceTypes'
+
+// Component Imports
+import OrderDetails from '@views/apps/ecommerce/orders/details'
+
+// Data Imports
+import { getEcommerceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/ecommerce` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getEcommerceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/ecommerce`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch ecommerce data')
+  }
+
+  return res.json()
+} */
+
+const OrderDetailsPage = async (props: { params: Promise<{ id: string }> }) => {
+  const params = await props.params
+
+  // Vars
+  const data = await getEcommerceData()
+
+  const filteredData = data?.orderData.filter((item: OrderType) => item.order === params.id)[0]
+
+  if (!filteredData) {
+    redirect('/not-found')
+  }
+
+  return filteredData ? <OrderDetails orderData={filteredData} order={params.id} /> : null
+}
+
+export default OrderDetailsPage

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/orders/list/page.tsx

@@ -0,0 +1,32 @@
+// Component Imports
+import OrderList from '@views/apps/ecommerce/orders/list'
+
+// Data Imports
+import { getEcommerceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/ecommerce` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getEcommerceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/ecommerce`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch ecommerce data')
+  }
+
+  return res.json()
+} */
+
+const OrdersListPage = async () => {
+  // Vars
+  const data = await getEcommerceData()
+
+  return <OrderList orderData={data?.orderData} />
+}
+
+export default OrdersListPage

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/products/add/page.tsx

@@ -0,0 +1,49 @@
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Component Imports
+import ProductAddHeader from '@views/apps/ecommerce/products/add/ProductAddHeader'
+import ProductInformation from '@views/apps/ecommerce/products/add/ProductInformation'
+import ProductImage from '@views/apps/ecommerce/products/add/ProductImage'
+import ProductVariants from '@views/apps/ecommerce/products/add/ProductVariants'
+import ProductInventory from '@views/apps/ecommerce/products/add/ProductInventory'
+import ProductPricing from '@views/apps/ecommerce/products/add/ProductPricing'
+import ProductOrganize from '@views/apps/ecommerce/products/add/ProductOrganize'
+
+const eCommerceProductsAdd = () => {
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12 }}>
+        <ProductAddHeader />
+      </Grid>
+      <Grid size={{ xs: 12, md: 8 }}>
+        <Grid container spacing={6}>
+          <Grid size={{ xs: 12 }}>
+            <ProductInformation />
+          </Grid>
+          <Grid size={{ xs: 12 }}>
+            <ProductImage />
+          </Grid>
+          <Grid size={{ xs: 12 }}>
+            <ProductVariants />
+          </Grid>
+          <Grid size={{ xs: 12 }}>
+            <ProductInventory />
+          </Grid>
+        </Grid>
+      </Grid>
+      <Grid size={{ xs: 12, md: 4 }}>
+        <Grid container spacing={6}>
+          <Grid size={{ xs: 12 }}>
+            <ProductPricing />
+          </Grid>
+          <Grid size={{ xs: 12 }}>
+            <ProductOrganize />
+          </Grid>
+        </Grid>
+      </Grid>
+    </Grid>
+  )
+}
+
+export default eCommerceProductsAdd

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/products/category/page.tsx

@@ -0,0 +1,8 @@
+// Component Imports
+import ProductCategoryTable from '@views/apps/ecommerce/products/category/ProductCategoryTable'
+
+const eCommerceProductsCategory = () => {
+  return <ProductCategoryTable />
+}
+
+export default eCommerceProductsCategory

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/products/list/page.tsx

@@ -0,0 +1,45 @@
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Component Imports
+import ProductCard from '@views/apps/ecommerce/products/list/ProductCard'
+import ProductListTable from '@views/apps/ecommerce/products/list/ProductListTable'
+
+// Data Imports
+import { getEcommerceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/ecommerce` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getEcommerceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/ecommerce`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch ecommerce data')
+  }
+
+  return res.json()
+} */
+
+const eCommerceProductsList = async () => {
+  // Vars
+  const data = await getEcommerceData()
+
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12 }}>
+        <ProductCard />
+      </Grid>
+      <Grid size={{ xs: 12 }}>
+        <ProductListTable />
+      </Grid>
+    </Grid>
+  )
+}
+
+export default eCommerceProductsList

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/referrals/page.tsx

@@ -0,0 +1,72 @@
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Component Imports
+import HorizontalStatisticsCard from '@views/apps/ecommerce/referrals/HorizontalStatisticsCard'
+import IconStepsCard from '@views/apps/ecommerce/referrals/IconStepsCard'
+import InviteAndShare from '@views/apps/ecommerce/referrals/InviteAndShare'
+import ReferredUsersTable from '@views/apps/ecommerce/referrals/ReferredUsersTable'
+
+// Data Imports
+import { getEcommerceData, getStatisticsData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/pages/widget-examples` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getStatisticsData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/pages/widget-examples`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch statistics data')
+  }
+
+  return res.json()
+} */
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/ecommerce` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getEcommerceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/ecommerce`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch ecommerce data')
+  }
+
+  return res.json()
+} */
+
+const eCommerceReferrals = async () => {
+  // Vars
+  const statsData = await getStatisticsData()
+  const ecommerceData = await getEcommerceData()
+
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12 }}>
+        <HorizontalStatisticsCard data={statsData?.statsHorizontalWithAvatar} />
+      </Grid>
+      <Grid size={{ xs: 12, md: 8 }}>
+        <IconStepsCard />
+      </Grid>
+      <Grid size={{ xs: 12, md: 4 }}>
+        <InviteAndShare />
+      </Grid>
+      <Grid size={{ xs: 12 }}>
+        <ReferredUsersTable referralsData={ecommerceData?.referrals} />
+      </Grid>
+    </Grid>
+  )
+}
+
+export default eCommerceReferrals

src/app/[lang]/(dashboard)/(private)/apps/ecommerce/settings/page.tsx

@@ -0,0 +1,31 @@
+// React Imports
+import type { ReactElement } from 'react'
+
+// Next Imports
+import dynamic from 'next/dynamic'
+
+// Component Imports
+import Settings from '@views/apps/ecommerce/settings'
+
+const StoreDetailsTab = dynamic(() => import('@views/apps/ecommerce/settings/store-details'))
+const PaymentsTab = dynamic(() => import('@views/apps/ecommerce/settings/payments'))
+const CheckoutTab = dynamic(() => import('@views/apps/ecommerce/settings/checkout'))
+const ShippingDeliveryTab = dynamic(() => import('@views/apps/ecommerce/settings/ShippingDelivery'))
+const LocationsTab = dynamic(() => import('@views/apps/ecommerce/settings/locations'))
+const NotificationsTab = dynamic(() => import('@views/apps/ecommerce/settings/Notifications'))
+
+// Vars
+const tabContentList = (): { [key: string]: ReactElement } => ({
+  'store-details': <StoreDetailsTab />,
+  payments: <PaymentsTab />,
+  checkout: <CheckoutTab />,
+  'shipping-delivery': <ShippingDeliveryTab />,
+  locations: <LocationsTab />,
+  notifications: <NotificationsTab />
+})
+
+const eCommerceSettings = () => {
+  return <Settings tabContentList={tabContentList()} />
+}
+
+export default eCommerceSettings

src/app/[lang]/(dashboard)/(private)/apps/email/[folder]/page.tsx

@@ -0,0 +1,10 @@
+// Component Imports
+import EmailWrapper from '@views/apps/email'
+
+const EmailFolderPage = async (props: { params: Promise<{ folder: string }> }) => {
+  const params = await props.params
+
+  return <EmailWrapper folder={params.folder} />
+}
+
+export default EmailFolderPage

src/app/[lang]/(dashboard)/(private)/apps/email/label/[label]/page.tsx

@@ -0,0 +1,10 @@
+// Component Imports
+import EmailWrapper from '@views/apps/email'
+
+const EmailLabelPage = async (props: { params: Promise<{ label: string }> }) => {
+  const params = await props.params
+
+  return <EmailWrapper label={params.label} />
+}
+
+export default EmailLabelPage

src/app/[lang]/(dashboard)/(private)/apps/email/page.tsx

@@ -0,0 +1,8 @@
+// Component Imports
+import EmailWrapper from '@views/apps/email'
+
+const EmailPage = () => {
+  return <EmailWrapper folder='inbox' />
+}
+
+export default EmailPage

src/app/[lang]/(dashboard)/(private)/apps/invoice/add/page.tsx

@@ -0,0 +1,45 @@
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Component Imports
+import AddCard from '@views/apps/invoice/add/AddCard'
+import AddActions from '@views/apps/invoice/add/AddActions'
+
+// Data Imports
+import { getInvoiceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/invoice` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getInvoiceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/invoice`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch invoice data')
+  }
+
+  return res.json()
+}
+ */
+const InvoiceAdd = async () => {
+  // Vars
+  const data = await getInvoiceData()
+
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12, md: 9 }}>
+        <AddCard invoiceData={data} />
+      </Grid>
+      <Grid size={{ xs: 12, md: 3 }}>
+        <AddActions />
+      </Grid>
+    </Grid>
+  )
+}
+
+export default InvoiceAdd

src/app/[lang]/(dashboard)/(private)/apps/invoice/edit/[id]/page.tsx

@@ -0,0 +1,59 @@
+// Next Imports
+import { redirect } from 'next/navigation'
+
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Type Imports
+import type { InvoiceType } from '@/types/apps/invoiceTypes'
+
+// Component Imports
+import EditCard from '@views/apps/invoice/edit/EditCard'
+import EditActions from '@views/apps/invoice/edit/EditActions'
+
+// Data Imports
+import { getInvoiceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/invoice` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getInvoiceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/invoice`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch invoice data')
+  }
+
+  return res.json()
+} */
+
+const EditPage = async (props: { params: Promise<{ id: string }> }) => {
+  const params = await props.params
+
+  // Vars
+  const data = await getInvoiceData()
+
+  const filteredData = data?.filter((invoice: InvoiceType) => invoice.id === params.id)[0]
+
+  if (!filteredData) {
+    redirect('/not-found')
+  }
+
+  return filteredData ? (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12, md: 9 }}>
+        <EditCard data={data} invoiceData={filteredData} id={params.id} />
+      </Grid>
+      <Grid size={{ xs: 12, md: 3 }}>
+        <EditActions id={params.id} />
+      </Grid>
+    </Grid>
+  ) : null
+}
+
+export default EditPage

src/app/[lang]/(dashboard)/(private)/apps/invoice/list/page.tsx

@@ -0,0 +1,41 @@
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Component Imports
+import InvoiceList from '@views/apps/invoice/list'
+
+// Data Imports
+import { getInvoiceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/invoice` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getInvoiceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/invoice`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch invoice data')
+  }
+
+  return res.json()
+} */
+
+const InvoiceApp = async () => {
+  // Vars
+  const data = await getInvoiceData()
+
+  return (
+    <Grid container>
+      <Grid size={{ xs: 12 }}>
+        <InvoiceList invoiceData={data} />
+      </Grid>
+    </Grid>
+  )
+}
+
+export default InvoiceApp

src/app/[lang]/(dashboard)/(private)/apps/invoice/preview/[id]/page.tsx

@@ -0,0 +1,46 @@
+// Next Imports
+import { redirect } from 'next/navigation'
+
+// Type Imports
+import type { InvoiceType } from '@/types/apps/invoiceTypes'
+
+// Component Imports
+import Preview from '@views/apps/invoice/preview'
+
+// Data Imports
+import { getInvoiceData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/invoice` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getInvoiceData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/invoice`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch invoice data')
+  }
+
+  return res.json()
+} */
+
+const PreviewPage = async (props: { params: Promise<{ id: string }> }) => {
+  const params = await props.params
+
+  // Vars
+  const data = await getInvoiceData()
+
+  const filteredData = data?.filter((invoice: InvoiceType) => invoice.id === params.id)[0]
+
+  if (!filteredData) {
+    redirect('/not-found')
+  }
+
+  return filteredData ? <Preview invoiceData={filteredData} id={params.id} /> : null
+}
+
+export default PreviewPage

src/app/[lang]/(dashboard)/(private)/apps/kanban/page.tsx

@@ -0,0 +1,27 @@
+// Third-party Imports
+import classnames from 'classnames'
+
+// Component Imports
+import KanbanBoard from '@views/apps/kanban/KanbanBoard'
+
+// Util Imports
+import { commonLayoutClasses } from '@layouts/utils/layoutClasses'
+
+// Styles Imports
+import styles from '@views/apps/kanban/styles.module.css'
+
+const KanbanPage = () => {
+  return (
+    <div
+      className={classnames(
+        commonLayoutClasses.contentHeightFixed,
+        styles.scroll,
+        'is-full overflow-auto pis-2 -mis-2'
+      )}
+    >
+      <KanbanBoard />
+    </div>
+  )
+}
+
+export default KanbanPage

src/app/[lang]/(dashboard)/(private)/apps/logistics/dashboard/page.tsx

@@ -0,0 +1,84 @@
+//MUI Imports
+import Grid from '@mui/material/Grid2'
+
+//Component Imports
+import LogisticsStatisticsCard from '@views/apps/logistics/dashboard/LogisticsStatisticsCard'
+import LogisticsVehicleOverview from '@views/apps/logistics/dashboard/LogisticsVehicleOverview'
+import LogisticsShipmentStatistics from '@views/apps/logistics/dashboard/LogisticsShipmentStatistics'
+import LogisticsDeliveryPerformance from '@views/apps/logistics/dashboard/LogisticsDeliveryPerformance'
+import LogisticsDeliveryExceptions from '@views/apps/logistics/dashboard/LogisticsDeliveryExceptions'
+import LogisticsOrdersByCountries from '@/views/apps/logistics/dashboard/LogisticsOrdersByCountries'
+import LogisticsOverviewTable from '@views/apps/logistics/dashboard/LogisticsOverviewTable'
+
+//Data Imports
+import { getLogisticsData, getStatisticsData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/pages/widget-examples` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getStatisticsData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/pages/widget-examples`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch statisticsData')
+  }
+
+  return res.json()
+} */
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/logistics` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getLogisticsData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/logistics`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch logistics data')
+  }
+
+  return res.json()
+} */
+
+const LogisticsDashboard = async () => {
+  // Vars
+  const data = await getStatisticsData()
+  const vehicleData = await getLogisticsData()
+
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12 }}>
+        <LogisticsStatisticsCard data={data?.statsHorizontalWithBorder} />
+      </Grid>
+      <Grid size={{ xs: 12, md: 6 }}>
+        <LogisticsVehicleOverview />
+      </Grid>
+      <Grid size={{ xs: 12, md: 6 }}>
+        <LogisticsShipmentStatistics />
+      </Grid>
+      <Grid size={{ xs: 12, md: 4 }}>
+        <LogisticsDeliveryPerformance />
+      </Grid>
+      <Grid size={{ xs: 12, md: 4 }}>
+        <LogisticsDeliveryExceptions />
+      </Grid>
+      <Grid size={{ xs: 12, md: 4 }}>
+        <LogisticsOrdersByCountries />
+      </Grid>
+      <Grid size={{ xs: 12 }}>
+        <LogisticsOverviewTable vehicleData={vehicleData?.vehicles} />
+      </Grid>
+    </Grid>
+  )
+}
+
+export default LogisticsDashboard

src/app/[lang]/(dashboard)/(private)/apps/logistics/fleet/page.tsx

@@ -0,0 +1,8 @@
+// Component Imports
+import Fleet from '@views/apps/logistics/fleet'
+
+const FleetPage = () => {
+  return <Fleet mapboxAccessToken={process.env.MAPBOX_ACCESS_TOKEN!} />
+}
+
+export default FleetPage

src/app/[lang]/(dashboard)/(private)/apps/permissions/page.tsx

@@ -0,0 +1,32 @@
+// Component Imports
+import Permissions from '@views/apps/permissions'
+
+// Data Imports
+import { getPermissionsData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/permissions` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getPermissionsData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/permissions`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch permissions data')
+  }
+
+  return res.json()
+} */
+
+const PermissionsApp = async () => {
+  // Vars
+  const data = await getPermissionsData()
+
+  return <Permissions permissionsData={data} />
+}
+
+export default PermissionsApp

src/app/[lang]/(dashboard)/(private)/apps/roles/page.tsx

@@ -0,0 +1,32 @@
+// Component Imports
+import Roles from '@views/apps/roles'
+
+// Data Imports
+import { getUserData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/user-list` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getUserData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/user-list`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch userData')
+  }
+
+  return res.json()
+} */
+
+const RolesApp = async () => {
+  // Vars
+  const data = await getUserData()
+
+  return <Roles userData={data} />
+}
+
+export default RolesApp

src/app/[lang]/(dashboard)/(private)/apps/user/list/page.tsx

@@ -0,0 +1,32 @@
+// Component Imports
+import UserList from '@views/apps/user/list'
+
+// Data Imports
+import { getUserData } from '@/app/server/actions'
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/apps/user-list` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getUserData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/apps/user-list`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch userData')
+  }
+
+  return res.json()
+} */
+
+const UserListApp = async () => {
+  // Vars
+  const data = await getUserData()
+
+  return <UserList userData={data} />
+}
+
+export default UserListApp

src/app/[lang]/(dashboard)/(private)/apps/user/view/page.tsx

@@ -0,0 +1,69 @@
+// React Imports
+import type { ReactElement } from 'react'
+
+// Next Imports
+import dynamic from 'next/dynamic'
+
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Type Imports
+import type { PricingPlanType } from '@/types/pages/pricingTypes'
+
+// Component Imports
+import UserLeftOverview from '@views/apps/user/view/user-left-overview'
+import UserRight from '@views/apps/user/view/user-right'
+
+// Data Imports
+import { getPricingData } from '@/app/server/actions'
+
+const OverViewTab = dynamic(() => import('@views/apps/user/view/user-right/overview'))
+const SecurityTab = dynamic(() => import('@views/apps/user/view/user-right/security'))
+const BillingPlans = dynamic(() => import('@views/apps/user/view/user-right/billing-plans'))
+const NotificationsTab = dynamic(() => import('@views/apps/user/view/user-right/notifications'))
+const ConnectionsTab = dynamic(() => import('@views/apps/user/view/user-right/connections'))
+
+// Vars
+const tabContentList = (data?: PricingPlanType[]): { [key: string]: ReactElement } => ({
+  overview: <OverViewTab />,
+  security: <SecurityTab />,
+  'billing-plans': <BillingPlans data={data} />,
+  notifications: <NotificationsTab />,
+  connections: <ConnectionsTab />
+})
+
+/**
+ * ! If you need data using an API call, uncomment the below API code, update the `process.env.API_URL` variable in the
+ * ! `.env` file found at root of your project and also update the API endpoints like `/pages/pricing` in below example.
+ * ! Also, remove the above server action import and the action itself from the `src/app/server/actions.ts` file to clean up unused code
+ * ! because we've used the server action for getting our static data.
+ */
+
+/* const getPricingData = async () => {
+  // Vars
+  const res = await fetch(`${process.env.API_URL}/pages/pricing`)
+
+  if (!res.ok) {
+    throw new Error('Failed to fetch data')
+  }
+
+  return res.json()
+} */
+
+const UserViewTab = async () => {
+  // Vars
+  const data = await getPricingData()
+
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12, lg: 4, md: 5 }}>
+        <UserLeftOverview />
+      </Grid>
+      <Grid size={{ xs: 12, lg: 8, md: 7 }}>
+        <UserRight tabContentList={tabContentList(data)} />
+      </Grid>
+    </Grid>
+  )
+}
+
+export default UserViewTab