# Frontend

This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 21.0.0.

## Development server

To start a local development server, run:

```bash
ng serve
```

Once the server is running, open your browser and navigate to `http://localhost:4200/`. The application will automatically reload whenever you modify any of the source files.

For local/dev Remote Dev Operator workflows, the workspace script binds the
Angular dev server to `0.0.0.0:4220`:

```bash
yarn start:dev
```

The dev-server host allowlist is intentionally narrow. It allows localhost plus
these trusted Tailscale MagicDNS devices for local/dev access:

- `iphone172.taila889d7.ts.net`
- `christians-macbook-pro-m2-3.taila889d7.ts.net`

Do not replace this with a wildcard host allowance.

## Code scaffolding

Angular CLI includes powerful code scaffolding tools. To generate a new component, run:

```bash
ng generate component component-name
```

For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:

```bash
ng generate --help
```

## Building

To build the project run:

```bash
ng build
```

This will compile your project and store the build artifacts in the `dist/` directory. By default, the production build optimizes your application for performance and speed.

## Running unit tests

To execute Angular/Vitest unit and component tests, use:

```bash
yarn test
```

From the workspace root, use:

```bash
yarn test:frontend
```

## Runtime smoke

For local backend/frontend integration smoke, run this from the workspace root:

```bash
yarn smoke:runtime
```

This starts local dev services, checks the frontend HTTP path and backend GraphQL
smoke flow, then cleans up the generated smoke user.

If the app reports signed out with admin access required and no known admin
credentials are available, use the backend local/dev auth/admin setup guide in
`../backend/README.md` to reset or seed a known local admin before manual
frontend verification.

## Browser smoke

Playwright is not currently installed or configured in this workspace. The
planned browser-smoke structure is documented in `smoke/README.md`.

When Playwright is added, browser smoke should cover the minimal app shell:

- app loads in a real browser.
- core shell/layout renders.
- no page errors or unexpected console errors appear.
- no production credentials are required.

## Remote Dev Operator Console

The Remote Dev Operator Console is privileged local/dev tooling for inspecting
workflow status from a browser on localhost, LAN, VPN, or Tailscale during
development.

Local development builds use `src/environments/environment.development.ts`,
where `remoteDevConsole.enabled` is `true` and `production` is `false`.
Production builds use `src/environments/environment.ts`, where the console is
disabled and production-mode blocking remains authoritative.

Current visibility scope:

- admin session required.
- explicit local/dev build guard required.
- visible privileged local/dev labeling.
- workflow command/status references only.
- no prompt submission, tmux input, arbitrary command execution, or shell access.

This feature does not read `.env` files and does not require production
credentials. Broader interaction belongs in a separate security-reviewed chunk.

### Local/dev prompt queue

Trusted local/dev interaction is limited to queueing a short prompt for operator
review. It does not execute shell commands or send input to tmux/Codex directly.

To enable the backend prompt queue locally, set this safe local placeholder in
`apps/backend/.env`:

```bash
REMOTE_DEV_CONSOLE_INTERACTION_ENABLED=true
```

Queueing a prompt requires an admin session and the explicit confirmation phrase
shown in the UI. The backend writes queued prompts under `.tmp/remote-dev-console`
as local runtime state. Do not stage `.tmp`.

## Additional Resources

For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.