Files
BFlat d538bc2a68 Add 3D Object & 3D World generation to the webapp (#1756)
Adds two new create pages for 3D generation, 3D Object (meshes) and 3D
World (gaussian splats), wired up to the new omni-gen mesh/splat
endpoints, plus the navigation, icons, and polish to go with them.

### New create pages
- 3D Object (`/create-object`): turn a prompt or image into a 3D model.
- 3D World (`/create-world`): turn a prompt or image into an explorable
world.
- Both mirror the existing Create Image/Video experience: prompt box
with model selector and per-model options in the bottom bar, and a live
feed of in-progress, completed, and failed generations.
- Options adapt to the selected model, e.g. output type, polygon type,
geometry/texture quality, face count, PBR and texture toggles,
multi-view reference angles (front/back/left/right), mesh-file input,
reference image/video, panorama, and prompt-only where supported.
- Multi-view and reference slots support the same Upload /
Pick-from-library flow (desktop hover and mobile) as the image rows.
- Completed cards show the model's cover screenshot; clicking one opens
it in the interactive 3D viewer.

### Navigation and discovery
- Sidebar reorganized into two groups: Create (Image, Video, Audio, 3D
Object, 3D World) and a new Studio group (Edit Image, Edit 3D, Edit
Video, BG Change, Moodboard).
- Added 3D Object and 3D World cards to the Home page.
- Added breadcrumbs for the new pages.
- Added a My Library button to the top bar, next to the credits and
task-queue chips.

### Model icons
- Restored the Hunyuan (Tencent) and World Labs provider icons.
- Added Tripo, Meshy, and Rodin (Hyper3D) icons.
- Applied to both the webapp and desktop app.

### Fixes and polish
- Fixed the 3D-model icons showing a generic placeholder (missing cyan
color plus creator mappings).
- Fixed the Upload / Pick-from-library hover popover being clipped
inside glass panels.
- Reference-image rows in the 3D pages now align their fields to the
right with the title on the left, matching the other create pages.
- Prevented 3D-model cover screenshots from showing up as their own "3D
object" cards across the 3D feeds, the Library page, and the gallery
picker.
2026-07-08 23:03:11 +07:00
..
2026-03-12 15:49:24 +07:00
2026-06-10 09:28:25 -04:00

Frontend

This is an nx monorepo that can contain multiple apps and shared libraries.

All commands to run these projects are performed from this directory (except the repo-root launcher scripts noted below).

Requirements

  • Node.js 20+ (Nx 21 / Vite 6 requirement). Install via nvm, nodejs.org, or brew install node.
  • npm (ships with Node).

We use npm, not pnpm. pnpm was briefly adopted ("add pnpm to solve build issues") and later removed ("fix(frontend): consume video-editor libs via nx path aliases, drop pnpm"). If you have leftovers from that era — a pnpm-lock.yaml, pnpm-workspace.yaml, or a node_modules/.pnpm directory — npm installs will fail (typically with ENOTEMPTY rename errors). See Troubleshooting below.

Install dependencies

npm install

Running the apps in dev mode

From the repository root, the launcher scripts (these preflight your environment, install dependencies, and free the dev port first):

./script/website/unix_frontend_dev.sh           # artcraft-website (marketing site), port 4200
./script/website/unix_frontend_webapp_dev.sh    # artcraft-webapp (user dashboard), port 4201
./script/artcraft/unix_frontend_dev.sh          # artcraft (Tauri app frontend), port 5173

Or directly from this directory:

nx dev artcraft-website
nx dev artcraft-webapp
nx dev artcraft        # NB: the Tauri app also needs the Rust dev server running
nx dev editor2d

Building

npx nx build artcraft-website
npx nx build artcraft-webapp
npx nx build artcraft
npx nx build editor2d

Netlify deploys run apps/<app>/script/netlify_build.sh (see each app's netlify.toml).

Troubleshooting

npm install fails with ENOTEMPTY: directory not empty, rename ...

Your node_modules tree is corrupted — usually an interrupted install, or a tree written by pnpm back when the repo briefly used it. Fix:

./clean_modules.sh
npm install

Or the manual minimum:

rm -rf node_modules .nx pnpm-lock.yaml pnpm-workspace.yaml
npm install

Stale build state after switching branches

Call this when starting on main or a new branch:

./clean_modules.sh

It removes all dist/ outputs, resets the nx cache, and removes node_modules.

Import aliases

The names for @frontend and @storyteller come from the package.json file in the libs folder:

import { Login } from "@frontend/login";
import { api } from "@storyteller/api";

For shared UI components, import from @storyteller/ui-[componentname]:

import { Button } from "@storyteller/ui-button";
import { Modal } from "@storyteller/ui-modal";

Generating a new component library

# 1. Generate the library
npx nx g @nx/react:library libs/components/toaster --import-path=@storyteller/ui-toaster --bundler=vite
npm install

# 2. Import it somewhere in code

# 3. Sync and build
nx sync
nx build