# TODO: Editor.js Image Tool Integration

## Goal
Integrate the Editor.js **Image Tool** with proper upload endpoints, storage, and access control.

## Why
- Editor.js expects uploads to respond with `{ success: 1, file: { url: "..." } }`.
- We want private storage with a controlled proxy (like avatars) and optional resizing.

## Open Decisions
- Public access? (e.g. impressum pages should be public)
- Allowed file types (recommended: PNG/JPG/WebP; avoid SVG for security)
- Resize policy (max width + WebP variants?)

## Proposed Structure

### Storage
- `storage/pages/{page_uuid}/assets/{asset_uuid}/original.<ext>`
- Optional variants: `w1280.webp`, `w640.webp`, etc.

### DB
Create `page_assets` table:
- `id`, `uuid`, `page_id`, `locale`
- `file_name`, `mime`, `size`, `width`, `height`
- `created_by`, `created`

### Endpoints
1) **Upload by file**  
`pages/page/upload-image(none).phtml`
  - Accepts multipart (field name `image`).
  - Validates MIME/size.
  - Stores file + creates DB record.
  - Returns `{ success: 1, file: { url } }`.

2) **Fetch by URL** (optional)  
`pages/page/fetch-image(none).phtml`
  - Accepts JSON `{ url: "..." }`.
  - Downloads, validates, stores like upload.
  - Returns same response.

3) **Media proxy**  
`pages/page/media(none).phtml?uuid=...`
  - Checks permissions (public vs. logged‑in).
  - Reads storage file, sets headers, returns file.

### Editor.js config
Add `image` tool to `web/js/components/page-editor.js`:
```js
image: {
  class: ImageTool,
  config: {
    endpoints: {
      byFile: 'page/upload-image',
      byUrl: 'page/fetch-image'
    }
  }
}
```

## Next Steps
- Decide public vs. private access rules.
- Implement service + migration + endpoints.
- Add tool config and i18n messages.