Kleidarakos B2B & Papanikolaou Doors

The system

Kleidarakos & Papanikolaou Doors run a Greek locksmith network that was managing B2B orders through phone calls and spreadsheets. They needed a marketplace where business customers could browse a unified catalog (sourced from 8 different supplier sites), get quotes approved, place orders, and configure custom Papanikolaou doors in 3D before buying. I built five integrated components to get there: a Medusa B2B marketplace with company hierarchies, quote workflows, and approval flows (a port of the official B2B starter, extended with custom modules for brands, bundles, wishlist, reviews, newsletter, and Resend notifications); a React 19 + TanStack admin frontend for the catalog team; an Express 5 + TypeORM backend with 43 controllers and 49 entities that pulls in and unifies supplier data; a Chrome Manifest v3 extension for fast manual data extraction; and a Three.js 3D door configurator that runs on whatever laptop the B2B buyer happens to be using.

Architecture

• B2B storefront: Medusa 2.14.2 with ported B2B framework (Company, Employee, Quote, Approval modules), Next.js 16 storefront with custom modules (brands, bundles, wishlist, reviews, newsletter, Resend notifications), Stripe + PayPal, design tokens layer
• Catalog frontend: React 19 + Vite + TanStack Router/Query/Table, JWT auth with 80% token refresh, context-based state, served at backend.kleidarasioannina.com
• PIM backend (product-catalog-management): Express 5 + TypeORM + Postgres, 43 controllers / 49 entities / 94+ services, BullMQ queue for multi-supplier ingestion, AES-256-GCM credential encryption, Greek VAT 24% logic, Google Calendar OAuth2 sync, accounting/bookkeeping domain, Socket.IO real-time notifications
• Chrome extension: Manifest v3 popup data extractor (popup.js: 23.9KB) that pulls product data directly from supplier websites
• 3D door configurator (papanikolaou-doors): Three.js + R3F + drei + postprocessing, GLB asset pipeline with procedural fallback, adaptive performance tiers (auto low/high quality via PerformanceMonitor), material/accessory naming convention for runtime recoloring

My contribution

I designed and built all five components as the sole developer. The product-catalog-management backend was the largest piece (43 controllers, 49 entities, 94+ services) and one of the more complex Express projects I have written: 8 supplier-specific data adapters (each platform has different HTML and API quirks, there is no universal adapter that works everywhere), per-supplier rate limiting via BullMQ, AES-256-GCM encryption for stored supplier credentials, Google Calendar OAuth2 for appointment sync, and Greek VAT logic embedded at the catalog level rather than the storefront. The Medusa B2B marketplace was a port of the official starter with custom modules (brands, bundles, wishlist), Stripe + PayPal payments, and a design-tokens layer. The React 19 admin lives on the client’s subdomain with JWT auth. The 3D door configurator was the most technically interesting piece: it has to run on whatever low-powered laptop the B2B buyer happens to be using, so I wrote adaptive performance tiers via R3F’s PerformanceMonitor that downgrade quality automatically when FPS drops and recover when it returns.

Stack details

The most interesting technical decision was the 8 supplier-specific data adapters. Each supplier runs a different e-commerce platform (Magento, PrestaShop, OpenCart, WooCommerce) with its own HTML structure and API quirks, there’s no single generic adapter that works everywhere. The BullMQ queue enables concurrent supplier ingestion with per-supplier rate limiting. AES-256-GCM credential encryption ensures supplier passwords are stored securely in the database. The Greek VAT 24% business logic is embedded in the PIM rather than the storefront, because tax calculations are applied at the catalog level. Fuzzy search via DB extensions allows partial matching on Greek product names. The 300+ API endpoint count reflects a full accounting/bookkeeping domain on top of the catalog.

Outcomes

• Production B2B marketplace with quote-based selling, company hierarchies, approval workflows
• Automated sourcing from 8 different suppliers (Magento, PrestaShop, OpenCart, WooCommerce)
• 3D door configurator letting B2B buyers inspect products from every angle before ordering
• Chrome extension that reduces data entry time when adding new supplier products

The challenge

The 3D configurator for Papanikolaou Doors had to run on the low-powered laptops of B2B customers, I couldn’t assume a dedicated GPU. I implemented adaptive performance tiers via R3F’s PerformanceMonitor: on each frame, the monitor measures actual FPS and if they drop below the threshold, the configurator automatically switches to low-quality mode (lower resolution textures, simplified shadows, fewer postprocessing passes). If FPS recover, it returns to high-quality. The GLB asset pipeline has a procedural fallback for browsers that are slow to load the model, instead of a blank screen, the user sees a procedurally rendered placeholder. The material/accessory naming convention I designed allows runtime recoloring without a reload: changing a door colour swaps a material uniform, not a GLB reload.

Links

• Production deployment internal (no public storefront URL).
• 3D configurator repo: jimrarras/papanikolaou-doors (private)

Related work

• Heartbeat Pharmacy Platform: another Medusa build, but B2C pharma instead of B2B locksmith