24 changed files with 423 additions and 882 deletions
--- a/.idea/.gitignore
+++ b/.idea/.gitignore
@ -1,5 +0,0 @@
-# Default ignored files
-/shelf/
-/workspace.xml
-# Editor-based HTTP Client requests
-/httpRequests/
--- a/.idea/inspectionProfiles/Project_Default.xml
+++ b/.idea/inspectionProfiles/Project_Default.xml
@ -1,7 +0,0 @@
-<component name="InspectionProjectProfileManager">
-  <profile version="1.0">
-    <option name="myName" value="Project Default" />
-    <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
-    <inspection_tool class="Stylelint" enabled="true" level="ERROR" enabled_by_default="true" />
-  </profile>
-</component>
--- a/.idea/modules.xml
+++ b/.idea/modules.xml
@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectModuleManager">
-    <modules>
-      <module fileurl="file://$PROJECT_DIR$/.idea/pos-dashboard-v2.iml" filepath="$PROJECT_DIR$/.idea/pos-dashboard-v2.iml" />
-    </modules>
-  </component>
-</project>
--- a/.idea/pos-dashboard-v2.iml
+++ b/.idea/pos-dashboard-v2.iml
@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="WEB_MODULE" version="4">
-  <component name="NewModuleRootManager">
-    <content url="file://$MODULE_DIR$">
-      <excludeFolder url="file://$MODULE_DIR$/temp" />
-      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
-      <excludeFolder url="file://$MODULE_DIR$/tmp" />
-    </content>
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>
--- a/.idea/vcs.xml
+++ b/.idea/vcs.xml
@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="" vcs="Git" />
-  </component>
-</project>
--- a/52
+++ b/52
@ -1,52 +0,0 @@
-# Build stage
-FROM node:18-alpine AS builder
-WORKDIR /app
-
-# Build arguments for environment variables
-ARG NEXT_PUBLIC_APP_URL
-ARG NEXT_PUBLIC_DOCS_URL
-ARG NEXT_PUBLIC_API_URL
-ARG API_URL
-ARG BASEPATH
-ARG MAPBOX_ACCESS_TOKEN
-
-# Set environment variables for build
-ENV API_URL=$API_URL
-ENV BASEPATH=$BASEPATH
-ENV MAPBOX_ACCESS_TOKEN=$MAPBOX_ACCESS_TOKEN
-ENV NEXT_PUBLIC_APP_URL=$NEXT_PUBLIC_APP_URL
-ENV NEXT_PUBLIC_DOCS_URL=$NEXT_PUBLIC_DOCS_URL
-ENV NEXT_PUBLIC_API_URL=$NEXT_PUBLIC_API_URL
-
-# Copy all files first
-COPY . .
-
-# Install dependencies
-RUN npm ci
-
-# Build icons
-RUN npm run build:icons
-
-# Build the application without linting
-RUN npm run build:no-lint
-
-# Production stage
-FROM node:18-alpine AS runner
-WORKDIR /app
-
-ENV NODE_ENV=production
-
-RUN addgroup -g 1001 -S nodejs
-RUN adduser -S nextjs -u 1001
-
-COPY --from=builder /app/public ./public
-COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
-COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
-
-USER nextjs
-
-EXPOSE 8080
-
-ENV PORT=8080
-
-CMD ["node", "server.js"]
--- a/deployment.sh
+++ b/deployment.sh
@ -1,19 +0,0 @@
-#!/bin/bash
-
-APP_NAME="apskel-frontend"
-PORT="8080"
-
-echo "🔄 Pulling latest code..."
-git pull
-
-echo "🐳 Building Docker image..."
-docker build -t apskel-frontend .
-
-docker stop $APP_NAME 2>/dev/null
-docker rm $APP_NAME 2>/dev/null
-
-docker run -d --name $APP_NAME \
-  -p 8080:$PORT \
-  $APP_NAME:latest
-
-echo "✅ Deployment complete."
--- a/next.config.ts
+++ b/next.config.ts
@ -1,34 +1,29 @@
 import type { NextConfig } from 'next'

 const nextConfig: NextConfig = {
-  output: 'standalone',
  basePath: process.env.BASEPATH,
-  eslint: {
-    ignoreDuringBuilds: true,
-  },
-  typescript: {
-    ignoreBuildErrors: true,
-  },
-  redirects: async () => [
+  redirects: async () => {
+    return [
      {
        source: '/',
        destination: '/en/dashboards/overview',
        permanent: true,
-      locale: false,
+        locale: false
      },
      {
        source: '/:lang(en|fr|ar)',
        destination: '/:lang/dashboards/overview',
        permanent: true,
-      locale: false,
+        locale: false
      },
      {
        source: '/((?!(?:en|fr|ar|front-pages|favicon.ico)\\b)):path',
        destination: '/en/:path',
        permanent: true,
-      locale: false,
+        locale: false
+      }
+    ]
  }
-  ],
 }

 export default nextConfig
--- a/package-lock.json
+++ b/package-lock.json
@ -25,7 +25,6 @@
        "@fullcalendar/react": "6.1.15",
        "@fullcalendar/timegrid": "6.1.15",
        "@hookform/resolvers": "3.9.1",
-        "@iconify/react": "^6.0.1",
        "@mui/lab": "6.0.0-beta.19",
        "@mui/material": "6.2.1",
        "@mui/material-nextjs": "6.2.1",
@ -1309,21 +1308,6 @@
        "pathe": "^1.1.2"
      }
    },
-    "node_modules/@iconify/react": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/@iconify/react/-/react-6.0.1.tgz",
-      "integrity": "sha512-fCocnAfiGXjrA0u7KkS3W/OQHNp9LRFICudvOtxmS3Mf7U92aDhP50wyzRbobZli51zYt9ksZ9g0J7H586XvOQ==",
-      "license": "MIT",
-      "dependencies": {
-        "@iconify/types": "^2.0.0"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/cyberalien"
-      },
-      "peerDependencies": {
-        "react": ">=16"
-      }
-    },
    "node_modules/@iconify/tools": {
      "version": "4.1.1",
      "resolved": "https://registry.npmjs.org/@iconify/tools/-/tools-4.1.1.tgz",
@ -1348,6 +1332,7 @@
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
      "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==",
+      "dev": true,
      "license": "MIT"
    },
    "node_modules/@iconify/utils": {
--- a/package.json
+++ b/package.json
@ -11,8 +11,7 @@
    "lint:fix": "next lint --fix",
    "format": "prettier --write \"src/**/*.{js,jsx,ts,tsx}\"",
    "build:icons": "tsx src/assets/iconify-icons/bundle-icons-css.ts",
-    "removeI18n": "tsx src/remove-translation-scripts/index.ts",
-    "build:no-lint": "NEXT_DISABLE_ESLINT=true NEXT_DISABLE_TYPECHECK=true next build"
+    "removeI18n": "tsx src/remove-translation-scripts/index.ts"
  },
  "dependencies": {
    "@emoji-mart/data": "1.2.1",
@ -31,7 +30,6 @@
    "@fullcalendar/react": "6.1.15",
    "@fullcalendar/timegrid": "6.1.15",
    "@hookform/resolvers": "3.9.1",
-    "@iconify/react": "^6.0.1",
    "@mui/lab": "6.0.0-beta.19",
    "@mui/material": "6.2.1",
    "@mui/material-nextjs": "6.2.1",
--- a/src/app/[lang]/(dashboard)/(private)/dashboards/orders/page.tsx
+++ b/src/app/[lang]/(dashboard)/(private)/dashboards/orders/page.tsx
@ -7,87 +7,18 @@ import Grid from '@mui/material/Grid2'
 import DistributedBarChartOrder from '@views/dashboards/crm/DistributedBarChartOrder'

 // Server Action Imports
-import { TextField, Typography, useTheme } from '@mui/material'
-import { useState } from 'react'
 import Loading from '../../../../../../components/layout/shared/Loading'
 import { useSalesAnalytics } from '../../../../../../services/queries/analytics'
 import { RecentSale } from '../../../../../../types/services/analytic'
-import { formatDateDDMMYYYY, formatForInputDate } from '../../../../../../utils/transform'
 import OrdersReport from '../../../../../../views/dashboards/orders/OrdersReport'

 const DashboardOrder = () => {
-  const theme = useTheme()
-
-  const today = new Date()
-  const monthAgo = new Date()
-  monthAgo.setDate(today.getDate() - 30)
-
-  const [filter, setFilter] = useState({
-    date_from: formatDateDDMMYYYY(monthAgo),
-    date_to: formatDateDDMMYYYY(today)
-  })
-
-  const { data, isLoading } = useSalesAnalytics({
-    date_from: filter.date_from,
-    date_to: filter.date_to
-  })
+  const { data, isLoading } = useSalesAnalytics()

  if (isLoading) return <Loading />

  return (
    <Grid container spacing={6}>
-      <Grid size={{ xs: 12 }}>
-        <div className='flex gap-4 items-center justify-between'>
-          <Typography variant='h1' className='text-3xl font-bold text-gray-900 mb-2'>
-            Orders Analysis Dashboard
-          </Typography>
-          <div className='flex items-center gap-4'>
-            <TextField
-              type='date'
-              value={formatForInputDate(data?.date_from || new Date())}
-              onChange={e => {
-                setFilter({
-                  ...filter,
-                  date_from: formatDateDDMMYYYY(new Date(e.target.value))
-                })
-              }}
-              size='small'
-              sx={{
-                '& .MuiOutlinedInput-root': {
-                  '&.Mui-focused fieldset': {
-                    borderColor: 'primary.main'
-                  },
-                  '& fieldset': {
-                    borderColor: theme.palette.mode === 'dark' ? 'rgba(231, 227, 252, 0.22)' : theme.palette.divider
-                  }
-                }
-              }}
-            />
-            <Typography>-</Typography>
-            <TextField
-              type='date'
-              value={
-                data?.date_to
-                  ? new Date(data?.date_to).toISOString().split('T')[0]
-                  : new Date().toISOString().split('T')[0]
-              }
-              onChange={e => {}}
-              size='small'
-              sx={{
-                '& .MuiOutlinedInput-root': {
-                  '&.Mui-focused fieldset': {
-                    borderColor: 'primary.main'
-                  },
-                  '& fieldset': {
-                    borderColor: theme.palette.mode === 'dark' ? 'rgba(231, 227, 252, 0.22)' : theme.palette.divider
-                  }
-                }
-              }}
-            />
-          </div>
-        </div>
-      </Grid>
-
      <Grid size={{ xs: 12, sm: 6, md: 4, lg: 3 }}>
        <DistributedBarChartOrder
          isLoading={isLoading}
--- a/src/app/[lang]/(dashboard)/(private)/dashboards/overview/page.tsx
+++ b/src/app/[lang]/(dashboard)/(private)/dashboards/overview/page.tsx
@ -1,31 +1,18 @@
 'use client'

-import { TextField, Typography, useTheme } from '@mui/material'
-import { useState } from 'react'
-import Loading from '../../../../../../components/layout/shared/Loading'
+import React from 'react'
 import { useDashboardAnalytics } from '../../../../../../services/queries/analytics'
-import { formatDateDDMMYYYY, formatForInputDate, formatShortCurrency } from '../../../../../../utils/transform'
-import OrdersReport from '../../../../../../views/dashboards/orders/OrdersReport'
-import PaymentMethodReport from '../../../../../../views/dashboards/payment-methods/PaymentMethodReport'
+import Loading from '../../../../../../components/layout/shared/Loading'
+import { formatCurrency, formatDate, formatShortCurrency } from '../../../../../../utils/transform'
 import ProductSales from '../../../../../../views/dashboards/products/ProductSales'
+import PaymentMethodReport from '../../../../../../views/dashboards/payment-methods/PaymentMethodReport'
+import OrdersReport from '../../../../../../views/dashboards/orders/OrdersReport'

 const DashboardOverview = () => {
-  const theme = useTheme()
-
-  const today = new Date()
-  const monthAgo = new Date()
-  monthAgo.setDate(today.getDate() - 30)
-
-  const [filter, setFilter] = useState({
-    date_from: formatDateDDMMYYYY(monthAgo),
-    date_to: formatDateDDMMYYYY(today)
-  })
-
  // Sample data - replace with your actual data
-  const { data: salesData, isLoading } = useDashboardAnalytics({
-    date_from: filter.date_from,
-    date_to: filter.date_to
-  })
+  const { data: salesData, isLoading } = useDashboardAnalytics()
+
+  if (isLoading) return <Loading />

  const MetricCard = ({ iconClass, title, value, subtitle, bgColor = 'bg-blue-500', isCurrency = false }: any) => (
    <div className='bg-white rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300 p-6'>
@ -42,67 +29,27 @@ const DashboardOverview = () => {
    </div>
  )

+  const ProgressBar = ({ percentage, color = 'bg-blue-500' }: any) => (
+    <div className='w-full bg-gray-200 rounded-full h-2'>
+      <div
+        className={`${color} h-2 rounded-full transition-all duration-300`}
+        style={{ width: `${percentage}%` }}
+      ></div>
+    </div>
+  )
+
  return (
    <>
+      {salesData && (
        <div>
          {/* Header */}
-        <div className='mb-8 flex gap-4 items-center justify-between'>
-          <Typography variant='h1' className='text-3xl font-bold text-gray-900 mb-2'>
-            Analysis Dashboard
-          </Typography>
-          <div className='flex items-center gap-4'>
-            <TextField
-              type='date'
-              value={formatForInputDate(salesData?.date_from || new Date())}
-              onChange={e => {
-                setFilter({
-                  ...filter,
-                  date_from: formatDateDDMMYYYY(new Date(e.target.value))
-                })
-              }}
-              size='small'
-              sx={{
-                '& .MuiOutlinedInput-root': {
-                  '&.Mui-focused fieldset': {
-                    borderColor: 'primary.main'
-                  },
-                  '& fieldset': {
-                    borderColor: theme.palette.mode === 'dark' ? 'rgba(231, 227, 252, 0.22)' : theme.palette.divider
-                  }
-                }
-              }}
-            />
-            <Typography>-</Typography>
-            <TextField
-              type='date'
-              value={
-                salesData?.date_to
-                  ? new Date(salesData?.date_to).toISOString().split('T')[0]
-                  : new Date().toISOString().split('T')[0]
-              }
-              onChange={e => {
-                setFilter({
-                  ...filter,
-                  date_to: formatDateDDMMYYYY(new Date(e.target.value))
-                })
-              }}
-              size='small'
-              sx={{
-                '& .MuiOutlinedInput-root': {
-                  '&.Mui-focused fieldset': {
-                    borderColor: 'primary.main'
-                  },
-                  '& fieldset': {
-                    borderColor: theme.palette.mode === 'dark' ? 'rgba(231, 227, 252, 0.22)' : theme.palette.divider
-                  }
-                }
-              }}
-            />
-          </div>
-        </div>
+          {/* <div className="mb-8">
+          <h1 className="text-3xl font-bold text-gray-900 mb-2">Sales Dashboard</h1>
+          <p className="text-gray-600">
+            {formatDate(salesData.date_from)} - {formatDate(salesData.date_to)}
+          </p>
+        </div> */}

-        {salesData ? (
-          <>
          {/* Overview Metrics */}
          <div className='grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8'>
            <MetricCard
@ -144,11 +91,8 @@ const DashboardOverview = () => {

          {/* Recent Sales */}
          <OrdersReport title='Recent Sales' orderData={salesData.recent_sales} />
-          </>
-        ) : (
-          <Loading />
-        )}
        </div>
+      )}
    </>
  )
 }
--- a/src/app/[lang]/(dashboard)/(private)/dashboards/payment-methods/page.tsx
+++ b/src/app/[lang]/(dashboard)/(private)/dashboards/payment-methods/page.tsx
@ -11,82 +11,14 @@ import Loading from '../../../../../../components/layout/shared/Loading'
 import { usePaymentAnalytics } from '../../../../../../services/queries/analytics'
 import { PaymentDataItem } from '../../../../../../types/services/analytic'
 import PaymentMethodReport from '../../../../../../views/dashboards/payment-methods/PaymentMethodReport'
-import { Typography, TextField, useTheme } from '@mui/material'
-import { useState } from 'react'
-import { formatDateDDMMYYYY, formatForInputDate } from '../../../../../../utils/transform'

 const DashboardPayment = () => {
-  const theme = useTheme()
-
-  const today = new Date()
-  const monthAgo = new Date()
-  monthAgo.setDate(today.getDate() - 30)
-
-  const [filter, setFilter] = useState({
-    date_from: formatDateDDMMYYYY(monthAgo),
-    date_to: formatDateDDMMYYYY(today)
-  })
-
-  const { data, isLoading } = usePaymentAnalytics({
-    date_from: filter.date_from,
-    date_to: filter.date_to
-  })
+  const { data, isLoading } = usePaymentAnalytics()

  if (isLoading) return <Loading />

  return (
    <Grid container spacing={6}>
-      <Grid size={{ xs: 12 }}>
-        <div className='flex gap-4 items-center justify-between'>
-          <Typography variant='h1' className='text-3xl font-bold text-gray-900 mb-2'>
-            Payments Analysis Dashboard
-          </Typography>
-          <div className='flex items-center gap-4'>
-            <TextField
-              type='date'
-              value={formatForInputDate(data?.date_from || new Date())}
-              onChange={e => {
-                setFilter({
-                  ...filter,
-                  date_from: formatDateDDMMYYYY(new Date(e.target.value))
-                })
-              }}
-              size='small'
-              sx={{
-                '& .MuiOutlinedInput-root': {
-                  '&.Mui-focused fieldset': {
-                    borderColor: 'primary.main'
-                  },
-                  '& fieldset': {
-                    borderColor: theme.palette.mode === 'dark' ? 'rgba(231, 227, 252, 0.22)' : theme.palette.divider
-                  }
-                }
-              }}
-            />
-            <Typography>-</Typography>
-            <TextField
-              type='date'
-              value={
-                data?.date_to
-                  ? new Date(data?.date_to).toISOString().split('T')[0]
-                  : new Date().toISOString().split('T')[0]
-              }
-              onChange={e => {}}
-              size='small'
-              sx={{
-                '& .MuiOutlinedInput-root': {
-                  '&.Mui-focused fieldset': {
-                    borderColor: 'primary.main'
-                  },
-                  '& fieldset': {
-                    borderColor: theme.palette.mode === 'dark' ? 'rgba(231, 227, 252, 0.22)' : theme.palette.divider
-                  }
-                }
-              }}
-            />
-          </div>
-        </div>
-      </Grid>
      <Grid size={{ xs: 12, sm: 6, md: 4, lg: 3 }}>
        <DistributedBarChartOrder
          isLoading={isLoading}
--- a/src/app/[lang]/(dashboard)/(private)/dashboards/products/page.tsx
+++ b/src/app/[lang]/(dashboard)/(private)/dashboards/products/page.tsx
@ -6,88 +6,47 @@ import Grid from '@mui/material/Grid2'
 // Component Imports

 // Server Action Imports
-import { TextField, Typography, useTheme } from '@mui/material'
-import { useState } from 'react'
 import Loading from '../../../../../../components/layout/shared/Loading'
 import { useProductSalesAnalytics } from '../../../../../../services/queries/analytics'
-import { formatDateDDMMYYYY, formatForInputDate } from '../../../../../../utils/transform'
 import ProductSales from '../../../../../../views/dashboards/products/ProductSales'

 const DashboardProduct = () => {
-  const theme = useTheme()
+  const { data, isLoading } = useProductSalesAnalytics()

-  const today = new Date()
-  const monthAgo = new Date()
-  monthAgo.setDate(today.getDate() - 30)
+  const summary = {
+    totalProducts: data?.data.length,
+    totalQuantitySold: data?.data.reduce((sum, item) => sum + item.quantity_sold, 0),
+    totalRevenue: data?.data.reduce((sum, item) => sum + item.revenue, 0),
+    totalOrders: data?.data.reduce((sum, item) => sum + item.order_count, 0),
+    averageOrderValue: data?.data
+      ? data!.data.reduce((sum, item) => sum + item.revenue, 0) /
+        data!.data.reduce((sum, item) => sum + item.order_count, 0)
+      : 0
+  }

-  const [filter, setFilter] = useState({
-    date_from: formatDateDDMMYYYY(monthAgo),
-    date_to: formatDateDDMMYYYY(today)
+  const formatDate = (dateString: any) => {
+    return new Date(dateString).toLocaleDateString('id-ID', {
+      month: 'short',
+      day: 'numeric'
    })
+  }

-  const { data, isLoading } = useProductSalesAnalytics({
-    date_from: filter.date_from,
-    date_to: filter.date_to
-  })
+  const transformSalesData = (data: any) => {
+    return [
+      {
+        type: 'products',
+        avatarIcon: 'tabler-package',
+        date: data.map((d: any) => d.product_name),
+        series: [{ data: data.map((d: any) => d.revenue) }]
+      }
+    ]
+  }

  if (isLoading) return <Loading />

  return (
    <Grid container spacing={6}>
-      <Grid size={{ xs: 12, lg: 12 }}>
-        <div className='flex gap-4 items-center justify-between'>
-          <Typography variant='h1' className='text-3xl font-bold text-gray-900 mb-2'>
-            Products Analysis Dashboard
-          </Typography>
-          <div className='flex items-center gap-4'>
-            <TextField
-              type='date'
-              value={formatForInputDate(data?.date_from || new Date())}
-              onChange={e => {
-                setFilter({
-                  ...filter,
-                  date_from: formatDateDDMMYYYY(new Date(e.target.value))
-                })
-              }}
-              size='small'
-              sx={{
-                '& .MuiOutlinedInput-root': {
-                  '&.Mui-focused fieldset': {
-                    borderColor: 'primary.main'
-                  },
-                  '& fieldset': {
-                    borderColor: theme.palette.mode === 'dark' ? 'rgba(231, 227, 252, 0.22)' : theme.palette.divider
-                  }
-                }
-              }}
-            />
-            <Typography>-</Typography>
-            <TextField
-              type='date'
-              value={
-                data?.date_to
-                  ? new Date(data?.date_to).toISOString().split('T')[0]
-                  : new Date().toISOString().split('T')[0]
-              }
-              onChange={e => {}}
-              size='small'
-              sx={{
-                '& .MuiOutlinedInput-root': {
-                  '&.Mui-focused fieldset': {
-                    borderColor: 'primary.main'
-                  },
-                  '& fieldset': {
-                    borderColor: theme.palette.mode === 'dark' ? 'rgba(231, 227, 252, 0.22)' : theme.palette.divider
-                  }
-                }
-              }}
-            />
-          </div>
-        </div>
-      </Grid>
-      <Grid size={{ xs: 12, lg: 12 }}>
-        {data?.data ? <ProductSales title='Product Sales' productData={data.data} /> : <Loading />}
-      </Grid>
+      <Grid size={{ xs: 12, lg: 12 }}>{data?.data && <ProductSales title='Product Sales' productData={data.data} />}</Grid>
    </Grid>
  )
 }
--- a/src/app/[lang]/(dashboard)/(private)/dashboards/profit-loss/page.tsx
+++ b/src/app/[lang]/(dashboard)/(private)/dashboards/profit-loss/page.tsx
@ -2,28 +2,23 @@

 import React, { useState } from 'react'
 import { useProfitLossAnalytics } from '../../../../../../services/queries/analytics'
-import { formatDateDDMMYYYY, formatForInputDate, formatShortCurrency } from '../../../../../../utils/transform'
+import { formatDateDDMMYYYY, formatShortCurrency } from '../../../../../../utils/transform'
 import MultipleSeries from '../../../../../../views/dashboards/profit-loss/EarningReportWithTabs'
 import { DailyData, ProfitLossReport } from '../../../../../../types/services/analytic'
 import { TextField, Typography, useTheme } from '@mui/material'
-import Loading from '../../../../../../components/layout/shared/Loading'

 const DashboardProfitloss = () => {
  const theme = useTheme()

-  const today = new Date()
-  const monthAgo = new Date()
-  monthAgo.setDate(today.getDate() - 30)
-
  const [filter, setFilter] = useState({
-    date_from: formatDateDDMMYYYY(monthAgo),
-    date_to: formatDateDDMMYYYY(today)
+    date_from: new Date().setDate(new Date().getDate() - 30).toString(),
+    date_to: new Date().toString()
  })

  // Sample data - replace with your actual data
  const { data: profitData, isLoading } = useProfitLossAnalytics({
-    date_from: filter.date_from,
-    date_to: filter.date_to
+    date_from: formatDateDDMMYYYY(filter.date_from),
+    date_to: formatDateDDMMYYYY(filter.date_to)
  })

  const formatCurrency = (amount: any) => {
@ -104,6 +99,7 @@ const DashboardProfitloss = () => {

  return (
    <>
+      {profitData && (
        <div>
          {/* Header */}
          <div className='mb-8 flex gap-4 items-center justify-between'>
@ -113,13 +109,8 @@ const DashboardProfitloss = () => {
            <div className='flex items-center gap-4'>
              <TextField
                type='date'
-              value={formatForInputDate(profitData?.date_from || new Date())}
-              onChange={e => {
-                setFilter({
-                  ...filter,
-                  date_from: formatDateDDMMYYYY(new Date(e.target.value))
-                })
-              }}
+                value={new Date(profitData.date_from).toISOString().split('T')[0]}
+                onChange={e => {}}
                size='small'
                sx={{
                  '& .MuiOutlinedInput-root': {
@ -135,11 +126,7 @@ const DashboardProfitloss = () => {
              <Typography>-</Typography>
              <TextField
                type='date'
-              value={
-                profitData?.date_to
-                  ? new Date(profitData?.date_to).toISOString().split('T')[0]
-                  : new Date().toISOString().split('T')[0]
-              }
+                value={new Date(profitData.date_to).toISOString().split('T')[0]}
                onChange={e => {}}
                size='small'
                sx={{
@ -156,8 +143,7 @@ const DashboardProfitloss = () => {
            </div>
          </div>

-        {profitData ? (
-          <>
+          {/* Summary Metrics */}
          <div className='grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8'>
            <MetricCard
              iconClass='tabler-currency-dollar'
@ -201,9 +187,7 @@ const DashboardProfitloss = () => {
              <p className='text-3xl font-bold text-green-600 mb-2'>
                Rp {formatShortCurrency(profitData.summary.net_profit)}
              </p>
-                <p className='text-sm text-gray-600'>
-                  Margin: {formatPercentage(profitData.summary.net_profit_margin)}
-                </p>
+              <p className='text-sm text-gray-600'>Margin: {formatPercentage(profitData.summary.net_profit_margin)}</p>
            </div>
            <div className='bg-white rounded-lg shadow-md p-6'>
              <div className='flex items-center mb-4'>
@ -280,9 +264,7 @@ const DashboardProfitloss = () => {
                              {formatPercentage(day.gross_profit_margin)}
                            </span>
                          </td>
-                            <td className='px-4 py-4 whitespace-nowrap text-right text-sm text-gray-900'>
-                              {day.orders}
-                            </td>
+                          <td className='px-4 py-4 whitespace-nowrap text-right text-sm text-gray-900'>{day.orders}</td>
                        </tr>
                      ))}
                    </tbody>
@ -412,11 +394,8 @@ const DashboardProfitloss = () => {
              </div>
            </div>
          </div>
-          </>
-        ) : (
-          <Loading />
-        )}
        </div>
+      )}
    </>
  )
 }
--- a/src/components/layout/horizontal/HorizontalMenu.tsx
+++ b/src/components/layout/horizontal/HorizontalMenu.tsx
@ -97,8 +97,8 @@ const HorizontalMenu = ({ dictionary }: { dictionary: Awaited<ReturnType<typeof
          <MenuItem href={`/${locale}/dashboards/analytics`} icon={<i className='tabler-trending-up' />}>
            {dictionary['navigation'].analytics}
          </MenuItem>
-          <MenuItem href={`/${locale}/dashboards/inventory`} icon={<i className='tabler-shopping-cart' />}>
-            {dictionary['navigation'].inventory}
+          <MenuItem href={`/${locale}/dashboards/ecommerce`} icon={<i className='tabler-shopping-cart' />}>
+            {dictionary['navigation'].eCommerce}
          </MenuItem>
          <MenuItem href={`/${locale}/dashboards/academy`} icon={<i className='tabler-school' />}>
            {dictionary['navigation'].academy}
--- a/src/components/layout/shared/Loading.tsx
+++ b/src/components/layout/shared/Loading.tsx
@ -2,7 +2,7 @@ import { CircularProgress } from '@mui/material'

 export default function Loading({ size = 60 }: { size?: number }) {
  return (
-    <div className='absolute inset-0 z-50 flex items-center justify-center bg-white/70'>
+    <div className='fixed inset-0 z-50 flex items-center justify-center bg-white/70'>
      <CircularProgress size={size} />
    </div>
  )
--- a/src/services/api.ts
+++ b/src/services/api.ts
@ -1,12 +1,11 @@
 import axios from 'axios'
-import { toast } from 'react-toastify'

 const getToken = () => {
  return localStorage.getItem('authToken')
 }

 export const api = axios.create({
-  baseURL: 'https://api-pos.apskel.id/api/v1',
+  baseURL: process.env.NEXT_PUBLIC_API_URL,
  headers: {
    'Content-Type': 'application/json'
  },
@ -41,7 +40,7 @@ api.interceptors.response.use(
    }

    if (status >= 500) {
-      toast.error(error.response?.data?.errors[0].cause || 'Terjadi kesalahan server.')
+      console.error('Server error:', error.response?.data?.message || 'Terjadi kesalahan server.')
    }

    return Promise.reject(error)
--- a/src/services/mutations/inventories.ts
+++ b/src/services/mutations/inventories.ts
@ -1,7 +1,7 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query'
 import { api } from '../api'
 import { toast } from 'react-toastify'
-import { InventoryAdjustRequest, InventoryRequest, InventoryRestockRequest } from '../../types/services/inventory'
+import { InventoryAdjustRequest, InventoryRequest } from '../../types/services/inventory'

 export const useInventoriesMutation = () => {
  const queryClient = useQueryClient()
@ -34,24 +34,6 @@ export const useInventoriesMutation = () => {
    }
  })

-  const restockInventory = useMutation({
-    mutationFn: async (newInventory: InventoryRestockRequest) => {
-      newInventory.items.map(item => {
-        item.quantity = Number(item.quantity)
-      })
-
-      const response = await api.post('/inventory/restock', newInventory)
-      return response.data
-    },
-    onSuccess: () => {
-      toast.success('Inventory restock successfully!')
-      queryClient.invalidateQueries({ queryKey: ['inventories'] })
-    },
-    onError: (error: any) => {
-      toast.error(error.response?.data?.errors?.[0]?.cause || 'Create failed')
-    }
-  })
-
  const deleteInventory = useMutation({
    mutationFn: async (id: string) => {
      const response = await api.delete(`/inventory/${id}`)
@ -66,5 +48,5 @@ export const useInventoriesMutation = () => {
    }
  })

-  return { createInventory, adjustInventory, deleteInventory, restockInventory }
+  return { createInventory, adjustInventory, deleteInventory }
 }
--- a/src/types/services/inventory.ts
+++ b/src/types/services/inventory.ts
@ -29,15 +29,3 @@ export interface InventoryAdjustRequest {
  delta: number
  reason: string
 }
-
-export interface Item {
-  item_id: string
-  item_type: string
-  quantity: number | string
-}
-
-export interface InventoryRestockRequest {
-  outlet_id: string
-  items: Item[]
-  reason: string
-}
--- a/src/utils/transform.ts
+++ b/src/utils/transform.ts
@ -36,22 +36,12 @@ export const formatDate = (dateString: any) => {

 export const formatDateDDMMYYYY = (dateString: Date | string) => {
  const date = new Date(dateString)
-  date.setHours(0, 0, 0, 0)
  const day = String(date.getDate()).padStart(2, '0')
  const month = String(date.getMonth() + 1).padStart(2, '0')
  const year = date.getFullYear()
  return `${day}-${month}-${year}`
 }

-export const formatForInputDate = (dateString: Date | string) => {
-  const date = new Date(dateString)
-  const day = String(date.getDate()).padStart(2, '0')
-  const month = String(date.getMonth() + 1).padStart(2, '0')
-  const year = date.getFullYear()
-  return `${year}-${month}-${day}`
-}
-
-
 export const formatDatetime = (dateString: string | number | Date) => {
  const date = new Date(dateString)

--- a/src/views/apps/ecommerce/products/list/ProductListTable.tsx
+++ b/src/views/apps/ecommerce/products/list/ProductListTable.tsx
@ -220,13 +220,13 @@ const ProductListTable = () => {
          <div className='flex items-center'>
            <IconButton
              LinkComponent={Link}
-              href={getLocalizedUrl(`/apps/inventory/products/${row.original.id}/detail`, locale as Locale)}
+              href={getLocalizedUrl(`/apps/ecommerce/products/${row.original.id}/detail`, locale as Locale)}
            >
              <i className='tabler-eye text-textSecondary' />
            </IconButton>
            <IconButton
              LinkComponent={Link}
-              href={getLocalizedUrl(`/apps/inventory/products/${row.original.id}/edit`, locale as Locale)}
+              href={getLocalizedUrl(`/apps/ecommerce/products/${row.original.id}/edit`, locale as Locale)}
            >
              <i className='tabler-edit text-textSecondary' />
            </IconButton>
--- a/src/views/apps/ecommerce/stock/adjustment/AdjustmentStockDrawer.tsx
+++ b/src/views/apps/ecommerce/stock/adjustment/AdjustmentStockDrawer.tsx
@ -14,12 +14,12 @@ import Typography from '@mui/material/Typography'

 // Components Imports
 import CustomTextField from '@core/components/mui/TextField'
-import { Autocomplete, CircularProgress, MenuItem } from '@mui/material'
+import { Autocomplete, CircularProgress } from '@mui/material'
 import { useDebounce } from 'use-debounce'
 import { useInventoriesMutation } from '../../../../../services/mutations/inventories'
 import { useOutlets } from '../../../../../services/queries/outlets'
 import { useProducts } from '../../../../../services/queries/products'
-import { InventoryRestockRequest, Item } from '../../../../../types/services/inventory'
+import { InventoryAdjustRequest } from '../../../../../types/services/inventory'

 type Props = {
  open: boolean
@ -30,22 +30,17 @@ const AdjustmentStockDrawer = (props: Props) => {
  // Props
  const { open, handleClose } = props

-  const { restockInventory } = useInventoriesMutation()
+  const { mutate: adjustInventory, isPending: isCreating } = useInventoriesMutation().adjustInventory

  // States
  const [productInput, setProductInput] = useState('')
  const [productDebouncedInput] = useDebounce(productInput, 500) // debounce for better UX
  const [outletInput, setOutletInput] = useState('')
  const [outletDebouncedInput] = useDebounce(outletInput, 500) // debounce for better UX
-  const [formData, setFormData] = useState<InventoryRestockRequest>({
+  const [formData, setFormData] = useState<InventoryAdjustRequest>({
+    product_id: '',
    outlet_id: '',
-    items: [
-      {
-        item_id: '',
-        item_type: '',
-        quantity: 0
-      }
-    ],
+    delta: 0,
    reason: ''
  })

@ -63,11 +58,14 @@ const AdjustmentStockDrawer = (props: Props) => {
  const handleFormSubmit = (e: any) => {
    e.preventDefault()

-    restockInventory.mutate(formData, {
+    adjustInventory(
+      { ...formData, delta: Number(formData.delta) },
+      {
        onSuccess: () => {
          handleReset()
        }
-    })
+      }
+    )
  }

  const handleInputChange = (e: any) => {
@ -81,14 +79,9 @@ const AdjustmentStockDrawer = (props: Props) => {
  const handleReset = () => {
    handleClose()
    setFormData({
+      product_id: '',
      outlet_id: '',
-      items: [
-        {
-          item_id: '',
-          item_type: '',
-          quantity: 0
-        }
-      ],
+      delta: 0,
      reason: ''
    })
  }
@ -143,33 +136,18 @@ const AdjustmentStockDrawer = (props: Props) => {
              />
            )}
          />
-          <CustomTextField
-            select
-            fullWidth
-            label='Item Type'
-            value={formData.items[0]?.item_type || ''}
-            onChange={e => setFormData({ ...formData, items: [{ ...formData.items[0], item_type: e.target.value }] })}
-          >
-            <MenuItem value='PRODUCT'>Product</MenuItem>
-            {/* <MenuItem value='IGREDIENT'>Ingredient</MenuItem> */}
-          </CustomTextField>
          <Autocomplete
            options={options}
            loading={isLoading}
            getOptionLabel={option => option.name}
-            value={options.find(p => p.id === formData.items[0].item_id) || null}
+            value={options.find(p => p.id === formData.product_id) || null}
            onInputChange={(event, newProductInput) => {
              setProductInput(newProductInput)
            }}
            onChange={(event, newValue) => {
              setFormData({
                ...formData,
-                items: [
-                  {
-                    ...formData.items[0],
-                    item_id: newValue?.id || ''
-                  }
-                ]
+                product_id: newValue?.id || ''
              })
            }}
            renderInput={params => (
@ -192,20 +170,10 @@ const AdjustmentStockDrawer = (props: Props) => {
          />
          <CustomTextField
            fullWidth
-            label='Quantity'
-            name='quantity'
-            value={formData.items[0].quantity}
-            onChange={e =>
-              setFormData({
-                ...formData,
-                items: [
-                  {
-                    ...formData.items[0],
-                    quantity: e.target.value
-                  }
-                ]
-              })
-            }
+            label='Delta'
+            name='delta'
+            value={formData.delta}
+            onChange={handleInputChange}
            placeholder='0'
          />
          <CustomTextField
@ -219,8 +187,8 @@ const AdjustmentStockDrawer = (props: Props) => {
            placeholder='Write a Comment...'
          />
          <div className='flex items-center gap-4'>
-            <Button variant='contained' type='submit' disabled={restockInventory.isPending}>
-              {restockInventory.isPending ? 'Saving...' : 'Save'}
+            <Button variant='contained' type='submit' disabled={isCreating}>
+              {isCreating ? 'Adjusting...' : 'Adjust'}
            </Button>
            <Button variant='tonal' color='error' type='reset' onClick={handleReset}>
              Discard
--- a/src/views/dashboards/daily-report/report-generator.tsx
+++ b/src/views/dashboards/daily-report/report-generator.tsx
@ -485,7 +485,7 @@ const ReportGeneratorComponent: React.FC<ReportGeneratorProps> = ({
        </Box>

        <InfoBox>
-          <Typography variant='body2' component='div' sx={{ color: textSecondary }}>
+          <Typography variant='body2' sx={{ color: textSecondary }}>
            {labels.periodLabel || 'Periode:'}{' '}
            <Chip
              label={getPeriodText()}