Files
artcraft-services/frontend
BFlatandClaude Opus 5.5 b57f9155da Lead Crafting App pages with the Launcher download; shorter download labels (#72)
## What

- **App pages lead with ArtCraft Launcher.** The first download button
at the top of every `/apps/<slug>` page now downloads ArtCraft Launcher
for the visitor's system. It's the same OS-aware button as the `/apps`
hub, with the platform and build underneath. With no detected system it
jumps to `#get-it`. If the launcher ever has no release, the hero falls
back to the app's own download.
- **Shorter labels.**
- The launcher button now reads **Download Launcher** (hub, app heroes
and the Get-it callout).
- The standalone platform buttons read **Standalone for macOS / Windows
/ Linux** instead of "Download PhotoCraft for Windows". The section
heading and each "Other PhotoCraft files" list still name the app.
- **Spacing fix.** The "For Windows · Installer (64-bit)" line under the
launcher button no longer widens its column, which used to push the
buttons beside it away.

The launcher stays at v0.1.0, its latest published release. All 20 links
the site builds for it exist in that release. v0.1.1 is built but still
a draft; bump `CRAFT_LAUNCHER_RELEASE` once it's published.

## Checks

- Ran the site locally (`next dev`) and looked at `/apps/photocraft` and
`/apps` in Edge at desktop and phone widths: one row of buttons, even
gaps, and the launcher link goes to the Windows x64 MSI.
- `npm run typecheck` reports the same 54 errors as `main` without this
change (Playwright and three.js types in `tests/` and
`media-viewer-3d.tsx`); none come from these files.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

---------

Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-10 18:00:18 +07:00
..
2026-10-09 11:31:28 -04:00
2026-10-09 11:31:28 -04:00
2026-03-12 15:49:24 +07:00
2026-10-09 11:31:28 -04:00
2026-10-09 11:31:28 -04:00
2026-10-09 11:31:28 -04:00

Frontend

This is the Nx workspace for ArtCraft web apps and shared libraries. The desktop frontend is maintained in storytold/artcraft.

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_website_dev.sh  # artcraft-website-next (marketing site), port 3000
./script/website/unix_frontend_webapp_dev.sh   # artcraft-webapp (user dashboard), port 4201

Run the webapp from artcraft-services, not the separate artcraft desktop checkout. The webapp launcher also works from another directory when invoked by its full or relative path:

../artcraft-services/script/website/unix_frontend_webapp_dev.sh

Or directly from this directory:

npx nx dev @frontend/artcraft-webapp

Building

npx nx build artcraft-webapp

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