diff --git a/client/src/app/layout/MainLayout.tsx b/client/src/app/layout/MainLayout.tsx index 04900e2..00208a0 100644 --- a/client/src/app/layout/MainLayout.tsx +++ b/client/src/app/layout/MainLayout.tsx @@ -10,12 +10,16 @@ import Typography from '@mui/material/Typography' import { Link as RouterLink } from 'react-router-dom' import { AppHeader } from '@/app/layout/AppHeader' import { STORE_EMAIL, STORE_NAME, STORE_PHONE, VK_URL } from '@/shared/config' +import { ScrollOnNavigate } from '@/shared/ui/ScrollOnNavigate' +import { ScrollToTop } from '@/shared/ui/ScrollToTop' export function MainLayout({ children }: PropsWithChildren) { const year = new Date().getFullYear() return ( + + diff --git a/client/src/pages/admin-layout/ui/AdminLayoutPage.tsx b/client/src/pages/admin-layout/ui/AdminLayoutPage.tsx index 90c5cb1..29c1ff5 100644 --- a/client/src/pages/admin-layout/ui/AdminLayoutPage.tsx +++ b/client/src/pages/admin-layout/ui/AdminLayoutPage.tsx @@ -25,6 +25,8 @@ import { AdminProductsPage } from '@/pages/admin-products' import { AdminReviewsPage } from '@/pages/admin-reviews' import { AdminUsersPage } from '@/pages/admin-users' import { $user } from '@/shared/model/auth' +import { ScrollOnNavigate } from '@/shared/ui/ScrollOnNavigate' +import { ScrollToTop } from '@/shared/ui/ScrollToTop' import { AdminNotificationsPage } from './AdminNotificationsPage' type NavItem = { @@ -124,6 +126,8 @@ export function AdminLayoutPage() { return ( + + {isMobile ? ( <> diff --git a/client/src/pages/me/ui/MeLayoutPage.tsx b/client/src/pages/me/ui/MeLayoutPage.tsx index 385a927..9cff739 100644 --- a/client/src/pages/me/ui/MeLayoutPage.tsx +++ b/client/src/pages/me/ui/MeLayoutPage.tsx @@ -26,6 +26,8 @@ import { OrderDetailPage } from '@/pages/me/ui/sections/OrderDetailPage' import { OrdersPage } from '@/pages/me/ui/sections/OrdersPage' import { SettingsPage } from '@/pages/me/ui/sections/SettingsPage' import { $user } from '@/shared/model/auth' +import { ScrollOnNavigate } from '@/shared/ui/ScrollOnNavigate' +import { ScrollToTop } from '@/shared/ui/ScrollToTop' type NavItem = { to: string @@ -128,6 +130,8 @@ export function MeLayoutPage() { return ( + + {isMobile ? ( <> diff --git a/client/src/shared/lib/avatar-styles.ts b/client/src/shared/lib/avatar-styles.ts index a3e3bec..ddd0290 100644 --- a/client/src/shared/lib/avatar-styles.ts +++ b/client/src/shared/lib/avatar-styles.ts @@ -81,7 +81,7 @@ export const AVATAR_STYLES: StyleDef[] = [ }, ] -export const DEFAULT_STYLE_ID = 'bottts' +export const DEFAULT_STYLE_ID = 'avataaars' export function getStyleById(id: string | null | undefined): StyleDef { return AVATAR_STYLES.find((s) => s.id === id) ?? AVATAR_STYLES[0] diff --git a/client/src/shared/ui/ScrollOnNavigate.tsx b/client/src/shared/ui/ScrollOnNavigate.tsx new file mode 100644 index 0000000..3925696 --- /dev/null +++ b/client/src/shared/ui/ScrollOnNavigate.tsx @@ -0,0 +1,12 @@ +import { useEffect } from 'react' +import { useLocation } from 'react-router-dom' + +export function ScrollOnNavigate() { + const { pathname } = useLocation() + + useEffect(() => { + window.scrollTo(0, 0) + }, [pathname]) + + return null +} diff --git a/client/src/shared/ui/ScrollToTop.tsx b/client/src/shared/ui/ScrollToTop.tsx new file mode 100644 index 0000000..4d521fc --- /dev/null +++ b/client/src/shared/ui/ScrollToTop.tsx @@ -0,0 +1,31 @@ +import Fab from '@mui/material/Fab' +import useScrollTrigger from '@mui/material/useScrollTrigger' +import Zoom from '@mui/material/Zoom' +import { ArrowUp } from 'lucide-react' + +export function ScrollToTop() { + const trigger = useScrollTrigger({ threshold: 400, disableHysteresis: true }) + + const handleClick = () => { + window.scrollTo({ top: 0, behavior: 'smooth' }) + } + + return ( + + + + + + ) +} diff --git a/server/prisma/prisma/dev.db b/server/prisma/prisma/dev.db index 01bce42..10de6af 100644 Binary files a/server/prisma/prisma/dev.db and b/server/prisma/prisma/dev.db differ