Dev

.prettierignore

@@ -13,4 +13,5 @@ yarn.lock
 pnpm-lock.yaml
 
 .github
+.info
 

COOKIE-CONSENT.md

@@ -19,12 +19,12 @@
 Категории `COOKIE_CATEGORIES` — в `src/const/const.ts`.  
 Типы `CookieCategoryId` и `CookieConsent` — в `src/types/types.ts`.
 
-| id            | Название                       | Обязательные |
-| ------------- | ------------------------------ | :----------: |
-| `necessary`   | Строго необходимые cookies     |    ✅ да     |
-| `performance` | Cookies производительности     |    ❌ нет    |
-| `functional`  | Функциональные cookies         |    ❌ нет    |
-| `targeting`   | Целевые и аналитические cookies|    ❌ нет    |
+| id            | Название                        | Обязательные |
+| ------------- | ------------------------------- | :----------: |
+| `necessary`   | Строго необходимые cookies      |    ✅ да     |
+| `performance` | Cookies производительности      |    ❌ нет    |
+| `functional`  | Функциональные cookies          |    ❌ нет    |
+| `targeting`   | Целевые и аналитические cookies |    ❌ нет    |
 
 ```typescript
 // src/types/types.ts

eslint.config.mjs

@@ -9,6 +9,25 @@ const compat = new FlatCompat({
   baseDirectory: __dirname,
 })
 
-const eslintConfig = [...compat.extends('next/core-web-vitals', 'next/typescript')]
+const eslintConfig = [
+  {
+    ignores: [
+      'node_modules/',
+      '.next/',
+      'dist/',
+      'build/',
+      'coverage/',
+      '.git/',
+      '.github/',
+      '.info/',
+      'next-env.d.ts',
+      '*.log',
+      '.DS_Store',
+      '.env.local',
+      '.env.*.local',
+    ],
+  },
+  ...compat.extends('next/core-web-vitals', 'next/typescript'),
+]
 
 export default eslintConfig

package.json

@@ -5,8 +5,8 @@
     "dev": "next dev --turbopack",
     "build": "next build --turbopack",
     "start": "next start",
-    "lint": "next lint",
-    "lint:fix": "next lint . --fix",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
     "format": "prettier --write .",
     "format:check": "prettier --check ."
   },

src/app/categories/[categories-detail]/page.tsx

@@ -1,10 +1,10 @@
 import type { Metadata } from 'next'
 import { JSX } from 'react'
 import { notFound } from 'next/navigation'
-import { BreadcrumbItem, CategoryFromServer, SlideItem } from '@/types/types'
+import { BreadcrumbItem, CategoryFromServer, SlideItem, WorkFromServer } from '@/types/types'
 import Heading from '@/components/Heading/Heading'
 import Detail from '@/components/Detail/Detail'
-import { fetchCollectionItem, getImageUrl } from '@/lib/api-client'
+import { fetchCollection, fetchCollectionItem, getImageUrl } from '@/lib/api-client'
 
 type PageProps = {
   params: Promise<{
@@ -81,11 +81,17 @@ export default async function Page({ params }: PageProps): Promise<JSX.Element>
     },
   ]
 
-  const slidesList: SlideItem[] = category.slider?.map((image) => ({
-    id: image._id,
-    image: getImageUrl(image._id, 800, 500),
-    imageFull: getImageUrl(image._id, 1600, 1000, { mode: 'bestFit' }),
-    alt: image.title || category.title,
+  const relatedWorks = await fetchCollection<WorkFromServer>('works', {
+    filter: { 'category._id': category._id },
+    sort: { date: -1 },
+    limit: 50,
+  })
+
+  const slidesList: SlideItem[] = relatedWorks.map((work) => ({
+    id: work.image._id,
+    image: getImageUrl(work.image._id, 800, 500),
+    imageFull: getImageUrl(work.image._id, 1600, 1000, { mode: 'bestFit' }),
+    alt: work.image.alt || work.title,
   }))
 
   return (

src/app/gallery/[...slug]/page.tsx

@@ -33,9 +33,7 @@ export async function generateMetadata({ params }: PageProps): Promise<Metadata>
 
   let ogImage: string | undefined
   if (currentItem) {
-    const firstImageChild = currentItem._children?.find(
-      (child) => child.image && child.image._id,
-    )
+    const firstImageChild = currentItem._children?.find((child) => child.image && child.image._id)
     if (firstImageChild?.image?._id) {
       ogImage = getImageUrl(firstImageChild.image._id, 1200, 630, { mime: 'jpeg' })
     }

src/app/in-stock/[in-stock-detail]/page.tsx

@@ -114,4 +114,4 @@ export default async function Page({ params }: PageProps): Promise<JSX.Element>
       {MasterInfo && <Master master={MasterInfo} />}
     </>
   )
-}
+}

src/app/news/[news-detail]/page.tsx

@@ -101,4 +101,4 @@ export default async function Page({ params }: PageProps): Promise<JSX.Element>
       />
     </>
   )
-}
+}

src/app/restoration/page.tsx

@@ -0,0 +1,43 @@
+import type { Metadata } from 'next'
+import { JSX } from 'react'
+import { BreadcrumbItem } from '@/types/types'
+import Heading from '@/components/Heading/Heading'
+import RestorationPage from '@/components/RestorationPage/RestorationPage'
+
+export const metadata: Metadata = {
+  title: 'Реставрация икон',
+  description:
+    'Профессиональная реставрация икон: укрепление красочного слоя, чистка, восстановление окладов и восполнение утрат.',
+  openGraph: {
+    title: 'Реставрация икон | Иконописная Артель',
+    description:
+      'Профессиональная реставрация икон: укрепление красочного слоя, чистка, восстановление окладов и восполнение утрат.',
+  },
+  alternates: {
+    canonical: '/restoration',
+  },
+}
+
+const breadcrumbsList: BreadcrumbItem[] = [
+  {
+    title: 'Главная',
+    url: '/',
+  },
+  {
+    title: 'Реставрация',
+  },
+]
+
+export default function Page(): JSX.Element {
+  const title = 'Реставрация икон'
+  const description =
+    '<p>Мы бережно восстанавливаем священные образы, сохраняя их историческую и художественную ценность.</p>'
+
+  return (
+    <>
+      <Heading title={title} description={description} breadcrumbsList={breadcrumbsList} />
+
+      <RestorationPage />
+    </>
+  )
+}

src/app/sitemap.ts

@@ -11,14 +11,50 @@ export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
   const staticPages: MetadataRoute.Sitemap = [
     { url: `${siteUrl}/`, lastModified: new Date(), changeFrequency: 'daily', priority: 1.0 },
     { url: `${siteUrl}/about`, lastModified: new Date(), changeFrequency: 'daily', priority: 0.9 },
+    {
+      url: `${siteUrl}/restoration`,
+      lastModified: new Date(),
+      changeFrequency: 'daily',
+      priority: 0.9,
+    },
     { url: `${siteUrl}/works`, lastModified: new Date(), changeFrequency: 'daily', priority: 0.9 },
-    { url: `${siteUrl}/in-stock`, lastModified: new Date(), changeFrequency: 'daily', priority: 0.9 },
-    { url: `${siteUrl}/contacts`, lastModified: new Date(), changeFrequency: 'daily', priority: 0.9 },
-    { url: `${siteUrl}/categories`, lastModified: new Date(), changeFrequency: 'daily', priority: 0.9 },
-    { url: `${siteUrl}/gallery`, lastModified: new Date(), changeFrequency: 'daily', priority: 0.9 },
+    {
+      url: `${siteUrl}/in-stock`,
+      lastModified: new Date(),
+      changeFrequency: 'daily',
+      priority: 0.9,
+    },
+    {
+      url: `${siteUrl}/contacts`,
+      lastModified: new Date(),
+      changeFrequency: 'daily',
+      priority: 0.9,
+    },
+    {
+      url: `${siteUrl}/categories`,
+      lastModified: new Date(),
+      changeFrequency: 'daily',
+      priority: 0.9,
+    },
+    {
+      url: `${siteUrl}/gallery`,
+      lastModified: new Date(),
+      changeFrequency: 'daily',
+      priority: 0.9,
+    },
     { url: `${siteUrl}/news`, lastModified: new Date(), changeFrequency: 'daily', priority: 0.9 },
-    { url: `${siteUrl}/reviews`, lastModified: new Date(), changeFrequency: 'daily', priority: 0.9 },
-    { url: `${siteUrl}/order-delivery`, lastModified: new Date(), changeFrequency: 'daily', priority: 0.9 },
+    {
+      url: `${siteUrl}/reviews`,
+      lastModified: new Date(),
+      changeFrequency: 'daily',
+      priority: 0.9,
+    },
+    {
+      url: `${siteUrl}/order-delivery`,
+      lastModified: new Date(),
+      changeFrequency: 'daily',
+      priority: 0.9,
+    },
   ]
 
   const urls: MetadataRoute.Sitemap = [...staticPages]
@@ -87,4 +123,4 @@ export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
   }
 
   return urls
-}
+}

src/app/works/[works-detail]/page.tsx

@@ -1,7 +1,13 @@
 import type { Metadata } from 'next'
 import { JSX } from 'react'
 import { notFound, redirect } from 'next/navigation'
-import { BreadcrumbItem, MasterFromServer, SlideItem, WorkFromServer } from '@/types/types'
+import {
+  BreadcrumbItem,
+  CategoryFromServer,
+  MasterFromServer,
+  SlideItem,
+  WorkFromServer,
+} from '@/types/types'
 import Heading from '@/components/Heading/Heading'
 import Detail from '@/components/Detail/Detail'
 import Master from '@/components/Master/Master'
@@ -84,6 +90,10 @@ export default async function Page({ params }: PageProps): Promise<JSX.Element>
       alt: image.title || work.title,
     })) || []
 
+  const category: CategoryFromServer | null = work.category?._id
+    ? await fetchCollectionItem<CategoryFromServer>('category', work.category._id)
+    : null
+
   const MasterInfo: MasterFromServer | null = work.master
     ? await fetchCollectionItem<MasterFromServer>('masters', work.master?._id)
     : null
@@ -113,9 +123,10 @@ export default async function Page({ params }: PageProps): Promise<JSX.Element>
         slidesList={slidesList}
         price={work.price}
         size={work.size}
+        categoryTitle={category?.title}
       />
 
       {MasterInfo && <Master master={MasterInfo} />}
     </>
   )
-}
+}

src/components/BeforeAfterSlider/BeforeAfterSlider.module.scss

@@ -0,0 +1,108 @@
+@use '../../styles/variables' as *;
+
+.before-after {
+  position: relative;
+  overflow: hidden;
+
+  width: 100%;
+  max-width: 600px;
+  height: 400px;
+  justify-self: center;
+
+  box-shadow: $cardShadow;
+  border-radius: 20px;
+
+  cursor: ew-resize;
+  user-select: none;
+  touch-action: none;
+
+  @media (max-width: $tablet-mid-width) {
+    display: flex;
+    flex-direction: column;
+    max-width: 100%;
+    height: 300px;
+  }
+}
+
+.before-after__image-wrapper {
+  position: absolute;
+  inset: 0;
+}
+
+.before-after__image {
+  object-fit: cover;
+}
+
+.before-after__image--before {
+  z-index: 1;
+}
+
+.before-after__image--after {
+  z-index: 0;
+}
+
+.before-after__label {
+  position: absolute;
+  bottom: 16px;
+  z-index: 10;
+
+  padding: 6px 14px;
+
+  font-size: 14px;
+  font-weight: 500;
+  color: $bg-text-color;
+
+  background-color: rgba(0, 0, 0, 0.6);
+  border-radius: 20px;
+
+  pointer-events: none;
+}
+
+.before-after__label--before {
+  left: 16px;
+}
+
+.before-after__label--after {
+  right: 16px;
+}
+
+.before-after__divider {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 50%;
+  z-index: 5;
+
+  width: 2px;
+
+  background-color: $base-bg;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
+
+  transform: translateX(-50%);
+}
+
+.before-after__handle {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  z-index: 6;
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 24px;
+  height: 24px;
+
+  background-color: $base-bg;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+  border-radius: 50%;
+
+  transform: translate(-50%, -50%);
+}
+
+.before-after__handle-icon {
+  width: 18px;
+  height: 18px;
+
+  color: $accent-bg;
+}