Files
artcraft/frontend
Tanish Manku 2178afd736 webapp: mount pagescene at /pagescene with sidebar-aware viewport
Adds /pagescene (and /pagescene/:sceneToken) under the webapp's public
chrome (inside ProtectedLayout, outside RequireAuth) so anonymous users
can view scenes too. Adapter implementation mirrors the website's, with
two webapp-specific tweaks: imports the local useSession / showToast /
invalidateSession helpers, and getViewportSize returns the wrapper's
live ResizeObserver-measured rect so DnD hit-testing matches the visible
canvas (not window.innerWidth).

Sidebar handling: the lib's position-fixed UI is scoped to a wrapper
div with transform: translateZ(0), which creates a new containing block.
The wrapper renders inside SidebarInset's flex flow, so the editor sits
naturally to the right of the sidebar and below the topbar; expanded-
sidebar behavior is deferred (currently shrinks the page further per the
flex layout).

Sidebar nav gets an "Edit 3D" entry between Image and Video. Tailwind
config gets brand-primary/secondary/tertiary, action color, red/green/
blue DEFAULTs; styles.css adds .bg-ui-panel-gradient, .prevent-select,
.dot-typing — same gap-fills landed on the website.

No new endpoints. tsconfig churn from nx sync.
2026-05-12 09:18:13 -07: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.

Install dependencies

npm install

Editor2d

Run dev server:

nx dev editor2d

artcraft

Run dev server:

nx dev artcraft
call when starting on main or a new branch:
./clean_modules

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";

building:
npx nx build artcraft
npx nx build editor2d

dev:
npx nx dev artcraft
npx nx dev editor2d



# component build
1.
npx nx g @nx/react:library libs/components/toaster --import-path=@storyteller/ui-toaster --bundler=vite
npm install
2.import it first in code
3.nx sync
4.nx build

or

# frontend build
in frontend folder

% nx build -project type
% nx build artcraft
% nx dev artcraft