← All projects
AI Tool2026

Zahara AIhttps://zahara-v1.vercel.app

A multi-tenant platform for building AI agents across four builder surfaces — conversational, visual, full-IDE, and guided — powered by a Next.js App Router front end and a FastAPI backend.

Role
Front-end Engineer
Timeline
2025 · Design & API integration
Client
Private client (NDA)
↗ Live URL

The Problem

Zahara is a multi-tenant platform for building AI agents through several distinct surfaces — a conversational "Vibe" builder, a visual "Flow" builder, a full-IDE "Pro" builder, and a guided "Clinic" builder. As usage grew, a set of UX and trust issues surfaced across these builders, and the Pro IDE carried a subtle but serious data-scoping bug: its file API loaded files across agents instead of scoping them to the active one, so a user could see the wrong agent's files. In a multi-tenant AI product, that kind of cross-tenant bleed erodes trust quickly.

The Approach

I traced the Pro IDE issue to its root cause — an unscoped file-loading endpoint — and refactored file handling end to end so every file operation is scoped to the active agent. That spanned both the FastAPI backend and the Next.js front end (the file tree, the client store, the page, and the typed API layer), keeping the contract consistent across the stack. In parallel I worked through seven client-reported UX and trust issues across all four builders, and ran the changes through three review rounds before handing back clean patches against the client's branch.

Architecture

Zahara pairs a Next.js App Router front end with a FastAPI (Python) backend. The front end exposes four builder surfaces over a shared component and state layer; the Pro builder is a full in-browser IDE with a file tree backed by a client-side store and a typed API client. The backend serves a per-agent file API and the multi-tenant agent runtime. The refactor established a clear invariant: file reads and writes are always scoped to the active agent, enforced on the server and reflected consistently through the client store and UI.

Client (Next.js App Router)
Vibe Builder
conversational
Flow Builder
visual
Pro Builder
full IDE
Clinic Builder
guided
Pro IDE
File Tree
agent-scoped
Pro Store
client state
API Client
typed calls
Backend (FastAPI)
Files API
per-agent scoping
Agent Runtime
multi-tenant

Outcome

The Pro IDE file-scoping refactor closed the cross-agent file bleed across five files on both the backend and front end, with the agent-scoped contract verified over three audit rounds. The seven client-reported issues spanning the Vibe, Flow, Pro, and Clinic builders were resolved, and the work shipped as clean, reviewed patches applied to the client's branch — measurably improving the reliability and trustworthiness of the builder experience.

Tech Stack

Next.js 16TypeScriptFastAPIPythonReactZustandAI AgentsMulti-tenant

Have a project like this?

I build multi-tenant SaaS, real-time systems, and mobile apps end-to-end.

Get in touch →
Zahara AI — Case Study · Faridul · Faridul