Merge constant and constants folder and add path alias to project

src/App.tsx

@@ -1,6 +1,7 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { ThemeProvider } from './context/theme.context'
 import { HomePage } from './pages/home'
+
 const queryClient = new QueryClient({
 	defaultOptions: {
 		queries: {

src/common/constant/store.key.ts

@@ -1,11 +1,11 @@
-import type { SelectedCity } from '../../context/weather.context'
-import type { Todo } from '../../layouts/calendar/interface/todo.interface'
-import type { Bookmark } from '../../layouts/search/bookmarks/types/bookmark.types'
-import type { FetchedCurrency } from '../../services/getMethodHooks/getCurrencyByCode.hook'
+import type { SelectedCity } from '@/context/weather.context'
+import type { Todo } from '@/layouts/calendar/interface/todo.interface'
+import type { Bookmark } from '@/layouts/search/bookmarks/types/bookmark.types'
+import type { FetchedCurrency } from '@/services/getMethodHooks/getCurrencyByCode.hook'
 import type {
 	FetchedWeather,
 	WeatherSettings,
-} from '../../services/getMethodHooks/weather/weather.interface'
+} from '@/services/getMethodHooks/weather/weather.interface'
 import type { StoredWallpaper, Wallpaper } from '../wallpaper.interface'
 
 export interface StorageKV {

src/components/UpdateReleaseNotesModal.tsx

@@ -1,6 +1,6 @@
 import { motion } from 'framer-motion'
 import { RiBug2Line, RiCheckboxCircleFill, RiStarLine, RiToolsLine } from 'react-icons/ri'
-import { useTheme } from '../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 import Modal from './modal'
 
 type ReleaseNotes = Record<

src/components/checkbox.tsx

@@ -1,6 +1,6 @@
 import { motion } from 'framer-motion'
 import { memo } from 'react'
-import { useTheme } from '../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 
 interface CustomCheckboxProps {
 	checked: boolean

src/components/extension-installed-modal.tsx

@@ -1,6 +1,6 @@
 import { motion } from 'framer-motion'
 import { useState } from 'react'
-import keepItImage from '../assets/keep-it.png'
+import keepItImage from '@/assets/keep-it.png'
 import Modal from './modal'
 
 interface ExtensionInstalledModalProps {

src/components/modal.tsx

@@ -2,7 +2,7 @@ import { AnimatePresence, motion } from 'framer-motion'
 import { type ReactNode, useEffect } from 'react'
 import ReactDOM from 'react-dom'
 import { AiOutlineClose } from 'react-icons/ai'
-import { useTheme } from '../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 
 type ModalProps = {
 	isOpen: boolean

src/components/section-panel.tsx

@@ -1,6 +1,6 @@
 import { motion } from 'framer-motion'
 import type { ReactNode } from 'react'
-import { useTheme } from '../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 
 interface SectionPanelProps {
 	title: string

src/components/selectBox/multiSelectDropdown.component.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useRef, useState } from 'react'
 import { FiCheck, FiChevronDown, FiSearch, FiX } from 'react-icons/fi'
-import { useTheme } from '../../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 
 interface Option {
 	value: string

src/components/text-input.tsx

@@ -1,5 +1,5 @@
 import { type ForwardedRef, forwardRef } from 'react'
-import { useTheme } from '../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 
 interface TextInputProps {
 	value: string

src/context/bookmark.context.tsx

@@ -1,7 +1,7 @@
 import React, { createContext, useEffect, useState } from 'react'
 import { toast } from 'react-hot-toast'
-import { getFromStorage, setToStorage } from '../common/storage'
-import type { Bookmark } from '../layouts/search/bookmarks/types/bookmark.types'
+import { getFromStorage, setToStorage } from '@/common/storage'
+import type { Bookmark } from 'W/layouts/search/bookmarks/types/bookmark.types'
 
 const MAX_BOOKMARK_SIZE = 1.5 * 1024 * 1024
 

src/context/currency.context.tsx

@@ -1,5 +1,5 @@
 import React, { createContext, useEffect, useState } from 'react'
-import { getFromStorage, setToStorage } from '../common/storage'
+import { getFromStorage, setToStorage } from '@/common/storage'
 
 export interface StoreContext {
 	selectedCurrencies: Array<string>

src/context/general-setting.context.tsx

@@ -1,6 +1,6 @@
 import type React from 'react'
 import { createContext, useCallback, useContext, useEffect, useState } from 'react'
-import { getFromStorage, setToStorage } from '../common/storage'
+import { getFromStorage, setToStorage } from '@/common/storage'
 
 export type FontFamily = 'Vazir' | 'digiLalezarPlus'
 

src/context/theme.context.tsx

@@ -1,6 +1,6 @@
 import type React from 'react'
 import { createContext, useCallback, useContext, useEffect, useState } from 'react'
-import { getFromStorage, setToStorage } from '../common/storage'
+import { getFromStorage, setToStorage } from '@/common/storage'
 
 interface ThemeContextType {
 	theme: string

src/context/todo.context.tsx

@@ -1,8 +1,8 @@
 import type React from 'react'
 import { createContext, useContext, useEffect, useState } from 'react'
 import { v4 as uuidv4 } from 'uuid'
-import { getFromStorage, setToStorage } from '../common/storage'
-import type { Todo } from '../layouts/calendar/interface/todo.interface'
+import { getFromStorage, setToStorage } from '@/common/storage'
+import type { Todo } from '@/layouts/calendar/interface/todo.interface'
 
 interface TodoContextType {
 	todos: Todo[]

src/context/weather.context.tsx

@@ -1,6 +1,6 @@
 import React, { createContext, useEffect, useState } from 'react'
-import { getFromStorage, setToStorage } from '../common/storage'
-import type { WeatherSettings } from '../services/getMethodHooks/weather/weather.interface'
+import { getFromStorage, setToStorage } from '@/common/storage'
+import type { WeatherSettings } from '@/services/getMethodHooks/weather/weather.interface'
 
 export interface SelectedCity {
 	name: string

src/layouts/arzLive/arzLive.layout.tsx

@@ -1,9 +1,9 @@
 import { motion } from 'framer-motion'
 import { useState } from 'react'
 import { FiChevronDown, FiChevronUp } from 'react-icons/fi'
-import { useCurrencyStore } from '../../context/currency.context'
-import { useTheme } from '../../context/theme.context'
-import { useGetSupportCurrencies } from '../../services/getMethodHooks/getSupportCurrencies.hook'
+import { useCurrencyStore } from '@/context/currency.context'
+import { useTheme } from '@/context/theme.context'
+import { useGetSupportCurrencies } from '@/services/getMethodHooks/getSupportCurrencies.hook'
 import { AddCurrencyBox } from './components/addCurrency-box'
 import { CurrencyBox } from './components/currency-box'
 

src/layouts/arzLive/components/addCurrency-box.tsx

@@ -2,10 +2,10 @@ import { motion } from 'framer-motion'
 import { useState } from 'react'
 import { AiOutlineLoading } from 'react-icons/ai'
 import { TiPlus } from 'react-icons/ti'
-import Modal from '../../../components/modal'
-import { MultiSelectDropdown } from '../../../components/selectBox/multiSelectDropdown.component'
-import { useCurrencyStore } from '../../../context/currency.context'
-import { useTheme } from '../../../context/theme.context'
+import Modal from '@/components/modal'
+import { MultiSelectDropdown } from '@/components/selectBox/multiSelectDropdown.component'
+import { useCurrencyStore } from '@/context/currency.context'
+import { useTheme } from '@/context/theme.context'
 
 export type SupportedCurrencies = {
 	key: string

src/layouts/arzLive/components/currency-box.tsx

@@ -2,13 +2,13 @@ import { motion, useMotionValue, useSpring } from 'framer-motion'
 import ms from 'ms'
 import { useEffect, useRef, useState } from 'react'
 import { FaArrowDownLong, FaArrowUpLong } from 'react-icons/fa6'
-import { getMainColorFromImage } from '../../../common/color'
-import { getFromStorage, setToStorage } from '../../../common/storage'
-import { useTheme } from '../../../context/theme.context'
+import { getMainColorFromImage } from '@/common/color'
+import { getFromStorage, setToStorage } from '@/common/storage'
+import { useTheme } from '@/context/theme.context'
 import {
 	type FetchedCurrency,
 	useGetCurrencyByCode,
-} from '../../../services/getMethodHooks/getCurrencyByCode.hook'
+} from '@/services/getMethodHooks/getCurrencyByCode.hook'
 import { CurrencyModalComponent } from './currency-modal'
 
 interface CurrencyBoxProps {

src/layouts/arzLive/components/currency-modal.tsx

@@ -1,8 +1,8 @@
 import { AnimatePresence, motion } from 'framer-motion'
 import { useState } from 'react'
 import { FaArrowDownLong, FaArrowUpLong, FaChartLine } from 'react-icons/fa6'
-import Modal from '../../../components/modal'
-import { useTheme } from '../../../context/theme.context'
+import Modal from '@/components/modal'
+import { useTheme } from '@/context/theme.context'
 import { CurrencyChart } from './currency-chart'
 
 interface CurrencyModalComponentProps {

src/layouts/calendar/calendar.tsx

@@ -2,8 +2,8 @@ import { AnimatePresence, motion } from 'framer-motion'
 import jalaliMoment from 'jalali-moment'
 import type React from 'react'
 import { useCallback, useState } from 'react'
-import { useTheme } from '../../context/theme.context'
-import { TodoProvider } from '../../context/todo.context'
+import { useTheme } from '@/context/theme.context'
+import { TodoProvider } from '@/context/todo.context'
 import { CalendarContainer } from './components/calendar-container'
 import { CalendarContent } from './components/calendar-content'
 import { CalendarGrid } from './components/calendar-grid'

src/layouts/calendar/components/calendar-container.tsx

@@ -1,5 +1,5 @@
 import type React from 'react'
-import { useTheme } from '../../../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 
 interface CalendarContainerProps {
 	children: React.ReactNode

src/layouts/calendar/components/calendar-grid.tsx

@@ -1,9 +1,9 @@
 import type jalaliMoment from 'jalali-moment'
 import type React from 'react'
 import { v4 as uuidv4 } from 'uuid'
-import { useTheme } from '../../../context/theme.context'
-import { useTodoStore } from '../../../context/todo.context'
-import { useGetEvents } from '../../../services/getMethodHooks/getEvents.hook'
+import { useTheme } from '@/context/theme.context'
+import { useTodoStore } from '@/context/todo.context'
+import { useGetEvents } from '@/services/getMethodHooks/getEvents.hook'
 import { formatDateStr } from '../utils'
 import { DayItem } from './day'
 

src/layouts/calendar/components/calendar-header.tsx

@@ -4,7 +4,7 @@ import type React from 'react'
 import { useMemo } from 'react'
 import { FaChevronLeft, FaChevronRight } from 'react-icons/fa6'
 import { FiCalendar } from 'react-icons/fi'
-import { useTheme } from '../../../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 
 const PERSIAN_MONTHS = [
 	'فروردین',

src/layouts/calendar/components/day-slider.tsx

@@ -1,7 +1,7 @@
 import { motion } from 'framer-motion'
 import jalaliMoment from 'jalali-moment'
 import { FaChevronLeft, FaChevronRight } from 'react-icons/fa6'
-import { useTheme } from '../../../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 
 interface DaySliderProps {
 	currentDate: jalaliMoment.Moment

src/layouts/calendar/components/day-summary.tsx

@@ -2,9 +2,9 @@ import { motion } from 'framer-motion'
 import type jalaliMoment from 'jalali-moment'
 import type React from 'react'
 import { FiCalendar, FiChevronRight, FiClipboard } from 'react-icons/fi'
-import { useTheme } from '../../../context/theme.context'
-import { useTodoStore } from '../../../context/todo.context'
-import { useGetEvents } from '../../../services/getMethodHooks/getEvents.hook'
+import { useTheme } from '@/context/theme.context'
+import { useTodoStore } from '@/context/todo.context'
+import { useGetEvents } from '@/services/getMethodHooks/getEvents.hook'
 import type { TabType } from '../calendar'
 import { formatDateStr } from '../utils'
 import { getGregorianEvents, getHijriEvents, getShamsiEvents } from '../utils'

src/layouts/calendar/components/day.tsx

@@ -1,6 +1,6 @@
 import jalaliMoment from 'jalali-moment'
-import { useTheme } from '../../../context/theme.context'
-import type { FetchedAllEvents } from '../../../services/getMethodHooks/getEvents.hook'
+import { useTheme } from '@/context/theme.context'
+import type { FetchedAllEvents } from '@/services/getMethodHooks/getEvents.hook'
 import type { Todo } from '../interface/todo.interface'
 import { formatDateStr, getHijriEvents, getShamsiEvents } from '../utils'
 

src/layouts/calendar/components/events/event.tsx

@@ -1,8 +1,8 @@
 import { motion } from 'framer-motion'
 import type jalaliMoment from 'jalali-moment'
 import { FiCalendar } from 'react-icons/fi'
-import { useTheme } from '../../../../context/theme.context'
-import type { FetchedAllEvents } from '../../../../services/getMethodHooks/getEvents.hook'
+import { useTheme } from '@/context/theme.context'
+import type { FetchedAllEvents } from '@/services/getMethodHooks/getEvents.hook'
 import { getGregorianEvents, getHijriEvents, getShamsiEvents } from '../../utils'
 
 interface Prop {

src/layouts/calendar/components/pomodoro/components/settings-panel.tsx

@@ -1,6 +1,6 @@
 import { motion } from 'framer-motion'
 import type React from 'react'
-import Modal from '../../../../../components/modal'
+import Modal from '@/components/modal'
 import type { PomodoroSettings } from '../types'
 
 interface SettingInputProps {

src/layouts/calendar/components/pomodoro/pomodoro-timer.tsx

@@ -9,7 +9,7 @@ import {
 	FiRefreshCw,
 	FiSettings,
 } from 'react-icons/fi'
-import { useTheme } from '../../../../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 import { ControlButton } from './components/control-button'
 import { ModeButton } from './components/mode-button'
 import { PomodoroSettingsPanel } from './components/settings-panel'

src/layouts/calendar/components/tab-navigation.tsx

@@ -2,7 +2,7 @@ import { motion } from 'framer-motion'
 import type React from 'react'
 import { FiCalendar, FiClipboard, FiWatch } from 'react-icons/fi'
 import { IoAnalyticsOutline } from 'react-icons/io5'
-import { useTheme } from '../../../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 import type { TabType } from '../calendar'
 
 interface TabNavigationProps {

src/layouts/calendar/components/todos/todo-input.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react'
 import { FiFlag, FiTag } from 'react-icons/fi'
 import Analytics from '../../../../analytics'
-import { useTheme } from '../../../../context/theme.context'
+import { useTheme } from '@/context/theme.context'
 
 interface Prop {
 	onAdd: (

src/layouts/calendar/components/todos/todo-stats.tsx

@@ -1,6 +1,6 @@
 import { useMemo } from 'react'
-import { useTheme } from '../../../../context/theme.context'
-import { useTodoStore } from '../../../../context/todo.context'
+import { useTheme } from '@/context/theme.context'
+import { useTodoStore } from '@/context/todo.context'
 
 export function TodoStats() {
 	const { todos } = useTodoStore()

src/layouts/calendar/components/todos/todo.item.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react'
 import { FiChevronDown, FiChevronUp, FiEdit, FiTrash2 } from 'react-icons/fi'
-import CustomCheckbox from '../../../../components/checkbox'
-import { useTheme } from '../../../../context/theme.context'
+import CustomCheckbox from '@/components/checkbox'
+import { useTheme } from '@/context/theme.context'
 import type { Todo } from '../../interface/todo.interface'
 
 interface Prop {

src/layouts/calendar/components/todos/todos.tsx

@@ -1,9 +1,9 @@
 import type jalaliMoment from 'jalali-moment'
 import { useEffect, useState } from 'react'
 import { FaEye, FaEyeSlash } from 'react-icons/fa'
-import { getFromStorage, setToStorage } from '../../../../common/storage'
-import { useTheme } from '../../../../context/theme.context'
-import { useTodoStore } from '../../../../context/todo.context'
+import { getFromStorage, setToStorage } from '@/common/storage'
+import { useTheme } from '@/context/theme.context'
+import { useTodoStore } from '@/context/todo.context'
 import { formatDateStr } from '../../utils'
 import { TodoInput } from './todo-input'
 import { TodoItem } from './todo.item'

src/layouts/navbar/navbar.layout.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react'
 import { VscSettings } from 'react-icons/vsc'
-import { Colors } from '../../common/constant/colors.constant'
+import { Colors } from '@/common/constant/colors.constant'
 import { SettingModal } from '../setting/setting-modal'
 
 export interface PageLink {

src/layouts/search/bookmarks/bookmarks.tsx

@@ -1,11 +1,11 @@
 import { useEffect, useState } from 'react'
-import { getFromStorage } from '../../../common/storage'
-import { useBookmarkStore } from '../../../context/bookmark.context'
-import { useTheme } from '../../../context/theme.context'
+import { getFromStorage } from '@/common/storage'
+import { useBookmarkStore } from '@/context/bookmark.context'
+import { useTheme } from '@/context/theme.context'
 import {
 	type FetchedSuggestionsBookmark,
 	useGetBookmarks,
-} from '../../../services/getMethodHooks/getBookmarks.hook'
+} from '@/services/getMethodHooks/getBookmarks.hook'
 import { AddBookmarkModal } from './components/add-bookmark.modal'
 import { BookmarkContextMenu } from './components/bookmark-context-menu'
 import { BookmarkItem } from './components/bookmark-item'

src/layouts/search/bookmarks/components/add-bookmark.modal.tsx

@@ -2,7 +2,7 @@ import { AnimatePresence, motion } from 'framer-motion'
 import { useRef, useState } from 'react'
 import { FaImage, FaUpload } from 'react-icons/fa'
 import { v4 as uuidv4 } from 'uuid'
-import Modal from '../../../../components/modal'
+import Modal from '@/components/modal'
 import type { Bookmark, BookmarkType } from '../types/bookmark.types'
 
 interface AddBookmarkModalProps {

src/layouts/search/search.tsx

@@ -2,8 +2,8 @@ import { useRef, useState } from 'react'
 import { CiSearch } from 'react-icons/ci'
 import { MdOutlineClear } from 'react-icons/md'
 import Browser from 'webextension-polyfill'
-import { BookmarkProvider } from '../../context/bookmark.context'
-import { useTheme } from '../../context/theme.context'
+import { BookmarkProvider } from '@/context/bookmark.context'
+import { useTheme } from '@/context/theme.context'
 import { BookmarksComponent } from './bookmarks/bookmarks'
 
 export function SearchLayout() {

src/layouts/setting/setting-modal.tsx

@@ -2,8 +2,8 @@ import clsx from 'clsx'
 import { AnimatePresence, motion } from 'framer-motion'
 import { useState } from 'react'
 import { VscCloud, VscInfo, VscPaintcan, VscSettingsGear } from 'react-icons/vsc'
-import Modal from '../../components/modal'
-import { useTheme } from '../../context/theme.context'
+import Modal from '@/components/modal'
+import { useTheme } from '@/context/theme.context'
 import { AboutUsTab } from './tabs/about-us/about-us'
 import { GeneralSettingTab } from './tabs/general/general'
 import { WallpaperSetting } from './tabs/wallpapers/wallpapers'