From 6211634f967ed31cf64b4ee296859245554beddd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Afra=20=E2=80=8C?= Date: Sat, 1 Aug 2026 16:42:53 +0330 Subject: [PATCH] perf: restyle imports to use @ for the base path --- src/App.tsx | 6 ++-- src/api/authApi.ts | 2 +- src/api/axios.ts | 4 +-- src/app/store.ts | 2 +- src/components/ProtectedRoute.tsx | 2 +- src/components/layout/AdminLayout.tsx | 8 ++--- src/components/layout/Sidebar.tsx | 6 ++-- src/constants/navigation.tsx | 49 +++++++++++++++++---------- src/design/theme/antdTheme.ts | 4 +-- src/design/tokens/index.ts | 6 ++-- src/features/auth/authService.ts | 4 +-- src/features/auth/authSlice.ts | 6 ++-- src/main.tsx | 6 ++-- src/pages/Billboards/Billboards.tsx | 4 +-- src/pages/Home/Home.tsx | 4 +-- src/pages/Login/Login.tsx | 6 ++-- src/pages/Profile/Profile.tsx | 4 +-- src/pages/VerifyOtp/VerifyOtp.tsx | 10 +++--- src/routes/router.tsx | 14 ++++---- src/services/api.ts | 14 ++++---- src/services/authApi.ts | 12 +++---- src/types/index.ts | 2 +- src/utils/authInterceptor.ts | 2 +- src/utils/authUrl.ts | 2 +- src/utils/hooks.ts | 2 +- src/utils/logout.ts | 2 +- tsconfig.app.json | 5 +++ vite.config.ts | 6 ++++ 28 files changed, 110 insertions(+), 84 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index 621dce8..761c200 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,8 +1,8 @@ import { useEffect } from 'react'; import { Outlet, useLocation, useNavigate } from 'react-router-dom'; -import { useAppDispatch, useAppSelector } from './utils/hooks'; -import { hydrateAuth } from './features/auth/authSlice'; -import AdminLayout from './components/layout/AdminLayout'; +import { useAppDispatch, useAppSelector } from '@/utils/hooks'; +import { hydrateAuth } from '@/features/auth/authSlice'; +import AdminLayout from '@/components/layout/AdminLayout'; function App() { const dispatch = useAppDispatch(); diff --git a/src/api/authApi.ts b/src/api/authApi.ts index fac4373..604fcac 100644 --- a/src/api/authApi.ts +++ b/src/api/authApi.ts @@ -1,4 +1,4 @@ -import type { SendOtpResponse } from '../features/auth/authTypes'; +import type { SendOtpResponse } from '@/features/auth/authTypes'; export const authApi = { sendOtp: async (phoneNumber: string): Promise => { diff --git a/src/api/axios.ts b/src/api/axios.ts index b2d1e7f..e3213a2 100644 --- a/src/api/axios.ts +++ b/src/api/axios.ts @@ -1,6 +1,6 @@ import axios, { type AxiosError } from 'axios'; -import { env } from '../config/env'; -import { STORAGE_KEYS } from '../utils/storage'; +import { env } from '@/config/env'; +import { STORAGE_KEYS } from '@/utils/storage'; const api = axios.create({ baseURL: env.apiBaseUrl, diff --git a/src/app/store.ts b/src/app/store.ts index c61ec23..4a0ceb8 100644 --- a/src/app/store.ts +++ b/src/app/store.ts @@ -1,5 +1,5 @@ import { configureStore } from '@reduxjs/toolkit'; -import authReducer from '../features/auth/authSlice.ts'; +import authReducer from '@/features/auth/authSlice.ts'; export const store = configureStore({ reducer: { diff --git a/src/components/ProtectedRoute.tsx b/src/components/ProtectedRoute.tsx index dd2a33c..f8f1817 100644 --- a/src/components/ProtectedRoute.tsx +++ b/src/components/ProtectedRoute.tsx @@ -1,6 +1,6 @@ import type { ReactNode } from 'react'; import { Navigate, useLocation } from 'react-router-dom'; -import { useAppSelector } from '../utils/hooks'; +import { useAppSelector } from '@/utils/hooks'; interface ProtectedRouteProps { children: ReactNode; diff --git a/src/components/layout/AdminLayout.tsx b/src/components/layout/AdminLayout.tsx index d384890..0f6148b 100644 --- a/src/components/layout/AdminLayout.tsx +++ b/src/components/layout/AdminLayout.tsx @@ -2,10 +2,10 @@ import { Drawer, Layout, Menu, Typography, theme } from "antd"; import { useEffect, useState } from "react"; import type { ReactNode } from "react"; import { useNavigate, useLocation } from "react-router-dom"; -import winsooLogo from "../../assets/images/winsoo.svg"; -import { getSidebarMenuItems } from "../../constants/navigation"; -import { colors } from "../../design/tokens/colors"; -import { spacing } from "../../design/tokens/spacing"; +import winsooLogo from "@/assets/images/winsoo.svg"; +import { getSidebarMenuItems } from "@/constants/navigation"; +import { colors } from "@/design/tokens/colors"; +import { spacing } from "@/design/tokens/spacing"; const { Header, Content, Sider } = Layout; const { Title } = Typography; diff --git a/src/components/layout/Sidebar.tsx b/src/components/layout/Sidebar.tsx index ce324b1..cca1dda 100644 --- a/src/components/layout/Sidebar.tsx +++ b/src/components/layout/Sidebar.tsx @@ -1,8 +1,8 @@ import { Menu } from 'antd'; import { useNavigate, useLocation } from 'react-router-dom'; -import { getSidebarMenuItems } from '../../constants/navigation'; -import { colors } from '../../design/tokens/colors'; -import { spacing } from '../../design/tokens/spacing'; +import { getSidebarMenuItems } from '@/constants/navigation'; +import { colors } from '@/design/tokens/colors'; +import { spacing } from '@/design/tokens/spacing'; const Sidebar = () => { const navigate = useNavigate(); diff --git a/src/constants/navigation.tsx b/src/constants/navigation.tsx index 1f7473a..e0b7448 100644 --- a/src/constants/navigation.tsx +++ b/src/constants/navigation.tsx @@ -1,9 +1,9 @@ -import { Home, MonitorPlay, UserRound } from 'lucide'; -import type { ReactNode } from 'react'; -import type { MenuProps } from 'antd'; -import LucideIcon from '../components/ui/LucideIcon'; +import { Home, MonitorPlay, UserRound } from "lucide"; +import type { ReactNode } from "react"; +import type { MenuProps } from "antd"; +import LucideIcon from "@/components/ui/LucideIcon"; -export type SidebarItemKey = '/profile' | '/billboards' | '/'; +export type SidebarItemKey = "/profile" | "/billboards" | "/"; export interface SidebarItem { key: SidebarItemKey; @@ -13,25 +13,40 @@ export interface SidebarItem { export const sidebarItems: SidebarItem[] = [ { - key: '/profile', - label: 'پروفایل کاربر', + key: "/", + label: "داشبورد", + icon: , + }, + { + key: "/profile", + label: "پروفایل کاربر", icon: , }, { - key: '/billboards', - label: 'بیلبوردها', + key: "/billboards", + label: "بیلبوردها", icon: , }, - { - key: '/', - label: 'داشبورد', - icon: , - }, ]; -export const getSidebarMenuItems = (): NonNullable => +export const getSidebarMenuItems = (): NonNullable => sidebarItems.map((item) => ({ key: item.key, - label: {item.icon}{item.label}, - icon: {item.icon}, + label: ( + + {item.icon} + {item.label} + + ), + icon: ( + + {item.icon} + + ), })); diff --git a/src/design/theme/antdTheme.ts b/src/design/theme/antdTheme.ts index 0cc29a9..1b42595 100644 --- a/src/design/theme/antdTheme.ts +++ b/src/design/theme/antdTheme.ts @@ -1,6 +1,6 @@ import type { ThemeConfig } from 'antd'; -import { colors } from '../tokens/colors'; -import { typography } from '../tokens/typography'; +import { colors } from '@/design/tokens/colors'; +import { typography } from '@/design/tokens/typography'; export const antdTheme: ThemeConfig = { token: { diff --git a/src/design/tokens/index.ts b/src/design/tokens/index.ts index 2b370ce..62b6bb5 100644 --- a/src/design/tokens/index.ts +++ b/src/design/tokens/index.ts @@ -1,3 +1,3 @@ -export { colors } from './colors'; -export { spacing } from './spacing'; -export { typography } from './typography'; +export { colors } from '@/design/tokens/colors'; +export { spacing } from '@/design/tokens/spacing'; +export { typography } from '@/design/tokens/typography'; diff --git a/src/features/auth/authService.ts b/src/features/auth/authService.ts index 7afe577..1be9093 100644 --- a/src/features/auth/authService.ts +++ b/src/features/auth/authService.ts @@ -1,5 +1,5 @@ -import { authApi } from '../../services/authApi'; -import type { AuthSessionPayload, RequestOtpResponse } from '../../types/auth'; +import { authApi } from '@/services/authApi'; +import type { AuthSessionPayload, RequestOtpResponse } from '@/types/auth'; export const authService = { sendOtp: async (phoneNumber: string): Promise => { diff --git a/src/features/auth/authSlice.ts b/src/features/auth/authSlice.ts index 8b90404..1376559 100644 --- a/src/features/auth/authSlice.ts +++ b/src/features/auth/authSlice.ts @@ -1,7 +1,7 @@ import { createSlice, type PayloadAction } from '@reduxjs/toolkit'; -import type { AuthState, LoginSuccessPayload } from './authTypes'; -import { STORAGE_KEYS } from '../../utils/storage'; -import { getAccessToken, storeAuthTokens } from '../../utils/authToken'; +import type { AuthState, LoginSuccessPayload } from '@/features/auth/authTypes'; +import { STORAGE_KEYS } from '@/utils/storage'; +import { getAccessToken, storeAuthTokens } from '@/utils/authToken'; const initialState: AuthState = { user: null, diff --git a/src/main.tsx b/src/main.tsx index d60713a..8a0eec9 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -5,9 +5,9 @@ import { RouterProvider } from 'react-router-dom'; import { ConfigProvider } from 'antd'; import 'antd/dist/reset.css'; import faIR from 'antd/locale/fa_IR'; -import { store } from './app/store'; -import { router } from './routes/router'; -import { antdTheme } from './design/theme/antdTheme'; +import { store } from '@/app/store'; +import { router } from '@/routes/router'; +import { antdTheme } from '@/design/theme/antdTheme'; import './index.css'; createRoot(document.getElementById('root')!).render( diff --git a/src/pages/Billboards/Billboards.tsx b/src/pages/Billboards/Billboards.tsx index 1cea852..bae932c 100644 --- a/src/pages/Billboards/Billboards.tsx +++ b/src/pages/Billboards/Billboards.tsx @@ -1,6 +1,6 @@ import { Card, Typography } from 'antd'; -import { colors } from '../../design/tokens/colors'; -import { spacing } from '../../design/tokens/spacing'; +import { colors } from '@/design/tokens/colors'; +import { spacing } from '@/design/tokens/spacing'; const { Title, Paragraph } = Typography; diff --git a/src/pages/Home/Home.tsx b/src/pages/Home/Home.tsx index b28c644..c5a8d0e 100644 --- a/src/pages/Home/Home.tsx +++ b/src/pages/Home/Home.tsx @@ -1,6 +1,6 @@ import { Card, Typography } from 'antd'; -import { colors } from '../../design/tokens/colors'; -import { spacing } from '../../design/tokens/spacing'; +import { colors } from '@/design/tokens/colors'; +import { spacing } from '@/design/tokens/spacing'; const { Title, Paragraph } = Typography; diff --git a/src/pages/Login/Login.tsx b/src/pages/Login/Login.tsx index af16cc0..3bf9ff3 100644 --- a/src/pages/Login/Login.tsx +++ b/src/pages/Login/Login.tsx @@ -1,8 +1,8 @@ import { Button, Card, Form, Input, Typography, message } from 'antd'; import { useNavigate } from 'react-router-dom'; -import { authService } from '../../features/auth/authService'; -import { colors } from '../../design/tokens/colors'; -import { spacing } from '../../design/tokens/spacing'; +import { authService } from '@/features/auth/authService'; +import { colors } from '@/design/tokens/colors'; +import { spacing } from '@/design/tokens/spacing'; const { Title, Paragraph } = Typography; diff --git a/src/pages/Profile/Profile.tsx b/src/pages/Profile/Profile.tsx index 1cdf44a..3f205bc 100644 --- a/src/pages/Profile/Profile.tsx +++ b/src/pages/Profile/Profile.tsx @@ -1,6 +1,6 @@ import { Card, Typography } from 'antd'; -import { colors } from '../../design/tokens/colors'; -import { spacing } from '../../design/tokens/spacing'; +import { colors } from '@/design/tokens/colors'; +import { spacing } from '@/design/tokens/spacing'; const { Title, Paragraph } = Typography; diff --git a/src/pages/VerifyOtp/VerifyOtp.tsx b/src/pages/VerifyOtp/VerifyOtp.tsx index 8634517..0f45c42 100644 --- a/src/pages/VerifyOtp/VerifyOtp.tsx +++ b/src/pages/VerifyOtp/VerifyOtp.tsx @@ -1,11 +1,11 @@ import { Button, Card, Form, Input, Typography, message, type InputRef } from 'antd'; import { useEffect, useRef, useState } from 'react'; import { useNavigate } from 'react-router-dom'; -import { useAppDispatch } from '../../utils/hooks'; -import { loginSuccess } from '../../features/auth/authSlice'; -import { authService } from '../../features/auth/authService'; -import { colors } from '../../design/tokens/colors'; -import { spacing } from '../../design/tokens/spacing'; +import { useAppDispatch } from '@/utils/hooks'; +import { loginSuccess } from '@/features/auth/authSlice'; +import { authService } from '@/features/auth/authService'; +import { colors } from '@/design/tokens/colors'; +import { spacing } from '@/design/tokens/spacing'; const { Title, Paragraph } = Typography; diff --git a/src/routes/router.tsx b/src/routes/router.tsx index 1b39b46..7630829 100644 --- a/src/routes/router.tsx +++ b/src/routes/router.tsx @@ -1,11 +1,11 @@ import { createBrowserRouter, Navigate } from 'react-router-dom'; -import App from '../App'; -import Login from '../pages/Login/Login'; -import VerifyOtp from '../pages/VerifyOtp/VerifyOtp'; -import Home from '../pages/Home/Home'; -import Profile from '../pages/Profile/Profile'; -import Billboards from '../pages/Billboards/Billboards'; -import ProtectedRoute from '../components/ProtectedRoute'; +import App from '@/App'; +import Login from '@/pages/Login/Login'; +import VerifyOtp from '@/pages/VerifyOtp/VerifyOtp'; +import Home from '@/pages/Home/Home'; +import Profile from '@/pages/Profile/Profile'; +import Billboards from '@/pages/Billboards/Billboards'; +import ProtectedRoute from '@/components/ProtectedRoute'; export const router = createBrowserRouter([ { diff --git a/src/services/api.ts b/src/services/api.ts index 8879018..004dc10 100644 --- a/src/services/api.ts +++ b/src/services/api.ts @@ -1,11 +1,11 @@ import axios, { type AxiosError, type InternalAxiosRequestConfig } from 'axios'; -import { AUTH_SCOPE } from '../constants/auth'; -import { env } from '../config/env'; -import { getAccessToken, getRefreshToken, storeAuthTokens, clearAuthTokens } from '../utils/authToken'; -import { logout } from '../utils/logout'; -import { buildAuthUrl } from '../utils/authUrl'; -import { createBasicAuthHeader } from '../config/env'; -import type { TokenResponse } from '../types/auth'; +import { AUTH_SCOPE } from '@/constants/auth'; +import { env } from '@/config/env'; +import { getAccessToken, getRefreshToken, storeAuthTokens, clearAuthTokens } from '@/utils/authToken'; +import { logout } from '@/utils/logout'; +import { buildAuthUrl } from '@/utils/authUrl'; +import { createBasicAuthHeader } from '@/config/env'; +import type { TokenResponse } from '@/types/auth'; const apiBaseUrl = env.apiBaseUrl; diff --git a/src/services/authApi.ts b/src/services/authApi.ts index 6f2e5e3..ff31db4 100644 --- a/src/services/authApi.ts +++ b/src/services/authApi.ts @@ -1,10 +1,10 @@ import axios from 'axios'; -import { AUTH_SCOPE } from '../constants/auth'; -import { createBasicAuthHeader } from '../config/env'; -import { clearAuthTokens, storeAuthTokens } from '../utils/authToken'; -import { normalizePhoneNumber, toE164PhoneNumber } from '../utils/phone'; -import { buildAuthUrl } from '../utils/authUrl'; -import type { RequestOtpPayload, RequestOtpResponse, TokenResponse } from '../types/auth'; +import { AUTH_SCOPE } from '@/constants/auth'; +import { createBasicAuthHeader } from '@/config/env'; +import { clearAuthTokens, storeAuthTokens } from '@/utils/authToken'; +import { normalizePhoneNumber, toE164PhoneNumber } from '@/utils/phone'; +import { buildAuthUrl } from '@/utils/authUrl'; +import type { RequestOtpPayload, RequestOtpResponse, TokenResponse } from '@/types/auth'; export const authApi = { requestOtp: async (phoneNumber: string): Promise => { diff --git a/src/types/index.ts b/src/types/index.ts index d9a6ff5..a9e2444 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -1 +1 @@ -export * from '../features/auth/authTypes'; +export * from '@/features/auth/authTypes'; diff --git a/src/utils/authInterceptor.ts b/src/utils/authInterceptor.ts index e625ccb..ba226d7 100644 --- a/src/utils/authInterceptor.ts +++ b/src/utils/authInterceptor.ts @@ -1,5 +1,5 @@ import type { AxiosError } from 'axios'; -import api from '../services/api'; +import api from '@/services/api'; export const attachAuthInterceptor = () => { api.interceptors.response.use( diff --git a/src/utils/authUrl.ts b/src/utils/authUrl.ts index 1dc3e16..2946870 100644 --- a/src/utils/authUrl.ts +++ b/src/utils/authUrl.ts @@ -1,4 +1,4 @@ -import { env } from '../config/env'; +import { env } from '@/config/env'; const normalizeBaseUrl = (value: string) => value.trim().replace(/\/+$/, ''); const ensureLeadingSlash = (value: string) => (value.startsWith('/') ? value : `/${value}`); diff --git a/src/utils/hooks.ts b/src/utils/hooks.ts index ce045b5..7716914 100644 --- a/src/utils/hooks.ts +++ b/src/utils/hooks.ts @@ -1,5 +1,5 @@ import { useDispatch, useSelector } from 'react-redux'; -import type { AppDispatch, RootState } from '../app/store'; +import type { AppDispatch, RootState } from '@/app/store'; export const useAppDispatch = useDispatch.withTypes(); export const useAppSelector = useSelector.withTypes(); diff --git a/src/utils/logout.ts b/src/utils/logout.ts index 7e0c58d..0ee9c0b 100644 --- a/src/utils/logout.ts +++ b/src/utils/logout.ts @@ -1,4 +1,4 @@ -import { clearAuthTokens } from './authToken'; +import { clearAuthTokens } from '@/utils/authToken'; export const logout = () => { clearAuthTokens(); diff --git a/tsconfig.app.json b/tsconfig.app.json index 6830b6f..f01cf23 100644 --- a/tsconfig.app.json +++ b/tsconfig.app.json @@ -16,6 +16,11 @@ "noEmit": true, "jsx": "react-jsx", + /* Path aliases */ + "paths": { + "@/*": ["./src/*"] + }, + /* Linting */ "noUnusedLocals": true, "noUnusedParameters": true, diff --git a/vite.config.ts b/vite.config.ts index d1203cd..7b93b60 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,3 +1,4 @@ +import { fileURLToPath, URL } from 'node:url' import { defineConfig } from 'vite' import react, { reactCompilerPreset } from '@vitejs/plugin-react' import babel from '@rolldown/plugin-babel' @@ -8,4 +9,9 @@ export default defineConfig({ react(), babel({ presets: [reactCompilerPreset()] }) ], + resolve: { + alias: { + '@': fileURLToPath(new URL('./src', import.meta.url)), + }, + }, })