ZSEMI - Завод Специальных Электромонтажных Изделий

API Documentation

Configuration Panel (Layout)

import ConfigPanel from './DevTools/ConfigPanel';
<ConfigPanel />

SEO Configuration

// Use in any component
const { config, getFeature } = useAppConfig();

// Check if feature is enabled
if (getFeature('enableSearch')) {
  // Render search component
}

// Custom SEO for specific pages
<AppSEO 
  pageKey="catalog" 
  customSEO={{
    title: "Custom Page Title",
    description: "Custom description"
  }} 
/>

Categories API

src/api/categories.ts

Handles fetching of product categories.

interface CategoryResponse {
  ID: string;
  NAME: string;
  CODE: string;
  IBLOCK_SECTION_ID: string | null;
  DEPTH_LEVEL: number;
}

// Fetches all categories
fetchCategories(): Promise<CategoryTree[]>

Products API

src/api/products.ts

Manages product-related operations.

interface ProductFilters {
  page?: number;
  limit?: number;
  search?: string;
  categoryId?: string;
  hit?: number;
  properties?: Record<string, string | number | (string | number)[]>;
}

// Fetches products with optional filters
fetchProducts(filters?: ProductFilters): Promise<ApiResponse<ProductResponse>>

// Fetches a single product by ID
fetchProductById(id: string): Promise<ProductDetailResponse>

// Generates and downloads catalog PDF
downloadCatalogPDF(): Promise<void>

Mail API

src/api/mail.ts

Handles email communication.

interface MailRequest {
  name: string;
  phone: string;
  email: string;
  message: string;
  captcha: string;
  files?: File[];
}

// Sends email with optional attachments
sendMail(data: MailRequest): Promise<any>

Features

Cart Management

• Add/remove products
• Update quantities
• Calculate totals
• Persist cart state

Category Navigation

• Hierarchical category structure
• Breadcrumb navigation
• Category filtering

Product Features

• Product search
• Filtering by properties
• Recently viewed products
• Product details view
• PDF catalog generation

Forms

• Contact form
• Order form
• File attachments
• reCAPTCHA integration

UI Components

• Responsive header variants
• Mobile-friendly navigation
• Loading states
• Notifications
• Modal dialogs

Configuration

API Configuration

src/config/api.config.ts

• Base URL configuration
• API endpoints
• Default parameters

Mail Configuration

src/config/mail.config.ts

• Mail server settings
• reCAPTCHA configuration
• File upload limits

Development

Prerequisites

• Node.js 18+
• npm or yarn

Installation

npm install

Running Development Server

npm run dev

Building for Production

npm run build

Linting

npm run lint

Project Structure

src/
├── api/          # API integration
├── components/   # Reusable components
├── config/       # Configuration files
├── context/      # React context providers
├── data/         # Static data and mock data
├── hooks/        # Custom React hooks
├── pages/        # Page components
├── styles/       # Global styles
├── types/        # TypeScript type definitions
└── utils/        # Utility functions