Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/sergio-salcedo-dev/excel-product-manager/llms.txt

Use this file to discover all available pages before exploring further.

Preoc Product Manager is a Next.js 15 web application built for quantity surveyors, construction project managers, and estimators who need a fast, structured way to manage product catalogs. Instead of juggling unwieldy spreadsheets or heavyweight ERP modules, the app provides a focused dashboard for creating, reading, updating, and deleting construction products — complete with Excel round-trip sync so existing workflows are never disrupted. When current market pricing is needed, integrated AI search taps both the CYPE Precios database and Google Gemini to surface accurate, up-to-date cost intelligence without leaving the interface.

​
Key Features

Product CRUD

Create, edit, and delete construction products through a structured form with fields for code, description, unit, price, and category. All data persists immediately in the browser without a round-trip to any server.

Excel Import & Export

Import an .xlsx workbook to bulk-load products in seconds, or export the current catalog to a formatted spreadsheet ready for procurement teams, quantity take-offs, or archival. Powered by the xlsx library.

CYPE Precios AI Search

Query the CYPE Precios construction price database through a Gemini-backed search. Returns structured unit prices for materials and labour items common in Spanish construction projects.

Gemini AI Market Search

Ask Google Gemini for real-world market pricing, product alternatives, or specification guidance. Results are streamed directly into the dashboard so estimates stay current with live market conditions.

​
Architecture Overview

Preoc Product Manager follows a three-layer clean architecture pattern that keeps business rules independent of frameworks and I/O concerns. The domain layer defines the Product interface and the repository contract — pure TypeScript with no external dependencies. The application layer contains use cases such as SearchProducts that orchestrate domain objects and remain fully testable in isolation. The infrastructure layer handles all side effects: parsing and writing .xlsx files, calling the Gemini API, and reading/writing localStorage. React components and Next.js App Router pages sit outside the bounded context and depend only on the application layer, never on infrastructure directly. 
├── contexts/product/
│   ├── domain/Product.ts          # Product interface & repository contract
│   ├── application/SearchProducts.ts  # Use case
│   └── infrastructure/ExcelService.ts # xlsx parsing & export
├── components/ProductDashboard.tsx    # Main UI component
├── app/                               # Next.js App Router
│   ├── layout.tsx
│   └── page.tsx
└── hooks/use-mobile.ts                # Responsive breakpoint hook
The app stores all product data in browser localStorage. No backend database or server-side persistence is required — the full product catalog lives in the user’s browser and survives page refreshes automatically.

​
Tech Stack

The table below lists the primary dependencies extracted from package.json, their pinned versions, and their role in the application. Runtime packages are loaded at execution time; build-time packages are dev dependencies used only during development and compilation.
PackageVersionTypePurpose
next^15.4.9runtimeReact framework with App Router and server components
react^19.2.1runtimeUI rendering and component model
@google/genai^1.50.1runtimeGoogle Gemini API client for AI-powered search
xlsx^0.18.5runtimeExcel workbook parsing and generation
lucide-react^0.553.0runtimeConsistent SVG icon library
motion^12.38.0runtimeDeclarative animation primitives for React
tailwindcss4.1.11devUtility-first CSS framework (v4, PostCSS-based)

Build docs developers (and LLMs) love

Get started for freeTalk to us