Next.js 16

Lineadecor

B2B Kitchen Render Portal (Lunaar AI)

Overview

Lineadecor is a white-label B2B dealer portal built for a kitchen and decoration brand, adapting the Lunaar render AI into a branded kitchen-visualization tool. It lets authorized dealers turn a hand sketch or reference photo into a photorealistic kitchen render, organized around a dealer/branch hierarchy with per-dealer credit budgets. Both the frontend and its backend API were built from scratch.

What It Does

Dealers upload a kitchen sketch, then configure kitchen-specific options such as cabinet surface finishes (matte, metallic, glossy) for lower, upper and tall units, countertop and floor surfaces, handle finish, ambient lighting, and required LED and decor toggles. The job runs asynchronously with live status, and the finished render is presented with a before/after comparison slider, an optional 2K upscale, and one-click JPG or PDF export.

Tech Stack

Next.js 16React 19TypeScriptTailwind CSSTanStack QuerySSEjsPDFreact-compare-slider

View Live

Key Features

Guided sketch-to-render wizard with kitchen-specific finish, surface, lighting and decor options

Live render progress streamed over Server-Sent Events, with an animated processing screen and automatic polling fallback

Result viewer with before/after compare slider, fullscreen lightbox, and original/compare/render view modes

On-demand 2K upscale of any render, tracked with its own live progress stream

Client-side PDF export (auto-sized landscape/portrait) plus high-resolution JPG and original-image downloads

Per-dealer monthly credit limits with usage tracking, a credit history ledger, and Excel (.xlsx) report export

Flag-as-defective workflow with mandatory reasons, plus admin review, unflag and soft-delete trash

Role-based admin panel (Admin/Manager/User) for users, branches/dealers, credit limits and flagged content

Technical Highlights

→Next.js 16 App Router (standalone output) with React 19, TypeScript and Tailwind CSS v4

→Cookie-based auth with an axios response interceptor that silently refreshes tokens and queues concurrent 401s behind a single refresh

→Server-Sent Events via native EventSource for render and upscale status, with per-item stream dedup and a 5s polling fallback

→react-compare-slider and a lightbox for before/after review; jsPDF for client-side PDF generation

→TanStack Query for data fetching/caching; renders served from S3, API proxied through Next.js rewrites

→Safe error handling that maps backend error categories to user-friendly messages and env-toggled maintenance mode with a secret bypass key

→Both the frontend and its dedicated backend API built end to end

Key Achievements

Productized the Lunaar render engine into a branded, self-serve B2B tool for a real kitchen client

Delivered a resilient async render experience with live streaming plus a polling fallback so status never stalls

Built a complete multi-tenant dealer model with per-branch credit budgeting, ledgers and Excel reporting

Shipped a full admin and content-moderation suite including flagging, unflagging and soft-delete recovery

Impact & Results

Delivered end to end at Group Taiga, turning the Lunaar render engine into a branded B2B portal that lets a kitchen brand's dealers self-serve photorealistic renders. The dealer/branch hierarchy, credit budgeting and admin tooling make it a real operational product rather than a demo.