wip

Co-authored-by: Ivan <84693047+exact01@users.noreply.github.com>

.eslintrc.cjs

@@ -10,9 +10,8 @@ module.exports = {
         'prettier'
     ],
     ignorePatterns: ['dist', '.eslintrc.cjs', 'plop', 'plop/**', 'plopfile.js', '.stylelintrc.js'],
-    parser: '@typescript-eslint/parser',
     plugins: ['react-refresh', 'import'],
-
+    parser: '@typescript-eslint/parser',
     settings: {
         'import/parsers': {
             '@typescript-eslint/parser': ['.ts', '.tsx']

.gitignore

@@ -132,3 +132,4 @@ dist
 .DS_Store
 .vercel
 stats.html
+fsd-high-level-dependencies.html

package.json

@@ -78,6 +78,7 @@
     "@vitejs/plugin-react": "^4.3.1",
     "@vitejs/plugin-react-swc": "^3.7.0",
     "cross-env": "^7.0.3",
+    "dependency-cruiser": "^16.7.0",
     "eslint": "^8.56.0",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-config-prettier": "^9.1.0",
@@ -95,6 +96,7 @@
     "prettier": "^3.3.3",
     "prop-types": "^15.8.1",
     "rollup-plugin-visualizer": "^5.12.0",
+    "steiger": "^0.5.3",
     "stylelint": "^16.9.0",
     "stylelint-config-standard-scss": "^13.1.0",
     "typescript": "^5.7.2",

src/app.tsx

@@ -14,15 +14,14 @@ import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
 import { QueryClientProvider } from '@tanstack/react-query'
 import { NavigationProgress } from '@mantine/nprogress'
 import { Notifications } from '@mantine/notifications'
-import { ModalsProvider } from '@mantine/modals'
 import { MantineProvider } from '@mantine/core'
 import { useMediaQuery } from '@mantine/hooks'
-import { StrictMode } from 'react'
 
-import { AuthProvider } from '@/shared/providers/auth-provider'
-import { Router } from '@/app/router/router'
-import { theme } from '@/shared/theme'
+// import { StrictMode } from 'react'
+import { AuthProvider } from '@shared/providers/auth-provider'
+import { theme } from '@shared/theme'
 
+import { Router } from './app/router/router'
 import { queryClient } from './shared/api'
 
 export function App() {

src/app/layouts/dashboard/root/dashboard.layout.tsx

@@ -3,7 +3,7 @@ import { Outlet } from 'react-router-dom'
 import { PiLink } from 'react-icons/pi'
 
 import { Logo } from '@shared/ui/logo'
-import { app } from '@/config'
+import { app } from 'src/config'
 
 import { SidebarLayout } from '../sidebar/sidebar.layout'
 import packageJson from '../../../../../package.json'

src/app/router/router.tsx

@@ -9,18 +9,18 @@ import { NotFoundPageComponent } from '@pages/not-found'
 
 import { StatisticNodesConnector } from '@pages/dashboard/statistic-nodes/connectors'
 import { ConfigPageConnector } from '@pages/dashboard/config/ui/connectors'
-import { HostsPageConnector } from '@/pages/dashboard/hosts/ui/connectors'
-import { UsersPageConnector } from '@/pages/dashboard/users/ui/connectors'
+import { HostsPageConnector } from '@pages/dashboard/hosts/ui/connectors'
+import { UsersPageConnector } from '@pages/dashboard/users/ui/connectors'
 import { NodesPageConnector } from '@pages/dashboard/nodes/ui/connectors'
 import { HomePageConnector } from '@pages/dashboard/home/connectors'
-import { ErrorBoundaryHoc } from '@/shared/hocs/error-boundary'
-import { AuthGuard } from '@/shared/hocs/guards/auth-guard'
-import { AuthLayout } from '@/app/layouts/auth/auth.layout'
-import { DashboardLayout } from '@/app/layouts/dashboard'
+import { ErrorBoundaryHoc } from '@shared/hocs/error-boundary'
+import { AuthGuard } from '@shared/hocs/guards/auth-guard'
 import { ErrorPageComponent } from '@pages/error'
 import { LoginPage } from '@pages/auth/login'
 
+import { DashboardLayout } from '../layouts/dashboard'
 import { ROUTES } from '../../shared/constants'
+import { AuthLayout } from '../layouts/auth'
 
 const router = createBrowserRouter(
     createRoutesFromElements(

src/entities/auth/session-store/use-session-store.ts

@@ -1,7 +1,7 @@
 import { createJSONStorage, devtools, persist } from 'zustand/middleware'
 import { create } from 'zustand'
 
-import { setAuthorizationToken } from '@/shared/api'
+import { setAuthorizationToken } from '@shared/api'
 
 import { IActions, ISetTokenAction, IState } from './interfaces'
 

src/entities/dashboard/dashboard-store/dashboard-store.ts

@@ -7,8 +7,8 @@ import {
 import { devtools } from 'zustand/middleware'
 import { AxiosError } from 'axios'
 
-import { IInboundsHashMap } from '@/entitites/dashboard/dashboard-store/interfaces/inbounds-hash-map.interface'
-import { getUserTimezoneUtil } from '@/shared/utils/time-utils'
+import { IInboundsHashMap } from '@entities/dashboard/dashboard-store/interfaces/inbounds-hash-map.interface'
+import { getUserTimezoneUtil } from '@shared/utils/time-utils'
 import { create } from '@shared/hocs/store-wrapper'
 import { instance } from '@shared/api'
 

src/entities/dashboard/dashboard-store/interfaces/state.interface.ts

@@ -4,7 +4,7 @@ import {
     GetStatsCommand
 } from '@remnawave/backend-contract'
 
-import { IInboundsHashMap } from '@/entitites/dashboard/dashboard-store/interfaces/inbounds-hash-map.interface'
+import { IInboundsHashMap } from '@entities/dashboard/dashboard-store/interfaces/inbounds-hash-map.interface'
 
 export interface IState {
     bandwidthStats: GetBandwidthStatsCommand.Response['response'] | null

src/entities/dashboard/users/ui/table-columns/data-usage/data-usage.column.tsx

@@ -1,8 +1,8 @@
 import { RESET_PERIODS } from '@remnawave/backend-contract'
 import { Box, Group, Progress, Text } from '@mantine/core'
 
-import { IProps } from '@/entitites/dashboard/users/ui/table-columns/username/interface'
-import { prettyBytesUtil } from '@/shared/utils/bytes'
+import { IProps } from '@entities/dashboard/users/ui/table-columns/username/interface'
+import { prettyBytesUtil } from '@shared/utils/bytes'
 
 export function DataUsageColumnEntity(props: IProps) {
     const { user } = props

src/entities/dashboard/users/ui/table-columns/data-usage/interface.ts

@@ -0,0 +1,5 @@
+import { User } from '@entities/dashboard/users/models'
+
+export interface IProps {
+    user: User
+}

src/entities/dashboard/users/ui/table-columns/short-uuid/interface.ts

@@ -0,0 +1,5 @@
+import { User } from '@entities/dashboard/users/models'
+
+export interface IProps {
+    user: User
+}

src/entities/dashboard/users/ui/table-columns/short-uuid/short-uuid.column.tsx

@@ -1,8 +1,8 @@
 import { CopyButton } from '@mantine/core'
 import { LuCopy } from 'react-icons/lu'
 
-import { IProps } from '@/entitites/dashboard/users/ui/table-columns/username/interface'
-import { LinkChip } from '@/shared/ui/stuff/link-chip'
+import { IProps } from '@entities/dashboard/users/ui/table-columns/username/interface'
+import { LinkChip } from '@shared/ui/stuff/link-chip'
 
 export function ShortUuidColumnEntity(props: IProps) {
     const { user } = props

src/entities/dashboard/users/ui/table-columns/status/interface.ts

@@ -1,4 +1,4 @@
-import { User } from '@/entitites/dashboard/users/models'
+import { User } from '@entities/dashboard/users/models'
 
 export interface IProps {
     need?: 'badge' | 'both' | 'date'

src/entities/dashboard/users/ui/table-columns/status/status.column.tsx

@@ -1,7 +1,7 @@
 import { Stack, Text } from '@mantine/core'
 
-import { UserStatusBadge } from '@/widgets/dashboard/users/user-status-badge'
-import { getExpirationTextUtil } from '@/shared/utils/time-utils'
+import { UserStatusBadge } from '@widgets/dashboard/users/user-status-badge'
+import { getExpirationTextUtil } from '@shared/utils/time-utils'
 
 import { IProps } from './interface'
 

src/entities/dashboard/users/ui/table-columns/username/interface.ts

@@ -0,0 +1,5 @@
+import { User } from '@entities/dashboard/users/models'
+
+export interface IProps {
+    user: User
+}

src/entities/dashboard/users/ui/table-columns/username/username.column.tsx

@@ -1,7 +1,7 @@
 import { Box, Group, Indicator, Text } from '@mantine/core'
 
-import { IProps } from '@/entitites/dashboard/users/ui/table-columns/username/interface'
-import { getConnectionStatusColorUtil, getTimeAgoUtil } from '@/shared/utils/time-utils'
+import { IProps } from '@entities/dashboard/users/ui/table-columns/username/interface'
+import { getConnectionStatusColorUtil, getTimeAgoUtil } from '@shared/utils/time-utils'
 
 export function UsernameColumnEntity(props: IProps) {
     const { user } = props

src/entitites/dashboard/users/ui/table-columns/data-usage/interface.ts

@@ -1,5 +0,0 @@
-import { User } from '@/entitites/dashboard/users/models'
-
-export interface IProps {
-    user: User
-}

src/entitites/dashboard/users/ui/table-columns/short-uuid/interface.ts

@@ -1,5 +0,0 @@
-import { User } from '@/entitites/dashboard/users/models'
-
-export interface IProps {
-    user: User
-}

src/entitites/dashboard/users/ui/table-columns/username/interface.ts

@@ -1,5 +0,0 @@
-import { User } from '@/entitites/dashboard/users/models'
-
-export interface IProps {
-    user: User
-}

src/features/auth/login-form.feature.tsx

@@ -5,7 +5,7 @@ import { PiSignInDuotone } from 'react-icons/pi'
 import MD5 from 'crypto-js/md5'
 
 import { useAuth } from '@shared/hooks/use-auth'
-import { useLogin } from '@/shared/api/hooks'
+import { useLogin } from '@shared/api/hooks'
 
 import { handleFormErrors } from '../../shared/utils/form'
 

src/features/dashboard/config/config-editor-actions/config-editor-actions.feature.tsx

@@ -2,7 +2,7 @@ import { PiCheckSquareOffset, PiFloppyDisk } from 'react-icons/pi'
 import { notifications } from '@mantine/notifications'
 import { Button, Group } from '@mantine/core'
 
-import { useConfigStoreActions } from '@entitites/dashboard/config/config-store'
+import { useConfigStoreActions } from '@entities/dashboard/config/config-store'
 
 import { Props } from './interfaces'
 

src/features/dashboard/config/monaco-setup/monaco-setup.feature.tsx

@@ -2,7 +2,7 @@ import { Monaco } from '@monaco-editor/react'
 import { consola } from 'consola/browser'
 import axios from 'axios'
 
-import { app } from '@/config'
+import { app } from 'src/config'
 
 export const MonacoSetupFeature = {
     setup: async (monaco: Monaco) => {

src/features/dashboard/users/users-action-group/action-group.feature.tsx

@@ -3,7 +3,7 @@
 import { PiArrowsClockwise, PiPlus } from 'react-icons/pi'
 import { Button, Group } from '@mantine/core'
 
-import { useUserCreationModalStoreActions } from '@entitites/dashboard/user-creation-modal-store'
+import { useUserCreationModalStoreActions } from '@entities/dashboard/user-creation-modal-store'
 
 import { IProps } from './interfaces'
 

src/features/dashboard/users/users-table/model/use-table-columns.tsx

@@ -4,11 +4,11 @@ import { MRT_ColumnDef } from 'mantine-react-table'
 import { useMemo } from 'react'
 import dayjs from 'dayjs'
 
-import { ShortUuidColumnEntity } from '@entitites/dashboard/users/ui/table-columns/short-uuid'
-import { UsernameColumnEntity } from '@entitites/dashboard/users/ui/table-columns/username'
-import { StatusColumnEntity } from '@entitites/dashboard/users/ui/table-columns/status'
-import { DataUsageColumnEntity } from '@entitites/dashboard/users/ui'
-import { prettyBytesToAnyUtil } from '@/shared/utils/bytes'
+import { ShortUuidColumnEntity } from '@entities/dashboard/users/ui/table-columns/short-uuid'
+import { UsernameColumnEntity } from '@entities/dashboard/users/ui/table-columns/username'
+import { StatusColumnEntity } from '@entities/dashboard/users/ui/table-columns/status'
+import { DataUsageColumnEntity } from '@entities/dashboard/users/ui'
+import { prettyBytesToAnyUtil } from '@shared/utils/bytes'
 
 export const useUserTableColumns = () => {
     return useMemo<MRT_ColumnDef<GetAllUsersV2Command.Response['response']['users'][0]>[]>(

src/features/dashboard/users/users-table/model/use-table-data.tsx

@@ -1,8 +1,8 @@
 import { keepPreviousData, useQuery } from '@tanstack/react-query'
 import { GetAllUsersV2Command } from '@remnawave/backend-contract'
 
-import { useDashboardStoreActions } from '@entitites/dashboard/dashboard-store/dashboard-store'
-import { sToMs } from '@/shared/utils/time-utils'
+import { useDashboardStoreActions } from '@entities/dashboard/dashboard-store/dashboard-store'
+import { sToMs } from '@shared/utils/time-utils'
 
 import { TableParams } from './interfaces'
 

src/features/ui/dashboard/header-buttons/header-buttons.feature.tsx

@@ -1,13 +1,12 @@
-import { Button, Image, Menu } from '@mantine/core'
 import { PiSignOutDuotone } from 'react-icons/pi'
 import { useNavigate } from 'react-router-dom'
+import { Button, Menu } from '@mantine/core'
+import { removeToken } from '@entities/auth'
 
-import { resetAllStores } from '@/shared/hocs/store-wrapper'
-import { clearQueryClient } from '@/shared/api'
-import { removeToken } from '@entitites/auth'
-import { ROUTES } from '@/shared/constants'
-import { useAuth } from '@/shared/hooks'
-import { app } from '@/config'
+import { resetAllStores } from '@shared/hocs/store-wrapper'
+import { clearQueryClient } from '@shared/api'
+import { ROUTES } from '@shared/constants'
+import { useAuth } from '@shared/hooks'
 
 export const HeaderButtons = () => {
     const { setIsAuthenticated } = useAuth()

src/features/ui/dashboard/hosts/delete-host/delete-host.feature.tsx

@@ -3,7 +3,7 @@ import { ActionIcon, Tooltip } from '@mantine/core'
 import { PiTrashDuotone } from 'react-icons/pi'
 import { useState } from 'react'
 
-import { useHostsStoreActions, useHostsStoreEditModalHost } from '@entitites/dashboard'
+import { useHostsStoreActions, useHostsStoreEditModalHost } from '@entities/dashboard'
 
 import { IProps } from './interfaces'
 

src/features/ui/dashboard/hosts/header-action-buttons/header-action-buttons.feature.tsx

@@ -3,7 +3,7 @@ import { Button, Group, Select } from '@mantine/core'
 import consola from 'consola/browser'
 import { useState } from 'react'
 
-import { useHostsStoreActions, useHostsStoreSelectedInboundTag } from '@entitites/dashboard'
+import { useHostsStoreActions, useHostsStoreSelectedInboundTag } from '@entities/dashboard'
 
 import { IProps } from './interfaces'
 

src/features/ui/dashboard/nodes/delete-node/delete-node.feature.tsx

@@ -3,7 +3,7 @@ import { ActionIcon, Tooltip } from '@mantine/core'
 import { PiTrashDuotone } from 'react-icons/pi'
 import { useState } from 'react'
 
-import { useNodesStoreActions, useNodesStoreEditModalNode } from '@entitites/dashboard/nodes'
+import { useNodesStoreActions, useNodesStoreEditModalNode } from '@entities/dashboard/nodes'
 
 import { IProps } from './interfaces'
 

src/features/ui/dashboard/nodes/nodes-header-action-buttons/nodes-header-action-buttons.feature.tsx

@@ -3,7 +3,7 @@ import { notifications } from '@mantine/notifications'
 import { Button, Group } from '@mantine/core'
 import { useState } from 'react'
 
-import { useNodesStoreActions } from '@entitites/dashboard/nodes/nodes-store/nodes-store'
+import { useNodesStoreActions } from '@entities/dashboard/nodes/nodes-store/nodes-store'
 
 import { IProps } from './interfaces'
 

src/features/ui/dashboard/nodes/toggle-node-status-button/toggle-node-status-button.feature.tsx

@@ -3,7 +3,7 @@ import { notifications } from '@mantine/notifications'
 import { Button } from '@mantine/core'
 import { useState } from 'react'
 
-import { useNodesStoreActions, useNodesStoreEditModalNode } from '@entitites/dashboard/nodes'
+import { useNodesStoreActions, useNodesStoreEditModalNode } from '@entities/dashboard/nodes'
 
 import { IProps } from './interfaces'
 

src/features/ui/dashboard/users/delete-user/delete-user.feature.tsx

@@ -1,8 +1,8 @@
 import { ActionIcon, Tooltip } from '@mantine/core'
 import { PiTrashDuotone } from 'react-icons/pi'
 
-import { useUserModalStoreActions } from '@/entitites/dashboard/user-modal-store/user-modal-store'
-import { useDeleteUser } from '@/shared/api/hooks'
+import { useUserModalStoreActions } from '@entities/dashboard/user-modal-store/user-modal-store'
+import { useDeleteUser } from '@shared/api/hooks'
 
 import { IProps } from './interfaces'
 

src/features/ui/dashboard/users/revoke-subscription-user/revoke-subscription-user.feature.tsx

@@ -1,7 +1,7 @@
 import { ActionIcon, Tooltip } from '@mantine/core'
 import { PiKeyDuotone } from 'react-icons/pi'
 
-import { useInvalidateUsersTSQ, useRevokeUserSubscription } from '@/shared/api/hooks'
+import { useInvalidateUsersTSQ, useRevokeUserSubscription } from '@shared/api/hooks'
 
 import { IProps } from './interfaces'
 

src/features/ui/dashboard/users/toggle-user-status-button/toggle-user-status-button.feature.tsx

@@ -2,7 +2,7 @@ import { PiCellSignalFullDuotone, PiCellSignalSlashDuotone, PiTrashDuotone } fro
 import { USERS_STATUS } from '@remnawave/backend-contract'
 import { Button } from '@mantine/core'
 
-import { useDisableUser, useEnableUser, useInvalidateUsersTSQ } from '@/shared/api/hooks'
+import { useDisableUser, useEnableUser, useInvalidateUsersTSQ } from '@shared/api/hooks'
 
 import { IProps } from './interfaces'
 

src/features/ui/dashboard/users/view-user-action/view-user-action.feature.tsx

@@ -1,7 +1,7 @@
 import { Button, Group } from '@mantine/core'
 import { PiEyeDuotone } from 'react-icons/pi'
 
-import { useUserModalStoreActions } from '@/entitites/dashboard/user-modal-store/user-modal-store'
+import { useUserModalStoreActions } from '@entities/dashboard/user-modal-store/user-modal-store'
 
 import { IProps } from './interfaces'
 

src/pages/auth/login/login.page.tsx

@@ -1,7 +1,7 @@
 import { Box, Group, Stack, Text, Title } from '@mantine/core'
 
 import { UnderlineShape } from '@shared/ui/underline-shape'
-import { Logo } from '@/shared/ui/logo'
+import { Logo } from '@shared/ui/logo'
 import { Page } from '@shared/ui/page'
 
 import { LoginForm } from '../../../features/auth'

src/pages/dashboard/config/ui/components/constant/constants.ts

@@ -1,5 +1,5 @@
-import { IBreadcrumb } from '@/shared/interfaces'
-import { ROUTES } from '@/shared/constants'
+import { IBreadcrumb } from '@shared/interfaces'
+import { ROUTES } from '@shared/constants'
 
 export const BREADCRUMBS: IBreadcrumb[] = [
     { label: 'Dashboard', href: ROUTES.DASHBOARD.HOME },

src/pages/dashboard/config/ui/connectors/config.page.connector.tsx

@@ -1,14 +1,14 @@
-import { useEffect, useState } from 'react'
-import { consola } from 'consola/browser'
-
 import {
     useConfigStoreActions,
     useConfigStoreConfig,
     useConfigStoreIsConfigLoading
-} from '@entitites/dashboard/config/config-store/config-store'
-import { fetchWithProgress } from '@/shared/utils/fetch-with-progress'
-import { LoadingScreen } from '@/shared/ui'
-import { app } from '@/config'
+} from '@entities/dashboard/config/config-store/config-store'
+import { useEffect, useState } from 'react'
+import { consola } from 'consola/browser'
+
+import { fetchWithProgress } from '@shared/utils/fetch-with-progress'
+import { LoadingScreen } from '@shared/ui'
+import { app } from 'src/config'
 
 import { ConfigPageComponent } from '../components/config.page.component'
 

src/pages/dashboard/home/components/constant/constants.ts

@@ -1,3 +1,3 @@
-import { IBreadcrumb } from '@/shared/interfaces'
+import { IBreadcrumb } from '@shared/interfaces'
 
 export const BREADCRUMBS: IBreadcrumb[] = [{ label: 'Dashboard', href: '/' }, { label: 'Home' }]

src/pages/dashboard/home/components/home.page.tsx

@@ -1,8 +1,8 @@
 import { SimpleGrid, Stack, Text } from '@mantine/core'
 
-import { MetricWithIcon } from '@/widgets/dashboard/home/metric-with-icons'
-import { LoadingScreen, PageHeader } from '@/shared/ui'
-import { MetricWithTrend } from '@/shared/ui/metrics'
+import { MetricWithIcon } from '@widgets/dashboard/home/metric-with-icons'
+import { LoadingScreen, PageHeader } from '@shared/ui'
+import { MetricWithTrend } from '@shared/ui/metrics'
 import { Page } from '@shared/ui/page'
 
 import { getBandwidthMetrics, getSimpleMetrics, getUsersMetrics } from './metrics'