Kantor noskill

Write everything the user reads in Bahasa Indonesia unless the user writes in another language.

The page is kantor-noskill.html in this skill's base directory. It is written for the claude.ai Artifact runtime: no doctype/head/body of its own (the Artifact tool adds them), three.js from cdnjs, and two runtime capabilities:

• mcp → host:filesystem (list_directory, read_multiple_files) to read ticket files on the viewer's computer, only inside the Claude desktop app;
• db → document boards/latest, a copy of the board the desktop writes so a browser or phone can show it as "Snapshot";
• room + user (scope profile) → shows who else has the office open, as chips and as visitors in the ground-floor lobby.

The live board reads ticket files and activity.json (written by feature-flow), so the Product Manager, CTO and Analyst light up while they write the PRD, ADR or BRD, before any ticket exists.

HOLD tickets can be answered on the page (stored in the answers collection, applied by /noskill:tiket lanjut), and the Eng. Manager plus the agent who held a HOLD ticket wait in the meeting room on floor 3. Agents have names (Rayyan PM, Faris CTO, Zahra Analyst, Hamzah Tech Lead, Zayn Backend, Alya Frontend, Fathan Fullstack, Arkan Reviewer + QA, Hafiz Eng. Manager). Walking agents show a speech bubble with the verdict they carry, Metrik shows tokens per agent and per ticket from Riwayat, and Timeline shows today's status changes (click one to replay from there).

Idle agents from every floor take breaks: the shared coffee corner ("Ruang ngopi") on floor 3, the pantry on floor 1 (also at lunch time), the toilets or musholla on floor 2 (musholla at prayer times), or a chat at a colleague's desk. They talk to each other in speech bubbles and come back to their desk when work arrives. The office stands on a small island with a beach, palms, a lagoon and open sea. A ring road circles it; cars and motorbikes loop in two opposite lanes and stop for people at the zebra crossing. Outside the road is a village (wooden houses, a konbini, a small shrine, a water tower), a lighthouse whose beams sweep at night, and a pier with a fishing boat; another boat sails round the island. A bus stop, an ojek stand, and a bakso cart sit on the outer sidewalk.

Features on the page: click an agent (role, skills, current ticket), click a ticket on the board (AC, Riwayat, who holds it, replay its journey), Metrik (time per stage and per agent, most revised tickets, HOLD list), project filter, Ikuti tiket (camera follows the agent carrying a ticket), floor buttons, and a collapsible panel.

1. If the Artifact tool is available (Cowork, claude.ai)

1. List the user's artifacts. If one is titled Kantor noskill, ask whether to open it as is or update it to this plugin's version. To update: read it first (action: "read"), then publish this file to its url.
2. Otherwise publish the file as a new artifact:
   • file_path: the html file above
   • icon: building
   • description: Diorama 3D kantor tiga lantai tim agent noskill dengan board tiket live dari folder docs/noskill.
   • capabilities:

     {"mcp": {"servers": [{"server": "host:filesystem", "tools": ["list_directory", "read_multiple_files"]}]},
      "db": {"rules": [{"path": "boards", "read": "view", "write": "admin"}, {"path": "answers", "read": "view", "write": "admin"}]},
      "room": {},
      "user": {"scopes": ["profile"]}}

   Do not change the page source while publishing.
3. Tell the user, briefly, how to turn on live data:
   • Add a filesystem MCP server named exactly filesystem to the Claude desktop config (Settings → Developer → Edit Config), with the parent folders of their projects as the last args. With Node from nvm, use the full path of npx and set env.PATH to that Node's bin folder; then quit Claude with Cmd+Q and reopen.

     "filesystem": {
       "command": "/full/path/to/npx",
       "args": ["-y", "@modelcontextprotocol/server-filesystem", "/Users/<user>/code"],
       "env": { "PATH": "/full/path/to/node/bin:/usr/local/bin:/usr/bin:/bin" }
     }

   • Open the artifact in the Claude desktop app → Folder tiket → paste one docs/noskill (or .../tickets) path per line → Pakai data live → allow access.
   • In a browser or on a phone the page shows the last copy the desktop saved (label Snapshot), or the demo if none exists yet.
   • Local servers only work on artifacts the user owns.
   • Optional: offer a weekday-morning scheduled task that summarises HOLD and BUG tickets (from the ticket folders, or from the artifact's boards/latest document when the computer is off).

2. If there is no Artifact tool (plain Claude Code terminal)

Copy the page into the project so it opens in a browser, wrapping it in a document shell:

docs="${user_config.docs_dir}"; [ "${docs#\$}" = "$docs" ] || docs=docs/noskill   # fallback if not substituted
mkdir -p "$docs"
{ printf '%s\n' '<!doctype html><html lang="id"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><style>[hidden]{display:none!important}</style></head><body>'
  cat "<this skill's base directory>/kantor-noskill.html"
  printf '%s\n' '</body></html>'; } > "$docs/kantor-noskill.html"

Then tell the user the path and that opened this way the page runs in demo mode only: live tickets and Snapshot need the claude.ai artifact runtime (Cowork or claude.ai). Offer open <path> (macOS) or xdg-open <path> (Linux). Do not add kantor-noskill.html to git unless the user asks.