56 files changed, 165 insertions, 153 deletions

diff --git a/.gitignore b/.gitignore
index 87d3a105..2c30a3b4 100644
--- a/.gitignore
+++ b/.gitignore
@@ -35,4 +35,6 @@ yarn-error.log*
 *.tsbuildinfo
 next-env.d.ts
 
-package-lock.json
\ No newline at end of file
+package-lock.json
+
+.vscode
\ No newline at end of file
diff --git a/jsconfig.json b/jsconfig.json
new file mode 100644
index 00000000..29f6bcc5
--- /dev/null
+++ b/jsconfig.json
@@ -0,0 +1,8 @@
+{
+  "compilerOptions": {
+    "baseUrl": "./src/",
+    "paths": {
+        "@/*": ["./*"]
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/components/WithAuth.js b/src/components/auth/WithAuth.js
index 74518b3b..ef975873 100644
--- a/src/components/WithAuth.js
+++ b/src/components/auth/WithAuth.js
@@ -1,6 +1,6 @@
+import { getAuth } from "@/core/utils/auth";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
-import { getAuth } from "../helpers/auth";
 
 const WithAuth = ({ children }) => {
   const router = useRouter();
diff --git a/src/components/Alert.js b/src/components/elements/Alert.js
index 914d1590..914d1590 100644
--- a/src/components/Alert.js
+++ b/src/components/elements/Alert.js
diff --git a/src/components/BottomPopup.js b/src/components/elements/BottomPopup.js
index b7f5f2de..deb1b895 100644
--- a/src/components/BottomPopup.js
+++ b/src/components/elements/BottomPopup.js
@@ -1,4 +1,4 @@
-import CloseIcon from "../icons/close.svg";
+import CloseIcon from "@/icons/close.svg";
 
 const BottomPopup = ({ 
   active = false, 
diff --git a/src/components/ConfirmAlert.js b/src/components/elements/ConfirmAlert.js
index 27155011..27155011 100644
--- a/src/components/ConfirmAlert.js
+++ b/src/components/elements/ConfirmAlert.js
diff --git a/src/components/Fields.js b/src/components/elements/Fields.js
index 586a6a22..586a6a22 100644
--- a/src/components/Fields.js
+++ b/src/components/elements/Fields.js
diff --git a/src/components/Filter.js b/src/components/elements/Filter.js
index f2051ba8..f2051ba8 100644
--- a/src/components/Filter.js
+++ b/src/components/elements/Filter.js
diff --git a/src/components/Image.js b/src/components/elements/Image.js
index f06272b0..f06272b0 100644
--- a/src/components/Image.js
+++ b/src/components/elements/Image.js
diff --git a/src/components/LineDivider.js b/src/components/elements/LineDivider.js
index 4e8c7b52..4e8c7b52 100644
--- a/src/components/LineDivider.js
+++ b/src/components/elements/LineDivider.js
diff --git a/src/components/Link.js b/src/components/elements/Link.js
index d354bb1b..d354bb1b 100644
--- a/src/components/Link.js
+++ b/src/components/elements/Link.js
diff --git a/src/components/Pagination.js b/src/components/elements/Pagination.js
index 1cb1bca0..1cb1bca0 100644
--- a/src/components/Pagination.js
+++ b/src/components/elements/Pagination.js
diff --git a/src/components/ProgressBar.js b/src/components/elements/ProgressBar.js
index 0adedcdf..0adedcdf 100644
--- a/src/components/ProgressBar.js
+++ b/src/components/elements/ProgressBar.js
diff --git a/src/components/Spinner.js b/src/components/elements/Spinner.js
index 21006ecd..21006ecd 100644
--- a/src/components/Spinner.js
+++ b/src/components/elements/Spinner.js
diff --git a/src/components/AppBar.js b/src/components/layouts/AppBar.js
index 4cac8ce5..f9dddf9d 100644
--- a/src/components/AppBar.js
+++ b/src/components/layouts/AppBar.js
@@ -2,7 +2,7 @@ import { ChevronLeftIcon, HeartIcon, HomeIcon } from "@heroicons/react/24/outlin
 import Head from "next/head";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
-import Link from "./Link";
+import Link from "../elements/Link";
 
 const AppBar = ({ title }) => {
   const router = useRouter();
diff --git a/src/components/Footer.js b/src/components/layouts/Footer.js
index f0ae66b3..e48daf7f 100644
--- a/src/components/Footer.js
+++ b/src/components/layouts/Footer.js
@@ -4,8 +4,8 @@ import {
   EnvelopeIcon
 } from "@heroicons/react/24/outline";
 import Image from "next/image";
-import InstagramIcon from "../icons/instagram.svg";
-import LinkedinIcon from "../icons/linkedin.svg";
+import InstagramIcon from "@/icons/instagram.svg";
+import LinkedinIcon from "@/icons/linkedin.svg";
 
 export default function Footer() {
   return (
diff --git a/src/components/Header.js b/src/components/layouts/Header.js
index 71f8fd58..5cd0a1bc 100644
--- a/src/components/Header.js
+++ b/src/components/layouts/Header.js
@@ -12,12 +12,12 @@ import {
 } from "@heroicons/react/24/outline";
 
 // Helpers
-import { useAuth } from "../helpers/auth";
+import { useAuth } from "@/core/utils/auth";
 // Components
-import Link from "./Link";
+import Link from "../elements/Link";
 // Images
-import Logo from "../images/logo.png";
-import greeting from "../helpers/greeting";
+import Logo from "@/images/logo.png";
+import greeting from "@/core/utils/greeting";
 
 const menus = [
   { name: 'Semua Brand', href: '/shop/brands' },
diff --git a/src/components/Layout.js b/src/components/layouts/Layout.js
index fd507963..fd507963 100644
--- a/src/components/Layout.js
+++ b/src/components/layouts/Layout.js
diff --git a/src/components/ManufactureCard.js b/src/components/manufactures/ManufactureCard.js
index 52a964d5..73a96902 100644
--- a/src/components/ManufactureCard.js
+++ b/src/components/manufactures/ManufactureCard.js
@@ -1,6 +1,6 @@
-import { createSlug } from "../helpers/slug";
-import Image from "./Image";
-import Link from "./Link";
+import { createSlug } from "@/core/utils/slug";
+import Image from "../elements/Image";
+import Link from "../elements/Link";
 
 export default function ManufactureCard({ data }) {
   const manufacture = data;
diff --git a/src/components/ProductCard.js b/src/components/products/ProductCard.js
index 2cb0d99b..e32463a7 100644
--- a/src/components/ProductCard.js
+++ b/src/components/products/ProductCard.js
@@ -1,8 +1,8 @@
-import Link from "./Link";
-import currencyFormat from "../helpers/currencyFormat";
-import { createSlug } from "../helpers/slug";
+import Link from "../elements/Link";
+import currencyFormat from "@/core/utils/currencyFormat";
+import { createSlug } from "@/core/utils/slug";
 import { ChevronRightIcon } from "@heroicons/react/20/solid";
-import Image from "./Image";
+import Image from "../elements/Image";
 
 
 export default function ProductCard({ data }) {
diff --git a/src/components/product/ProductSlider.js b/src/components/products/ProductSlider.js
index 84dc4258..ddc505c7 100644
--- a/src/components/product/ProductSlider.js
+++ b/src/components/products/ProductSlider.js
@@ -1,5 +1,5 @@
 import { Swiper, SwiperSlide } from "swiper/react";
-import ProductCard from "../ProductCard";
+import ProductCard from "./ProductCard";
 import ImagePlaceholderIcon from "../../icons/image-placeholder.svg";
 import "swiper/css";
 
diff --git a/src/helpers/address.js b/src/core/utils/address.js
index c4a19af5..c4a19af5 100644
--- a/src/helpers/address.js
+++ b/src/core/utils/address.js
diff --git a/src/helpers/apiOdoo.js b/src/core/utils/apiOdoo.js
index 4d0adae3..4d0adae3 100644
--- a/src/helpers/apiOdoo.js
+++ b/src/core/utils/apiOdoo.js
diff --git a/src/helpers/auth.js b/src/core/utils/auth.js
index 62eba2c0..62eba2c0 100644
--- a/src/helpers/auth.js
+++ b/src/core/utils/auth.js
diff --git a/src/helpers/cart.js b/src/core/utils/cart.js
index 66efcbf2..66efcbf2 100644
--- a/src/helpers/cart.js
+++ b/src/core/utils/cart.js
diff --git a/src/helpers/convertToOption.js b/src/core/utils/convertToOption.js
index 08fec08f..08fec08f 100644
--- a/src/helpers/convertToOption.js
+++ b/src/core/utils/convertToOption.js
diff --git a/src/helpers/currencyFormat.js b/src/core/utils/currencyFormat.js
index dadeaec6..dadeaec6 100644
--- a/src/helpers/currencyFormat.js
+++ b/src/core/utils/currencyFormat.js
diff --git a/src/helpers/formValidation.js b/src/core/utils/formValidation.js
index 0e83f4cc..0e83f4cc 100644
--- a/src/helpers/formValidation.js
+++ b/src/core/utils/formValidation.js
diff --git a/src/helpers/getFileBase64.js b/src/core/utils/getFileBase64.js
index 78013e43..78013e43 100644
--- a/src/helpers/getFileBase64.js
+++ b/src/core/utils/getFileBase64.js
diff --git a/src/helpers/greeting.js b/src/core/utils/greeting.js
index 7dc19f8f..7dc19f8f 100644
--- a/src/helpers/greeting.js
+++ b/src/core/utils/greeting.js
diff --git a/src/helpers/mailer.js b/src/core/utils/mailer.js
index 4e7ff7cc..4e7ff7cc 100644
--- a/src/helpers/mailer.js
+++ b/src/core/utils/mailer.js
diff --git a/src/helpers/slug.js b/src/core/utils/slug.js
index 0a7d30fc..0a7d30fc 100644
--- a/src/helpers/slug.js
+++ b/src/core/utils/slug.js
diff --git a/src/helpers/toTitleCase.js b/src/core/utils/toTitleCase.js
index 5cfd70d0..5cfd70d0 100644
--- a/src/helpers/toTitleCase.js
+++ b/src/core/utils/toTitleCase.js
diff --git a/src/pages/404.js b/src/pages/404.js
index b7f8b8ef..1e1850f2 100644
--- a/src/pages/404.js
+++ b/src/pages/404.js
@@ -1,7 +1,7 @@
 import Image from "next/image";
-import Link from "../components/Link";
-import Header from "../components/Header";
-import Layout from "../components/Layout";
+import Link from "@/components/elements/Link";
+import Header from "@/components/layouts/Header";
+import Layout from "@/components/layouts/Layout";
 import PageNotFoundImage from "../images/page-not-found.png";
 
 export default function PageNotFound() {
diff --git a/src/pages/activate.js b/src/pages/activate.js
index c738af81..d9b41bf4 100644
--- a/src/pages/activate.js
+++ b/src/pages/activate.js
@@ -1,14 +1,14 @@
 import axios from "axios";
 import Head from "next/head";
 import Image from "next/image";
-import Link from "../components/Link";
+import Link from "@/components/elements/Link";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
-import Alert from "../components/Alert";
-import Layout from "../components/Layout";
-import Spinner from "../components/Spinner";
-import { setAuth } from "../helpers/auth";
-import Logo from "../images/logo.png";
+import Alert from "@/components/elements/Alert";
+import Layout from "@/components/layouts/Layout";
+import Spinner from "@/components/elements/Spinner";
+import { setAuth } from "@/core/utils/auth";
+import Logo from "@/images/logo.png";
 
 export default function Activate() {
   const [email, setEmail] = useState('');
diff --git a/src/pages/api/activation-request.js b/src/pages/api/activation-request.js
index 42ad5364..3f33875c 100644
--- a/src/pages/api/activation-request.js
+++ b/src/pages/api/activation-request.js
@@ -1,5 +1,5 @@
-import apiOdoo from "../../helpers/apiOdoo";
-import mailer from "../../helpers/mailer";
+import apiOdoo from "@/core/utils/apiOdoo";
+import mailer from "@/core/utils/mailer";
 
 export default async function handler(req, res) {
   try {
diff --git a/src/pages/api/activation.js b/src/pages/api/activation.js
index 67ec1c9e..8b22af8d 100644
--- a/src/pages/api/activation.js
+++ b/src/pages/api/activation.js
@@ -1,4 +1,4 @@
-import apiOdoo from "../../helpers/apiOdoo";
+import apiOdoo from "@/core/utils/apiOdoo";
 
 export default async function handler(req, res) {
   try {
diff --git a/src/pages/api/login.js b/src/pages/api/login.js
index a747294b..e02a73cb 100644
--- a/src/pages/api/login.js
+++ b/src/pages/api/login.js
@@ -1,4 +1,4 @@
-import apiOdoo from "../../helpers/apiOdoo";
+import apiOdoo from "@/core/utils/apiOdoo";
 
 export default async function handler(req, res) {
   try {
diff --git a/src/pages/api/register.js b/src/pages/api/register.js
index 323cab24..7c8d8b39 100644
--- a/src/pages/api/register.js
+++ b/src/pages/api/register.js
@@ -1,4 +1,4 @@
-import apiOdoo from "../../helpers/apiOdoo";
+import apiOdoo from "@/core/utils/apiOdoo";
 
 export default async function handler(req, res) {
   try {
diff --git a/src/pages/index.js b/src/pages/index.js
index 511f2ecd..35175dce 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -7,15 +7,15 @@ import "swiper/css/pagination";
 import "swiper/css/autoplay";
 
 // Helpers
-import apiOdoo from "../helpers/apiOdoo";
+import apiOdoo from "@/core/utils/apiOdoo";
 
 // Components
-import Header from "../components/Header";
-import ProductSlider from "../components/product/ProductSlider";
-import Layout from "../components/Layout";
-import ManufactureCard from "../components/ManufactureCard";
-import Footer from "../components/Footer";
-import Image from "../components/Image";
+import Header from "@/components/layouts/Header";
+import ProductSlider from "@/components/products/ProductSlider";
+import Layout from "@/components/layouts/Layout";
+import ManufactureCard from "@/components/manufactures/ManufactureCard";
+import Footer from "@/components/layouts/Footer";
+import Image from "@/components/elements/Image";
 
 export async function getServerSideProps() {
   const heroBanners = await apiOdoo('GET', `/api/v1/banner?type=index-a-1`);
diff --git a/src/pages/login.js b/src/pages/login.js
index 0dfacfaa..cd48e5e6 100644
--- a/src/pages/login.js
+++ b/src/pages/login.js
@@ -1,14 +1,14 @@
 import axios from "axios";
 import Head from "next/head";
 import Image from "next/image";
-import Link from "../components/Link";
+import Link from "@/components/elements/Link";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
-import Alert from "../components/Alert";
-import Layout from "../components/Layout";
-import Spinner from "../components/Spinner";
-import { setAuth } from "../helpers/auth";
-import Logo from "../images/logo.png";
+import Alert from "@/components/elements/Alert";
+import Layout from "@/components/layouts/Layout";
+import Spinner from "@/components/elements/Spinner";
+import { setAuth } from "@/core/utils/auth";
+import Logo from "@/images/logo.png";
 
 export default function Login() {
   const router = useRouter();
diff --git a/src/pages/logout.js b/src/pages/logout.js
index de749a37..8ea21fab 100644
--- a/src/pages/logout.js
+++ b/src/pages/logout.js
@@ -1,6 +1,6 @@
 import { useRouter } from "next/router";
 import { useEffect } from "react";
-import { deleteAuth } from "../helpers/auth";
+import { deleteAuth } from "@/core/utils/auth";
 
 export default function Logout() {
   const router = useRouter();
diff --git a/src/pages/my/address/[id]/edit.js b/src/pages/my/address/[id]/edit.js
index e65ba699..838d39e7 100644
--- a/src/pages/my/address/[id]/edit.js
+++ b/src/pages/my/address/[id]/edit.js
@@ -1,12 +1,12 @@
 import { Controller, useForm } from "react-hook-form"
-import WithAuth from "../../../../components/WithAuth";
-import Layout from "../../../../components/Layout";
-import AppBar from "../../../../components/AppBar";
+import WithAuth from "@/components/auth/WithAuth";
+import Layout from "@/components/layouts/Layout";
+import AppBar from "@/components/layouts/AppBar";
 import { yupResolver } from "@hookform/resolvers/yup";
 import * as Yup from "yup";
-import { Select } from "../../../../components/Fields";
+import { Select } from "@/components/elements/Fields";
 import { useEffect, useState } from "react";
-import apiOdoo from "../../../../helpers/apiOdoo";
+import apiOdoo from "@/core/utils/apiOdoo";
 import { toast } from "react-hot-toast";
 import { useRouter } from "next/router";
 
@@ -17,7 +17,7 @@ const validationSchema = Yup.object().shape({
   mobile: Yup.string().required('Harus di-isi'),
   street: Yup.string().required('Harus di-isi'),
   zip: Yup.string().required('Harus di-isi'),
-  city: Yup.number().required('Harus di-pilih'),
+  city: Yup.string().required('Harus di-pilih'),
 });
 
 const types = [
diff --git a/src/pages/my/address/create.js b/src/pages/my/address/create.js
index 71f73a64..4c7a8130 100644
--- a/src/pages/my/address/create.js
+++ b/src/pages/my/address/create.js
@@ -1,13 +1,13 @@
 import { Controller, useForm } from "react-hook-form"
-import WithAuth from "../../../components/WithAuth";
-import Layout from "../../../components/Layout";
-import AppBar from "../../../components/AppBar";
+import WithAuth from "@/components/auth/WithAuth";
+import Layout from "@/components/layouts/Layout";
+import AppBar from "@/components/layouts/AppBar";
 import { yupResolver } from "@hookform/resolvers/yup";
 import * as Yup from "yup";
-import { Select } from "../../../components/Fields";
+import { Select } from "@/components/elements/Fields";
 import { useEffect, useState } from "react";
-import apiOdoo from "../../../helpers/apiOdoo";
-import { useAuth } from "../../../helpers/auth";
+import apiOdoo from "@/core/utils/apiOdoo";
+import { useAuth } from "@/core/utils/auth";
 import { toast } from "react-hot-toast";
 import { useRouter } from "next/router";
 
@@ -18,7 +18,7 @@ const validationSchema = Yup.object().shape({
   mobile: Yup.string().required('Harus di-isi'),
   street: Yup.string().required('Harus di-isi'),
   zip: Yup.string().required('Harus di-isi'),
-  city: Yup.number().required('Harus di-pilih'),
+  city: Yup.string().required('Harus di-pilih'),
 });
 
 const defaultValues = {
diff --git a/src/pages/my/address/index.js b/src/pages/my/address/index.js
index 236e4b60..dbe082ff 100644
--- a/src/pages/my/address/index.js
+++ b/src/pages/my/address/index.js
@@ -1,12 +1,14 @@
 import { useEffect, useState } from "react";
-import AppBar from "../../../components/AppBar";
-import Layout from "../../../components/Layout";
-import Link from "../../../components/Link";
-import WithAuth from "../../../components/WithAuth";
-import apiOdoo from "../../../helpers/apiOdoo";
-import { useAuth } from "../../../helpers/auth";
 import { useRouter } from "next/router";
-import { createOrUpdateItemAddress, getItemAddress } from "../../../helpers/address";
+
+import AppBar from "@/components/layouts/AppBar";
+import Layout from "@/components/layouts/Layout";
+import Link from "@/components/elements/Link";
+import WithAuth from "@/components/auth/WithAuth";
+
+import apiOdoo from "@/core/utils/apiOdoo";
+import { useAuth } from "@/core/utils/auth";
+import { createOrUpdateItemAddress, getItemAddress } from "@/core/utils/address";
 
 export default function Address() {
   const router = useRouter();
diff --git a/src/pages/my/menu.js b/src/pages/my/menu.js
index f43c1fe9..e7ece135 100644
--- a/src/pages/my/menu.js
+++ b/src/pages/my/menu.js
@@ -1,8 +1,8 @@
 
-import AppBar from "../../components/AppBar";
-import Layout from "../../components/Layout";
-import Link from "../../components/Link";
-import { useAuth } from "../../helpers/auth";
+import AppBar from "@/components/layouts/AppBar";
+import Layout from "@/components/layouts/Layout";
+import Link from "@/components/elements/Link";
+import { useAuth } from "@/core/utils/auth";
 import {
   ArrowRightOnRectangleIcon,
   ChatBubbleLeftRightIcon,
diff --git a/src/pages/my/profile.js b/src/pages/my/profile.js
index d4b7fb6d..97891259 100644
--- a/src/pages/my/profile.js
+++ b/src/pages/my/profile.js
@@ -1,14 +1,14 @@
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import { toast } from "react-hot-toast";
-import AppBar from "../../components/AppBar";
-import Layout from "../../components/Layout";
-import WithAuth from "../../components/WithAuth";
-import apiOdoo from "../../helpers/apiOdoo";
+import AppBar from "@/components/layouts/AppBar";
+import Layout from "@/components/layouts/Layout";
+import WithAuth from "@/components/auth/WithAuth";
+import apiOdoo from "@/core/utils/apiOdoo";
 import { 
   useAuth,
   setAuth as setAuthCookie,
   getAuth
-} from "../../helpers/auth";
+} from "@/core/utils/auth";
 
 export default function MyProfile() {
   const [auth, setAuth] = useAuth();
diff --git a/src/pages/my/transactions/[slug].js b/src/pages/my/transactions/[slug].js
index b2381247..a76b0c4d 100644
--- a/src/pages/my/transactions/[slug].js
+++ b/src/pages/my/transactions/[slug].js
@@ -1,8 +1,8 @@
 import { ArrowDownOnSquareIcon, ArrowDownTrayIcon, ChevronDownIcon, ChevronRightIcon, ChevronUpIcon } from "@heroicons/react/24/outline";
-import AppBar from "../../../components/AppBar";
-import Layout from "../../../components/Layout";
-import LineDivider from "../../../components/LineDivider";
-import WithAuth from "../../../components/WithAuth";
+import AppBar from "@/components/layouts/AppBar";
+import Layout from "@/components/layouts/Layout";
+import LineDivider from "@/components/elements/LineDivider";
+import WithAuth from "@/components/auth/WithAuth";
 import { useState } from "react";
 
 const Row = ({ label, children }) => (
diff --git a/src/pages/my/transactions/index.js b/src/pages/my/transactions/index.js
index 7792c647..b1e31661 100644
--- a/src/pages/my/transactions/index.js
+++ b/src/pages/my/transactions/index.js
@@ -1,14 +1,14 @@
 import { useRouter } from "next/router";
-import AppBar from "../../../components/AppBar";
-import BottomPopup from "../../../components/BottomPopup";
-import Layout from "../../../components/Layout";
-import WithAuth from "../../../components/WithAuth";
+import AppBar from "@/components/layouts/AppBar";
+import BottomPopup from "@/components/elements/BottomPopup";
+import Layout from "@/components/layouts/Layout";
+import WithAuth from "@/components/auth/WithAuth";
 import { useEffect, useState } from "react";
-import { useAuth } from "../../../helpers/auth";
-import apiOdoo from "../../../helpers/apiOdoo";
-import currencyFormat from "../../../helpers/currencyFormat";
+import { useAuth } from "@/core/utils/auth";
+import apiOdoo from "@/core/utils/apiOdoo";
+import currencyFormat from "@/core/utils/currencyFormat";
 import { EllipsisVerticalIcon } from "@heroicons/react/24/outline";
-import Link from "../../../components/Link";
+import Link from "@/components/elements/Link";
 
 export default function Transactions() {
   const [ auth ] = useAuth();
diff --git a/src/pages/register.js b/src/pages/register.js
index 46938d0b..046ae686 100644
--- a/src/pages/register.js
+++ b/src/pages/register.js
@@ -1,12 +1,12 @@
 import axios from "axios";
 import Head from "next/head";
 import Image from "next/image";
-import Link from "../components/Link";
+import Link from "@/components/elements/Link";
 import { useEffect, useState } from "react";
-import Alert from "../components/Alert";
-import Layout from "../components/Layout";
-import Spinner from "../components/Spinner";
-import Logo from "../images/logo.png";
+import Alert from "@/components/elements/Alert";
+import Layout from "@/components/layouts/Layout";
+import Spinner from "@/components/elements/Spinner";
+import Logo from "@/images/logo.png";
 
 export default function Login() {
   const [email, setEmail] = useState('');
diff --git a/src/pages/shop/brands/[slug].js b/src/pages/shop/brands/[slug].js
index 8e67ef1e..928da0d0 100644
--- a/src/pages/shop/brands/[slug].js
+++ b/src/pages/shop/brands/[slug].js
@@ -1,13 +1,13 @@
 import axios from "axios";
 import { useEffect, useState } from "react";
-import Filter from "../../../components/Filter";
-import Footer from "../../../components/Footer";
-import Header from "../../../components/Header";
-import Layout from "../../../components/Layout";
-import Pagination from "../../../components/Pagination";
-import ProductCard from "../../../components/ProductCard";
-import { getNameFromSlug } from "../../../helpers/slug";
-import FilterIcon from "../../../icons/filter.svg";
+import Filter from "@/components/elements/Filter";
+import Footer from "@/components/layouts/Footer";
+import Header from "@/components/layouts/Header";
+import Layout from "@/components/layouts/Layout";
+import Pagination from "@/components/elements/Pagination";
+import ProductCard from "@/components/products/ProductCard";
+import { getNameFromSlug } from "@/core/utils/slug";
+import FilterIcon from "@/icons/filter.svg";
 
 export async function getServerSideProps(context) {
   const { 
diff --git a/src/pages/shop/brands.js b/src/pages/shop/brands/index.js
index d82fc31d..fec2405a 100644
--- a/src/pages/shop/brands.js
+++ b/src/pages/shop/brands/index.js
@@ -1,11 +1,11 @@
-import Header from "../../components/Header";
-import apiOdoo from "../../helpers/apiOdoo";
+import Header from "@/components/layouts/Header";
+import apiOdoo from "@/core/utils/apiOdoo";
 import InfiniteScroll from "react-infinite-scroll-component";
 import { useEffect, useState } from "react";
-import Spinner from "../../components/Spinner";
-import Layout from "../../components/Layout";
-import ManufactureCard from "../../components/ManufactureCard";
-import Footer from "../../components/Footer";
+import Spinner from "@/components/elements/Spinner";
+import Layout from "@/components/layouts/Layout";
+import ManufactureCard from "@/components/manufactures/ManufactureCard";
+import Footer from "@/components/layouts/Footer";
 
 export async function getServerSideProps() {
   let initialManufactures = await apiOdoo('GET', '/api/v1/manufacture?limit=31');
diff --git a/src/pages/shop/cart.js b/src/pages/shop/cart.js
index 0c6bbdc3..53d5e648 100644
--- a/src/pages/shop/cart.js
+++ b/src/pages/shop/cart.js
@@ -14,21 +14,21 @@ import {
   createOrUpdateItemCart, 
   deleteItemCart, 
   getCart 
-} from "../../helpers/cart";
-import { createSlug } from "../../helpers/slug";
-import apiOdoo from "../../helpers/apiOdoo";
-import currencyFormat from "../../helpers/currencyFormat";
+} from "@/core/utils/cart";
+import { createSlug } from "@/core/utils/slug";
+import apiOdoo from "@/core/utils/apiOdoo";
+import currencyFormat from "@/core/utils/currencyFormat";
 
 // Components
-import ConfirmAlert from "../../components/ConfirmAlert";
-import Image from "../../components/Image";
-import Layout from "../../components/Layout";
-import Link from "../../components/Link";
-import Alert from "../../components/Alert";
-import Spinner from "../../components/Spinner";
-import AppBar from "../../components/AppBar";
-import ProgressBar from "../../components/ProgressBar";
-import LineDivider from "../../components/LineDivider";
+import ConfirmAlert from "@/components/elements/ConfirmAlert";
+import Image from "@/components/elements/Image";
+import Layout from "@/components/layouts/Layout";
+import Link from "@/components/elements/Link";
+import Alert from "@/components/elements/Alert";
+import Spinner from "@/components/elements/Spinner";
+import AppBar from "@/components/layouts/AppBar";
+import ProgressBar from "@/components/elements/ProgressBar";
+import LineDivider from "@/components/elements/LineDivider";
 
 export default function Cart() {
   const router = useRouter();
diff --git a/src/pages/shop/checkout.js b/src/pages/shop/checkout.js
index 0f9619cf..1849e0fe 100644
--- a/src/pages/shop/checkout.js
+++ b/src/pages/shop/checkout.js
@@ -1,22 +1,22 @@
 import { ExclamationCircleIcon } from "@heroicons/react/24/solid";
 import { useEffect, useState } from "react";
-import Alert from "../../components/Alert";
-import AppBar from "../../components/AppBar";
-import Image from "../../components/Image";
-import Layout from "../../components/Layout";
-import LineDivider from "../../components/LineDivider";
-import Link from "../../components/Link";
-import ProgressBar from "../../components/ProgressBar";
-import Spinner from "../../components/Spinner";
-import apiOdoo from "../../helpers/apiOdoo";
-import { useAuth } from "../../helpers/auth";
-import { deleteItemCart, getCart } from "../../helpers/cart";
-import currencyFormat from "../../helpers/currencyFormat";
-import { getItemAddress } from "../../helpers/address";
+import Alert from "@/components/elements/Alert";
+import AppBar from "@/components/layouts/AppBar";
+import Image from "@/components/elements/Image";
+import Layout from "@/components/layouts/Layout";
+import LineDivider from "@/components/elements/LineDivider";
+import Link from "@/components/elements/Link";
+import ProgressBar from "@/components/elements/ProgressBar";
+import Spinner from "@/components/elements/Spinner";
+import apiOdoo from "@/core/utils/apiOdoo";
+import { useAuth } from "@/core/utils/auth";
+import { deleteItemCart, getCart } from "@/core/utils/cart";
+import currencyFormat from "@/core/utils/currencyFormat";
+import { getItemAddress } from "@/core/utils/address";
 import { useRouter } from "next/router";
-import WithAuth from "../../components/WithAuth";
+import WithAuth from "@/components/auth/WithAuth";
 import { toast } from "react-hot-toast";
-import getFileBase64 from "../../helpers/getFileBase64";
+import getFileBase64 from "@/core/utils/getFileBase64";
 
 export default function Checkout() {
   const router = useRouter();
diff --git a/src/pages/shop/product/[slug].js b/src/pages/shop/product/[slug].js
index 43d511a8..fe467439 100644
--- a/src/pages/shop/product/[slug].js
+++ b/src/pages/shop/product/[slug].js
@@ -1,17 +1,17 @@
-import Link from "../../../components/Link";
+import Link from "@/components/elements/Link";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
-import Header from "../../../components/Header";
-import apiOdoo from "../../../helpers/apiOdoo";
-import { createSlug, getIdFromSlug } from "../../../helpers/slug";
-import currencyFormat from "../../../helpers/currencyFormat";
-import ProductSlider from "../../../components/product/ProductSlider";
-import Layout from "../../../components/Layout";
-import { createOrUpdateItemCart } from "../../../helpers/cart";
+import Header from "@/components/layouts/Header";
+import apiOdoo from "@/core/utils/apiOdoo";
+import { createSlug, getIdFromSlug } from "@/core/utils/slug";
+import currencyFormat from "@/core/utils/currencyFormat";
+import ProductSlider from "@/components/products/ProductSlider";
+import Layout from "@/components/layouts/Layout";
+import { createOrUpdateItemCart } from "@/core/utils/cart";
 import toast from "react-hot-toast";
-import Footer from "../../../components/Footer";
-import Image from "../../../components/Image";
-import LineDivider from "../../../components/LineDivider";
+import Footer from "@/components/layouts/Footer";
+import Image from "@/components/elements/Image";
+import LineDivider from "@/components/elements/LineDivider";
 
 export async function getServerSideProps( context ) {
   const { slug } = context.query;
diff --git a/src/pages/shop/search.js b/src/pages/shop/search.js
index db93d2cb..2521c7a2 100644
--- a/src/pages/shop/search.js
+++ b/src/pages/shop/search.js
@@ -1,12 +1,12 @@
 import axios from "axios";
-import Header from "../../components/Header";
-import Layout from "../../components/Layout";
-import Pagination from "../../components/Pagination";
-import ProductCard from "../../components/ProductCard";
-import FilterIcon from "../../icons/filter.svg";
+import Header from "@/components/layouts/Header";
+import Layout from "@/components/layouts/Layout";
+import Pagination from "@/components/elements/Pagination";
+import ProductCard from "@/components/products/ProductCard";
+import FilterIcon from "@/icons/filter.svg";
 import { useEffect, useState } from "react";
-import Filter from "../../components/Filter";
-import Footer from "../../components/Footer";
+import Filter from "@/components/elements/Filter";
+import Footer from "@/components/layouts/Footer";
 
 export async function getServerSideProps(context) {
   const {